/* Black Russia collection. Scoped independently from every other game hub. */
.game-page .gh.gh--black-russia .gh-cards { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.gh--black-russia .br-tile {
  --accent: #b5a4fb; --panel: #34294b; --base: #1c1926;
  position: relative; isolation: isolate; display: grid;
  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--black-russia .br-tile--currency { --accent: #b6e3cb; --panel: #2a4a40; --base: #182822; }
.gh--black-russia .br-tile--accounts { --accent: #b2c6f4; --panel: #2b3c60; --base: #1a2235; }
.gh--black-russia .br-tile--accounts-with-cash { --accent: #c6b6fa; --panel: #42305c; --base: #231c32; }
.gh--black-russia .br-tile--donate { --accent: #f2d797; --panel: #58432c; --base: #2c251b; }
.gh--black-russia .br-tile--items { --accent: #eabbb1; --panel: #56393a; --base: #2d2024; }
.gh--black-russia .br-tile__head { display: flex; flex-direction: column; gap: 9px; position: relative; z-index: 2; }
.gh--black-russia .br-tile__caption { color: var(--accent); font: 500 11px/1.3 var(--font-body); letter-spacing: .015em; }
.gh--black-russia .br-tile__title { max-width: 100%; color: #fbf9ff; font: 700 clamp(21px, 1.85vw, 30px)/1.08 var(--font-display); letter-spacing: -.035em; overflow-wrap: anywhere; }
.gh--black-russia .br-tile__art { position: relative; display: block; min-height: 170px; margin: 2px -22px 0; }
.gh--black-russia .br-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--black-russia .br-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--black-russia .br-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--black-russia .br-tile--accounts .br-tile__art img { inset: 0 1%; width: 98%; height: 100%; object-position: center bottom; }
.gh--black-russia .br-tile--items .br-tile__art img { inset: auto; left: 0; top: 50%; width: 100%; max-width: none; height: auto; translate: 0 -50%; }
.gh--black-russia .br-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--black-russia .br-tile__detail { flex: 1; min-width: 0; color: #e7e3ee; font: 500 11px/1.5 var(--font-body); }
.gh--black-russia .br-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--black-russia .br-tile__offer small { color: var(--accent); font: 500 11px/1.2 var(--font-body); }
.gh--black-russia .br-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--black-russia .br-tile__arrow svg { width: 18px; height: 18px; }
.gh--black-russia .br-tile:focus-visible { outline: 3px solid #c1b3ff; outline-offset: 4px; }
@media (hover: hover) {
  .gh--black-russia .br-tile:hover { border-color: var(--accent); transform: translateY(-4px); }
  .gh--black-russia .br-tile:hover .br-tile__art img { transform: translateY(-3px) rotate(-2deg); }
  .gh--black-russia .br-tile:hover .br-tile__arrow { color: var(--base); background: var(--accent); border-color: var(--accent); }
}
@media (max-width: 1100px) and (min-width: 761px) {
  .game-page .gh.gh--black-russia .gh-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .gh--black-russia .br-tile { grid-column: span 2; min-height: 318px; }
  .gh--black-russia .br-tile:nth-child(n+4) { grid-column: span 3; }
  .gh--black-russia .br-tile__art img { left: 5%; width: 90%; }
  .gh--black-russia .br-tile__title { font-size: 25px; }
}
@media (max-width: 760px) {
  .game-page .gh.gh--black-russia .gh-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .gh--black-russia .br-tile { padding: 16px; min-height: 268px; grid-template-rows: auto minmax(128px, 1fr) auto; border-radius: 18px; }
  .gh--black-russia .br-tile__head { gap: 7px; }
  .gh--black-russia .br-tile__caption { font-size: 10px; }
  .gh--black-russia .br-tile__title { font-size: clamp(19px, 4.6vw, 27px); }
  .gh--black-russia .br-tile__art { min-height: 128px; margin: 0 -16px; }
  .gh--black-russia .br-tile__foot { min-height: 44px; padding-top: 8px; }
  .gh--black-russia .br-tile__detail { font-size: 10px; }
  .gh--black-russia .br-tile__arrow { flex-basis: 32px; width: 32px; height: 32px; }
  .gh--black-russia .br-tile__arrow svg { width: 16px; height: 16px; }
  .gh--black-russia .br-tile__offer { font-size: 18px; }
  .gh--black-russia .br-tile--items { grid-column: 1 / -1; min-height: 180px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); grid-template-rows: auto auto; }
  .gh--black-russia .br-tile--items .br-tile__head { grid-column: 1; }
  .gh--black-russia .br-tile--items .br-tile__art { grid-column: 2; grid-row: 1 / 3; margin: -16px -16px -16px 0; }
  .gh--black-russia .br-tile--items .br-tile__art img { inset: auto; left: -10%; top: 50%; width: 110%; height: auto; }
  .gh--black-russia .br-tile--items .br-tile__foot { grid-column: 1; align-self: end; flex-wrap: wrap; }
}
@media (max-width: 359px) {
  .gh--black-russia .br-tile { padding: 12px; }
  .gh--black-russia .br-tile__title { font-size: 16px; overflow-wrap: normal; }
  .gh--black-russia .br-tile__art { margin-left: -12px; margin-right: -12px; }
  .gh--black-russia .br-tile__detail { max-width: 75px; }
}
@media (prefers-reduced-motion: reduce) {
  .gh--black-russia .br-tile, .gh--black-russia .br-tile__art img, .gh--black-russia .br-tile__arrow { transition: none; }
  .gh--black-russia .br-tile:hover, .gh--black-russia .br-tile:hover .br-tile__art img { transform: none; }
}
