.button.green {
    background: linear-gradient(145deg, #2e7d32, #4caf50);
    border: 1px solid #66bb6a;
    box-shadow: 0 0 5px rgba(76, 175, 80, 0.5), 0 0 10px rgba(76, 175, 80, 0.3);
}

.button.green:hover {
    box-shadow: 0 0 15px rgba(76, 175, 80, 0.8), 0 0 25px rgba(76, 175, 80, 0.6);
}

.button.red {
    background: linear-gradient(145deg, #b71c1c, #f44336);
    border: 1px solid #ef5350;
    box-shadow: 0 0 5px rgba(244, 67, 54, 0.5), 0 0 10px rgba(244, 67, 54, 0.3);
}

.button.red:hover {
    box-shadow: 0 0 15px rgba(244, 67, 54, 0.8), 0 0 25px rgba(244, 67, 54, 0.6);
}

.button.orange {
    background: linear-gradient(145deg, #ff8c00, #ffa500);
    border: 1px solid #ff8c00;
    box-shadow: 0 0 5px rgba(255, 140, 0, 0.5), 0 0 10px rgba(255, 140, 0, 0.3);
}

.button.orange:hover {
    box-shadow: 0 0 15px rgba(255, 140, 0, 0.8), 0 0 25px rgba(255, 140, 0, 0.6);
}

.button.darkorange {
    background: linear-gradient(145deg, #d84315, #ff6e40);
    border: 1px solid #ff8a65;
    box-shadow: 0 0 5px rgba(255, 110, 64, 0.5), 0 0 10px rgba(255, 110, 64, 0.3);
}

.button.darkorange:hover {
    box-shadow: 0 0 15px rgba(255, 110, 64, 0.8), 0 0 25px rgba(255, 110, 64, 0.6);
}

.button.purple {
    background: linear-gradient(145deg, #6a1b9a, #ab47bc);
    border: 1px solid #ce93d8;
    box-shadow: 0 0 5px rgba(171, 71, 188, 0.5), 0 0 10px rgba(171, 71, 188, 0.3);
}

.button.purple:hover {
    box-shadow: 0 0 15px rgba(171, 71, 188, 0.8), 0 0 25px rgba(171, 71, 188, 0.6);
}

.button.darkblue {
    background: linear-gradient(145deg, #00008b, #0000cd);
    border: 1px solid #4682b4;
    box-shadow: 0 0 5px rgba(70, 130, 180, 0.5), 0 0 10px rgba(70, 130, 180, 0.3);
}

.button.darkblue:hover {
    box-shadow: 0 0 15px rgba(70, 130, 180, 0.8), 0 0 25px rgba(70, 130, 180, 0.6);
}

.button.pink {
    background: linear-gradient(145deg, #e91e63, #ec407a);
    border: 1px solid #f06292;
    box-shadow: 0 0 5px rgba(236, 64, 122, 0.5), 0 0 10px rgba(236, 64, 122, 0.3);
}

.button.pink:hover {
    box-shadow: 0 0 15px rgba(236, 64, 122, 0.8), 0 0 25px rgba(236, 64, 122, 0.6);
}

.button.brown {
    background: linear-gradient(145deg, #5d4037, #795548);
    border: 1px solid #8d6e63;
    box-shadow: 0 0 5px rgba(121, 85, 72, 0.5), 0 0 10px rgba(121, 85, 72, 0.3);
}

.button.brown:hover {
    box-shadow: 0 0 15px rgba(121, 85, 72, 0.8), 0 0 25px rgba(121, 85, 72, 0.6);
}

@keyframes glow {
  0% {
    box-shadow: 0 0 15px rgba(76, 175, 80, 0.6), 0 0 25px rgba(129, 199, 132, 0.4);
  }
  50% {
    box-shadow: 0 0 25px rgba(76, 175, 80, 1), 0 0 40px rgba(129, 199, 132, 0.8);
  }
  100% {
    box-shadow: 0 0 15px rgba(76, 175, 80, 0.6), 0 0 25px rgba(129, 199, 132, 0.4);
  }
}

.start-button {
    background: linear-gradient(145deg, #4CAF50, #81C784);
    border: 1px solid #66bb6a;
    font-size: 2rem; 
    font-weight: 900; 
    padding: 1.2rem 2.5rem; 
    animation: glow 2.5s infinite;
    color: white;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.start-button:hover {
    box-shadow: 0 0 25px rgba(76, 175, 80, 1), 0 0 35px rgba(76, 175, 80, 0.8);
}

.settings-button {
    background: linear-gradient(145deg, #153a59, #1e5282);
    border: 1px solid #2a75bb;
    box-shadow: 0 0 10px rgba(42, 117, 187, 0.5), 0 0 15px rgba(42, 117, 187, 0.3);
}

.settings-button:hover {
    box-shadow: 0 0 15px rgba(42, 117, 187, 0.8), 0 0 25px rgba(42, 117, 187, 0.6);
}

.button.small {
    padding: 0.5rem 1rem;
    font-size: 0.8rem;
    width: 50%;
    margin: 15px auto 0;
}

@keyframes pulse-mission {
    0% { transform: scale(1); box-shadow: 0 0 5px rgba(42, 117, 187, 0.4); }
    50% { transform: scale(1.05); box-shadow: 0 0 15px rgba(42, 117, 187, 0.8); }
    100% { transform: scale(1); box-shadow: 0 0 5px rgba(42, 117, 187, 0.4); }
}

.mission-list .button.small {
    animation: pulse-mission 2s infinite;
}