body{
  margin:0;
  min-height:100vh;

  background:#73bde0;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  font-family:
    "Hiragino Mincho ProN",
    serif;
}

.slot-machine{
  display:flex;
  gap:8px;
}

.reel-column{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}

.reel{
  width:50px;
  height:50px;

  background:#f2f2f2;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:32px;
  font-family:
    "Yu Gothic",
    sans-serif;
  font-weight:bold;
  transition: all .2s ease;
}

.stop-btn{
  width:50px;
  height:24px;

  border:none;
  border-radius:12px;

  background:#f1f236;

  font-size:11px;
  font-weight:bold;

  cursor:pointer;
}

.main-btn{
  width:240px;
  height:54px;

  margin-top:28px;

  border:none;
  border-radius:999px;

  background:#f1f236;

  font-size:18px;
  font-weight:bold;

  cursor:pointer;
}

.correct{
  color:#ff3333;
   font-family: "Dela Gothic One", sans-serif;
    font-size:50px;
 font-weight:normal;
}
.incorrect{
  color:black;
}

body.jackpot{
  overflow:hidden;
}

#jackpotBg{
  position: fixed;

  top: 50%;
  left: 50%;

  width: 130vmax;
  height: 130vmax;

  transform:
    translate(-50%, -50%);

  background-image: url("atari.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;

  opacity: 0;
  pointer-events: none;
  z-index: -1;
}

#jackpotBg.show{
  opacity:1;
  animation:
   
    spinBg 2.5s linear infinite,
    flashBg 0.3s infinite alternate;
}

@keyframes spinBg{
 from{
    transform:
      translate(-50%, -50%)
      rotate(0deg);
  }

  to{
    transform:
      translate(-50%, -50%)
      rotate(360deg);
  }

  from{
    filter:brightness(1);
  }
  to{
    filter:brightness(1.5);
  }
}