@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;800;900&display=swap');

/* Final Games section cleanup — authoritative styles loaded last. */
body.lobby-app .games-and-rewards{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 220px!important;
  gap:14px!important;
  align-items:start!important;
}

body.lobby-app .game-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:10px!important;
  align-items:stretch!important;
}

body.lobby-app .game-grid > .game-card{
  position:relative!important;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  aspect-ratio:.77!important;
  padding:0!important;
  overflow:hidden!important;
  isolation:isolate!important;
  clip-path:inset(0 round 8px)!important;
  border:1px solid #2e3b3b!important;
  border-radius:8px!important;
  background:#111820!important;
  box-shadow:
    0 10px 24px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.035)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}

body.lobby-app .game-grid > .game-card:hover{
  transform:translateY(-3px)!important;
  border-color:#4f695c!important;
  box-shadow:
    0 17px 30px rgba(0,0,0,.34),
    0 0 22px rgba(63,218,142,.07)!important;
}

/* Poster images already contain the title/BlockBet lockup. Don't print it twice. */
body.lobby-app .game-grid > .bb-poster-card .bb-poster-copy{
  display:none!important;
}

body.lobby-app .game-grid > .bb-poster-card::before{
  inset:-13px!important;
  background-size:cover!important;
  background-position:center!important;
  border-radius:0!important;
  transform:none!important;
  filter:saturate(1.05) contrast(1.02)!important;
}

body.lobby-app .game-grid > .bb-poster-chicken::before,
body.lobby-app .game-grid > .bb-poster-hilo::before,
body.lobby-app .game-grid > .bb-poster-plinko::before,
body.lobby-app .game-grid > .bb-poster-keno::before,
body.lobby-app .game-grid > .bb-poster-towers::before{
  inset:-20px!important;
}

body.lobby-app .game-grid > .bb-poster-card::after{
  inset:0!important;
  border-radius:8px!important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.055),transparent 23%),
    linear-gradient(180deg,transparent 60%,rgba(3,5,9,.12) 100%)!important;
}

body.lobby-app .game-grid > .bb-poster-card .bb-poster-shade{
  inset:0!important;
  border-radius:8px!important;
  background:linear-gradient(120deg,rgba(255,255,255,.045),transparent 25%)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)!important;
}

body.lobby-app .game-grid > .bb-poster-card:hover::before{
  transform:scale(1.018)!important;
}

