/* --- BỐ CỤC LÀNG MÙA ĐÔNG --- */
.winter-arena {
    height: 220px;
    background: linear-gradient(180deg, #1565c0 0%, #64b5f6 60%, #e3f2fd 60%, #ffffff 100%);
    box-shadow: inset 0 0 20px rgba(0,0,0,0.2);
    position: relative; 
    overflow: hidden;
}

/* Hiệu ứng tuyết rơi vô tận */
.winter-bg {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-image: 
        radial-gradient(4px 4px at 20px 30px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(3px 3px at 50px 70px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(5px 5px at 120px 40px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(4px 4px at 180px 110px, #ffffff, rgba(0,0,0,0)),
        radial-gradient(3px 3px at 250px 20px, #ffffff, rgba(0,0,0,0));
    background-size: 300px 300px;
    animation: snowfall 5s linear infinite;
    z-index: 1;
}

@keyframes snowfall {
    0% { transform: translateY(-100px); }
    100% { transform: translateY(300px); }
}

/* Các ngọn đồi tuyết phía sau */
.winter-bg::before {
    content: '';
    position: absolute;
    bottom: 30%; left: -10%;
    width: 60%; height: 50px;
    background: #bbdefb;
    border-radius: 50% 50% 0 0;
}
.winter-bg::after {
    content: '';
    position: absolute;
    bottom: 30%; right: -10%;
    width: 70%; height: 60px;
    background: #e3f2fd;
    border-radius: 50% 50% 0 0;
}

/* Đối tượng mục tiêu (Hộp quà, chuông...) */
.winter-object {
    position: absolute;
    top: 35%; left: 65%;
    transform: translate(-50%, -50%);
    width: 70px; height: 70px;
    background: rgba(255, 255, 255, 0.9);
    border: 3px solid #ffffff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
    animation: float-obj 3s ease-in-out infinite alternate;
}

@keyframes float-obj {
    0% { transform: translate(-50%, -40%); }
    100% { transform: translate(-50%, -60%); }
}

/* Hiệu ứng khi tính đúng */
.glow-success {
    animation: flash-item 1s ease-out forwards;
}
@keyframes flash-item {
    0%, 100% { filter: drop-shadow(0 4px 4px rgba(0,0,0,0.4)) scale(1); }
    50% { filter: drop-shadow(0 0 25px #ffeb3b) scale(1.3); }
}

/* Nhân vật Người Tuyết */
.snowman-char {
    position: absolute;
    bottom: 10px;
    left: 15%;
    font-size: 5rem;
    z-index: 5;
    filter: drop-shadow(0 5px 5px rgba(0,0,0,0.3));
    transform-origin: bottom center;
}

/* Xoay vòng vui mừng */
.happy-spin {
    animation: snow-spin 1s ease-out forwards !important;
}
@keyframes snow-spin {
    0% { transform: translateY(0) rotate(0); }
    50% { transform: translateY(-30px) rotate(15deg) scale(1.1); }
    100% { transform: translateY(0) rotate(360deg) scale(1); }
}

/* Rung lắc khi sai */
.shake-error { animation: shake-char 0.4s !important; }
@keyframes shake-char {
    0% { transform: translateX(0); }
    25% { transform: translateX(-15px) rotate(-5deg); }
    50% { transform: translateX(15px) rotate(5deg); }
    75% { transform: translateX(-15px) rotate(-5deg); }
    100% { transform: translateX(0); }
}

.min-h-75 { min-height: 85px; }