/* Idle Snake: the white glow becomes the menu (js/hero.js, idleSnake). Black type on the white glow. */
.snake-menu {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  text-align: center;
  color: #000;
  font-size: 1.7vw;
  line-height: 1.2;
  user-select: none;
}
.snake-menu p { margin: 0; }
.snake-title { font-size: 1.5em; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.snake-info { min-height: 1.2em; margin-top: 0.3em !important; font-size: 0.65em; letter-spacing: 0.08em; text-transform: uppercase; }
.snake-items { margin: 0.9em 0 0; padding: 0; list-style: none; }
.snake-items button {
  padding: 0.25em 0.9em;
  border: 0;
  background: none;
  color: #000;
  font: inherit;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
}
.snake-items button.is-sel { background: #000; color: #fff; }
.snake-items button:focus-visible { outline: 2px solid #0036cf; outline-offset: 2px; }

.snake-score {
  position: absolute;
  left: var(--header-inset);
  top: var(--header-top);
  z-index: 3;
  margin: 0;
  color: #fff;
  font-size: calc(var(--type-header) / 2);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: pre;
  pointer-events: none;
}