.card .book-under{z-index:0}
.book-leaf{position:absolute;inset:0;z-index:3;background:#f7ecd7;backface-visibility:hidden;transform-style:flat;box-shadow:8px 0 16px #0003;will-change:transform}
.book-leaf img{z-index:0}
.event-motion{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:1;pointer-events:none;opacity:0}
.mandap-motion{mask:url('preview/celebration/page-motion-mask-v15.png') center/100% 100% no-repeat;-webkit-mask:url('preview/celebration/page-motion-mask-v15.png') center/100% 100% no-repeat}
.event-motion.visible{opacity:1}
.temple-motion{inset:34.722222% auto auto 0;width:38.580247%;height:61.728395%;z-index:2;mask-image:url('preview/wedding/temple-mask-v2.png');mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-image:url('preview/wedding/temple-mask-v2.png');-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
@media(prefers-reduced-motion:reduce){.card:not(.motion-opt-in) .event-motion{display:none}.book-leaf{box-shadow:none}}

.wedding-name-light{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}

/* The wedding is the invitation's visual centrepiece; no card transform. */
.card.wedding-centrepiece{box-shadow:0 0 0 1px #d7ae6a88,0 0 32px #d4a35b24,0 24px 64px #0008}
@media(prefers-reduced-motion:reduce){.card.wedding-centrepiece{box-shadow:0 0 0 1px #d7ae6a66}}

/* Independent feature clocks start alongside the page's curtain/environment track. */
.mehendi-motion{inset:45.524691% auto auto 63.117284%;width:36.882716%;height:53.240741%;z-index:2}
.dance-motion{inset:47.067901% auto auto 60.956790%;width:39.043210%;height:51.697531%;z-index:2}
.event-hanging-light{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}

/* Native source elements continue decoding; Samsung sees a single opaque surface. */
.samsung-composite,.samsung-under{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;color-scheme:only light}
.samsung-composite{z-index:4}.samsung-under{z-index:0}
.card.samsung-composited img,.card.samsung-composited .event-motion,
.card.samsung-composited .wedding-name-light,.card.samsung-composited .event-hanging-light{opacity:0!important}

/* Paper-turn feel: shading across the lifting sheet (with a fine crease at the spine and a
   soft sheen near the free edge) and a cast shadow on the page beneath. Opacity is driven by
   book.js from the turn progress, so it follows the guest's finger and the settle animation. */
.leaf-shade,.turn-shadow{position:absolute;inset:0;pointer-events:none;opacity:0;color-scheme:only light}
.leaf-shade{z-index:5}
.leaf-shade.hinge-left{background:linear-gradient(90deg,rgba(40,24,8,.42) 0,rgba(40,24,8,.26) 2.5%,rgba(40,24,8,.16) 35%,rgba(40,24,8,.06) 72%,rgba(255,246,222,.16) 90%,rgba(40,24,8,.12) 100%)}
.leaf-shade.hinge-right{background:linear-gradient(270deg,rgba(40,24,8,.42) 0,rgba(40,24,8,.26) 2.5%,rgba(40,24,8,.16) 35%,rgba(40,24,8,.06) 72%,rgba(255,246,222,.16) 90%,rgba(40,24,8,.12) 100%)}
/* The shadow rides on the sheet's free edge and falls onto the page underneath. */
.turn-shadow{inset:0 auto;width:26%;z-index:0}
.turn-shadow.hinge-left{left:100%;background:linear-gradient(90deg,rgba(10,6,2,.42) 0,rgba(10,6,2,.2) 22%,rgba(10,6,2,0) 100%)}
.turn-shadow.hinge-right{right:100%;background:linear-gradient(270deg,rgba(10,6,2,.42) 0,rgba(10,6,2,.2) 22%,rgba(10,6,2,0) 100%)}
@media(prefers-reduced-motion:reduce){.leaf-shade,.turn-shadow{display:none}}

/* The card handles its own swipes and vertical drags (see book.js); pinch-zoom stays native. */
.card{touch-action:pinch-zoom}

/* Bending sheet: the strips replace the flat leaf for the length of the turn. */
.book-leaf.bending{background:transparent;box-shadow:none}
.book-leaf.bending>:not(.bend-strip){visibility:hidden}
.bend-strip canvas{color-scheme:only light}
