.study-art > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .35s ease; }
.play-disc { position: absolute; right: 16px; bottom: 16px; z-index: 1; display: grid; place-items: center; width: 43px; height: 43px; border: 1px solid #ffffff88; border-radius: 50%; background: #ffffffe8; color: var(--ink); box-shadow: 0 4px 16px #0002; transition: transform .2s ease, background .2s ease; }
.play-disc .icon { width: 17px; height: 17px; margin-left: 2px; }
.study-button:focus-visible .study-art { outline: 3px solid #7777f2; outline-offset: 4px; }
.study-button:hover .study-art > img { transform: scale(1.025); }
.study-button:hover .play-disc { transform: scale(1.06); background: #fff; }
@media (max-width: 520px) {
  .play-disc { right: 9px; bottom: 9px; width: 31px; height: 31px; }
  .play-disc .icon { width: 14px; height: 14px; }
}