.as-archive-app-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(156px,156px));
justify-content:start;
align-items:start;
gap:18px;
direction:rtl;
margin-top:60px;
padding-top:10px;
}

.as-archive-app-tile{
width:156px;
min-width:0
}

.as-archive-app-tile-link{
width:156px;
min-height:228px;
padding:14px 10px 12px;
border-radius:22px;
background:linear-gradient(180deg,rgba(21,28,43,.98),rgba(28,37,54,.92));
border:1px solid rgba(255,255,255,.07);
box-shadow:0 14px 32px rgba(0,0,0,.20);
text-align:center;
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
color:var(--as-text);
text-decoration:none!important;
overflow:hidden;
transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease
}

.as-archive-app-tile-link:hover{
transform:translateY(-3px);
color:var(--as-text);
border-color:rgba(125,211,252,.30);
box-shadow:0 18px 38px rgba(0,0,0,.24)
}

.as-archive-app-tile-icon,
.as-archive-app-tile-icon .as-app-icon-fallback,
.as-archive-app-tile-icon img{
width:118px;
height:118px;
border-radius:18px;
overflow:hidden;
display:grid;
place-items:center;
font-size:42px;
background:linear-gradient(135deg,rgba(52,120,255,.25),rgba(139,92,246,.24));
margin-bottom:11px;
object-fit:cover
}

.as-archive-app-tile-link strong{
width:100%;
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
color:var(--as-text);
font-size:14px;
line-height:1.35;
font-weight:900;
min-height:38px
}

.as-archive-app-tile-link small,
.as-archive-app-tile-link em{
display:block;
max-width:100%;
margin-top:4px;
color:rgba(238,244,255,.72);
font-size:12px;
line-height:1.35;
font-style:normal;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis
}

.as-archive-app-tile-link .as-stars-line{
margin-top:auto;
padding-top:8px;
color:var(--as-gold);
font-size:14px;
direction:ltr
}

body.as-light .as-archive-app-tile-link,
html.as-light .as-archive-app-tile-link{
background:linear-gradient(180deg,#1f2937,#111827);
color:#fff
}

body.as-light .as-archive-app-tile-link strong,
html.as-light .as-archive-app-tile-link strong{
color:#fff
}

@media (max-width:760px){

.as-archive-app-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
justify-content:stretch
}

.as-archive-app-tile{
width:100%
}

.as-archive-app-tile-link{
width:100%;
min-height:210px;
border-radius:20px
}

.as-archive-app-tile-icon,
.as-archive-app-tile-icon .as-app-icon-fallback,
.as-archive-app-tile-icon img{
width:104px;
height:104px;
border-radius:17px
}
}

@media (max-width:390px){

.as-archive-app-tile-link{
min-height:198px;
padding:12px 8px
}

.as-archive-app-tile-icon,
.as-archive-app-tile-icon .as-app-icon-fallback,
.as-archive-app-tile-icon img{
width:92px;
height:92px
}

.as-archive-app-tile-link strong{
font-size:13px
}
}