/* Epoch tile art, 2026-10-12 (intent 2026-10-12-weave-sessions-restructure,
   epoch-art-integration.md). The owner's words: "the epoch tiles need images
   of their own in website theme". Linked only by a page whose step cards carry
   art, so no other page's head restamps. One drawing at the top of each step
   card: square, the card's full width at every size, no tinted box and no
   shadow. */
.step-art {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  margin: 0 0 var(--space-3);
  border-radius: var(--radius-sm);
}

@media (max-width: 759px) {
  .step-art {
    width: 100%;
    max-width: none;
  }
}

/* Eight epochs, so four across from 1024px: two full rows and no empty slot.
   care.css keeps three columns from 760px and one below; this sheet is
   unlayered and loads only on the page whose steps carry art. */
@media (min-width: 1024px) {
  .steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}