body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{padding:2vh 2vw;text-align:center}.floating-envelope{animation:fadeUp .6s ease-out;bottom:14vh;left:50%;max-width:90vw;position:absolute;transform:translateX(-50%);z-index:50}.envelope-wrapper{height:auto;max-width:300px;width:100%}.instruction-card{background-color:#fff0f5;border:2px solid #ffb3c1;border-radius:12px;bottom:5vh;box-shadow:0 4px 12px #ff699940;color:#ad1457;font-family:Arial,sans-serif;font-size:1rem;left:50%;max-width:90vw;min-width:250px;padding:1em;position:fixed;text-align:center;transform:translateX(-50%);width:20vw;z-index:1000}.cake-ready-message{animation:fadeInPop 1s ease-out forwards;color:#c2185b;font-family:Comic Sans MS,Segoe Print,cursive;font-size:1.5rem;margin-top:2vh;text-shadow:1px 1px 3px #0000001a}@keyframes fadeUp{0%{opacity:0;transform:translate(-50%,40px)}to{opacity:1;transform:translate(-50%)}}@keyframes fadeInPop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@media (max-width:768px){.instruction-card{font-size:.95rem;padding:.8em;width:40vw}.cake-ready-message{font-size:1.2rem}.floating-envelope{bottom:8vh}}@media (max-width:480px){.instruction-card{font-size:.85rem;padding:.6em;width:80vw}.cake-ready-message{font-size:1rem}.floating-envelope{bottom:13vh}}.background-animation{background:linear-gradient(180deg,#ffe6f0,#fff0f5);height:100%;left:0;overflow:hidden;position:fixed;top:0;width:100%;z-index:-1}.circle{animation:floatUp 12s linear infinite;animation-delay:calc(var(--i)*-1s);background:radial-gradient(circle,#ffc0cb66,#0000);border-radius:50%;bottom:-100px;height:30px;left:calc(var(--i)*5%);position:absolute;transform:scale(calc(.5 + var(--i)*.05));width:30px}@keyframes floatUp{0%{opacity:.4;transform:translateY(0) scale(1)}50%{opacity:.8}to{opacity:0;transform:translateY(-110vh) scale(1.2)}}.candle-count-display{animation:fadeIn 2s ease-in-out forwards;background-color:#ff8fab;border:2px solid #ffc2d1;border-radius:10px;box-shadow:0 4px 8px #0003;color:#f0e4d0;font-family:Arial,sans-serif;font-size:30px;font-weight:700;margin:150px auto 20px;opacity:0;padding:10px;text-align:center;width:-webkit-fit-content;width:fit-content}@media (max-width:768px){.candle-count-display{font-size:25px;margin-top:100px}}@keyframes fadeIn{to{opacity:1}}.candle-count-display span{color:#ad030f;font-weight:700}body{background:#ffe5ec}.cake{height:200px;left:50%;margin:-70px 0 0 -125px;top:50%;width:250px}.cake,.cake>*{position:absolute}.plate{background:#ccc;bottom:-10px;box-shadow:0 2px 0 #b3b3b3,0 4px 0 #b3b3b3,0 5px 40px #00000080;height:110px;left:-10px;width:270px}.layer,.plate{border-radius:50%}.layer{background:#ffc2d1;box-shadow:0 2px 0 #fb6f92,0 4px 0 #ff8fab,0 6px 0 #ff8fab,0 8px 0 #ff8fab,0 10px 0 #ff8fab,0 12px 0 #ff8fab,0 14px 0 #ff8fab,0 16px 0 #ff8fab,0 18px 0 #ff8fab,0 20px 0 #ff8fab,0 22px 0 #ff8fab,0 24px 0 #ff8fab,0 26px 0 #ff8fab,0 28px 0 #ff8fab,0 30px 0 #ff8fab;height:100px;opacity:0;transform:translateY(-220px);width:250px}.layer-top{animation:layerRise .6s ease-out .4s forwards;top:0}.layer-middle{animation:layerRise .6s ease-out .2s forwards;top:33px}.layer-bottom{animation:layerRise .6s ease-out 0s forwards;top:66px}.icing{animation:icingDrop .6s ease-out .6s forwards;border-radius:50%;height:108px;opacity:0;right:-4px;top:-3px;transform:translateY(-220px);width:258px;z-index:2}.icing:before{background:#fff9f0;border-radius:50%;bottom:6px;box-shadow:0 0 4px #f6efe3,0 0 4px #f6efe3,0 0 4px #f6efe3;content:"";left:5px;position:absolute;right:5px;top:4px;z-index:3}.drip{animation:dripBounce .5s ease-out .8s forwards;background:#f0e4d0;border-radius:0 0 25px 25px;height:60px;opacity:0;transform:translateY(-30px) scaleY(.3);width:50px}.drip1{height:48px;left:5px;top:60px;transform:skewY(15deg) translateY(-30px) scaleY(.3);width:40px}.drip2{left:185px;top:70px;transform:skewY(-15deg) translateY(-30px) scaleY(.3)}.drip3{left:110px;top:58px;width:56px}.drip3,.drip4{border-radius:0 0 40px 40px}.drip4{left:55px;top:80px;width:40px}.candle{animation:candleDrop .6s ease-out 1s forwards;background-color:#7b020b;border-radius:6px/3px;height:35px;left:50%;margin-left:-8px;opacity:0;top:10px;transform:translateY(-100px);width:12px;z-index:10}.candle:before{background-color:#ad030f;border-radius:50%;content:"";height:6px;left:0;position:absolute;top:0;width:12px}.candle.out .flame{display:none}.flame{animation:flicker 1s ease-in-out infinite alternate;background-color:orange;border-radius:8px 8px 8px 8px/20px 20px 8px 8px;box-shadow:0 0 10px #ffa50080,0 0 20px #ffa50080,0 0 60px #ffa50080,0 0 80px #ffa50080;height:25px;left:50%;margin-left:-6px;position:absolute;top:-28px;transform-origin:50% 90%;width:10px;z-index:10}.smoke-wrapper{left:45%;pointer-events:none;position:absolute;top:-10px;transform:translateX(-50%)}.smoke-puff{animation-fill-mode:forwards;background:radial-gradient(circle,#bebebe99 0,#7878784d 70%,#0000 100%);border-radius:50%;bottom:0;filter:blur(1px);height:16px;opacity:0;position:absolute;width:16px}.puff-1{animation:puffLeft 5s ease-out forwards}.puff-2{animation:puffRight 6s ease-out .2s forwards}.puff-3{animation:puffLeft 7s ease-out .4s forwards}.puff-4{animation:puffRight 8s ease-out .6s forwards}@keyframes dripBounce{0%{opacity:0;transform:translateY(-30px) scaleY(.3)}60%{opacity:1}to{opacity:1;transform:translateY(0) scaleY(1)}}@keyframes candleIn{to{transform:translateY(0)}}@keyframes puffLeft{0%{opacity:.9;transform:translate(0) scale(.35)}30%{opacity:.7;transform:translate(-3px,-40px) scale(.6)}60%{opacity:.4;transform:translate(-5px,-100px) scale(1.2)}to{opacity:0;transform:translate(-7px,-150px) scale(1.6)}}@keyframes puffRight{0%{opacity:.9;transform:translate(0) scale(.35)}30%{opacity:.7;transform:translate(3px,-40px) scale(.6)}60%{opacity:.4;transform:translate(5px,-100px) scale(1.2)}to{opacity:0;transform:translate(7px,-150px) scale(1.6)}}@keyframes layerRise{0%{opacity:0;transform:translateY(-220px)}80%{transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes icingDrop{0%{opacity:0;transform:translateY(-200px)}60%{opacity:1;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes flicker{0%{box-shadow:0 0 10px #ffa50033,0 0 20px #ffa50033,0 0 60px #ffa50033,0 0 80px #ffa50033;transform:skewX(5deg)}25%{box-shadow:0 0 10px #ffa50080,0 0 20px #ffa50080,0 0 60px #ffa50080,0 0 80px #ffa50080;transform:skewX(-5deg)}50%{box-shadow:0 0 10px #ffa5004d,0 0 20px #ffa5004d,0 0 60px #ffa5004d,0 0 80px #ffa5004d;transform:skewX(10deg)}75%{box-shadow:0 0 10px #ffa50066,0 0 20px #ffa50066,0 0 60px #ffa50066,0 0 80px #ffa50066;transform:skewX(-10deg)}to{box-shadow:0 0 10px #ffa50080,0 0 20px #ffa50080,0 0 60px #ffa50080,0 0 80px #ffa50080;transform:skewX(5deg)}}@keyframes candleDrop{0%{opacity:0;transform:translateY(-100px)}80%{opacity:1;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}:root{--primary:#fff;--bg-color:#05353d;--bg-envelope-color:#f5edd1;--envelope-tab:#ecdeb8;--envelope-cover:#e6cfa7;--shadow-color:#0003;--txt-color:#444;--heart-color:#ff8fab}body{background-color:#05353d;background-color:var(--bg-color);box-sizing:border-box;color:#444;color:var(--txt-color);font-family:Merriweather,serif;margin:0;padding:0}.envelope-wrapper{bottom:160px;transform:translateX(-50%)}.envelope{height:230px;width:300px}.envelope:before{border-left:150px solid #0000;border-right:150px solid #0000;border-top:130px solid #ecdeb8;border-top:130px solid var(--envelope-tab);top:0;transform-origin:top;transition:all .5s ease-in-out .7s}.envelope:after,.envelope:before{content:"";position:absolute;z-index:2}.envelope:after{border-bottom:100px solid #e6cfa7;border-bottom:100px solid var(--envelope-cover);border-left:150px solid #e6cfa7;border-left:150px solid var(--envelope-cover);border-right:150px solid #e6cfa7;border-right:150px solid var(--envelope-cover);border-top:130px solid #0000;height:0;width:0}.letter{word-wrap:break-word;bottom:0;box-shadow:0 0 5px #0003;box-shadow:0 0 5px var(--shadow-color);height:85%;padding:20px 10px;right:20%;text-align:center;transition:all 1s ease-in-out;white-space:pre-wrap;width:54%;word-break:break-word;z-index:1}.text{color:#444;color:var(--txt-color);font-family:Gill Sans,Gill Sans MT,Calibri,Trebuchet MS,sans-serif;font-size:10px;text-align:left}.heart{cursor:pointer;transform:translate(-50%,-20%) rotate(45deg);transition:transform .5s ease-in-out 1s}.heart:after,.heart:before{background-color:#ff8fab;background-color:var(--heart-color);border-radius:50%;content:"";height:15px;position:absolute;width:15px}.heart:before{top:-7.5px}.heart:after{right:7.5px}.flap .envelope:before{transform:rotateX(180deg);z-index:0}.flap .letter{height:110%}.flap .heart{transform:rotate(90deg);transition-delay:.4s}.envelope-wrapper{bottom:110px;cursor:pointer;height:230px;left:50%;overflow:hidden;position:absolute;transform:translate(-50%) scale(1);transform-origin:bottom center;transition:transform .4s ease;width:300px;z-index:50}.envelope-wrapper:not(.expanded){overflow:hidden;transform:translate(-50%) scale(.27)}.envelope-wrapper.expanded{overflow:visible;transform:translate(-50%) scale(1)}.envelope{height:100%;position:relative;width:100%}.envelope,.letter{transition:all .4s ease}.letter{background:#fff;background:var(--primary);bottom:10%;box-shadow:0 2px 6px #0003;box-shadow:0 2px 6px var(--shadow-color);font-size:10px;height:80%;left:7%;opacity:0;overflow:hidden;padding:10px;position:absolute;transform:scale(.8);transition:all .4s ease,height .4s ease;width:80%}.flap .letter{bottom:190px;height:115%;transition-delay:1s}.envelope-wrapper.expanded .letter,.flap .letter{opacity:1;transform:scale(1)}.heart{background:#ff8fab;background:var(--heart-color);box-shadow:0 1px 6px #0003;box-shadow:0 1px 6px var(--shadow-color);height:15px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) rotate(45deg);transition:transform .4s ease;width:15px;z-index:4}.envelope-back{background-color:#f5edd1;background-color:var(--bg-envelope-color);border-radius:4px;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.text strong{font-family:Great Vibes,cursive;font-size:18.5px}.text p{font-family:Merriweather,serif;font-size:13px}@media (max-width:768px){.envelope-wrapper{bottom:90px;height:170px;width:220px}.envelope:after,.envelope:before{border-width:100px 110px 70px}.letter{font-size:8.5px;padding:6px}.text strong{font-size:14px}.text p{font-size:9.5px}}@media (max-width:480px){.envelope-wrapper{bottom:80px;height:140px;overflow:visible;width:180px}.envelope:after,.envelope:before{border-width:80px 90px 60px}.letter{bottom:10%;font-size:7px;height:78%!important;left:7.5%!important;opacity:0;padding:4px;transform:scale(.8);transition:all .4s ease;width:85%!important}.flap .letter{bottom:150px!important;height:125%!important;left:3.1%!important;opacity:1!important;transform:scale(1)!important;transition-delay:1s;width:90%!important}.text strong{font-size:12px}.text p{font-size:8.5px}.heart,.heart:after,.heart:before{height:12px;width:12px}}.mic-modal-overlay{align-items:center;background:#0009;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.mic-modal{background:#fffaf3;border-radius:16px;box-shadow:0 8px 20px #0003;box-sizing:border-box;max-width:400px;padding:2rem;text-align:center;width:100%}.mic-modal h2{color:#c2185b;font-size:1.6rem;margin-bottom:.5rem}.mic-modal p{color:#4e3b3b;font-size:1rem;margin-bottom:1.2rem}.start-button{background:#ff8fab;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;padding:.6rem 1.4rem;transition:background .2s ease}.start-button:hover{background:#fb6f92}@media (max-width:480px){.mic-modal{padding:1.2rem}.mic-modal h2{font-size:1.3rem}.mic-modal p{font-size:.95rem}.start-button{font-size:1rem;padding:.8rem;width:100%}}
/*# sourceMappingURL=main.3e2f0028.css.map*/