/* Member index: official people-list/card pattern with accessible tabs. */
.lab-member-tabs {
  width: 100%;
  max-width: none;
  margin: var(--semantic-space-inner-ll) auto 0;
  padding-inline: 0;
  color: var(--ui-text-default);
}

.lab-member-tab-buttons {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  margin: 0 0 var(--semantic-space-inner-ll);
  border-bottom: 1px solid var(--ui-line-default);
  gap: 0;
  scrollbar-width: none;
}

.lab-member-tab-buttons::-webkit-scrollbar {
  display: none;
}

.lab-member-tab-button {
  position: relative;
  flex: 0 0 auto;
  min-height: var(--semantic-size-icon-clickable);
  padding: var(--semantic-space-inner-m) var(--semantic-space-inner-l);
  border: 0;
  background: transparent;
  color: var(--ui-text-light);
  cursor: pointer;
  font: inherit;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
}

.lab-member-tab-button:hover,
.lab-member-tab-button.is-active {
  color: var(--ui-text-brand-primary);
}

.lab-member-tab-button.is-active::after {
  position: absolute;
  right: var(--semantic-space-inner-m);
  bottom: -1px;
  left: var(--semantic-space-inner-m);
  height: 4px;
  border-radius: var(--semantic-corner-radius-s) var(--semantic-corner-radius-s) 0 0;
  background: var(--brand-primary);
  content: "";
}

.lab-member-tab-panel[hidden] {
  display: none;
}

.lab-member-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  gap: var(--semantic-space-inner-ll);
  list-style: none;
}

.lab-member-list__item {
  min-width: 0;
  margin: 0;
}

.lab-member-row {
  display: flex;
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--ui-line-default);
  border-radius: var(--semantic-corner-radius-m);
  background: var(--ui-background-default);
  color: var(--ui-text-default) !important;
  text-decoration: none;
}

.lab-member-row:hover {
  border-color: var(--brand-primary);
  box-shadow: var(--elevation-lv1);
}

.lab-member-photo {
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--brand-quaternary);
}

.lab-member-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lab-member-placeholder {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  color: var(--brand-secondary);
  font-size: 32px;
  font-weight: 700;
}

.lab-member-info {
  display: grid;
  padding: var(--semantic-space-inner-l);
  gap: var(--semantic-space-inner-s);
}

.lab-member-name {
  color: var(--ui-text-brand-primary);
  font-size: 22px;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: 1.31px;
  font-feature-settings: "palt" 1;
}

.lab-member-position,
.lab-member-division {
  color: var(--ui-text-light);
  font-size: 14px;
  line-height: 24px;
}