/* Global Styles */
body {
    font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.logo-img {
    width: 90px;
    height: auto;
}
.container {
    flex: 1;
}

.avatar-sm {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
}

/* Game-specific Styles */
.emoji-clue {
    font-size: 3rem;
    text-align: center;
    line-height: 1.5;
}

.buzzer-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 2rem 0;
}

/* Animation for correct/wrong answers */
@keyframes pulse-success {
    0% { box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.7); }
    70% { box-shadow: 0 0 0 15px rgba(25, 135, 84, 0); }
    100% { box-shadow: 0 0 0 0 rgba(25, 135, 84, 0); }
}

@keyframes pulse-danger {
    0% { box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7); }
    70% { box-shadow: 0 0 0 15px rgba(220, 53, 69, 0); }
    100% { box-shadow: 0 0 0 0 rgba(220, 53, 69, 0); }
}

.pulse-success {
    animation: pulse-success 1.5s;
}

.pulse-danger {
    animation: pulse-danger 1.5s;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .buzzer {
        width: 150px !important;
        height: 150px !important;
        font-size: 20px !important;
    }
    
    .clue-container, .final-clue-container {
        min-height: 60px;
        padding: 15px;
    }
    
    .emoji-clue {
        font-size: 2.5rem;
    }
}