.department-roster-card .card-body { display: grid; gap: 16px; }
.department-roster-campus,
.department-roster-teams { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.department-roster-chip,
.department-roster-team {
  border: 1px solid #c8d6e2;
  background: #fff;
  color: #173c59;
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
}
.department-roster-chip { padding: 5px 10px; font-size: .82rem; font-weight: 700; }
.department-roster-team { padding: 7px 11px; display: inline-flex; gap: 7px; align-items: center; }
.department-roster-team small { min-width: 20px; padding: 1px 6px; border-radius: 999px; background: #eef4f8; text-align: center; }
.department-roster-chip.active,
.department-roster-team.active { border-color: #0d416c; background: #0d416c; color: #fff; }
.department-roster-team.active small { background: rgba(255,255,255,.18); }
.department-roster-heading { display: flex; justify-content: space-between; align-items: end; gap: 12px; }
.department-roster-heading h2 { margin: 0; }
.department-roster-heading p { margin: 4px 0 0; color: #5d7284; }
.department-roster-download {
  border: 0;
  border-radius: 9px;
  background: #0d416c;
  color: #fff;
  padding: 9px 14px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.department-roster-download:hover { filter: brightness(.95); }
.department-roster-download:focus-visible { outline: 3px solid rgba(13,65,108,.25); outline-offset: 2px; }
.department-roster-card td:first-child,
.department-roster-card th:first-child { width: 58px; text-align: center; }
.department-roster-card td small { display: block; margin-top: 3px; }
@media (max-width: 680px) {
  .department-roster-chip { padding: 5px 9px; }
  .department-roster-team { width: 100%; justify-content: space-between; text-align: left; }
  .department-roster-heading { align-items: stretch; flex-direction: column; }
  .department-roster-download { width: 100%; }
}