/* characters carousel */
.cq{overflow:hidden;padding:22px 0 8px;margin-top:12px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.cq div{display:flex;width:max-content;animation:cq 40s linear infinite reverse}
.cq .ch{display:flex;flex-direction:column;align-items:center;gap:8px;margin-right:18px;width:104px;padding:16px 0 12px;border-radius:26px;background:linear-gradient(160deg,#181818,#040404);border:.5px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 12px 28px rgba(0,0,0,.6)}
.cq b{font-size:13px;font-weight:600;color:#9a9a9f}
@keyframes cq{to{transform:translateX(-50%)}}
.cq .ch img,.cq .ph i{width:72px;height:72px;border-radius:20px;object-fit:cover;display:block}
.cq .ph{opacity:.6;border-style:dashed}
.cq .ph i{border:1.5px dashed rgba(255,255,255,.25);display:grid;place-items:center;color:var(--mu);font:300 30px var(--sans)}
/* black & white effect for character images */
.cq .ch img{filter:grayscale(1) contrast(1.1) brightness(.95)}

/* bigger, uniform cards */
.cq .ch{width:124px;padding:14px 0 12px;border-radius:30px}
.cq .ch img,.cq .ph i{width:96px;height:96px;border-radius:24px}
.cq .ch b{max-width:100%;padding:0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* no labels: tighter card */
.cq .ch{padding:14px 14px}

/* same level, same size */
.cq div{align-items:center}
.cq .ch{flex:none;height:auto;transform:none}
.cq .ch img{width:96px;height:96px;flex:none}
