/* DjimlyStore Digital v2.39.96 — premium horizontal game subcategory cards */

/* Every game pack list now uses one consistent premium list-card system. */
html body #djs-portal #djs-screen-game #djs-game-packs{
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
  width:100%!important;
  max-width:100%!important;
  padding:0 0 calc(112px + env(safe-area-inset-bottom))!important;
  margin:0!important;
  overflow:visible!important;
}

html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996{
  position:relative!important;
  display:grid!important;
  grid-template-columns:126px minmax(0,1fr) 150px!important;
  grid-template-rows:minmax(112px,1fr) auto!important;
  grid-template-areas:
    "media copy side"
    "media sale side"!important;
  align-items:stretch!important;
  gap:10px 18px!important;
  width:100%!important;
  min-width:0!important;
  min-height:158px!important;
  padding:14px 16px!important;
  margin:0!important;
  border:1px solid #e5e9ef!important;
  border-radius:26px!important;
  background:#fff!important;
  color:#0b1220!important;
  box-shadow:0 12px 34px rgba(18,35,58,.075)!important;
  overflow:hidden!important;
  text-align:left!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996:not(.has-sale-v23996){
  grid-template-rows:1fr!important;
  grid-template-areas:"media copy side"!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996:hover,
html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996:focus-visible,
html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996.active{
  border-color:#b9d7ff!important;
  box-shadow:0 16px 40px rgba(29,104,210,.12)!important;
  transform:translateY(-1px)!important;
  outline:none!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996.is-popular-v23996{
  border-color:#7fb9ff!important;
  box-shadow:0 12px 34px rgba(29,104,210,.11)!important;
}

html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-media-v2187{
  grid-area:media!important;
  align-self:stretch!important;
  width:126px!important;
  height:100%!important;
  min-width:126px!important;
  min-height:130px!important;
  border-radius:20px!important;
  background:#eef3f8!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-image-v2187,
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-image-v2187 img{
  width:100%!important;
  height:100%!important;
  border-radius:0!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-image-v2187 img{
  object-fit:cover!important;
  object-position:center!important;
}

html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-copy-v2187{
  grid-area:copy!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:5px!important;
  min-width:0!important;
  width:100%!important;
  padding:0!important;
  overflow:visible!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-product-v2187{
  margin:0!important;
  color:#8a96a8!important;
  -webkit-text-fill-color:#8a96a8!important;
  font-size:10px!important;
  line-height:1.05!important;
  font-weight:900!important;
  letter-spacing:.045em!important;
  text-transform:uppercase!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-title-v2187{
  margin:0!important;
  color:#0d1730!important;
  -webkit-text-fill-color:#0d1730!important;
  font-size:21px!important;
  line-height:1.02!important;
  font-weight:950!important;
  letter-spacing:-.035em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-available-v2187{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  min-height:28px!important;
  padding:5px 9px!important;
  margin:2px 0 0!important;
  border:1px solid #9fe3c6!important;
  border-radius:999px!important;
  background:#f0fcf6!important;
  color:#14895c!important;
  -webkit-text-fill-color:#14895c!important;
  font-size:10px!important;
  font-weight:900!important;
  line-height:1!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-available-v2187 i{
  width:7px!important;
  height:7px!important;
  min-width:7px!important;
  background:#31bc7c!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-desc-v2187{
  width:100%!important;
  margin:0!important;
  color:#8b95a5!important;
  -webkit-text-fill-color:#8b95a5!important;
  font-size:10.5px!important;
  line-height:1.25!important;
  font-style:normal!important;
  font-weight:650!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-cashback-v2187{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  width:auto!important;
  min-height:29px!important;
  margin:3px 0 0!important;
  padding:6px 10px!important;
  border-radius:10px!important;
  background:#ecfbf4!important;
  color:#14895c!important;
  -webkit-text-fill-color:#14895c!important;
  font-size:10px!important;
  line-height:1!important;
  font-style:normal!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-cashback-v2187 .ms{
  font-size:14px!important;
  color:#21a86c!important;
  -webkit-text-fill-color:#21a86c!important;
}

/* Price + modern arrow control on the right. */
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-side-v2187{
  grid-area:side!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  align-self:stretch!important;
  min-width:0!important;
  width:100%!important;
  padding:9px 0 4px!important;
  text-align:right!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187{
  display:block!important;
  color:#0d1730!important;
  -webkit-text-fill-color:#0d1730!important;
  font-size:25px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:-.045em!important;
  white-space:nowrap!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187 .djs-promo-price{
  display:grid!important;
  justify-items:end!important;
  gap:3px!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187 .djs-promo-price s{
  color:#7e8795!important;
  -webkit-text-fill-color:#7e8795!important;
  font-size:10px!important;
  font-weight:700!important;
  line-height:1!important;
  text-decoration-thickness:1.4px!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187 .djs-promo-price strong{
  color:#0d1730!important;
  -webkit-text-fill-color:#0d1730!important;
  font-size:25px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:-.045em!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-arrow-shell-v23996{
  display:grid!important;
  place-items:center!important;
  width:54px!important;
  height:54px!important;
  min-width:54px!important;
  border:1px solid #dfe8f1!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 7px 18px rgba(16,42,72,.055)!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-arrow-v2187{
  margin:0!important;
  align-self:center!important;
  justify-self:center!important;
  color:#1477ef!important;
  -webkit-text-fill-color:#1477ef!important;
  font-size:27px!important;
  font-weight:500!important;
  line-height:1!important;
}

/* Actual-sale-only strip. No sale = no strip and no timer. */
html body #djs-portal #djs-screen-game .djs-game-row-sale-v23996{
  grid-area:sale!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  width:100%!important;
  min-width:0!important;
  min-height:36px!important;
  padding:4px 10px 4px 5px!important;
  margin-top:2px!important;
  border:1px solid #dce8f6!important;
  border-radius:11px!important;
  background:#f8fbff!important;
  color:#17243a!important;
  overflow:hidden!important;
  white-space:nowrap!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-sale-v23996>strong{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:28px!important;
  padding:0 9px!important;
  border-radius:8px!important;
  background:#ff3347!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:10px!important;
  font-weight:950!important;
  flex:0 0 auto!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-sale-v23996>span:nth-child(2){
  color:#17243a!important;
  -webkit-text-fill-color:#17243a!important;
  font-size:9.5px!important;
  font-weight:850!important;
  flex:0 0 auto!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-sale-time-v23996{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#1d5fae!important;
  -webkit-text-fill-color:#1d5fae!important;
  font-size:9.5px!important;
  font-weight:850!important;
  overflow:hidden!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-sale-time-v23996 .ms{
  font-size:14px!important;
  color:#1b7ce8!important;
  -webkit-text-fill-color:#1b7ce8!important;
  flex:0 0 auto!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-sale-time-v23996 b{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:#17243a!important;
  -webkit-text-fill-color:#17243a!important;
  font-size:9.5px!important;
  font-weight:900!important;
}

/* Optional badge respects the real admin `popular` flag. */
html body #djs-portal #djs-screen-game .djs-game-row-popular-v23996{
  position:absolute!important;
  z-index:4!important;
  top:0!important;
  right:0!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  min-height:29px!important;
  padding:0 11px 0 12px!important;
  border-radius:0 25px 0 14px!important;
  background:linear-gradient(135deg,#1487ff,#3c6dff)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  letter-spacing:.04em!important;
  box-shadow:0 5px 14px rgba(32,111,230,.18)!important;
}
html body #djs-portal #djs-screen-game .djs-game-row-popular-v23996 .ms{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  font-size:13px!important;
}

/* Tablet/desktop: preserve the same design but allow a little more breathing room. */
@media(min-width:760px){
  html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996{
    grid-template-columns:148px minmax(0,1fr) 180px!important;
    min-height:184px!important;
    gap:12px 22px!important;
    padding:16px 18px!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-media-v2187{
    width:148px!important;min-width:148px!important;min-height:148px!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-title-v2187{font-size:25px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187,
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187 .djs-promo-price strong{font-size:30px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-arrow-shell-v23996{width:60px!important;height:60px!important;border-radius:19px!important}
}

/* Mobile is the approved reference target.  These rules deliberately override
   the older v2.39.88 two-row repair loaded earlier in the cascade. */
@media(max-width:560px){
  html body #djs-portal #djs-screen-game #djs-game-packs{gap:12px!important;padding-bottom:calc(118px + env(safe-area-inset-bottom))!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996{
    grid-template-columns:102px minmax(0,1fr) 74px!important;
    grid-template-rows:minmax(106px,1fr) auto!important;
    grid-template-areas:"media copy side" "media sale side"!important;
    gap:8px 10px!important;
    min-height:142px!important;
    padding:10px!important;
    border-radius:22px!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996:not(.has-sale-v23996){
    grid-template-rows:1fr!important;
    grid-template-areas:"media copy side"!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-media-v2187{
    grid-area:media!important;
    width:102px!important;
    min-width:102px!important;
    height:100%!important;
    min-height:118px!important;
    align-self:stretch!important;
    border-radius:17px!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-copy-v2187{
    grid-area:copy!important;
    gap:4px!important;
    justify-content:center!important;
    align-self:stretch!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-product-v2187{font-size:8.5px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-title-v2187{font-size:16px!important;line-height:1.02!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-available-v2187{min-height:24px!important;padding:4px 7px!important;font-size:8.5px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-desc-v2187{font-size:8.4px!important;line-height:1.18!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-cashback-v2187{min-height:25px!important;padding:5px 7px!important;font-size:8.3px!important;border-radius:8px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-cashback-v2187 .ms{font-size:11px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-side-v2187{
    grid-area:side!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    align-items:flex-end!important;
    width:100%!important;
    padding:10px 0 3px!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187,
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187 .djs-promo-price strong{font-size:18px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187 .djs-promo-price s{font-size:8px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-arrow-shell-v23996{width:48px!important;height:48px!important;min-width:48px!important;border-radius:16px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-arrow-v2187{font-size:24px!important;margin:0!important}
  html body #djs-portal #djs-screen-game .djs-game-row-sale-v23996{
    grid-area:sale!important;
    min-height:31px!important;
    gap:5px!important;
    padding:3px 6px 3px 4px!important;
    margin:0!important;
    border-radius:9px!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-sale-v23996>strong{min-height:24px!important;padding:0 6px!important;border-radius:7px!important;font-size:8.3px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-sale-v23996>span:nth-child(2){font-size:7.6px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-sale-time-v23996{gap:3px!important;font-size:7.6px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-sale-time-v23996 .ms{font-size:11px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-sale-time-v23996 b{font-size:7.6px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-popular-v23996{min-height:26px!important;padding:0 8px 0 9px!important;border-radius:0 21px 0 12px!important;font-size:7.5px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-popular-v23996 .ms{font-size:11px!important}
}

@media(max-width:380px){
  html body #djs-portal #djs-screen-game .djs-game-row-v2187.djs-game-row-v23996{
    grid-template-columns:88px minmax(0,1fr) 62px!important;
    gap:7px 8px!important;
    min-height:130px!important;
    padding:9px!important;
  }
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-media-v2187{width:88px!important;min-width:88px!important;min-height:108px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-title-v2187{font-size:14px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-desc-v2187{font-size:7.7px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187,
  html body #djs-portal #djs-screen-game .djs-game-row-v23996 .djs-game-row-price-v2187 .djs-promo-price strong{font-size:15.5px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-arrow-shell-v23996{width:42px!important;height:42px!important;min-width:42px!important;border-radius:14px!important}
  html body #djs-portal #djs-screen-game .djs-game-row-sale-v23996>span:nth-child(2){display:none!important}
}