.figure {
  display: grid;
  gap: var(--space-2);
  margin: 0;
}
.frame {
  position: relative;
  display: grid;
  place-items: center;
  min-inline-size: 0;
  overflow: hidden;
  border: 1px solid var(--border-standard);
  border-radius: var(--radius-md);
  background: var(--surface-muted);
}
.square {
  aspect-ratio: 1;
}
.landscape {
  aspect-ratio: 4 / 3;
}
.wide {
  aspect-ratio: 16 / 9;
}
.portrait {
  aspect-ratio: 3 / 4;
}
.auto {
  aspect-ratio: auto;
}
.image {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}
.figure figcaption {
  color: var(--text-secondary);
  font-size: var(--type-caption-size);
}
