/* Channel cards (the home page and Browse). Scoped to channel grids, because Settings and Admin
   use .card for their section boxes. */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px}
.grid.small{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.grid .card{display:block;color:inherit;text-decoration:none;border-radius:14px}
.grid .card:hover .thumb{transform:translateY(-3px);box-shadow:0 10px 26px rgba(0,0,0,.18)}
.grid .thumb{aspect-ratio:16/9;border-radius:12px;position:relative;overflow:hidden;display:grid;place-items:center;
  transition:transform .18s,box-shadow .18s}
.grid .thumb .big-initials{font-family:"Bricolage Grotesque",Figtree,sans-serif;font-weight:800;font-size:clamp(34px,5vw,54px);color:rgba(255,255,255,.92);letter-spacing:-.02em}
.grid .thumb .shot{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.grid .thumb .tl{position:absolute;top:10px;left:10px;display:flex;gap:6px;z-index:1}
.grid .thumb .br{z-index:1}
.grid .thumb .br{position:absolute;right:10px;bottom:10px}
.grid .badge-live{background:var(--live-badge);color:#fff;font-weight:800;font-size:12px;padding:3px 8px;border-radius:6px;letter-spacing:.04em}
.grid .badge-dark{background:rgba(0,0,0,.6);color:#fff;font-size:12px;font-weight:600;padding:3px 8px;border-radius:6px}
.grid .card.offline .thumb{filter:saturate(.35) brightness(.85)}
.grid .card.offline.has-offline .thumb{filter:none}
.grid .card-body{display:flex;gap:10px;padding:10px 2px 0}
.grid .card-av{width:36px;height:36px;font-size:14px}
.grid .card-title{font-weight:700;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grid .card-sub{color:var(--muted);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grid .card-text{min-width:0}
.grid .partner-tag{background:#5B34C9}