.client-team-summary .client-team-identity {
  display: grid;
  grid-template-columns: minmax(12rem, .65fr) minmax(14rem, 1fr);
  gap: .35rem 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--border, #ddd5c8);
  border-radius: .65rem;
  background: rgba(255, 255, 255, .5);
}

.client-team-identity strong { font-size: 1rem; }
.client-team-identity span { overflow-wrap: anywhere; }
.client-team-identity em {
  grid-column: 1 / -1;
  color: var(--muted, #756b60);
  font-style: normal;
  line-height: 1.5;
}

.client-team-dialog {
  width: min(68rem, calc(100vw - 2rem));
  max-height: min(50rem, calc(100vh - 2rem));
  padding: 0;
  border: 1px solid var(--border, #ddd5c8);
  border-radius: .85rem;
  background: #fffdf8;
  color: #1a1815;
  box-shadow: 0 1.5rem 5rem rgba(26, 24, 21, .24);
}

.client-team-dialog::backdrop { background: rgba(20, 17, 15, .72); }
.client-team-dialog-shell { padding: clamp(1rem, 3vw, 2rem); }
.client-team-dialog header { display: flex; justify-content: space-between; gap: 1rem; }
.client-team-dialog header span,
.client-team-invite-form label span,
.client-team-member label span {
  display: block;
  color: #8c6c31;
  font-family: "DM Mono", monospace;
  font-size: .69rem;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.client-team-dialog h2 { margin: .25rem 0; font: 400 clamp(1.8rem, 4vw, 2.7rem)/1.05 "Cormorant Garamond", serif; }
.client-team-dialog header p { max-width: 46rem; margin: .5rem 0 1.25rem; color: #625a51; line-height: 1.55; }
.client-team-close { align-self: flex-start; min-width: 2.75rem; min-height: 2.75rem; border: 1px solid #d4cabe; border-radius: 50%; background: transparent; font-size: 1.7rem; cursor: pointer; }

.client-team-invite-form {
  display: grid;
  grid-template-columns: 1fr 1.35fr 1fr auto;
  align-items: end;
  gap: .75rem;
  margin: .5rem 0 1rem;
  padding: 1rem;
  border: 1px solid #ddd5c8;
  border-radius: .65rem;
  background: #f8f3eb;
}
.client-team-invite-form label { display: block; margin-bottom: .35rem; }
.client-team-invite-form input,
.client-team-invite-form select,
.client-team-member select { width: 100%; min-height: 2.8rem; padding: .55rem .65rem; border: 1px solid #cfc4b8; border-radius: .35rem; background: #fff; color: inherit; }
.client-team-status { min-height: 1.5rem; margin: .35rem 0; color: #356048; }
.client-team-status.error { color: #a33b2a; }
.client-team-list { display: grid; gap: .65rem; overflow: auto; max-height: min(31rem, 55vh); padding: .2rem; }
.client-team-member {
  display: grid;
  grid-template-columns: minmax(13rem, 1.5fr) minmax(10rem, 1fr) auto minmax(10rem, auto);
  align-items: center;
  gap: .8rem;
  padding: .9rem;
  border: 1px solid #e0d8cd;
  border-radius: .55rem;
  background: #fff;
}
.client-team-member.removed { opacity: .66; }
.client-team-member-person { display: grid; gap: .15rem; min-width: 0; }
.client-team-member-person span,
.client-team-member-person em { overflow-wrap: anywhere; color: #6f665d; font-size: .82rem; font-style: normal; }
.client-team-member-state { display: grid; justify-items: center; gap: .2rem; }
.client-team-state { padding: .28rem .5rem; border-radius: 999px; background: #ece8e2; font-size: .72rem; text-transform: capitalize; }
.client-team-state.active { background: #e5f1e8; color: #285b3a; }
.client-team-state.invited { background: #fbf0d6; color: #775a1c; }
.client-team-state.suspended,
.client-team-state.removed { background: #f5e4df; color: #883827; }
.client-team-member-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem; }
.client-team-remove { padding: .55rem .7rem; border: 0; background: transparent; color: #9a3d2d; text-decoration: underline; cursor: pointer; }

@media (max-width: 850px) {
  .client-team-invite-form,
  .client-team-member { grid-template-columns: 1fr; }
  .client-team-member-state { justify-items: start; }
  .client-team-member-actions { justify-content: flex-start; }
}

@media (max-width: 560px) {
  .client-team-dialog { width: 100vw; max-height: 100vh; margin: 0; border-radius: 0; }
  .client-team-summary .client-team-identity { grid-template-columns: 1fr; }
}