@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');
/* Estilos generales, modales, etc... (todo lo que ya tenías está bien) */
body { font-family: 'Poppins', sans-serif; /* ... */ }
.modal-overlay { /* ... */ }
.hidden { display: none; }
#game-container { width: 100%; max-width: 800px; /* ... */ }

/* Estilos del Área de Juego */
.game-header { text-align: center; margin-bottom: 20px; }
.network-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 15px;
    margin: 20px 0;
    min-height: 400px;
}
.computer {
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2.5em;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 3px solid;
}
.computer.vulnerable { border-color: #ffc107; background-color: #fff9e6; }
.computer.vulnerable:hover { background-color: #fff2d1; }
.computer.patched { border-color: #28a745; background-color: #eaf6ec; cursor: not-allowed; }
.computer.infected { border-color: #dc3545; background-color: #fbe9e7; color: #dc3545; cursor: not-allowed; animation: pulse-red 1s infinite; }

@keyframes pulse-red { 0% { box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7); } 100% { box-shadow: 0 0 10px 10px rgba(220, 53, 69, 0); } }

.message-box { padding: 10px; border-radius: 5px; font-weight: 600; }
.game-footer { margin-top: 20px; text-align: center; }
#action-button { padding: 12px 25px; font-size: 1.1em; cursor: pointer; border-radius: 5px; border: none; }
.back-button { /* ... Estilo del botón de volver ... */ }

/* Estilos de la Nota de Rescate y su botón */
#ransom-note .ransom-box { /* ... */ }
#ransom-exit-button { /* ... */ }
#ransom-exit-button:disabled { background-color: #5a5a5a; color: #999; cursor: not-allowed; }
.game-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.timer-display {
    font-size: 1.2em;
    font-weight: 600;
    color: #ffc107; /* Un color que resalte */
    background: rgba(0,0,0,0.2);
    padding: 5px 15px;
    border-radius: 5px;
    white-space: nowrap;
}

.back-button {
    display: inline-block;
    padding: 10px 15px;
    margin-top: 10px;
    background-color: #6c757d;
    color: white;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 600;
}