@media (min-width: 700px) {
  .image-tile,
  .page-tile {
    aspect-ratio: 1;
  }

  .page-tile {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
  }

  .page-tile::-webkit-scrollbar {
    display: none;
  }

  .battle-feed > .page-tile {
    aspect-ratio: auto;
  }
}

@media (max-width: 520px) {
  html {
    scroll-padding-bottom: 122px;
  }

  .game-stage {
    height: 100dvh;
  }

  .tile-stream {
    gap: 14px;
    padding: 20px 16px 122px;
    scroll-padding-bottom: 122px;
  }

  .battle-feed {
    gap: 14px;
  }

  .word-dock {
    width: calc(100% - 12px);
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 6px;
  }

  .word-input {
    justify-self: center;
    width: 100%;
    font-size: 16px;
  }

  .word-status {
    width: 100%;
    margin: 0;
    padding: 0 8px;
    text-align: center;
  }
}