.envelope-stage{text-align:center}
.envelope{position:relative;width:min(420px,84vw);height:270px;margin:36px auto;cursor:grab;perspective:900px}
.envelope-back,.envelope-front,.envelope-flap,.envelope-letter{position:absolute}
.envelope-back{inset:0;border-radius:14px;background:#d96a9d;box-shadow:0 25px 60px rgba(0,0,0,.35)}
.envelope-front{inset:0;border-radius:14px;background:linear-gradient(145deg,#f38bbb,#c8588d);
 clip-path:polygon(0 22%,50% 68%,100% 22%,100% 100%,0 100%);z-index:3}
.envelope-flap{inset:0;background:#f5a2c8;clip-path:polygon(0 0,100% 0,50% 64%);z-index:4;
 transform-origin:top;transition:transform .85s cubic-bezier(.2,.8,.2,1)}
.envelope-letter{left:8%;right:8%;bottom:8%;height:78%;display:grid;place-items:center;color:#5c2641;
 border-radius:8px;background:#fff9ef;z-index:2;transition:transform 1s .35s ease}
.seal{position:absolute;z-index:5;left:50%;top:52%;transform:translate(-50%,-50%);
 width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#9d214f;color:white}
.envelope.is-open .envelope-flap{transform:rotateX(180deg);z-index:1}
.envelope.is-open .envelope-letter{transform:translateY(-150px)}
.envelope.is-open .seal{opacity:0}
.letter-paper{width:min(760px,92vw);max-height:82vh;overflow:auto;padding:44px;border-radius:14px;color:#4b263b;
 background:linear-gradient(rgba(255,252,244,.98),rgba(255,245,235,.98));box-shadow:0 25px 80px rgba(0,0,0,.35)}
.letter-paper h2{color:#6d274d}
.letter-paper p{font-family:Georgia,serif;font-size:clamp(17px,3vw,22px);line-height:1.9;white-space:pre-line}