/* Osta — «Kelpaako tämä lauta?» (2.10.2026).
 * Yksi kuva kerrallaan: osta.js näyttää vuorossa olevan ja piilottaa
 * muut `hidden`-attribuutilla. Värit paletista (verstas.css). */
.kelpaako-kuvat { margin: 12px 0; max-width: 520px; }
.kelpaako-kuvat .kuva { display: block; cursor: zoom-in; }
.kelpaako-kuvat .kuva[hidden] { display: none; }
.kelpaako-kuvat img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 4 / 3; object-fit: cover;
  border-radius: 6px; background: var(--ground-2);
}
.kelpaako-kuvat .kuva:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.kelpaako-napit button { min-height: 44px; flex: 1 1 auto; }
.kelpaako-napit button[aria-pressed="true"] {
  background: var(--accent); color: var(--ground); border-color: transparent;
}
.kelpaako-seuraava {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin: 14px 0 0;
}
.kelpaako-seuraava button { min-height: 44px; }