/* --- BỐ CỤC BỆ PHÓNG VŨ TRỤ --- */
.space-arena {
    height: 250px;
    background: radial-gradient(circle at 50% 100%, #1a237e 0%, #000000 100%);
    box-shadow: inset 0 0 20px rgba(0,0,0,0.8);
    position: relative;
    overflow: hidden;
    border: 4px solid #3949ab;
    border-radius: 12px;
}

/* Các vì sao lấp lánh */
.stars-bg {
    position: absolute;
    width: 100%; height: 100%;
    background-image: radial-gradient(rgba(255, 255, 255, 0.8) 1px, transparent 1px),
                      radial-gradient(rgba(255, 255, 255, 0.4) 2px, transparent 2px);
    background-size: 40px 40px, 90px 90px;
    background-position: 0 0, 20px 20px;
    animation: twinkle 3s infinite alternate linear;
    z-index: 1;
}
@keyframes twinkle {
    0% { opacity: 0.5; }
    100% { opacity: 1; }
}

/* Bệ phóng */
.launch-pad {
    position: absolute;
    bottom: -10px;
    left: 40%;
    width: 20%;
    height: 30px;
    background: linear-gradient(90deg, #757575, #424242);
    border-top: 3px solid #bdbdbd;
    border-radius: 5px 5px 0 0;
    z-index: 2;
}

/* Tên lửa */
.rocket-char {
    position: absolute;
    left: 42%;
    bottom: 20px;
    font-size: 5rem;
    z-index: 4;
    transition: all 0.3s ease;
    filter: drop-shadow(0 0 10px rgba(255,255,255,0.2));
}

/* Tên lửa nhấp nháy chờ lệnh */
.idle {
    animation: rocket-hover 1.5s infinite alternate ease-in-out;
}
@keyframes rocket-hover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-3px); }
}

/* Lửa phụt ra khi đúng */
.rocket-fire {
    position: absolute;
    left: 48%;
    bottom: -15px;
    font-size: 3rem;
    z-index: 3;
}
.burn-flame {
    animation: fire-flicker 0.3s infinite alternate;
}
@keyframes fire-flicker {
    0% { transform: scale(1) translateY(0); filter: drop-shadow(0 0 10px #ff6d00); }
    100% { transform: scale(1.2) translateY(5px); filter: drop-shadow(0 0 20px #ffea00); }
}

.ready-launch { transform: translateY(-10px); }

/* Tên lửa rung lắc xịt khói khi sai */
.shake-error { animation: rocket-fail 0.4s infinite; filter: grayscale(80%) sepia(50%) hue-rotate(-50deg); }
@keyframes rocket-fail {
    0% { transform: translate(0,0) rotate(0); }
    25% { transform: translate(-5px, 2px) rotate(-3deg); }
    50% { transform: translate(5px, -2px) rotate(3deg); }
    75% { transform: translate(-5px, -2px) rotate(-3deg); }
    100% { transform: translate(0,0) rotate(0); }
}

/* Cảnh chiến thắng bay vào vũ trụ */
.blast-off {
    animation: fly-space 2s cubic-bezier(0.55, 0.085, 0.68, 0.53) forwards !important;
}
@keyframes fly-space {
    0% { transform: translateY(0); }
    100% { transform: translateY(-400px); opacity: 0; }
}

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