/* BlockBet homepage poster cards */
body.lobby-app .game-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:10px!important;
  align-items:start!important;
}
body.lobby-app .game-card{
  position:relative!important;
  overflow:hidden!important;
  border:1px solid #2a313a!important;
  border-radius:11px!important;
  background:#11151d!important;
  box-shadow:0 8px 20px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
body.lobby-app .bb-poster-card{
  display:block!important;
  width:100%!important;
  min-height:0!important;
  aspect-ratio:.74!important;
  padding:0!important;
  isolation:isolate;
}
body.lobby-app .bb-poster-card::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  background-image:var(--bb-poster)!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:cover!important;
  transform:scale(1.001)!important;
  filter:saturate(1.06) contrast(1.025)!important;
  transition:transform .22s ease,filter .22s ease!important;
}
body.lobby-app .bb-poster-card::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  background:
    radial-gradient(ellipse at 50% -8%,rgba(255,255,255,.16),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.025) 0%,transparent 46%,rgba(5,7,12,.10) 66%,rgba(4,6,10,.78) 100%)!important;
}
body.lobby-app .bb-poster-shade{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  border-radius:inherit!important;
  background:linear-gradient(115deg,rgba(255,255,255,.07),transparent 24%)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.055),inset 0 -20px 28px rgba(0,0,0,.08)!important;
}
body.lobby-app .bb-poster-copy{
  position:absolute!important;
  z-index:3!important;
  left:11px!important;
  right:11px!important;
  bottom:9px!important;
  padding:0!important;
  border:0!important;
  background:none!important;
  text-align:left!important;
}
body.lobby-app .bb-poster-copy b{
  display:block!important;
  margin:0!important;
  color:#fff!important;
  font-family:"Barlow Condensed","Arial Narrow",Impact,sans-serif!important;
  font-size:clamp(17px,1.25vw,24px)!important;
  font-weight:900!important;
  line-height:.93!important;
  letter-spacing:-.03em!important;
  text-transform:uppercase!important;
  text-shadow:0 2px 8px rgba(0,0,0,.62)!important;
}
body.lobby-app .bb-poster-copy small{
  display:block!important;
  margin-top:5px!important;
  color:rgba(255,255,255,.78)!important;
  font:900 6px/1 Inter,ui-sans-serif,system-ui,sans-serif!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
body.lobby-app .bb-poster-card:hover{
  transform:translateY(-4px)!important;
  border-color:#475463!important;
  box-shadow:0 15px 28px rgba(0,0,0,.40),0 0 22px rgba(91,71,190,.12)!important;
}
body.lobby-app .bb-poster-card:hover::before{
  transform:scale(1.035)!important;
  filter:saturate(1.11) contrast(1.04) brightness(1.04)!important;
}
body.lobby-app .bb-poster-card .game-number,
body.lobby-app .bb-poster-card .play-arrow,
body.lobby-app .bb-poster-card .copy,
body.lobby-app .bb-poster-card .game-sprite,
body.lobby-app .bb-poster-card .extra-game-art{display:none!important}

body.lobby-app .bb-poster-chicken{order:1!important}
body.lobby-app .bb-poster-plinko{order:2!important}
body.lobby-app .bb-poster-dice{order:3!important}
body.lobby-app .bb-poster-mines{order:4!important}
body.lobby-app .bb-poster-towers{order:5!important}
body.lobby-app .bb-poster-coinflip{order:6!important}
body.lobby-app .bb-poster-roulette{order:7!important}
body.lobby-app .bb-poster-blackjack{order:8!important}

@media(max-width:1500px){
  body.lobby-app .game-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
}
@media(max-width:1180px){
  body.lobby-app .game-grid{grid-template-columns:repeat(4,minmax(0,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 .bb-poster-card{aspect-ratio:.73!important}
}

body.lobby-app .bb-poster-hilo{order:9!important}
body.lobby-app .bb-poster-keno{order:10!important}
body.lobby-app .game-card[href="/games/rps/"]{order:11!important}
body.lobby-app .game-card[href="/games/uno/"]{order:12!important}
body.lobby-app .game-card[href="/games/wheel/"]{order:13!important}

/* deploy-bust 20260929-keno-hilo */


/* remove poster black corners */
/* The artwork files already have rounded/transparent corner pixels. Keep the
   card's own coloured artwork behind them instead of letting black show through. */
body.lobby-app .bb-poster-card{
  background:#202633!important;
  border-color:transparent!important;
  clip-path:inset(0 round 11px)!important;
}
body.lobby-app .bb-poster-card::before{
  inset:-2px!important;
  background-size:cover!important;
  background-position:center!important;
}
body.lobby-app .bb-poster-card::after,
body.lobby-app .bb-poster-card .bb-poster-shade{
  border-radius:11px!important;
}
body.lobby-app .bb-poster-chicken{background:#6d5dc9!important}
body.lobby-app .bb-poster-plinko{background:#6729ce!important}
body.lobby-app .bb-poster-dice{background:#f22d62!important}
body.lobby-app .bb-poster-mines{background:#433f8e!important}
body.lobby-app .bb-poster-towers{background:#353270!important}
body.lobby-app .bb-poster-coinflip{background:#f2aa18!important}
body.lobby-app .bb-poster-roulette{background:#c12767!important}
body.lobby-app .bb-poster-blackjack{background:#1b7a67!important}
body.lobby-app .bb-poster-hilo{background:#2f65c8!important}
body.lobby-app .bb-poster-keno{background:#9b63d7!important}


/* crop source-image corner masks */
/* The supplied poster PNGs have dark rounded-mask pixels baked into their
   corners. Zoom the artwork slightly inside the card so those baked-in masks
   are cropped away by the card's own rounded edge. */
body.lobby-app .bb-poster-card{
  overflow:hidden!important;
  border-radius:11px!important;
  clip-path:none!important;
  background:#11151d!important;
}
body.lobby-app .bb-poster-card::before{
  inset:-11px!important;
  background-size:cover!important;
  background-position:center!important;
  border-radius:16px!important;
  transform:none!important;
}
body.lobby-app .bb-poster-card:hover::before{
  transform:scale(1.018)!important;
}


/* targeted corner crop: chicken hilo plinko keno towers */
/* These five source posters have a larger dark corner mask baked into the PNG.
   Crop only these cards harder so the mask cannot show. */
body.lobby-app .bb-poster-chicken::before,
body.lobby-app .bb-poster-hilo::before,
body.lobby-app .bb-poster-plinko::before,
body.lobby-app .bb-poster-keno::before,
body.lobby-app .bb-poster-towers::before{
  inset:-20px!important;
  border-radius:20px!important;
  background-size:cover!important;
  background-position:center!important;
}
body.lobby-app .bb-poster-chicken,
body.lobby-app .bb-poster-hilo,
body.lobby-app .bb-poster-plinko,
body.lobby-app .bb-poster-keno,
body.lobby-app .bb-poster-towers{
  overflow:hidden!important;
  border-radius:10px!important;
}
