body {
  min-height: 100vh;
  place-items: center;
  background: url("assets/buchi-w.jpg");
  display: flex;
  justify-content: center;
}
.app-shell {
  width: 100%;
}
.app-shell.window {
  max-height: 360px;
  /* altura fija */
  display: flex;
  flex-direction: column;
}

.window-body {
  flex: 1;
  /* hace que el body se expanda dentro de la ventana */
  overflow: auto;
  /* opcional: scroll si hay contenido extra */
}
.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
  width: 100%;
  max-width: 1000px;
  align-items: stretch;
}

li{
  list-style-type: none;
}
.player-wrap {
      position: relative;
      width: 100%;
      aspect-ratio: 4 / 3;
      background: #000;
      border-radius: 4px;
      overflow: hidden;
    }

    .player-wrap #player {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      border: 0;
    }


    .controls {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-top: 6px;
    }

    .buttons {
      display: flex;
      justify-content: center;
      gap: 8px;
    }

    .progress-row {
      display: flex;
      align-items: center;
      gap: 6px;
    }

    .progress {
      flex: 1;
      height: 16px;
    }

    .time {
      font-variant-numeric: tabular-nums;
      font-size: 12px;
      white-space: nowrap;
    }

    .volume {
      display: flex;
      align-items: center;
      gap: 6px;
      justify-content: center;
    }

    .volume input[type="range"] {
      width: 100px;
    }


#cover {
  width: 100px;
  height: 100px;
}

/* Start https://www.cursors-4u.com */
* {
  cursor: url(https://cur.cursors-4u.net/anime/ani-9/ani879.ani), url(https://cur.cursors-4u.net/anime/ani-9/ani879.png), auto !important;
}

/* End https://www.cursors-4u.com */
footer p {
  font-size: 10px;

}
.wordart-title {
  font-family: 'Impact', sans-serif;
  font-size: 48px;
  font-weight: bold;
  text-align: center;

  /* Gradient */
  background: linear-gradient(183deg, #6000CA 10%, #CA00CD 70%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;

  transform: skewY(-7deg) scaleY(1.3) scaleX(0.8);
  margin-bottom: 24px;
}
.main-container {
  width: 100%;
  max-width: 1000px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.page-title {
  text-align: center;
  font-size: 32px;
  margin-bottom: 16px;
  font-weight: bold;
}

textarea {
  resize: none;
  /* para que no deforme la ventana */
}

#anonForm {
  font-family: 'Segoe UI', sans-serif;
}

#sendBtn {
  min-width: 80px;
}

.enter-message {
  font-size: 24px;
}

.gif-static {
  position: absolute;
  width: 100px;
  z-index: 9999;
  pointer-events: none;
}
.floating-gifs {
 display: none;
}
@media only screen and (min-width: 1600px) {
.floating-gifs {
    display: block;
  }
}