@layer normalize{html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}}*{box-sizing:border-box}body{background-color:#111;text-align:center;height:100vh;width:100vw;display:flex;align-items:center;justify-content:center;overflow:hidden;margin:0;padding:0;font-family:Arial,sans-serif;font-size:12px}.envelope{--w: min(300px, 88vw, 66vh);width:var(--w);height:calc(var(--w) / 2);font-size:calc(var(--w) / 31);background:#b49976;position:relative;--wc: transform;perspective:calc(var(--w) * 4);isolation:isolate}.envelope__check{height:100%;width:100%;z-index:10;opacity:0;position:absolute;left:0;top:0;margin:0;cursor:pointer}.envelope__check:checked~.envelope__flap{transition:transform .25s,z-index .25s steps(1,jump-end);transform:rotateX(-180deg);z-index:0}.envelope__check:checked~.envelope__letter{transform:translateY(-110%);transition:transform .25s .25s,z-index .5s steps(1,jump-end);z-index:5}.envelope__check:checked~.envelope__letter .letter__content:nth-child(2){transition:transform .25s .5s;transform:rotateX(0) translateZ(-1px)}.envelope__check:checked~.envelope__letter .letter__content:nth-child(3){transition:transform .25s .5s;transform:rotateX(0) translateZ(1px)}.letter__content:nth-child(2):before,.letter__content:nth-child(3):before{content:"";position:absolute;inset:0;background:linear-gradient(#261c0c57,#261c0c0a);pointer-events:none;transition:opacity .25s}.envelope__check:checked~.envelope__letter .letter__content:before{opacity:0;transition:opacity .25s .5s}.envelope__flap{will-change:var(--wc);position:absolute;top:0;left:0;right:0;height:75%;transition:transform .25s .5s,z-index .5s steps(1,jump-end);transform-origin:top center;backface-visibility:hidden;background:repeating-linear-gradient(-45deg,#c1ab8e,#c1ab8e 10px,#e74c3c 10px 20px,#c1ab8e 20px 30px,#1e90ff 30px 40px) 0 0/100% 5px no-repeat,#c1ab8e;z-index:4;clip-path:polygon(5% 40%,50% 100%,95% 40%,100% 0,0 0)}.envelope__flap--inside{background:#c1ab8e;backface-visibility:visible}.envelope__back{will-change:var(--wc);height:100%;width:100%;position:absolute;top:0;left:0;z-index:3;background:repeating-linear-gradient(-45deg,#cebda6,#cebda6 10px,#e74c3c 10px 20px,#cebda6 20px 30px,#1e90ff 30px 40px) 0 100%/100% 5px no-repeat,repeating-linear-gradient(-45deg,#cebda6,#cebda6 10px,#e74c3c 10px 20px,#cebda6 20px 30px,#1e90ff 30px 40px) 0 100%/5px 100% no-repeat,repeating-linear-gradient(-45deg,#cebda6,#cebda6 10px,#e74c3c 10px 20px,#cebda6 20px 30px,#1e90ff 30px 40px) 100% 100%/5px 100% no-repeat,#cebda6;clip-path:polygon(80% 40%,100% 0,100% 100%,0 100%,0 0,20% 40%)}.envelope__back:after{height:100%;width:100%;background:repeating-linear-gradient(-45deg,#c7b49a,#c7b49a 10px,#e74c3c 10px 20px,#c7b49a 20px 30px,#1e90ff 30px 40px) 0 100%/100% 5px no-repeat,#c7b49a;content:"";position:absolute;top:0;left:0;clip-path:polygon(70% 10%,100% 100%,0 100%,30% 10%)}.envelope__letter{will-change:var(--wc);height:90%;width:90%;z-index:2;position:absolute;left:5%;top:5%;transition:transform .25s .25s,z-index .25s steps(1,jump-end);transform:translateY(0);transform-style:preserve-3d}.letter{height:100%;width:100%;position:relative;transform-style:preserve-3d}.letter__content{height:100%;width:100%;background-color:#fffdf7;color:#2b2721;font-family:Courier Prime,ui-monospace,monospace;top:0;left:0;position:absolute;padding:1.1em 1.2em .4em;text-align:left;line-height:1.45;box-shadow:0 6px 16px -8px #0000008c}.letter__content p{margin:0 0 .75em}.letter__content:nth-child(2),.letter__content:nth-child(3){transition:transform .25s;top:100%;transform-origin:top center;backface-visibility:visible;z-index:2;border-top:1px solid rgba(43,39,33,.14);background-image:linear-gradient(rgba(38,28,12,.13),transparent 9%)}.letter__content:nth-child(2){transform:rotateX(180deg) translateZ(-1px)}.letter__content:nth-child(3){backface-visibility:hidden;transform:rotateX(180deg) translateZ(1px)}.sign-off{display:block;text-align:right;margin-top:-.25em;font-size:2.1em;font-family:Caveat,cursive;color:#1c3f6e;transform:skew(-20deg)}div.tp-dfwv{z-index:9999;width:280px;position:fixed}div.tp-dfwv .tp-rotv{max-height:calc(100vh - 16px);overflow:auto;border-radius:var(--bs-br)}div.tp-dfwv .tp-rotv>.tp-rotv_b{position:sticky;top:0;z-index:2;background:#45474c}