body{
  background-color: rgb(13, 13, 14);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 50px;
}
.heading{
    background-color: rgb(248, 8, 48);
    color: white;
    font-family:cursive;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 1px  10px 40px rgb(212, 30, 109);
}
.main{
  height: 320px;
  width: 320px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.btn{
  height: 100px;
  width: 100px;
  cursor: pointer;
  background-color: aliceblue;
  color: black;
  border:hidden;
  border-radius: 10px;
  font-size: xx-large;
  transition: all 0.1s ease-in-out;
}
.btn:active{
  background-color: rgb(219, 220, 220);
}
.reset{
  height: 50px;
  width: 130px;
  border: hidden;
  border-radius: 10px;
  font-size: larger;
  background-color: rgb(246, 3, 3);
  color: white;
  transition: all 0.1s ease-in-out;
}
.reset:active{
  background-color: rgb(245, 241, 241);
  color: black;
}
.win{
    background-color: white;
    padding: 10px;
    border-radius: 10px;
    color: white;
    background-color: rgb(4, 149, 26);
    box-shadow: 1px 20px 40px green;
    animation: scale 2s ease-in-out;
}
@keyframes scale{
  from{
    transform: scale(0.01);
  }
  to{
    transform: scale(1);
  }
}