@import"https://fonts.googleapis.com/css2?family=Kalam:wght@300&&display=swap";@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#ffd1dc;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{justify-content:center;align-items:center;margin:0;display:flex;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}.gift-box{width:250px;cursor:pointer;animation:jerk-wait 1.25s ease-in-out infinite;transform-origin:bottom center;transition:opacity .5s ease-out}@media(max-width:600px){.gift-box{margin-bottom:118px;width:225px}}@keyframes jerk-wait{0%,10%,20%,30%,40%,to{transform:rotate(0)}5%,25%{transform:rotate(-5deg)}15%,35%{transform:rotate(5deg)}}.hachiware-container{position:relative;margin-right:50px;transition:opacity 2.5s ease-out,transform 1.5s ease-out 2.5s;opacity:0}.hachiware-container.visible{opacity:1;transform:translate(-143px,60px)}.hachiware-container.fadeout{opacity:0;transform:translate(-165px,40px);transition:transform 1s ease-out 1s,opacity 1s ease-out 2s}.textbox{background-color:#f9f9f9;color:#333;border-radius:16px;position:absolute;top:-121px;right:-435px;width:393px;padding:12px 16px;font-family:Kalam,sans-serif;font-size:28px;font-weight:300;opacity:0}.hachiware-container.visible .textbox.fadeout{transition:opacity .5s ease-out;opacity:0}.hachiware-container.visible .textbox{transition:opacity .5s ease-out 5s;opacity:1}.word{opacity:0;transform:translateY(8px);transition:opacity .4s ease-out,transform .4s ease-out;display:inline-block;margin-right:.3em}.word.visible{opacity:1;transform:translateY(0)}.hachiware{width:400px;transition:opacity .5s ease-out}.hachiware.fadeout{opacity:0}.gift-box.hidden{opacity:0;pointer-events:none;animation:none}.envelope{width:85px;position:absolute;top:247px;transform:rotate(30deg);right:-44px;pointer-events:none}.hachiware-container.text-finished .envelope.fadeout{cursor:none;animation:none}.hachiware-container.text-finished .envelope{transition:filter .2s ease-out;animation:letter-jerk-wait 1.25s ease-in-out infinite;cursor:pointer;pointer-events:auto}.hachiware-container.text-finished .envelope.fadeout:hover{filter:none}.hachiware-container.text-finished .envelope:hover{filter:drop-shadow(0 0 5px rgba(255,223,0,1))}@media(max-width:600px){.hachiware-container{margin-right:32px;transform:translateY(-55px)}.hachiware{width:300px}.envelope{width:63.75px;top:185.25px;right:-33px}.hachiware-container.visible{opacity:1;transform:translateY(40px)}.textbox{top:-270px;right:-28.5px;width:286px;font-size:25px}.hachiware-container.text-finished .envelope:hover{filter:none}.hachiware-container.text-finished .envelope{animation:letter-jerk-wait 1.25s ease-in-out infinite,letter-glow 1.25s ease-out infinite}.hachiware-container.fadeout{opacity:0;transform:translate(-135px,-128px);transition:transform 2s ease-out 1s,opacity 1s ease-out 3s}}@keyframes letter-glow{0%,to{filter:drop-shadow(0 0 2px rgba(255,223,0,1))}50%{filter:drop-shadow(0 0 8px rgba(255,223,0,1))}}@keyframes letter-jerk-wait{0%,10%,20%,30%,40%,to{transform:rotate(30deg)}5%,25%{transform:rotate(25deg)}15%,35%{transform:rotate(35deg)}}.letter{background-color:#f9f9f9;color:#333;opacity:0;transform:scale(.8);transform-origin:center 200px;transition:opacity 1s ease-out,transform 1s ease-in-out;font-family:Inter,sans-serif;font-size:1.25rem;font-weight:300;width:580px;padding:88px 104px;text-align:justify;margin:120px 0}.letter.visible{opacity:1;transform:scale(1)}.letter>p:not(:last-child):not(:nth-last-child(2)){margin-bottom:1em}@media(max-width:600px){.letter{width:302px;padding:28px 24px;margin:13px 0;text-align:justify}}
