body {
  margin: 0;
  background: black;
  color: #00ffcc;
  font-family: monospace;
}

.scene {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
}

.glitch-img {
  max-width: 300px;
}

/* Visible window */
.text-window {
  height: 3.5em;              /* fits 1 line */
  overflow: hidden;           /* 🔒 critical */
  width: 80%;
  text-align: center;
}

/* Moving stack */

.text-stack {
  animation: scrollText 28s infinite;
}


/* Each line */
.text-stack > div {
  height: 3.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.9;
}

/* Animation — one line at a time */
@keyframes scrollText {
  /* Line 1 */
  0%   { transform: translateY(0); }
  22%  { transform: translateY(0); }

  /* Line 2 */
  26%  { transform: translateY(-3.5em); }
  48%  { transform: translateY(-3.5em); }

  /* Line 3 */
  52%  { transform: translateY(-7em); }
  74%  { transform: translateY(-7em); }

  /* Line 4 */
  78%  { transform: translateY(-10.5em); }
  90%  { transform: translateY(-10.5em); }

  /* Line 5 — longest hold */
  94%  { transform: translateY(-14em); }
  100% { transform: translateY(-14em); }
}
