/* Equipe e usuários de teste: lista de pessoas com avatar e papel; convite/criação ao lado. */
.team-intro { margin: -10px 0 18px; }
.team-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .9fr); gap: 16px; align-items: start; }
.team-side { display: flex; flex-direction: column; gap: 16px; }
.team-list { list-style: none; padding: 0; margin: 0; }
.team-list li { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.team-list li:last-child { border-bottom: 0; }
.team-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--surface-2); color: var(--ink); display: grid; place-items: center; font-weight: 700; font-size: 14px; flex: none; }
.team-who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.team-who strong { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-who small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-list .select-sm { min-width: 110px; }
.team-invite { display: flex; flex-direction: column; }
.team-invite .btn { align-self: flex-start; }
.team-invites li { padding: 10px 0; }
@media (max-width: 960px) { .team-grid { grid-template-columns: 1fr; } }
/* celular: nome em cima, papel e remover embaixo */
@media (max-width: 560px) {
    .team-list li { flex-wrap: wrap; }
    .team-list li .team-who { flex: 1 1 calc(100% - 48px); }
    .team-list li form { margin-left: 48px; }
    .team-list li form + form { margin-left: auto; }
}