/* Turn the remaining atlas cards into the same poster language. */
body.lobby-app .game-grid > .game-card:not(.bb-poster-card){
  display:block!important;
  padding:0!important;
  background:
    radial-gradient(circle at 50% 25%,rgba(88,221,154,.10),transparent 35%),
    linear-gradient(150deg,#18242a,#0e151b)!important;
}

body.lobby-app .game-grid > .game-card[href="/games/rps/"]{
  background:
    radial-gradient(circle at 47% 28%,rgba(78,113,220,.30),transparent 38%),
    linear-gradient(155deg,#26345d,#101722 72%)!important;
}
body.lobby-app .game-grid > .game-card[href="/games/uno/"]{
  background:
    radial-gradient(circle at 52% 28%,rgba(77,126,235,.25),transparent 37%),
    linear-gradient(155deg,#202e4f,#101722 74%)!important;
}
body.lobby-app .game-grid > .game-card[href="/games/wheel/"]{
  background:
    radial-gradient(circle at 50% 25%,rgba(245,196,47,.30),transparent 35%),
    linear-gradient(155deg,#4a3613,#101713 75%)!important;
}
body.lobby-app .game-grid > .game-card[href="/games/#crash"]{
  background:
    radial-gradient(circle at 50% 25%,rgba(228,83,60,.28),transparent 36%),
    linear-gradient(155deg,#54241b,#151117 76%)!important;
}

body.lobby-app .game-grid > .game-card:not(.bb-poster-card)::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  background:
    linear-gradient(120deg,rgba(255,255,255,.07),transparent 23%),
    linear-gradient(180deg,transparent 48%,rgba(5,7,11,.15) 63%,rgba(4,6,9,.82) 100%)!important;
}

body.lobby-app .game-grid > .new-game-card .extra-game-art,
body.lobby-app .game-grid > .game-card:not(.bb-poster-card) .game-sprite{
  position:absolute!important;
  z-index:0!important;
  top:10px!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:88%!important;
  height:76%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  transform:translateX(-50%)!important;
  object-fit:contain!important;
  background-repeat:no-repeat!important;
  filter:drop-shadow(0 15px 18px rgba(0,0,0,.34))!important;
}

/* extra-atlas art has a 3:4 sprite cell */
body.lobby-app .game-grid > .new-game-card .extra-game-art{
  aspect-ratio:3/4!important;
  width:78%!important;
  height:auto!important;
  max-height:78%!important;
  background-size:400% 200%!important;
  clip-path:none!important;
}

/* game-atlas Crash art is square */
body.lobby-app .game-grid > .game-card[href="/games/#crash"] .game-sprite{
  width:72%!important;
  height:auto!important;
  aspect-ratio:1!important;
  top:13%!important;
}

body.lobby-app .game-grid > .game-card:not(.bb-poster-card) .copy{
  position:absolute!important;
  z-index:3!important;
  left:10px!important;
  right:10px!important;
  bottom:9px!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
}

body.lobby-app .game-grid > .game-card:not(.bb-poster-card) .copy b{
  display:block!important;
  max-width:100%!important;
  margin:0!important;
  color:#fff!important;
  font:900 clamp(18px,1.55vw,25px)/.86 'Barlow Condensed','Arial Narrow',sans-serif!important;
  letter-spacing:-.025em!important;
  text-transform:uppercase!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  text-shadow:0 3px 8px rgba(0,0,0,.60)!important;
}

body.lobby-app .game-grid > .game-card:not(.bb-poster-card) .copy::after{
  content:"BLOCKBET"!important;
  display:block!important;
  margin-top:5px!important;
  color:rgba(255,255,255,.72)!important;
  font:900 6px/1 'DM Sans',sans-serif!important;
  letter-spacing:.12em!important;
}

body.lobby-app .game-grid > .game-card:not(.bb-poster-card) .game-number,
body.lobby-app .game-grid > .game-card:not(.bb-poster-card) .play-arrow{
  display:none!important;
}

/* Fix the old high-specificity order rules from home-target.css. */
body.lobby-app .game-grid > .game-card.bb-poster-chicken{order:1!important}
body.lobby-app .game-grid > .game-card.bb-poster-dice{order:2!important}
body.lobby-app .game-grid > .game-card.bb-poster-mines{order:3!important}
body.lobby-app .game-grid > .game-card.bb-poster-towers{order:4!important}
body.lobby-app .game-grid > .game-card.bb-poster-plinko{order:5!important}
body.lobby-app .game-grid > .game-card.bb-poster-coinflip{order:6!important}
body.lobby-app .game-grid > .game-card.bb-poster-blackjack{order:7!important}
body.lobby-app .game-grid > .game-card.bb-poster-roulette{order:8!important}
body.lobby-app .game-grid > .game-card.bb-poster-hilo{order:9!important}
body.lobby-app .game-grid > .game-card.bb-poster-keno{order:10!important}
body.lobby-app .game-grid > .game-card.bb-poster-rps{order:11!important}
body.lobby-app .game-grid > .game-card[href="/games/uno/"]{order:12!important}
body.lobby-app .game-grid > .game-card.bb-poster-wheel{order:13!important}
body.lobby-app .game-grid > .game-card.bb-poster-crash{order:14!important}

/* Rewards align with the cleaned-up cards. */
body.lobby-app .reward-stack{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
}
body.lobby-app .reward-card{
  min-height:220px!important;
  padding:16px!important;
  border-radius:8px!important;
}
body.lobby-app .daily-spin-bar{
  min-height:78px!important;
  border-radius:8px!important;
}

@media(max-width:1450px){
  body.lobby-app .game-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(max-width:1100px){
  body.lobby-app .games-and-rewards{grid-template-columns:1fr!important}
  body.lobby-app .reward-stack{display:grid!important;grid-template-columns:1fr 1fr!important}
}
@media(max-width:900px){
  body.lobby-app .game-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:650px){
  body.lobby-app .game-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  body.lobby-app .game-grid > .game-card{aspect-ratio:.74!important}
  body.lobby-app .reward-stack{grid-template-columns:1fr!important}
}

body.lobby-app .game-grid > .bb-poster-rps::before{
  inset:-14px!important;
  background-position:center!important;
  background-size:cover!important;
}
