.stage{display:grid;grid-template-rows:1fr auto;min-height:100vh;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Helvetica Neue,Arial;color:#111;background:#fff}.center{display:flex;flex-direction:column;gap:16px;align-items:center;justify-content:center;padding:24px;overflow:hidden}.heart{width:180px;height:180px;cursor:pointer;filter:drop-shadow(0 10px 20px rgba(0,0,0,20%));transition:transform .2s ease;&:hover{transform:scale(1.05)}&:active{transform:scale(.95)}&.hidden{display:none}}.loadingIndicator{display:flex;flex-direction:column;gap:12px;align-items:center;font-size:14px;color:#6b7280;.spinner{width:24px;height:24px;border:2px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:spin 1s linear infinite}}.avatar{display:none;width:220px;height:220px;object-fit:cover;border-radius:20px;box-shadow:0 14px 30px rgba(0,0,0,18%);opacity:0;transform:translateY(20px);&.visible{display:block;animation:fade-in-up .6s ease forwards}}.title{display:none;margin:6px 0 4px;font-size:clamp(24px,4vw,36px);text-align:center;opacity:0;transform:translateY(20px);&.visible{display:block;animation:fade-in-up .6s ease .1s forwards}}.text{display:none;max-width:680px;margin:0;text-align:center;opacity:0;transform:translateY(20px);&.visible{display:block;animation:fade-in-up .6s ease .2s forwards}}.confetti{position:fixed;z-index:9999;width:10px;height:14px;border-radius:2px;animation:confetti-burst 3s ease-out forwards;will-change:transform,opacity}.actions{display:flex;gap:10px;margin-top:8px}.btn{display:none;padding:10px 16px;font-size:16px;font-weight:500;color:#fff;cursor:pointer;background:#111827;border:0;border-radius:10px;box-shadow:0 10px 20px rgba(0,0,0,15%);opacity:0;transform:translateY(20px);transition:all .2s ease;&:hover{background:#1f2937;box-shadow:0 15px 25px rgba(0,0,0,20%);transform:translateY(-2px)}&:active{transform:translateY(0)}&.visible{display:inline-block;animation:fade-in-up .6s ease .3s forwards}}.musicIndicator{display:flex;gap:8px;align-items:center;padding:8px 12px;font-size:14px;font-weight:500;color:#92400e;background:#fef3c7;border-radius:8px;opacity:0;transform:translateY(20px);animation:fade-in-up .6s ease .4s forwards;&:before{content:"🎵";animation:music-note 1s ease-in-out infinite}}.footer{padding:14px;font-size:12px;color:#9ca3af;text-align:center}@keyframes fade-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes confetti-burst{0%{opacity:1;transform:translate(0) rotate(0deg)}50%{opacity:1;transform:translate(var(--dx),var(--dy)) rotate(var(--rotate))}to{opacity:0;transform:translate(calc(var(--dx) + var(--fall-y) * .1),calc(var(--dy) + var(--fall-y))) rotate(calc(var(--rotate) + 1turn))}}@keyframes music-note{0%,to{transform:scale(1) rotate(0deg)}50%{transform:scale(1.2) rotate(10deg)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (width <= 768px){.center{gap:12px;padding:16px}.heart{width:140px;height:140px}.avatar{width:180px;height:180px}.title{font-size:clamp(20px,5vw,28px)}.text{max-width:100%}.btn,.text{font-size:14px}.btn{padding:12px 20px}}@media (width <= 480px){.center{gap:10px;padding:12px}.heart{width:120px;height:120px}.avatar{width:160px;height:160px}.title{font-size:18px}.text{font-size:13px}}@media (prefers-contrast:high){.heart{filter:drop-shadow(0 10px 20px rgba(0,0,0,40%))}.btn{border:2px solid #000}}@media (prefers-reduced-motion:reduce){.avatar,.btn,.heart,.text,.title{transition:none}.confetti{display:none}.confetti,.loadingIndicator .spinner,.musicIndicator:before{animation:none}@keyframes fade-in-up{0%{opacity:0}to{opacity:1}}}