figure {
  border: var(--minimalist-figure-border, var(--figure-border));
  display: grid;
  margin: 0;
  margin-block: var(--minimalist-figure-margin-block, var(--size-16));
  max-width: max-content;

  img {
    width: 100%;
  }

  figcaption {
    background-color: var(
      --minimalist-figcaption-background-color,
      var(--figcaption-background-color)
    );
    color: var(
      --minimalist-figcaption-foreground-color,
      var(--figcaption-foreground-color)
    );
    padding: var(--minimalist-figcaption-spacing, var(--figcaption-spacing));
  }
}

figure.overlap {
  grid-template: 1fr / 1fr;

  img,
  figcaption {
    grid-area: 1 / -1;
  }

  figcaption {
    background-color: var(
      --minimalist-figcaption-overlap-background-color,
      var(--figcaption-overlap-background-color)
    );
    color: var(
      --minimalist-figcaption-overlap-foreground-color,
      var(--figcaption-overlap-foreground-color)
    );
    place-self: end;
  }
}