/* load zenek pixel */
@font-face {
  font-family: "Zenek Pixel";
  src: url("fonts/zenek-pixel.woff2") format("woff2"),
       url("fonts/zenek-pixel.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}




/* reset */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* base layout */
body {
  background: white;
  color: black;
  font-family: "Zenek Pixel", monospace;
}

/* the full wall */
.type-wall {
  padding: 0;          /* no padding around rows */
  display: flex;
  flex-direction: column;
  gap: 0;              /* remove vertical spacing */
  min-height: 100vh;
}

/* each marquee row */
.marquee-row {
  overflow: hidden;
  white-space: nowrap;
  line-height: 1;
}

/* the moving track */
.marquee-track {
  display: inline-flex;
  will-change: transform;
  animation: scroll-left 24s linear infinite;
}

/* speed variations */
.marquee-row.slow .marquee-track {
  animation-duration: 32s;
}

/*.marquee-row.reverse .marquee-track {
  animation-name: scroll-right;
  animation-duration: 28s;
}*/

/* each 3-line type block */
.type-tile {
  display: inline-block;
  padding: 0;              /* remove inner spacing */
  margin: 0;               /* remove spacing between tiles */
  font-size: clamp(1rem, 2.3vw, 2.2rem);
  line-height: 1;          /* tighten multi-line blocks */
  
  /* variable font animation */
  font-variation-settings: "POSI" 0;
  animation: posi-pulse 2s ease-in-out infinite alternate;
}

/* animate POSI axis */
@keyframes posi-pulse {
  0% { font-variation-settings: "POSI" 0; }
  100% { font-variation-settings: "POSI" 100; }
}

/* horizontal scrolling */
@keyframes scroll-left {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@keyframes scroll-right {
  0% { transform: translateX(-50%); }
  100% { transform: translateX(0); }
}


/* ===== responsive tweaks ===== */

@media (max-width: 600px) {
  .type-tile {
    font-size: clamp(0.9rem, 4vw, 1.4rem);
  }
}

@media (min-width: 1200px) {
  .type-tile {
    font-size: 2.4rem;
  }
}
