/* Groups */
.groups-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-6);flex-wrap:wrap;gap:var(--sp-3); }
.groups-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--sp-4); }
.group-card { background:var(--clr-surface);border:1px solid var(--clr-border);border-radius:var(--radius-xl);padding:var(--sp-6);transition:all var(--dur-normal);cursor:pointer; }
.group-card:hover { box-shadow:var(--shadow-md);transform:translateY(-2px); }
.group-card__header { display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4); }
.group-card__icon { width:44px;height:44px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:1.2rem; }
.group-card__name { font-size:var(--fs-base);font-weight:var(--fw-semibold);margin-bottom:var(--sp-1); }
.group-card__subject { font-size:var(--fs-xs);color:var(--clr-text-muted); }
.group-card__desc { font-size:var(--fs-sm);color:var(--clr-text-light);margin-bottom:var(--sp-4);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
.group-card__footer { display:flex;align-items:center;justify-content:space-between; }
.group-card__members { display:flex;align-items:center; }
.group-card__members .avatar { width:28px;height:28px;font-size:0.65rem;margin-left:-8px;border:2px solid var(--clr-surface); }
.group-card__members .avatar:first-child { margin-left:0; }
.group-card__count { font-size:var(--fs-xs);color:var(--clr-text-muted);margin-left:var(--sp-2); }
/* Group Detail */
.group-detail__header { margin-bottom:var(--sp-6); }
.group-detail__header h1 { font-size:var(--fs-xl);margin-bottom:var(--sp-2); }
.group-detail__header p { font-size:var(--fs-sm);color:var(--clr-text-light); }
.group-detail__grid { display:grid;grid-template-columns:1fr 320px;gap:var(--sp-6); }
.group-detail__sidebar .card { margin-bottom:var(--sp-4); }
.member-item { display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1px solid var(--clr-border); }
.member-item:last-child { border-bottom:none; }
.member-item__info { flex:1; }
.member-item__name { font-size:var(--fs-sm);font-weight:var(--fw-medium); }
.member-item__role { font-size:var(--fs-xs);color:var(--clr-text-muted); }
@media(max-width:991px){.group-detail__grid{grid-template-columns:1fr}}
