/* SmileDice v6.3.16 LANDSCAPE REFERENCE — 2026-10-16
   10 poziomych kart zgodnych z zalaczonym screenem.
   Karty zostaly wyciete z referencji dostarczonej przez wlasciciela strony;
   brand, etykiety, strzalki i 4-stronne neonowe obramowanie sa juz w obrazie.
   NIE ZMIENIA funkcji JS, konta, Supabase, Netlify ani innych modulow.
   Bardzo istotne: nie przycinac obrazu i NIE ustawiac max-width=772px.
*/
#games-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  gap: clamp(10px, 1.0vw, 14px) !important;
  justify-items: stretch !important;
  align-items: stretch !important;
  overflow: visible !important;
}
#games-grid .game-card,
#games-grid .game-card:nth-child(n),
#games-grid .game-card.playable {
  position: relative !important;
  isolation: isolate !important;
  display: block !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: none !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  aspect-ratio: 194 / 149 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #07112a !important;
  box-shadow: 0 7px 20px rgba(0, 3, 20, .33), 0 0 11px rgba(51, 127, 238, .12) !important;
  text-align: left !important;
  transform: none !important;
  translate: none !important;
  transition: transform .2s ease,box-shadow .2s ease !important;
  -webkit-tap-highlight-color: transparent;
}
/* Obraz zawiera kompletna karte; zadne maski ani kolejne ramki CSS. */
#games-grid .game-card::before,
#games-grid .game-card::after,
#games-grid .game-card .game-art::before,
#games-grid .game-card .game-art::after {
  display: none !important;
  content: none !important;
}
#games-grid .game-card .game-art {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: inherit !important;
  overflow: hidden !important;
  background: none !important;
  z-index: 1 !important;
}
#games-grid .game-card .game-art img,
#games-grid .game-card:not([data-game="Dice"]) .game-art img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 0 !important;
  aspect-ratio: auto !important;
  object-fit: fill !important;
  object-position: center !important;
  transform: none !important;
  transition: none !important;
  opacity: 1 !important;
  filter: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  image-rendering: auto !important;
}
/* Zachowujemy semantyczne aria-label w znacznikach button.
   Teksty/logo/strzalki sa juz widoczne na graficznym wzorcu. */
#games-grid .game-card .royale-topline,
#games-grid .game-card .game-meta,
#games-grid .game-card .royale-arrow,
#games-grid .game-card .game-badge { display: none !important; }
#games-grid .game-card:hover,
#games-grid .game-card.playable:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 24px rgba(0,3,23,.55),0 0 19px rgba(49,208,248,.28) !important;
}
#games-grid .game-card:active {transform: translateY(-1px) !important;}
#games-grid .game-card:focus-visible {
  outline: 3px solid #33f6d3 !important;
  outline-offset: 3px !important;
}
@media (max-width: 1090px) {
  #games-grid {
    grid-template-columns: repeat(3,minmax(0,1fr)) !important;
    gap: 13px !important;
  }
}
@media (max-width: 650px) {
  #games-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap: 10px !important;
  }
  #games-grid .game-card,
  #games-grid .game-card:nth-child(n),
  #games-grid .game-card.playable {border-radius: 10px !important;}
}
@media (prefers-reduced-motion: reduce) {
  #games-grid .game-card {transition: none !important;}
}
