/* r1574 — clean first-party free-play discovery, scoped to the approved white homepage. */
#r1532-shell.r1536-app.r1560-app .r1574-category-bar{
 display:flex;align-items:center;justify-content:space-between;gap:12px;
 width:100%;min-height:39px;flex:0 0 auto;direction:rtl;padding:0 4px;
}
#r1532-shell.r1536-app.r1560-app .r1574-category-title{
 font-size:clamp(18px,1.65vw,23px);font-weight:850;color:#1d1749;
 line-height:1.3;margin:0;white-space:nowrap;
}
#r1532-shell.r1536-app.r1560-app .r1574-category-tabs{
 display:inline-flex;align-items:center;gap:4px;padding:4px;
 background:#eae7f8;border:1px solid #ded9f0;border-radius:15px;
 box-shadow:inset 0 1px 3px #4a2d8410;
}
#r1532-shell.r1536-app.r1560-app .r1574-category-tab{
 background:transparent;border:0;border-radius:11px;
 color:#514874;padding:7px 15px;min-height:31px;
 font-family:inherit;font-size:clamp(11px,1vw,14px);font-weight:800;
 cursor:pointer;white-space:nowrap;transition:background .16s,color .16s,box-shadow .16s;
}
#r1532-shell.r1536-app.r1560-app .r1574-category-tab.active{
 color:#fff;background:linear-gradient(115deg,#6d22d6,#4815a8);
 box-shadow:0 4px 10px #3f1d812c;
}
#r1532-shell.r1536-app.r1560-app .r1574-category-tab:hover:not(.active){
 background:#fff9;color:#4320a5;
}
#r1532-shell.r1536-app.r1560-app #r1532-exclusive-panel[hidden]{display:none!important}
#r1532-shell.r1536-app.r1560-app .r1574-free-play-panel[hidden]{display:none!important}
#r1532-shell.r1536-app.r1560-app.r1574-free-active .r1560-game-pager{display:none!important}
#r1532-shell.r1536-app.r1560-app .r1574-free-play-panel{
 flex:1 1 0;min-height:0;display:flex;flex-direction:column;gap:7px;
 position:relative;width:100%;direction:rtl;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-intro{
 display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:6px 10px;
 border:1px solid #e4dcf6;border-radius:12px;background:linear-gradient(100deg,#fbf9ff,#f4edff);
 padding:6px 13px;color:#44396c;font-size:clamp(10px,.86vw,12px);line-height:1.3;flex:0 0 auto;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-intro strong{
 color:#4e12b9;font-size:clamp(12px,1.02vw,14px);font-weight:850;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-cards{
 display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
 gap:clamp(8px,.9vw,14px);flex:1 1 0;min-height:0;width:100%;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-card{
 display:flex;flex-direction:column;align-items:stretch;min-width:0;min-height:0;
 overflow:hidden;position:relative;isolation:isolate;
 background:#171d50;border:1px solid #35305b;border-radius:17px;
 color:#fff;text-decoration:none!important;
 box-shadow:0 5px 17px #17104c24;
 transition:transform .17s ease,box-shadow .17s ease;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-card:hover{
 transform:translateY(-3px);box-shadow:0 12px 27px #1d125335;
}
#r1532-shell.r1536-app.r1560-app .r1574-theme-fbrkha{background:#111b50}
#r1532-shell.r1536-app.r1560-app .r1574-theme-qadha{background:#1a2351}
#r1532-shell.r1536-app.r1560-app .r1574-theme-khaltaha{background:#094b47}
#r1532-shell.r1536-app.r1560-app .r1574-theme-topten{background:#281342}
#r1532-shell.r1536-app.r1560-app .r1574-free-art{
 display:block;overflow:hidden;flex:0 0 60%;height:60%;min-height:0;width:100%;
 background:#23164e;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-art img{
 display:block;width:100%;height:100%;object-fit:cover;object-position:center;
 filter:saturate(1.03);transition:transform .18s ease;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-card:hover .r1574-free-art img{
 transform:scale(1.035);
}
#r1532-shell.r1536-app.r1560-app .r1574-free-copy{
 flex:1 1 0;min-height:0;padding:4px 10px 0;
 display:flex;flex-direction:column;gap:3px;align-items:center;justify-content:center;
 text-align:center;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-copy strong{
 font-weight:850;color:#fff2cb;font-size:clamp(17px,1.6vw,23px);line-height:1.22;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-copy>span{
 color:#f9f5ff;font-size:clamp(10px,.95vw,13px);font-weight:580;line-height:1.38;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-action{
 display:flex;align-items:center;justify-content:center;
 flex:0 0 auto;margin:5px 9px 9px;min-height:31px;
 border-radius:10px;padding:6px 8px;
 color:#fff;background:linear-gradient(110deg,#3f68f2,#771ddf);
 box-shadow:inset 0 1px 1px #ffffff50;
 font-size:clamp(11px,.95vw,13px);font-weight:850;
}
#r1532-shell.r1536-app.r1560-app .r1574-upcoming{
 display:flex;justify-content:center;gap:9px;align-items:center;
 color:#5b5579;font-size:clamp(10px,.88vw,12px);font-weight:640;
 padding:2px 10px;min-height:23px;flex:0 0 auto;
}
#r1532-shell.r1536-app.r1560-app .r1574-upcoming strong{
 color:#6c2ac1;white-space:nowrap;font-weight:850;
}
#r1532-shell.r1536-app.r1560-app .r1574-upcoming span{text-align:center;line-height:1.3}
#r1532-shell.r1536-app.r1560-app .r1574-free-pager{display:none}
@media(min-width:761px) and (max-width:1199px){
 #r1532-shell.r1536-app.r1560-app .r1574-free-cards{
  display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  scrollbar-width:none;overscroll-behavior-inline:contain;gap:12px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-cards::-webkit-scrollbar{display:none}
 #r1532-shell.r1536-app.r1560-app .r1574-free-card{
  flex:0 0 calc((100% - 12px) / 2);scroll-snap-align:start;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-pager{display:flex}
}
@media(max-width:760px){
 #r1532-shell.r1536-app.r1560-app .r1574-category-bar{
  gap:5px;min-height:32px;padding:0 2px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-category-title{
  font-size:clamp(14px,4vw,18px);
 }
 #r1532-shell.r1536-app.r1560-app .r1574-category-tabs{
  padding:3px;gap:1px;border-radius:12px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-category-tab{
  padding:6px clamp(6px,1.7vw,10px);min-height:27px;
  font-size:clamp(9.5px,2.6vw,12px);border-radius:9px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-play-panel{gap:5px}
 #r1532-shell.r1536-app.r1560-app .r1574-free-intro{
  gap:3px 7px;padding:5px 8px;
  font-size:10px;justify-content:center;text-align:center;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-intro strong{font-size:11px}
 #r1532-shell.r1536-app.r1560-app .r1574-free-cards{
  display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  scrollbar-width:none;overscroll-behavior-inline:contain;gap:9px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-cards::-webkit-scrollbar{display:none}
 #r1532-shell.r1536-app.r1560-app .r1574-free-card{
  flex:0 0 100%;scroll-snap-align:center;border-radius:16px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-art{
  flex-basis:63%;height:63%;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-copy strong{font-size:clamp(18px,5vw,23px)}
 #r1532-shell.r1536-app.r1560-app .r1574-free-copy>span{font-size:clamp(11px,3vw,13px)}
 #r1532-shell.r1536-app.r1560-app .r1574-free-action{
  margin:3px 8px 7px;min-height:30px;font-size:12px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-upcoming{
  display:block;white-space:normal;line-height:1.35;
  text-align:center;padding:1px 2px;font-size:10px;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-upcoming strong{margin-inline-end:6px}
 #r1532-shell.r1536-app.r1560-app .r1574-free-pager{
  display:flex;align-items:center;justify-content:center;gap:15px;
  flex:0 0 29px;min-height:29px;
 }
}
#r1532-shell.r1536-app.r1560-app .r1574-free-pager button{
 width:34px;height:29px;border-radius:9px;border:1px solid #dcd6ee;
 background:#fff;color:#5222b9;font-weight:850;font-size:18px;cursor:pointer;
}
#r1532-shell.r1536-app.r1560-app .r1574-free-count{
 direction:rtl;font-size:12px;font-weight:800;color:#413573;white-space:nowrap;
}
@media(max-width:370px) and (max-height:650px){
 #r1532-shell.r1536-app.r1560-app .r1574-free-intro span{display:none}
 #r1532-shell.r1536-app.r1560-app .r1574-free-art{flex-basis:54%;height:54%}
 #r1532-shell.r1536-app.r1560-app .r1574-upcoming span{display:none}
}
@media(prefers-reduced-motion:reduce){
 #r1532-shell.r1536-app.r1560-app .r1574-free-card,
 #r1532-shell.r1536-app.r1560-app .r1574-free-art img,
 #r1532-shell.r1536-app.r1560-app .r1574-category-tab{transition:none!important}
}

/* r1574 short viewport compact card: actual 320×568 responsive fixture showed
   the art, game name and action competing for ~100px. Switch to a two-column
   card rather than shrinking Arabic titles to an unreadable size. */
@media(max-width:370px) and (max-height:650px){
 #r1532-shell.r1536-app.r1560-app .r1574-free-card{
  display:grid!important;
  grid-template-columns:39% minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  gap:0!important;direction:rtl;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-art{
  grid-column:1!important;grid-row:1 / 3!important;
  width:100%!important;height:100%!important;min-height:0!important;
  flex:none!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-copy{
  grid-column:2!important;grid-row:1!important;
  min-height:0!important;min-width:0!important;
  justify-content:center!important;
  padding:3px 5px 0!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-copy strong{
  font-size:clamp(14px,4vw,17px)!important;line-height:1.2!important;
 }
 #r1532-shell.r1536-app.r1560-app .r1574-free-copy>span{display:none!important}
 #r1532-shell.r1536-app.r1560-app .r1574-free-action{
  grid-column:2!important;grid-row:2!important;
  margin:1px 5px 4px!important;padding:3px 6px!important;
  min-height:23px!important;font-size:10px!important;
 }
}
