body {
  margin: 0;
}

#game {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
}

#canvas {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#gameOverlays {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}

.playerOverlay {
  position: absolute;
  left: 0;
  width: 100%;
  height: 50%;
  pointer-events: none;
}

#player1 {
  top: 0;
}

#player2 {
  bottom: 0;
}

#player2time,
#player1time,
#speed2,
#speed1 {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: "Press Start 2P", system-ui;
  font-size: 20px;
  color: white;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
  pointer-events: none;
  margin: 0;
}

#player1time,
#player2time {
  top: 20px;
}

#speed1,
#speed2 {
  bottom: 20px;
}

#menu {
  display: block;
  position: fixed;
  background-color: white;
  height: 100vh;
  width: 100vw;
  backdrop-filter: blur(20px);
  z-index: 11;
}

#filter {
  position: fixed;
  opacity: 0.5;
  background-color: white;
  height: 100vh;
  width: 100vw;
  z-index: 11;
}

.gameTitle {
  display: block;
  width: 100vw;
  position: fixed;
  text-align: center;
  font-family: "Press Start 2P", system-ui;
  font-size: 30px;
  color: white;
  text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.8);
  z-index: 12;
}

#start,
#restart,
#continue {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  width: 180px;
  height: 8vh;
  font-family: "Press Start 2P", system-ui;
  font-size: 18px;
  color: white;
  border-color: white;
  background-color: black;
  z-index: 12;
}

#pauseMenu {
  display: none;
}

#continue,
#restart {
  display: block;
}

#start:hover,
#restart:hover,
#continue:hover {
  color: lightgray;
  border-color: gray;
  transition: ease-in-out 0.1s;
}

#start,
#continue {
  top: 40%;
}

#restart {
  top: 50%;
}

#player2laps,
#player1laps {
  position: absolute;
  top: 20px;
  left: 20px;
  font-family: "Press Start 2P", system-ui;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
  color: white;
  pointer-events: none;
  margin: 0;
}
