body {

  margin: 0;

  overflow: hidden;

  font-family: sans-serif;

  background: white;

  color: black;
}

.screen {

  min-height: 100vh;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  gap: 18px;

  position: relative;

  z-index: 1;

  text-align: center;
}

.hidden {
  display: none;
}

h1 {

  font-size: 48px;

  margin: 0;
}

p {

  font-size: 28px;

  margin: 0;
}

button {

  font-size: 24px;

  padding: 12px 28px;

  margin: 8px;

  cursor: pointer;
}

#counter {

  font-size: 52px;

  font-weight: bold;
}

#specialMessage {

  font-size: 32px;

  font-weight: bold;

  max-width: 80%;

  text-shadow:
    0 0 10px red,
    0 0 20px red;

  animation:
    glow 1.2s infinite alternate;
}

#creatorLink {

  position: fixed;

  right: 14px;

  bottom: 10px;

  z-index: 10;

  color: white;

  text-decoration: none;

  font-size: 14px;

  opacity: 0.7;
}

#creatorLink:hover {

  opacity: 1;
}

@keyframes glow {

  from {
    opacity: 0.7;
  }

  to {
    opacity: 1;
  }
}

.lieMode {

  background: black;

  color: white;
}

.homoMode {

  background-image:
    url("assets/img/senpai_silhouette.png");

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

  color: red;
}

.homoMode::before {

  content: "";

  position: fixed;

  inset: 0;

  background:
    rgba(0, 0, 0, 0.55);

  z-index: 0;
}