#cover{overflow:hidden;position:relative;min-height:100svh;padding:24px 16px}
.rabbit-stage{position:relative;width:min(340px,76vw);height:min(40vh,360px);margin:24px 0 12px;display:grid;place-items:center}
.intro-rabbit{border:0;padding:0;background:none;height:100%;max-width:100%;transform-origin:50% 90%;animation:rabbit-arrive 1.3s cubic-bezier(.22,1,.36,1) both,rabbit-greet 1.4s 1.3s ease-in-out both}
.intro-rabbit img{display:block;height:100%;max-width:100%;object-fit:contain}
.hello-note{position:absolute;top:-24px;z-index:2;font-size:11px;letter-spacing:2px;color:#947287;animation:invitation-appear .7s 1.8s both}
.ribbon-heart{position:absolute;right:8%;top:28%;font:34px Georgia;color:#bc8ea7;animation:heart-rise 1.1s 1.6s both}
#cover h1,#cover>p:not(.small),#cover #start{animation:invitation-appear .75s 2.3s both}
#cover #start{animation-delay:2.6s}
#cover #skip{position:absolute;right:20px;top:15px;text-decoration:none}
#cover .cover-ornament{font-size:30px}
.intro-rabbit.pet{animation:rabbit-pet .65s ease-in-out}
@keyframes rabbit-arrive{0%{opacity:0;transform:translateY(55px) scale(.9)}60%{opacity:1;transform:translateY(-7px) scale(1.015)}100%{opacity:1;transform:none}}
@keyframes rabbit-greet{0%,100%{transform:rotate(0)}35%{transform:rotate(-5deg)}70%{transform:rotate(3deg)}}
@keyframes rabbit-pet{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-10px) rotate(-4deg)}70%{transform:translateY(-3px) rotate(3deg)}}
@keyframes invitation-appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes heart-rise{from{opacity:0;transform:translateY(15px) scale(.7)}40%{opacity:1}to{opacity:0;transform:translateY(-30px) scale(1.1)}}
@media(max-height:650px){.rabbit-stage{height:29vh;margin:20px 0 5px}#cover h1{font-size:34px}#cover>p{margin:6px}}
@media(prefers-reduced-motion:reduce){#cover *,#cover{animation:none!important}.ribbon-heart{display:none}}