/* 🎰 1단계: 뽑기 통과 공 애니메이션 */
.lottery-machine {
    position: relative;
    width: 100%;
    height: 250px; 
    background: #f0f4f8;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: inset 0 0 20px rgba(0,0,0,0.1);
}
.lottery-ball {
    position: absolute;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    background: radial-gradient(circle at 30% 30%, #ffffff, #ffcfcf);
    box-shadow: 3px 3px 10px rgba(0,0,0,0.2);
    top: 40%; 
    left: 40%;
}

@keyframes flyAround {
    0% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(var(--tx1), var(--ty1)) rotate(90deg); }
    50% { transform: translate(var(--tx2), var(--ty2)) rotate(180deg); }
    75% { transform: translate(var(--tx3), var(--ty3)) rotate(270deg); }
    100% { transform: translate(0, 0) rotate(360deg); }
}

/* 💥 2단계: 선택된 공이 사진으로 촤라락 펴지는 효과 */
.unfold-wrapper {
    perspective: 1200px;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 40px; /* 💡 이 부분을 추가했습니다! (위쪽으로 40px 여백) */
}
.unfold-image {
    width: 100%;
    max-width: 450px; /* 기존 300px에서 450px로 크기를 큼직하게 키웠습니다 */
    height: 350px; /* 일정한 높이를 줘서 카드가 덜컹거리지 않게 고정 */
    object-fit: contain; /* 💡 핵심! 이미지가 잘리지 않고 원본 비율 그대로 쏙 들어가게 합니다 */
    
    animation: unfoldEffect 1.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
    transform-origin: center;
    opacity: 0;
}

@keyframes unfoldEffect {
    0% { 
        transform: scale(0.1) rotateX(180deg) rotateY(180deg) translateZ(-500px); 
        opacity: 0;
        border-radius: 50%; 
    }
    40% {
        transform: scale(1.2) rotateX(-20deg) rotateY(20deg) translateZ(100px); 
        opacity: 1;
        border-radius: 30%; 
    }
    100% { 
        transform: scale(1) rotateX(0deg) rotateY(0deg) translateZ(0); 
        opacity: 1;
        border-radius: 10px; 
    }
}

.fade-in-text {
    animation: fadeIn 1s ease 0.5s forwards;
    opacity: 0;
}
@keyframes fadeIn {
    to { opacity: 1; }
}