:root{color-scheme:light}*{box-sizing:border-box}body{margin:0;background:#f6f5f1}.stage{min-height:100svh;display:grid;place-items:center;overflow:hidden;padding:25px}button{font:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:2px dashed #a98c69;outline-offset:12px;border-radius:15px}.gift{display:block;width:min(280px,70vw);height:auto;border:0;padding:0;background:none;cursor:pointer;transform:rotate(-4deg)}.gift svg{display:block;width:100%;overflow:visible}.gift:hover{transform:rotate(-1deg)}.gift.tapped{animation:tap .28s}.gift.opening{animation:shake .5s}.opening .box-top{transform-origin:140px 130px;animation:open .5s .35s forwards}.result{width:min(400px,90vw);height:min(500px,80svh);padding:0;background:none;border:0;cursor:pointer;animation:appear .4s ease-out}.result img{display:block;width:100%;height:100%;object-fit:contain}[hidden]{display:none!important}@keyframes tap{40%{transform:scale(.92) rotate(-7deg)}75%{transform:scale(1.04) rotate(2deg)}}@keyframes shake{20%,60%{transform:rotate(-7deg)}40%,80%{transform:rotate(4deg)}}@keyframes open{to{transform:translateY(-50px) rotate(-15deg);opacity:0}}@keyframes appear{from{opacity:0;transform:translateY(15px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}body{background:#fff8f0}.gift{transform:rotate(-2deg);width:min(260px,70vw)}.gift:hover{transform:rotate(1deg)}
