*{box-sizing:border-box}body{margin:0;min-height:100svh;background:#f8f3e9;color:#25483b;font-family:ui-rounded,system-ui,-apple-system,sans-serif;background-image:radial-gradient(ellipse at 20% 10%,#f5dfc9 0,transparent 50%),radial-gradient(ellipse at 95% 90%,#dfe8d8 0,transparent 45%)}header{padding:26px 7%;font-weight:750;letter-spacing:-.7px}header a{color:inherit;text-decoration:none}main{max-width:700px;margin:5vh auto 10vh;padding:24px;text-align:center}.eyebrow{text-transform:uppercase;letter-spacing:3px;font-size:12px;font-weight:650;color:#78836d}h1{font-size:clamp(32px,7vw,52px);line-height:1.13;letter-spacing:-1.5px;margin:18px 0} .intro{color:#69796e;font-size:17px;line-height:1.5}.envelope{display:block;position:relative;width:min(340px,90%);height:225px;margin:64px auto 38px;border:0;border-radius:12px;background:#d5ad7f;box-shadow:0 22px 45px #60472722;cursor:pointer;perspective:900px;isolation:isolate;transition:transform .4s,opacity .4s}.envelope:focus-visible,.replay:focus-visible{outline:3px solid #25483b;outline-offset:8px}.envelope:hover{transform:translateY(-5px)}.paper{position:absolute;inset:18px 18px 12px;background:#fffdf7;border-radius:7px;transition:transform .8s .25s;box-shadow:0 0 5px #0001}.paper:before{content:'A little something, just for you.';display:block;padding:35px 24px;color:#54715e;font-family:Georgia,serif;font-size:22px}.front{position:absolute;inset:0;background:#ebc89e;clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%);border-radius:10px;z-index:3}.flap{position:absolute;inset:0;background:#f3d9b6;clip-path:polygon(0 0,100% 0,50% 55%);transform-origin:top;transition:transform .6s;z-index:4;backface-visibility:hidden}.seal{position:absolute;left:calc(50% - 23px);top:97px;width:46px;height:46px;background:#a5523f;border-radius:50%;color:#fff1dd;display:grid;place-items:center;font-size:23px;z-index:5;transition:opacity .2s}.opened .flap{transform:rotateX(180deg)}.opened .seal{opacity:0}.opened .paper{transform:translateY(-85px)}.opened{pointer-events:none;transform:scale(.8);opacity:0;transition:opacity .3s 1s,transform .7s .7s}.prompt{font-weight:600;font-size:16px}.letter{background:#fffdf8;border:1px solid #e4d9c8;border-radius:16px;box-shadow:0 20px 60px #60472715;padding:clamp(26px,7vw,52px);margin:30px auto;text-align:left;animation:reveal .6s both}.letter:before{content:'✉';color:#a5523f;font-size:28px}.message{font:clamp(23px,5vw,34px)/1.7 Georgia,'Noto Serif',serif;white-space:pre-wrap;overflow-wrap:anywhere;margin:22px 0}.signature{border-top:1px solid #e9dfd1;padding-top:18px;font-size:13px;color:#879180;letter-spacing:1px}.replay{background:transparent;border:1px solid #a7b2a1;color:#25483b;border-radius:999px;padding:12px 25px;font:inherit;cursor:pointer}footer{color:#8c9487;font-size:12px;margin-top:38px}[hidden]{display:none!important}@keyframes reveal{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important}}