main article,
main .modal,
main section[id],
main aside {
  display: none;
}
.page.active,
.block.active {
  display: block;
}
.span.active {
  display: inline;
}
.gallery > .main {
  display: block;
}
.gallery > .main > .block.match > figure.featured {
  display: block;
}
.results > .main > .block.match figcaption {
  display: none;
}
.gallery > .page.active {
  display: flex;
  row-gap: var(--normal-spacing);
  column-gap: var(--normal-spacing);
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: flex-start;
}
.page.results > article,
.page.results > section,
.page.results > aside {
  display: none;
}
.page.active > .main {
  display: block;
}
.block.match.active {
  display: grid;
  grid-template-columns: min-content auto;
  grid-template-rows: auto auto;
  grid-column-gap: 1em;
  margin-bottom: 1em;
  padding: 0.75em;
  width: 16em;
  height: 8em;
}
/* .image.match.active {
  display: inline-block;
}
 */
.image.match.active {
  display: inline-block;
  width: var(--thumb-width);
  height: var(--thumb-height);
}
.image.match > * {
  display: none;
}
.image.match > .main {
  display: block;
}
.image.match > .main > figure {
  display: none;
}
.image.match > .main > figure.featured {
  display: inline-block;
}
.image.match > .main > figure.featured > figcaption {
  display: none;
}

@media only screen and (max-width: 660px) {
  .page.results > .main > .block.match.active,
  .page.list > .main > .block.match.active {
    width: 100%;
  }
}
.page.gallery > .main > .block.match.active > header {
  grid-column: 1 / span 3;
  grid-row: 1 / 2;
}
.page.gallery > .main > .block.match.active > figure {
  grid-column: 1 / 2;
  grid-row: 2 / 3;
}
.page.gallery > .main > .block.match.active > p {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}
.block.match {
  cursor: pointer;
}
main .list > .block.match.active > * {
  display: none;
}
main .list > .block.match.active > header {
  display: block;
}
main .list > .block.match.active > p {
  display: block;
  font-size: 0.8em;
}
main .list > .block.match.active > p.note {
  display: none;
}
.block.match > p {
  display: none;
  margin: 0;
  padding: 0;
}
.block.match > p:first-of-type {
  display: inline;
}
.results > .main > .block a > figure.icon,
.list > .main > .block a > figure.icon {
  object-fit: cover;
  display: block;
  width: 24px;
  height: 24px;
}