/* --- BỐ CỤC KHU BẢO TỒN SAFARI --- */
.safari-arena {
    height: 180px;
    background: linear-gradient(180deg, #81c784 0%, #aed581 50%, #cddc39 100%);
    box-shadow: inset 0 0 15px rgba(0,0,0,0.3);
    position: relative;
    overflow: hidden;
    border: 4px solid #558b2f;
    border-radius: 12px;
}

/* Cây bao baobab nền */
.baobab-bg {
    position: absolute;
    bottom: 20%;
    right: 10%;
    font-size: 5rem;
    z-index: 1;
    filter: drop-shadow(0 5px 5px rgba(0,0,0,0.2));
}
.baobab-bg::before { content: '🌳'; }

/* Xe Jeep cứu hộ (Bên trái) */
.rescue-jeep {
    position: absolute;
    left: 5%;
    bottom: 15%;
    font-size: 4rem;
    z-index: 3;
    transition: all 0.3s ease;
}
.idle {
    animation: engine-idle 0.5s infinite alternate;
}
@keyframes engine-idle {
    0% { transform: translateY(0); }
    100% { transform: translateY(-2px); }
}

/* Xe chạy tới cứu */
.drive-fwd {
    animation: jeep-dash 0.6s ease-out forwards;
}
@keyframes jeep-dash {
    0% { left: 5%; transform: scale(1) rotate(0); }
    100% { left: 45%; transform: scale(1.1) rotate(-5deg); }
}

/* Kẹt bùn rung lắc */
.shake-error { animation: jeep-stuck 0.4s infinite; }
@keyframes jeep-stuck {
    0% { transform: translateX(0) rotate(0); }
    25% { transform: translateX(-5px) rotate(-5deg); }
    50% { transform: translateX(5px) rotate(5deg); }
    75% { transform: translateX(-5px) rotate(-5deg); }
    100% { transform: translateX(0) rotate(0); }
}

/* Động vật chờ cứu (Bên phải) */
.animal-char {
    position: absolute;
    right: 20%;
    bottom: 15%;
    font-size: 3.5rem;
    z-index: 2;
    transition: all 0.5s ease;
}
.sick { filter: grayscale(50%) brightness(0.8); }

.happy-animal {
    filter: grayscale(0%) brightness(1);
    animation: jump-joy 0.5s infinite alternate;
}
@keyframes jump-joy {
    0% { transform: translateY(0); }
    100% { transform: translateY(-15px); }
}

.run-away {
    animation: flee 0.8s ease-in forwards;
}
@keyframes flee {
    100% { transform: translateX(150px); opacity: 0; }
}

/* Trái tim bay lên khi cứu thành công */
.heal-heart {
    position: absolute;
    right: 22%;
    bottom: 40%;
    font-size: 2rem;
    z-index: 4;
}
.float-up {
    animation: heart-fly 1s ease-out forwards;
}
@keyframes heart-fly {
    0% { transform: translateY(0) scale(0.5); opacity: 1; }
    100% { transform: translateY(-80px) scale(1.5); opacity: 0; }
}

.min-h-75 { min-height: 90px; }
.hl-num { color: #d32f2f; font-weight: 900; font-size: 1.2em; }