.live-preview { display: block; width: 100%; height: 100%; }
/* The Spooly loop is rendered on the page's own ground; the page's grain over it hides the edge. */
.tile-grain { position: absolute; inset: 0; pointer-events: none; background-image: url("../grain.svg"); opacity: var(--grain-opacity); }
.experiments-page .article-index { max-width: 820px; margin-inline: auto; }
.experiments-page .writing-entry { margin-bottom: 64px; }
.experiments-page .article-link { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: clamp(32px, 5vw, 64px); }
.experiments-page .article-image { margin-top: 0; }
.experiments-page .article-image.artwork, .experiments-page .image-window { aspect-ratio: 1; }
.experiments-page .image-window { background: transparent; box-shadow: none !important; }
.experiments-page .image-window::after { display: none; }
.experiments-page .article-copy h2 { font-size: 27px; }
.experiments-page .article-subtitle { font-size: 14px; margin-bottom: 16px; }
.experiments-page .article-excerpt { margin-bottom: 18px; }
@media (max-width: 760px) {
  .experiments-page .article-index { max-width: 420px; }
  .experiments-page .article-link { grid-template-columns: 1fr; gap: 28px; }
  .experiments-page .article-image { width: min(100%, 300px); justify-self: center; }
}

@media (min-width: 761px) {
  .experiments-page .writing-entry:nth-child(even) .article-link { grid-template-columns: minmax(0, 1fr) minmax(0, 300px); }
}