/* /music/ — click-to-load video tiles and credit lists */
.yt { position: relative; display: block; width: 100%; max-width: 760px; margin: 1.2em 0 1em; border: 1px solid var(--divider); background: #000; overflow: hidden; }
.yt--16x9 { aspect-ratio: 16 / 9; }
iframe.yt { border: 1px solid var(--divider); }
.yt img { margin: 0; border: 0; border-radius: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; opacity: .88; transition: opacity .2s ease; }
.yt:hover img, .yt:focus-visible img { opacity: 1; }
.yt-play { position: absolute; left: 50%; top: 50%; width: 68px; height: 68px; margin: -34px 0 0 -34px; border-radius: 50%; background: rgba(10,10,15,.72); border: 1px solid rgba(255,255,255,.35); }
.yt-play::after { content: ""; position: absolute; left: 27px; top: 21px; border-style: solid; border-width: 13px 0 13px 21px; border-color: transparent transparent transparent var(--fg-strong); }
.credits { display: grid; grid-template-columns: max-content 1fr; align-items: baseline; gap: 6px 18px; margin: .6em 0 2.6em; font-size: var(--fs-small); }
.credits dt { font-family: var(--font-ui); font-size: var(--fs-caption); text-transform: uppercase; letter-spacing: .04em; color: var(--fg-muted); margin: 0; padding: 0; }
.credits dd { margin: 0; padding: 0; color: var(--fg); }
@media (max-width: 560px) { .credits { grid-template-columns: 1fr; gap: 0; } .credits dd { margin-bottom: 8px; } }