body{
  margin: 0;
  background-color: black;
  text-align: center;
  font-family: Helvetica;
}

#startScreen{
  position: fixed;
  inset: 0;
  background: black;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

#startScreen h1{
  color: white;
  font-size: 80px;
}

#startScreen button{
  width: 140px;
  height: 60px;
}

h1{
  color: white;
}

h3{
  color: white;
}

button{
  color: white;
  background-color: grey;
  border-radius: 20px;
  border: solid 2px white;
  height: 60px;
  width: 80px;
}

/* El juego siempre por encima de los 👾 */
#game{
  position: relative;
  z-index: 10;
}

/* 👾 de la pantalla de inicio */
.aliens{
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.aliens span{
  position: absolute;
  top: -60px;
  font-size: 40px;
  animation: fall 8s linear infinite;
}

/* 👾 del juego */
.alien{
  position: fixed;
  font-size: 40px;
  pointer-events: none;
  user-select: none;
  z-index: -1;
  transform-origin: center center;
  will-change: transform, left, top;
  transition: transform 0.08s linear;
}

/* Animaciones */

@keyframes fall{
  0%{
    transform: translateY(-60px) rotate(0deg);
  }
  100%{
    transform: translateY(110vh) rotate(360deg);
  }
}

@keyframes rise{
  0%{
    transform: translateY(110vh);
  }
  100%{
    transform: translateY(-60px);
  }
}