/* One catalogue layout for every game, including links and buttons.
   Older illustrations include captions: crop those out in the image layer
   and use the accessible HTML title consistently for every card. */
#экран-витрины .витрина__плитки {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
}
#экран-витрины .плитка-игры {
  order: 0;
  grid-column: auto;
  aspect-ratio: 4 / 3;
  min-width: 0;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 1px solid #b9c5bb35;
  border-radius: 20px;
  background: #141c1e;
  text-decoration: none;
  filter: none;
  isolation: isolate;
  box-shadow: 0 8px 24px #0003;
}
#экран-витрины .плитка-игры::before {
  content: "";
  position: absolute;
  inset: 0 0 27%;
  background: var(--catalog-art) center top / 100% auto no-repeat;
  mask-image: linear-gradient(#000 75%, transparent);
  pointer-events: none;
}
#экран-витрины .плитка-игры::after {
  content: "↗";
  position: absolute;
  right: 6%;
  bottom: 7%;
  color: #d2f76b;
  font: 400 clamp(20px, 4vw, 30px)/1 system-ui, sans-serif;
  pointer-events: none;
}
#экран-витрины .плитка-игры__название {
  position: absolute;
  inset: auto 17% 7% 6%;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  clip-path: none;
  white-space: normal;
  color: #f5f4ed;
  font: 700 clamp(15px, 4vw, 25px)/1.2 'Onest', system-ui, sans-serif;
  letter-spacing: -.025em;
  text-shadow: none;
}
#экран-витрины :is(.катан-витрина__метка, .катан-витрина__подпись,
  .катан-витрина__стрелка, .монополия-витрина__метка, .монополия-витрина__подпись) {
  display: none;
}
#экран-витрины [data-игра="нарды"] { --catalog-art: url('img/витрина/backgammon.jpg'); }
#экран-витрины [data-игра="шахматы"] { --catalog-art: url('img/витрина/chess.jpg'); }
#экран-витрины [data-игра="дурак"] { --catalog-art: url('img/витрина/durak.jpg'); }
#экран-витрины [data-игра="шашки"] { --catalog-art: url('img/витрина/checkers.jpg'); }
#экран-витрины [data-игра="домино"] { --catalog-art: url('img/витрина/dominoes.jpg'); }
#экран-витрины [data-игра="морской-бой"] { --catalog-art: url('img/витрина/battleship.jpg'); }
#экран-витрины [data-игра="захват"] { --catalog-art: url('img/захват/обложка.webp'); }
#экран-витрины [data-игра="катан"] { --catalog-art: url('img/катан/обложка-v5.webp'); }
#экран-витрины [data-игра="монополия"] { --catalog-art: url('img/монополия/обложка-v3.webp'); }
#экран-витрины [data-игра="покер"] { --catalog-art: url('img/покер/обложка-v1.webp'); }
#экран-витрины [data-игра="покер"]::before { background-size: cover; background-position: center; }
#экран-витрины [data-игра="монополия"]::before { background-size: cover; background-position: center; }
#экран-витрины [data-игра="деберц"] { --catalog-art: url('img/деберц/лобби.png'); }
@media (min-width: 900px) {
  #экран-витрины.витрина > :not(.нижние-вкладки):not(.лист-ещё) { max-width: 1000px; }
  #экран-витрины .витрина__плитки { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
}
@media (max-width: 360px) {
  #экран-витрины .витрина__плитки { gap: 10px; }
  #экран-витрины .плитка-игры { border-radius: 14px; }
}
#экран-витрины [data-игра="2048"] { --catalog-art:url('img/2048/cover-v1.png'); }
#экран-витрины [data-игра="бастион"] { --catalog-art:url('img/бастион/cover-v1.webp'); }
#экран-витрины [data-игра="2048"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="судоку"] { --catalog-art:url('img/sudoku/cover-v2.png'); }
#экран-витрины [data-игра="судоку"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="японский-кроссворд"] { --catalog-art:url('img/nonogram/cover-v1.png'); }
#экран-витрины [data-игра="японский-кроссворд"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="сапёр"] { --catalog-art:url('img/casual/mines.webp'); }
#экран-витрины [data-игра="сапёр"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="косынка"] { --catalog-art:url('img/casual/klondike.webp'); }
#экран-витрины [data-игра="косынка"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="паук"] { --catalog-art:url('img/casual/spider.webp'); }
#экран-витрины [data-игра="паук"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="свободная-ячейка"] { --catalog-art:url('img/casual/freecell.webp'); }
#экран-витрины [data-игра="свободная-ячейка"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="маджонг"] { --catalog-art:url('img/casual/mahjong.webp'); }
#экран-витрины [data-игра="маджонг"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="блоки"] { --catalog-art:url('img/casual/blocks.webp'); }
#экран-витрины [data-игра="блоки"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="три-в-ряд"] { --catalog-art:url('img/casual/match3.webp'); }
#экран-витрины [data-игра="три-в-ряд"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="поиск-слов"] { --catalog-art:url('img/casual/wordsearch.webp'); }
#экран-витрины [data-игра="поиск-слов"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="пятнашки"] { --catalog-art:url('img/casual/fifteen.webp'); }
#экран-витрины [data-игра="пятнашки"]::before { background-size:cover; background-position:center; }

#экран-витрины [data-игра="змейка"] { --catalog-art:url('img/casual/snake.webp'); }
#экран-витрины [data-игра="змейка"]::before { background-size:cover; background-position:center; }