.list {
  padding: 4rem;
  overflow: hidden;
}

.item {
  float: left;
  width: 4rem;
  margin: 1rem;
}

.iconName {
  text-align: center;
  font-size: 0.5rem;
}

.icon svg {
  height: 3rem;
  width: 3rem;
  margin: 0 auto;
}

.lyraIcons {
  padding: 2rem;
}

.lyraIcon {
  display: block;
  padding-top: 1em;
  color: inherit;
}

.title {
  font-size: 1.5em;
}

.role {
  composes: root from 'part:@lyra/base/theme/typography/code-style';
  background-color: inherit;
  color: inherit;
}

.iconPreview {
  color: inherit;
}

.iconPreviewXL {
  composes: iconPreview;
  font-size: 4em;
}

.iconPreviewL {
  composes: iconPreview;
  font-size: 3em;
}

.iconPreviewM {
  composes: iconPreview;
  font-size: 2em;
}

.iconPreviewS {
  composes: iconPreview;
  font-size: 1em;
}

.iconPreviewXS {
  composes: iconPreview;
  font-size: 0.5em;
}