/* Wordle page only */
body.wordle-page {
  margin: 0;
  background: #060405 url('assets/wordle/wordle-background.correct.webp') top center / cover fixed no-repeat;
  color: #1c1116;
}

.wordle-page-shell {
  width: min(1500px, 96vw);
  margin: 0 auto;
  padding: 0 0 42px;
}

.wordle-asset {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  pointer-events: none;
}

.wordle-top-header {
  margin: 0 auto 12px;
  filter: drop-shadow(0 16px 18px rgba(0,0,0,.42));
}

.wordle-smallstrip {
  margin: -8px auto 18px;
  filter: drop-shadow(0 12px 12px rgba(0,0,0,.38));
}

.wordle-random-postits {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: clamp(10px, 1.1vw, 18px);
  align-items: stretch;
  margin: 0 auto 26px;
}

.wordle-postit-card {
  position: relative;
  min-height: clamp(135px, 13vw, 210px);
  filter: drop-shadow(0 9px 8px rgba(0,0,0,.36));
}

.wordle-postit-card img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.wordle-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(310px, .92fr);
  gap: clamp(14px, 2vw, 28px);
  align-items: start;
  margin: 0 auto 28px;
}

.wordle-game-wrap,
.wordle-search-wrap {
  position: relative;
  filter: drop-shadow(0 14px 14px rgba(0,0,0,.45));
}

.wordle-long-postits {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(10px, 1vw, 16px);
  align-items: stretch;
  margin: 0 auto 28px;
}

.wordle-long-postits .wordle-postit-card {
  min-height: clamp(100px, 9vw, 155px);
}

.wordle-bottom-banner {
  margin: 0 auto;
  filter: drop-shadow(0 16px 16px rgba(0,0,0,.45));
}

@media (max-width: 950px) {
  body.wordle-page {
    background-size: auto 100vh;
    background-repeat: repeat-y;
    background-attachment: scroll;
  }

  .wordle-random-postits {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wordle-main-grid {
    grid-template-columns: 1fr;
  }

  .wordle-long-postits {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}