div.item {
  display: grid;
  grid-template-columns:
    calc(4rem * var(--pico-line-height)) auto;
  column-gap: var(--pico-block-spacing-horizontal);
  align-items: top;
  justify-content: left;
  word-break: break-all;

  &.player {
    display: block;
  }

  hgroup {
    margin: 0;
  }

  h5 small,
  hgroup span {
    font-weight: 400;
    font-size: 80%;
    color: var(--pico-muted-color);

    &.category {
      opacity: 0.5;
    }

  }

  .brief {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 80%;

    >span {
      margin-right: 1rem;
    }
  }

  .full>div {
    text-overflow: ellipsis;
    word-wrap: break-word;
    overflow: hidden;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    font-size: 80%;

  }

}