body {
    background-color: pink; /* TESTING PURPOSES */
}
#Calculate {
  margin: 10px auto;
  display: block;
  width: 150px;
  height: 30px;
  font-size: 16px;
  justify-content: center;
}
#FinalDamage {
    margin-top: 20px;
    padding: 10px;
    background-color: #def;
    border: 1px solid #09f;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
    justify-content: center;
}
/*entire grid*/
.button-grid {
  display: grid;
  grid-template-columns: repeat(2, 150px);
  grid-gap: 10px;
  padding: 10px;
  justify-content: center;
}
/*individual buttons*/
.button-grid button {
  width: 150px;
  height: 30px;
  font-size: 16px;
  cursor: pointer;
}
.active {
  filter: brightness(2.3); /* Slightly brighter */
  transition: filter 0.5s ease; /* Smooth effect */
}