.cn-env{position:relative;margin:0 auto;width:min(88%,22rem)}.cn-env-back{position:absolute;inset:0;border-radius:6px;background:linear-gradient(112deg,rgba(58,54,50,.06),transparent 42%),linear-gradient(-112deg,rgba(58,54,50,.06),transparent 42%),#ece6da;box-shadow:inset 0 0 0 1px rgba(58,54,50,.04)}.cn-env-photo{position:relative;margin:0 6%;transform:translateY(-14%);box-shadow:0 18px 40px -18px rgba(58,54,50,.45)}.cn-env-front{inset:0;top:34%;border-radius:0 0 6px 6px;background:linear-gradient(180deg,#f3eee4,#e9e2d4);clip-path:polygon(0 0,50% 42%,100% 0,100% 100%,0 100%)}.cn-env-front,.cn-env-seal{position:absolute;z-index:2}.cn-env-seal{left:50%;bottom:8%;transform:translateX(-50%)}.cn-film{background:#141210;color:#f5f2ec;padding:1.75rem 1.1rem;position:relative}.cn-film-meta{position:absolute;top:0;bottom:0;display:flex;flex-direction:column;justify-content:space-between;padding:2rem 0;font-family:var(--font-cute),sans-serif;font-size:9px;letter-spacing:.18em;color:rgba(245,242,236,.55);writing-mode:vertical-rl}.cn-film-caption{font-family:var(--font-cute),var(--font-body),sans-serif;background:rgba(0,0,0,.55);color:#fff;font-size:13px;padding:.45rem .9rem}.cn-cut{border:7px solid #fff;box-shadow:0 22px 44px -20px rgba(58,54,50,.5);transform:rotate(-6deg)}.cn-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);row-gap:.4rem;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.55);font-size:14px}.cn-cal-heart{position:absolute;inset:-6px;z-index:-1;color:#d64545;filter:drop-shadow(0 1px 4px rgba(0,0,0,.4))}@media (prefers-reduced-motion:reduce){.cn-marquee{animation:none!important}}.cn-envx{perspective:900px}.cn-envx .cn-env-photo{transform:translateY(20%);opacity:0;transition:transform .85s cubic-bezier(.22,1,.36,1) .35s,opacity .5s ease .4s;z-index:1}.cn-envx[data-stage=open] .cn-env-photo,.cn-envx[data-stage=opening] .cn-env-photo{transform:translateY(-28%);opacity:1}.cn-env-lid{position:absolute;left:0;right:0;top:0;height:58%;z-index:3;transform-origin:top center;transform:rotateX(0deg);transition:transform .7s cubic-bezier(.5,0,.3,1),opacity .3s ease .5s}.cn-env-lid,.cn-env-lid .cn-env-seal,.cn-env-lid:before{backface-visibility:hidden}.cn-env-lid:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#ddd5c6,#cdc4b2);clip-path:polygon(0 0,100% 0,50% 100%);border-radius:6px 6px 0 0}.cn-envx[data-stage=open] .cn-env-lid,.cn-envx[data-stage=opening] .cn-env-lid{transform:rotateX(-168deg);opacity:0}.cn-env-lid .cn-env-seal{bottom:auto;top:calc(100% - 27px)}@keyframes cn-heart-up{0%{transform:translate(-50%) scale(.4) rotate(0deg);opacity:0}18%{opacity:1}to{transform:translate(calc(-50% + var(--hx, 0px)),var(--hy,-170px)) scale(1) rotate(var(--hr,0deg));opacity:0}}.cn-heart{position:absolute;left:50%;top:30%;z-index:2;color:#c98d8d;animation:cn-heart-up var(--hd,1.6s) cubic-bezier(.2,.6,.35,1) var(--hdelay,0s) both;pointer-events:none}.cn-env-hint{transition:opacity .4s ease}@media (prefers-reduced-motion:reduce){.cn-env-lid,.cn-envx .cn-env-photo{transition:none!important}.cn-heart{animation:none!important;display:none}}