:root {
  --border-color: #291D4D;
  --dialog-background: #FFF3B4;

  --menu-background: #FFE8D2;
  --menu-border-color: #A48465;
  --menu-font-color: #3A160D;
  --menu-selected-background: #7fc2ff;
}

* {
  box-sizing:border-box;
}


.game-container canvas {
  image-rendering: pixelated;
}

.floating-person-name {
  position: absolute;
  width: 10px;
  font-size: 6px;
}

#character-name-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 0.2rem;
  margin: 4rem 4rem auto;
  color: white;
  font-size: 8px;
}

.clocked-out {
  color: black;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
}
input {
  font-size: 10px;
}

.character-selection-prompt {
  color: white;
  text-align: center;
  margin-top: 2rem;
  display: none;
  font-size: 12px;
}

.clock-in-btn {
  width: 7rem;
  margin: auto;
  font-size: 10px;
  font-family: 'Courier New', Courier, monospace;
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  padding: 5px;
  display: inline-block;
  cursor: pointer;
  border-radius: 8px;
}