/* Starlit Door: motion for the crib scene and mascots. One authored moment (a piece dropping into the crib);
   everything else is a slow idle life the eye barely registers. All of it stops under reduced motion. */
.crib{display:block;width:100%;height:100%}
.crib .tw{animation:tw 3.2s ease-in-out infinite}
.crib .twinkle-big{transform-origin:520px 96px;animation:big 4s ease-in-out infinite}
.crib-spiritual .twinkle-big{transform-origin:760px 92px}
.crib .flicker{animation:flick 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.crib .float{animation:float 5s ease-in-out infinite}
.crib .float.slow{animation-duration:7s}
.crib .bob{animation:bob 2.4s ease-in-out infinite}
.crib .flap{animation:flap .9s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 50%}
.crib .glow{animation:glow 3s ease-in-out infinite}
.crib .drop{animation:drop .9s cubic-bezier(.2,.9,.25,1.15) both;transform-box:view-box}
.complete .crib .glow{animation-duration:1.6s}

.mascot{display:block;overflow:visible}
.blink{animation:blink 5s infinite;transform-box:fill-box;transform-origin:50% 50%}
.pose-happy,.pose-cheer{animation:hop .7s cubic-bezier(.3,1.6,.5,1) both}
.pose-cheer{animation:hop .7s cubic-bezier(.3,1.6,.5,1) infinite alternate}
.zzz{animation:zz 2.8s ease-in-out infinite}
.flame-body{animation:sway 2.6s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}

@keyframes tw{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes big{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes flick{0%,100%{transform:scaleY(1);opacity:.95}50%{transform:scaleY(1.08) scaleX(.96);opacity:1}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes flap{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.55)}}
@keyframes glow{0%,100%{opacity:.18}50%{opacity:.34}}
@keyframes drop{0%{transform:translateY(-70px) rotate(-3deg);opacity:0}55%{opacity:1}100%{transform:none;opacity:1}}
@keyframes blink{0%,94%,100%{transform:scaleY(1)}96%{transform:scaleY(.1)}}
@keyframes hop{from{transform:translateY(0)}to{transform:translateY(-14px)}}
@keyframes zz{0%,100%{transform:translateY(0);opacity:.6}50%{transform:translateY(-6px);opacity:1}}
@keyframes sway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg) scaleY(1.03)}}

/* The 3D crib trial: clay figures lightly toned to each edition's light (night blue, dusk violet), except the Holy
   Family, who stay in full colour under their own warm glow. Arrival clips play over the scene. */
.crib3d .fig3d image,.crib3d-live video{filter:saturate(1.03)}
.crib-spiritual.crib3d .fig3d image,[data-edition="spiritual"] .crib3d-live video{filter:saturate(1.02)}
.crib3d .fig3d.hero image,.crib3d-live video.hero{filter:brightness(1.08) saturate(1.08)}
.crib3d .glow3d{animation:glow3d 4s ease-in-out infinite}
.crib3d-live{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.crib-live{position:absolute;pointer-events:none}
.crib-peek{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;display:block}
.crib3d-live video{position:absolute}
.crib3d .hop3d{animation:hop3d .9s cubic-bezier(.3,1.6,.5,1) both}
@keyframes hop3d{0%,100%{transform:translateY(0)}40%{transform:translateY(-22px)}}
@keyframes glow3d{0%,100%{opacity:.8}50%{opacity:1}}

/* The finishing pass (every 3D crib): one colour grade, distance haze, faint rim light, warm stable light, dusk tint. */
.crib3d.fx .fig3d image,.crib3d-live.fx video{filter:sepia(.06) saturate(.95) drop-shadow(0 0 2px rgba(255,190,110,.2)) drop-shadow(0 0 4px rgba(80,140,255,.14))}
.crib3d.fx .fig3d.d-far image,.crib3d-live.fx video.d-far{filter:sepia(.06) saturate(.8) brightness(1.04) contrast(.94)}
.crib3d.fx .fig3d.d-sky image,.crib3d-live.fx video.d-sky{filter:sepia(.05) saturate(.92) drop-shadow(0 0 5px rgba(255,220,150,.22))}
.crib3d.fx .fig3d.d-near image,.crib3d-live.fx video.d-near{filter:sepia(.06) saturate(1.02) contrast(1.03) drop-shadow(0 0 2px rgba(255,190,110,.22)) drop-shadow(0 0 4px rgba(80,140,255,.16))}
.crib3d.fx .fig3d.hero image,.crib3d-live.fx video.d-hero{filter:sepia(.07) saturate(1.03) contrast(1.03) brightness(1.05) drop-shadow(0 0 3px rgba(255,190,110,.3))}
.crib-spiritual.crib3d.fx .fig3d image,[data-edition="spiritual"] .crib3d-live.fx video{filter:sepia(.05) saturate(.96) hue-rotate(6deg) drop-shadow(0 0 3px rgba(255,170,190,.25))}
.crib-spiritual.crib3d.fx .fig3d.d-far image,[data-edition="spiritual"] .crib3d-live.fx video.d-far{filter:saturate(.82) brightness(1.02) contrast(.92) hue-rotate(8deg)}
.crib-spiritual.crib3d.fx .fig3d.hero image,[data-edition="spiritual"] .crib3d-live.fx video.d-hero{filter:sepia(.06) saturate(1.03) brightness(1.06) drop-shadow(0 0 3px rgba(255,190,140,.32))}
.crib3d.fx .warm3d{mix-blend-mode:screen;pointer-events:none}
.crib3d.fx .edge3d{mix-blend-mode:multiply}
.crib3d.fx .cshadow.grow{animation:cgrow 1.6s ease-out both;transform-box:fill-box;transform-origin:50% 50%}
@keyframes cgrow{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  .crib *,.mascot *,.blink,.zzz,.flame-body,.pose-happy,.pose-cheer{animation:none!important}
}