/* view: artist ------------------------------------------------------------
 * One act's page (views/artist.js, views/actsongs.js): the songs they first
 * sang and their collaborations, each a section laid out as who first sang a
 * song lists theirs (originator.css's rows). Tokens are listen.css's; nothing
 * here defines a colour of its own.
 */

/* A collaboration's row: who else it is with, under the title. */
.act-with {
  font-size: var(--t-meta);
  color: var(--body-ink);
}

/* On an act's channel page the sections sit in the work column under
   everything they sing, with the column's own gutters. */
.person-work .act-songs {
  margin-top: 32px;
}

/* At 900px and wider an act only first sung here keeps its head held at the
   left and every section of songs in the column at the right. */
@media (min-width: 900px) {
  .act-page > .orig-head {
    grid-row: 1 / span 3;
  }

  .act-page > .orig-songs {
    grid-column: 2;
  }

  .act-page > .orig-songs + .orig-songs {
    margin-top: 40px;
  }
}