body.feed-body.grid-mode{overflow:auto}
.wall-genres{position:fixed;left:18px;top:88px;bottom:24px;z-index:45;width:152px;display:none;
  flex-direction:column;gap:5px;padding:10px;border-right:1px solid rgba(255,255,255,.1)}
.genre-list{display:contents}
.wall-genres button{display:grid;grid-template-columns:34px 1fr;align-items:center;width:100%;min-height:42px;
  padding:0 8px;border:0;border-radius:6px;background:transparent;color:var(--dim);font-family:inherit;
  text-align:left;cursor:pointer;transition:background .18s ease,color .18s ease}
.wall-genres button span{font-size:17px;text-align:center}
.wall-genres button b{font-size:13px}
.wall-genres button:hover{background:rgba(255,255,255,.07);color:var(--ink)}
.wall-genres button.on{background:rgba(242,244,250,.94);color:#11131a}
body.grid-mode .wall-genres{display:flex}
body.grid-mode .home-rail,body.grid-mode .reel-queue{display:none}
#wall{display:none;width:100%;padding:90px 28px 60px 194px;columns:4 280px;column-gap:18px}
body.grid-mode #wall{display:block}
body.grid-mode #feed{display:none}
.wall-empty{position:fixed;left:194px;right:28px;top:45%;display:grid;place-items:center;
  color:var(--faint);font-size:13px;letter-spacing:1px}
.wall-empty[hidden]{display:none}
.w-card{position:relative;aspect-ratio:4/3;break-inside:avoid;margin-bottom:18px;border-radius:8px;overflow:hidden;
  border:1px solid var(--stroke);background:var(--panel);cursor:pointer;
  transition:.35s;opacity:0;transform:translateY(26px);animation:cardIn .7s cubic-bezier(.22,1,.36,1) forwards}
.w-card::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.62) 38%,rgba(0,0,0,.08) 72%,transparent 100%)}
@keyframes cardIn{to{opacity:1;transform:none}}
.w-card:hover{transform:translateY(-6px);border-color:rgba(125,216,255,.45);
  box-shadow:0 24px 60px rgba(0,0,0,.55)}
.w-cover{position:absolute;inset:0;overflow:hidden}
.w-cover .wall-preview{z-index:1;opacity:0;background:var(--panel);transition:opacity .22s ease}
.w-card.previewing .wall-preview.video-ready{opacity:1}
.w-cover .play-ic{width:52px;height:52px;font-size:16px;opacity:0}
.w-card:hover .play-ic{opacity:1}
.w-card.previewing .play-ic{opacity:0}
.w-body{position:absolute;inset:auto 0 0;z-index:3;padding:44px 16px 16px;text-shadow:0 2px 14px rgba(0,0,0,.9)}
.w-body h3{font-size:17px;font-weight:800;line-height:1.25}
.w-body p{font-size:12.5px;color:rgba(242,244,250,.72);line-height:1.55;margin-top:7px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(hover:none){
  .w-card:hover{transform:none;border-color:var(--stroke);box-shadow:none}
  .w-card:hover .play-ic{opacity:0}
}
@media(max-width:900px){
  .wall-genres{left:0;top:66px;bottom:12px;width:82px;padding:6px 5px;gap:3px}
  .wall-genres button{grid-template-columns:24px 1fr;min-height:38px;padding:0 3px}
  .wall-genres button span{font-size:14px}
  .wall-genres button b{font-size:11px}
  #wall{column-count:2;column-width:auto;padding:76px 8px 60px 88px;column-gap:8px}
  .wall-empty{left:88px;right:8px}
  .w-card{margin-bottom:10px}
  .w-body{padding:34px 11px 11px}
  .w-body h3{font-size:14px}
  .w-body p{font-size:11.5px;line-height:1.45;margin-top:5px}
}
