body { background: #1a1a1a; color: white; font-family: 'Segoe UI', sans-serif; text-align: center; margin: 0; padding: 20px; }
#game-container { max-width: 800px; margin: auto; }

#header { background: #333; padding: 15px; border-radius: 10px; margin-bottom: 20px; display: flex; justify-content: space-around; font-size: 1.2em; }

.team-row { display: flex; justify-content: center; gap: 15px; height: 150px; padding: 10px; align-items: center; }

.monster-card { 
    background: #2c3e50; border: 3px solid #34495e; border-radius: 12px;
    width: 120px; padding: 10px; position: relative; transition: all 0.2s;
}

.monster-emoji { font-size: 45px; display: block; margin-bottom: 8px; }
.hp-container { background: #444; height: 10px; width: 100%; border-radius: 5px; overflow: hidden; }
.hp-bar { background: #2ecc71; height: 100%; transition: width 0.3s; }
.poisoned-border { border-color: #8e44ad !important; box-shadow: 0 0 10px #8e44ad; }

/* Animação para Seleção de Substituição */
@keyframes pulse-gold {
    0% { box-shadow: 0 0 0px #f1c40f; transform: scale(1); }
    50% { box-shadow: 0 0 20px #f1c40f; transform: scale(1.05); }
    100% { box-shadow: 0 0 0px #f1c40f; transform: scale(1); }
}
.pulse-selection { animation: pulse-gold 1s infinite; border-color: #f1c40f !important; cursor: pointer; }

#combat-log { 
    height: 60px; background: #000; border-radius: 8px; margin: 10px 0;
    display: flex; align-items: center; justify-content: center; color: #f1c40f; font-weight: bold;
}

.hidden { display: none; }
.options-grid { display: flex; justify-content: center; gap: 15px; margin: 20px 0; flex-wrap: wrap; }

button { padding: 12px 24px; cursor: pointer; border: none; border-radius: 6px; font-weight: bold; font-size: 1em; }
#btn-fight { background: #e74c3c; color: white; }
#btn-reorder { background: #3498db; color: white; }
.continue-btn { background: #27ae60; color: white; width: 100%; margin-top: 15px; }

#instakill-overlay {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    font-size: 80px; color: #f1c40f; display: none; z-index: 100; text-shadow: 2px 2px 10px black;
}