/* r1577 | Unified game-card sizes and standalone free games marked "قريبًا".
   Last in the approved white home cascade. No commerce or playable routing changes. */
#r1532-shell.r1536-app.r1560-app{
 --r1577-gap:clamp(8px,.85vw,14px);
}
/* Main five games: the Arena keeps distinctive art, NEVER a larger physical card. */
@media(min-width:1200px){
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  grid-template-rows:minmax(0,1fr)!important;
  gap:var(--r1577-gap)!important;
  align-items:stretch!important;
 }
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile.arena,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile:not(.arena){
  grid-column:auto!important;grid-row:auto!important;
  display:flex!important;flex-direction:column!important;
  width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;
 }
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile .r1560-art,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile.arena .r1560-art,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile:not(.arena) .r1560-art{
  grid-column:auto!important;grid-row:auto!important;
  width:100%!important;flex:0 0 58%!important;
  height:58%!important;max-height:58%!important;min-height:0!important;
  border-radius:16px 16px 0 0!important;
 }
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile .text,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile.arena .text,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile:not(.arena) .text{
  grid-column:auto!important;grid-row:auto!important;
  flex:1 1 0!important;height:auto!important;min-height:0!important;
  width:100%!important;
  padding:5px 6px 0!important;gap:3px!important;justify-content:center!important;
 }
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile .r1560-card-action,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile.arena .r1560-card-action,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile:not(.arena) .r1560-card-action{
  grid-column:auto!important;grid-row:auto!important;
  flex:0 0 31px!important;height:31px!important;min-height:31px!important;
  margin:4px 7px 7px!important;font-size:11px!important;
 }
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile .text h2,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile.arena .text h2{
  font-size:clamp(17px,1.55vw,23px)!important;
 }
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile .text p,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile.arena .text p{
  font-size:clamp(10px,.9vw,12px)!important;
 }
 /* Four coming-soon designs have exactly the same width/height as any main card. */
 #r1532-shell.r1536-app.r1560-app .r1574-free-cards{
  display:flex!important;flex-direction:row!important;
  align-items:stretch!important;justify-content:center!important;
  gap:var(--r1577-gap)!important;
  overflow:visible!important;scroll-snap-type:none!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-card{
  flex:0 0 calc((100% - 4 * var(--r1577-gap)) / 5)!important;
  width:calc((100% - 4 * var(--r1577-gap)) / 5)!important;
  height:100%!important;
  grid-column:auto!important;grid-row:auto!important;
  display:flex!important;flex-direction:column!important;
 }
}
/* Upcoming free games are display-only illustrations, not playable game links. */
#r1532-shell.r1536-app.r1560-app .r1574-free-card.r1577-coming-card{
 cursor:default!important;pointer-events:auto!important;
 background:#fff!important;color:#282043!important;
 border:1px solid #e2deed!important;
 text-decoration:none!important;transform:none!important;
 box-shadow:0 4px 16px #22164213!important;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-card.r1577-coming-card:hover{
 transform:none!important;box-shadow:0 4px 16px #22164213!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1577-coming-art{
 position:relative!important;display:flex!important;
 align-items:center!important;justify-content:center!important;
 width:100%!important;min-height:0!important;
 flex:0 0 58%!important;height:58%!important;max-height:58%!important;
 border-radius:16px 16px 0 0!important;overflow:hidden!important;
 background:radial-gradient(circle at 34% 30%,#b89af68c,transparent 56%),
 linear-gradient(145deg,#39226f,#6749b4)!important;
 isolation:isolate!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-art::before,
#r1532-shell.r1536-app.r1560-app .r1577-coming-art::after{
 content:""!important;position:absolute!important;border-radius:50%!important;
 border:1px solid #ffffff35!important;pointer-events:none!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-art::before{
 width:76%!important;aspect-ratio:1;transform:translate(36%,29%)!important;
 box-shadow:0 0 0 19px #ffffff0a!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-art::after{
 width:45%!important;aspect-ratio:1;transform:translate(-85%,-56%)!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-symbol{
 position:relative!important;z-index:2!important;
 display:grid!important;place-items:center!important;
 width:clamp(65px,8vw,114px)!important;
 aspect-ratio:1!important;border-radius:27%!important;
 border:1px solid #ffffff68!important;
 background:linear-gradient(145deg,#ffffff36,#ffffff0b)!important;
 box-shadow:0 16px 28px #130c4028,inset 0 1px #ffffff5c!important;
 font-family:Tahoma,Arial,sans-serif!important;
 font-size:clamp(37px,4.4vw,65px)!important;line-height:1!important;
 font-weight:850!important;color:#fff!important;
 text-shadow:0 3px 10px #13093045!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-theme-who .r1577-coming-art{
 background:radial-gradient(circle at 30% 35%,#74b6fb6b,transparent 54%),linear-gradient(145deg,#153d78,#365cac)!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-theme-seconds .r1577-coming-art{
 background:radial-gradient(circle at 32% 37%,#ffd58185,transparent 58%),linear-gradient(145deg,#9b4c4e,#d58c48)!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-theme-forbidden .r1577-coming-art{
 background:radial-gradient(circle at 35% 28%,#a1f3d37c,transparent 58%),linear-gradient(145deg,#146b68,#348d83)!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1574-free-copy{
 display:flex!important;flex:1 1 0!important;
 justify-content:center!important;min-height:0!important;
 padding:5px 8px 0!important;gap:3px!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1574-free-copy strong{
 color:#291f4e!important;font-weight:900!important;
 font-size:clamp(16px,1.5vw,22px)!important;line-height:1.25!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1574-free-copy>span{
 color:#6d6480!important;font-size:clamp(10px,.86vw,12px)!important;
 line-height:1.3!important;
}
#r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1577-coming-status{
 display:flex!important;align-items:center!important;justify-content:center!important;
 flex:0 0 31px!important;min-height:31px!important;height:31px!important;
 margin:4px 7px 7px!important;border-radius:10px!important;
 background:#f0eafb!important;border:1px solid #e1d3f4!important;
 color:#6941ac!important;box-shadow:none!important;
 font-size:12px!important;font-weight:850!important;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-intro{
 justify-content:center!important;text-align:center!important;
}
#r1532-shell.r1536-app.r1560-app .r1574-upcoming{
 color:#726987!important;text-align:center!important;
}
/* At tablet widths both tabs share the same 2-card gallery dimensions. */
@media(min-width:761px) and (max-width:1199px){
 #r1532-shell.r1536-app.r1560-app .r1574-free-cards{
  display:flex!important;flex-direction:row!important;
  overflow-x:auto!important;overflow-y:hidden!important;
  gap:12px!important;scroll-snap-type:x mandatory!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-card.r1577-coming-card{
  flex:0 0 calc((100% - 12px) / 2)!important;
  width:calc((100% - 12px) / 2)!important;
  height:100%!important;display:flex!important;flex-direction:column!important;
  grid-template-columns:none!important;grid-template-rows:none!important;
 }
}
/* On phones every game and upcoming design takes one identical carousel frame. */
@media(max-width:760px){
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile,
 #r1532-shell.r1536-app.r1560-app .r1574-free-card.r1577-coming-card{
  width:100%!important;min-width:0!important;flex:0 0 100%!important;
  height:100%!important;min-height:0!important;
  display:flex!important;flex-direction:column!important;
  grid-template-columns:none!important;grid-template-rows:none!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1577-coming-art{
  height:58%!important;max-height:58%!important;flex:0 0 58%!important;
  grid-column:auto!important;grid-row:auto!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1574-free-copy,
 #r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1577-coming-status{
  grid-column:auto!important;grid-row:auto!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1577-coming-symbol{
  width:clamp(74px,22vw,110px)!important;font-size:clamp(42px,12vw,62px)!important;
 }
}
@media(max-width:370px) and (max-height:650px){
 #r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1577-coming-art{
  flex:0 0 46%!important;height:46%!important;max-height:46%!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1574-free-copy>span{
  display:none!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1577-coming-card .r1577-coming-status{
  min-height:24px!important;height:24px!important;flex-basis:24px!important;margin:2px 6px 5px!important;
 }
}
@media(prefers-reduced-motion:reduce){
 #r1532-shell.r1536-app.r1560-app .r1577-coming-card,
 #r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel .tile{
  transition:none!important;
 }
}
