@font-face{font-family:"ZEN Serif";src:url(/assets/ZEN-SERIF-Regular-oF1hQHto.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}body{font-family:"ZEN Serif",system-ui,Avenir,Helvetica,Arial,sans-serif;margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#213547;background-color:#fef2e4;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.scene{position:relative;width:100vw;height:100vh;overflow:hidden;background-color:#fef2e4;display:flex;justify-content:center;align-items:center;flex-direction:column;padding-bottom:4rem;box-sizing:border-box}.envelope-container{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:2.25rem}.tap-hint{margin:0;font-size:1rem;align-items:center;color:#8b7355;font-family:"ZEN Serif",Georgia,serif}.site-footer{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);font-size:.7rem;color:#8b7355;text-align:center;z-index:10}.envelope-wrapper{position:relative;perspective:800px;width:min(90vw,360px);min-width:260px;aspect-ratio:360 / 560;animation:envelopePulse 3s ease-in-out infinite}.envelope-wrapper.opened,.envelope-wrapper.opened .envelope-header,.envelope-wrapper.opened .envelope-subtitle{animation:none}.envelope{position:relative;z-index:1;width:100%;height:100%;cursor:pointer;transition:transform 1.2s ease;transform-style:preserve-3d}.envelope.opened{transform:rotateY(180deg)}.face{position:absolute;inset:0;width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:8px;backface-visibility:hidden}.face-front{z-index:1}.back-panel{position:absolute;inset:0;width:100%;height:100%;transform:rotateY(180deg);backface-visibility:hidden;border-radius:8px;transform-style:preserve-3d}.envelope:not(.opened) .back-panel{visibility:hidden}.face-back{z-index:1}.horse,.cloud-left,.cloud-right{display:block;height:auto;transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden}@keyframes envelopePulse{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}@keyframes envelopeTextCounterScale{0%{transform:scale(1)}50%{transform:scale(.98039)}to{transform:scale(1)}}.front-content{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:8px;overflow:hidden;backface-visibility:hidden}.flap-closed{position:absolute;top:0;left:.5px;width:99.6%;height:18%;background-size:100% 100%;background-position:bottom center;background-repeat:no-repeat;z-index:2;pointer-events:none}.flap-opens-above{position:absolute;bottom:98%;left:.5px;width:99.6%;height:18%;transform:translateY(1px);background-size:100% 100%;background-position:bottom center;background-repeat:no-repeat;z-index:1;pointer-events:none}.envelope-header{position:absolute;top:30px;left:0;right:0;margin:0;font-size:1.8rem;font-weight:700;letter-spacing:.5px;color:#f9e27d;text-align:center;text-transform:uppercase;z-index:3}.envelope-subtitle{position:absolute;top:calc(50px + 1.62rem);left:0;right:0;margin:0;font-size:.9rem;font-weight:400;letter-spacing:.5px;color:#f9e27d;text-align:center;z-index:3}.envelope-year{position:absolute;bottom:24px;left:0;right:0;font-size:1.4rem;font-weight:600;letter-spacing:.5px;color:#f9e27d;text-align:center;z-index:3}.cloud-left{position:absolute;width:90px;top:22%;left:52px;z-index:2}.cloud-right{position:absolute;width:86px;top:28%;right:52px;z-index:2}.cloud-left,.cloud-right{will-change:transform}.horse{position:absolute;width:90%;bottom:5%;left:50%;transform:translate(-50%) scale(1.3) translateZ(0);z-index:1;transform-origin:center bottom;animation:jiggleHorse 6s ease-in-out infinite}@keyframes jiggleHorse{0%{transform:translate(-50%) scale(1.3) rotate(0) translateZ(0)}25%{transform:translate(-50%) scale(1.3) rotate(-2deg) translateZ(0)}50%{transform:translate(-50%) scale(1.3) rotate(1.5deg) translateZ(0)}75%{transform:translate(-50%) scale(1.3) rotate(-1deg) translateZ(0)}to{transform:translate(-50%) scale(1.3) rotate(0) translateZ(0)}}.emoji-burst{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none;z-index:2}.emoji-confetti{position:absolute;left:0;top:0;font-size:1.75rem;animation-name:confettiBurst;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes confettiBurst{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(var(--dx,0),var(--dy,0)) rotate(var(--rotate,0deg));opacity:0}}.card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(330px,min(88vw,352px));max-height:85%;padding:2rem;background-color:#fff;border-radius:16px;text-align:center;box-shadow:0 6px 15px #0003;animation:cardFadeIn .5s ease forwards;box-sizing:border-box;overflow:hidden;display:flex;flex-direction:column;z-index:10;pointer-events:auto}.card h1.card-title{font-family:"ZEN Serif",Instrument Serif,serif;font-size:1.7rem;margin:0 0 1.5rem;color:#1a1a1a;flex-shrink:0;white-space:nowrap}.card p.card-paragraph{font-family:"ZEN Serif",Instrument Serif,serif;font-size:1.14rem;margin:0 0 2rem;color:#333;flex:1 1 auto;min-height:0;overflow-y:auto;line-height:1.4}.card .buttons{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:center;align-items:center;gap:1rem;margin-top:auto;flex-shrink:0}.buttons button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:.5rem 1.25rem;font-family:"ZEN Serif",serif;font-size:1rem;border-radius:8px;border:1px solid #b22222;background-color:#fef2e4;color:#000;cursor:pointer;transition:background-color .25s,color .25s;flex:1 1 0;min-width:0;white-space:nowrap;text-align:center;display:inline-flex;align-items:center;justify-content:center}.buttons button.share-btn{padding-left:1.25rem;padding-right:1.25rem}.buttons button:hover{background-color:#f9e27d}.buttons button:focus{outline:none}.buttons button:focus-visible{outline:2px solid #b22222;outline-offset:2px}.buttons button.share-btn.copied{border-color:#b22222}@media(max-width:480px){.scene{min-height:100dvh;min-height:100vh}.envelope-wrapper{width:min(90vw,360px);min-width:260px}.envelope-header{font-size:2rem}.envelope-subtitle{font-size:1rem}.envelope-year{font-size:1.5rem}.card{width:min(88vw,335px);max-width:none;min-height:20px;padding:2.2rem}.card h1.card-title{font-size:1.45rem}.card p.card-paragraph{font-size:1.2rem}.buttons button{font-size:1.05rem;padding:.6rem 1.1rem}.tap-hint{font-size:1.1rem}}@keyframes cardFadeIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
