/* Telegram follows the Black Russia collection, with its own objects and palette. */
.game-page .gh.gh--telegram .gh-cards { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.game-page .gh.gh--telegram .gh-cards--tg-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gh--telegram .tg-tile {
  --accent: #c6b6fa; --panel: #42305c; --base: #231c32;
  position: relative; isolation: isolate; display: grid;
  grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(135px, 1fr) auto;
  min-width: 0; min-height: 338px; padding: 22px;
  border: 1px solid #ffffff15; border-radius: 22px; overflow: hidden;
  background: var(--base); color: #fbf9ff; text-decoration: none;
  transition: border-color .2s, transform .2s;
}
.gh--telegram .tg-tile--stars { --accent: #f2d797; --panel: #58432c; --base: #2c251b; }
.gh--telegram .tg-tile--premium { --accent: #c6b6fa; --panel: #42305c; --base: #231c32; }
.gh--telegram .tg-tile--accounts { --accent: #afcff6; --panel: #2b4665; --base: #192a3c; }
.gh--telegram .tg-tile--gifts { --accent: #edbfd9; --panel: #5a354c; --base: #30202b; }
.gh--telegram .tg-tile--usernames { --accent: #b6e3d5; --panel: #2b4c44; --base: #1a2b27; }
.gh--telegram .tg-tile--channels { --accent: #b9d5e9; --panel: #344a61; --base: #1d2b3b; }
.gh--telegram .tg-tile__head { display: flex; flex-direction: column; gap: 9px; position: relative; z-index: 2; min-width: 0; }
.gh--telegram .tg-tile__caption { color: var(--accent); font: 500 11px/1.3 var(--font-body); letter-spacing: .015em; }
.gh--telegram .tg-tile__title { max-width: 100%; color: #fbf9ff; font: 700 clamp(21px, 1.85vw, 30px)/1.08 var(--font-display); letter-spacing: -.035em; overflow-wrap: normal; }
.gh--telegram .tg-tile--usernames .tg-tile__title { font-size: clamp(17px, 1.6vw, 28px); }
.gh--telegram .tg-tile__art { position: relative; display: block; min-height: 170px; margin: 2px -22px 0; }
.gh--telegram .tg-tile__art::before { content: ''; position: absolute; inset: 19% -22% -2% 15%; border-radius: 80px 0 0 80px; background: var(--panel); transform: rotate(-22deg); z-index: -1; }
.gh--telegram .tg-tile__art::after { content: ''; position: absolute; width: 88%; height: 70%; right: -25%; bottom: 16%; border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent); border-radius: 80px; transform: rotate(-22deg); z-index: -1; }
.gh--telegram .tg-tile__art img { position: absolute; inset: -5% -2% 0; width: 104%; height: 112%; object-fit: contain; object-position: center; filter: drop-shadow(0 12px 12px #0003); transition: transform .3s ease; }
.gh--telegram .tg-tile__foot { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding-top: 12px; min-height: 52px; }
.gh--telegram .tg-tile__detail { flex: 1; min-width: 0; color: #e7e3ee; font: 500 11px/1.5 var(--font-body); }
.gh--telegram .tg-tile__offer { display: flex; flex-direction: column; min-width: 0; max-width: 100%; overflow-wrap: anywhere; gap: 3px; color: #fff; font: 800 20px/1.1 var(--font-body); }
.gh--telegram .tg-tile__offer small { color: var(--accent); font: 500 11px/1.2 var(--font-body); }
.gh--telegram .tg-tile__arrow { flex: 0 0 38px; margin-left: auto; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; border: 1px solid #ffffff2b; background: #ffffff08; color: #f9f6ff; transition: background .2s, color .2s; }
.gh--telegram .tg-tile__arrow svg { width: 18px; height: 18px; }
.gh--telegram .tg-tile:focus-visible { outline: 3px solid #c1b3ff; outline-offset: 4px; }
@media (hover: hover) {
  .gh--telegram .tg-tile:hover { border-color: var(--accent); transform: translateY(-4px); }
  .gh--telegram .tg-tile:hover .tg-tile__art img { transform: translateY(-3px) rotate(-2deg); }
  .gh--telegram .tg-tile:hover .tg-tile__arrow { color: var(--base); background: var(--accent); border-color: var(--accent); }
}
@media (max-width: 1100px) and (min-width: 761px) {
  .game-page .gh.gh--telegram .gh-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .gh--telegram .tg-tile { grid-column: span 2; min-height: 318px; }
  .gh--telegram .gh-cards--tg-5 .tg-tile:nth-child(n+4) { grid-column: span 3; }
  .gh--telegram .tg-tile__art img { left: 5%; width: 90%; }
  .gh--telegram .tg-tile__title { font-size: 25px; }
  .gh--telegram .tg-tile--usernames .tg-tile__title { font-size: 25px; }
}
@media (max-width: 760px) {
  .game-page .gh.gh--telegram .gh-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .gh--telegram .tg-tile { padding: 16px; min-height: 268px; grid-template-rows: auto minmax(128px, 1fr) auto; border-radius: 18px; }
  .gh--telegram .tg-tile__head { gap: 7px; }
  .gh--telegram .tg-tile__caption { font-size: 10px; }
  .gh--telegram .tg-tile__title { font-size: clamp(19px, 4.6vw, 27px); }
  .gh--telegram .tg-tile--usernames .tg-tile__title { font-size: clamp(14px, 4.35vw, 24px); }
  .gh--telegram .tg-tile__art { min-height: 128px; margin: 0 -16px; }
  .gh--telegram .tg-tile__foot { min-height: 44px; padding-top: 8px; }
  .gh--telegram .tg-tile__detail { font-size: 10px; }
  .gh--telegram .tg-tile__arrow { flex-basis: 32px; width: 32px; height: 32px; }
  .gh--telegram .tg-tile__arrow svg { width: 16px; height: 16px; }
  .gh--telegram .tg-tile__offer { font-size: 18px; }
  .gh--telegram .tg-tile:last-child:nth-child(odd) { grid-column: 1 / -1; min-height: 180px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); grid-template-rows: auto auto; }
  .gh--telegram .tg-tile:last-child:nth-child(odd) .tg-tile__head { grid-column: 1; }
  .gh--telegram .tg-tile:last-child:nth-child(odd) .tg-tile__art { grid-column: 2; grid-row: 1 / 3; margin: -16px -16px -16px 0; }
  .gh--telegram .tg-tile:last-child:nth-child(odd) .tg-tile__art img { inset: 0; width: 100%; height: 100%; }
  .gh--telegram .tg-tile:last-child:nth-child(odd) .tg-tile__foot { grid-column: 1; align-self: end; flex-wrap: wrap; }
}
@media (max-width: 359px) {
  .gh--telegram .tg-tile { padding: 12px; }
  .gh--telegram .tg-tile__title { font-size: 16px; }
  .gh--telegram .tg-tile__art { margin-left: -12px; margin-right: -12px; }
  .gh--telegram .tg-tile__detail { max-width: 75px; }
}
@media (prefers-reduced-motion: reduce) {
  .gh--telegram .tg-tile, .gh--telegram .tg-tile__art img, .gh--telegram .tg-tile__arrow { transition: none; }
  .gh--telegram .tg-tile:hover, .gh--telegram .tg-tile:hover .tg-tile__art img { transform: none; }
}