html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background: #b8a2f4;
  overflow: hidden;
}

#splash {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

/* Centered face image */
#face {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transform-origin: 49.6% 50.9%; /* adjust to match left eye */
  transition: transform 2.5s ease-in-out, opacity 3s ease-in;
}

/* Zoom + fade to black */
.zoom {
  transform: scale(800);
  opacity: 0;
}