/* Member list — card grid, search/sort toolbar, pager.
   Lifted from docs/forum-theme/samples/memberlist.html (Direction C). */
.toolbar{display:flex; align-items:center; gap:10px; padding:10px 12px;
  border-bottom:1px solid var(--rule); flex-wrap:wrap; margin:0}
.toolbar input[type=text]{box-sizing:border-box; border:1px solid #b9c6dd; border-radius:5px;
  padding:7px 10px; font-family:inherit; font-size:13px; width:200px; background:#fff}
.toolbar .btn{border:1px solid #4f78b3; border-radius:5px; padding:6px 12px; cursor:pointer;
  color:#fff; font-size:12px; background:linear-gradient(to bottom,var(--bar-top),var(--bar-bot))}
.sort{margin-left:auto; display:flex; align-items:center; gap:6px; font-size:11px; color:var(--muted); flex-wrap:wrap}
.chip{padding:3px 11px; font-size:11px; border-radius:12px; border:1px solid #c4d2e8;
  background:#fff; color:#33506f}
.chip:hover{text-decoration:none; border-color:#7ba0d0}
.chip.on{background:#eaf2fd; border-color:#7ba0d0; color:var(--cat-text); font-weight:bold}

.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:9px; padding:10px}
.card{border:1px solid var(--frame); border-radius:8px; overflow:hidden; background:#fff;
  display:flex; gap:10px; padding:11px}
.card .av{display:flex; align-items:center; justify-content:center; width:54px; height:54px; flex:none;
  border-radius:10px; border:2px solid #fff; overflow:hidden;
  box-shadow:0 1px 4px rgba(39,80,127,.2); background:#eef4fb}
.card .av.ph{background:linear-gradient(135deg,#7db0ea,#27507f)}
.card .av:hover{text-decoration:none}
.card .av img{display:block; max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain}
.card .who{min-width:0; flex:1}
.card .nm{font-weight:bold; color:var(--cat-text); font-size:14px}
.card .meta{color:var(--muted); font-size:11px; margin-top:4px; line-height:1.7}
.card .meta b{color:var(--cat-text)}
.card .links{margin-top:5px; display:flex; gap:8px; font-size:11px}

.panel{padding:14px 12px; font-size:12px; color:#333; text-align:center}

.pager{display:flex; align-items:center; gap:4px; padding:10px 12px; font-size:11px;
  color:var(--muted); border-top:1px solid var(--rule); flex-wrap:wrap}
.pager b{color:var(--cat-text)}
.pager .r{margin-left:auto}
.pager a{min-width:18px; text-align:center; padding:1px 5px; border:1px solid #cdd8ea;
  border-radius:2px; background:#fff; color:var(--link)}
.pager a:hover{text-decoration:none; border-color:#7ba0d0}
.pager a.cur{background:var(--bar-bot); color:#fff; border-color:var(--bar-edge); font-weight:bold}

@media (max-width:760px){ .grid{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .grid{grid-template-columns:1fr} .sort{margin-left:0} }