body{margin:0}#root{width:100%;min-height:100vh}*{margin:0;padding:0;box-sizing:border-box}body{width:100vw;height:100vh;overflow:hidden;background:linear-gradient(180deg,#f5e6d8,#e8d5c4);font-family:Georgia,Times New Roman,serif}#root{width:100vw;height:100vh}.invitation{width:100vw;height:100vh;position:relative;display:flex;align-items:center;justify-content:center}.envelope-wrapper{position:absolute;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;cursor:pointer;perspective:1200px;z-index:10;animation:fadeIn .5s ease}.envelope-scene{position:relative;width:100vw;height:100vh;transform-style:preserve-3d;transition:transform .6s ease,opacity .6s ease}.envelope-back,.envelope-front,.envelope-flap{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}.envelope-back{z-index:1}.envelope-img{width:100%;height:100%;object-fit:contain;display:block}.envelope-flap{z-index:3;transform-origin:top center;transform:rotateX(0);transition:transform .8s cubic-bezier(.4,0,.2,1);clip-path:polygon(0 0,100% 0,50% 55%)}.flap-img{object-position:top center}.envelope-front{z-index:2;clip-path:polygon(0 0,50% 55%,100% 0,100% 100%,0 100%)}.front-img{object-position:bottom center}.envelope-wrapper.opening .envelope-flap{transform:rotateX(180deg)}.envelope-wrapper.opening .envelope-scene{animation:envelopeLift .4s ease .3s forwards}.envelope-wrapper.gone{display:none}@keyframes envelopeLift{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.6) translateY(-40vh)}}.invitation-content{position:absolute;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;z-index:5;animation:invitationReveal .8s cubic-bezier(.16,1,.3,1) forwards}.invitation-image{width:100%;height:100%;object-fit:contain;display:block}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes invitationReveal{0%{opacity:0;transform:scale(.85) translateY(50px)}to{opacity:1;transform:scale(1) translateY(0)}}