/* YouTube embed that only loads on click (GDC talk on the home page). */

.yt { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius-md); overflow: hidden; background: #000; }
.yt button { all: unset; cursor: pointer; position: absolute; inset: 0; display: grid; place-items: center; }
.yt img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.yt__play { position: relative; width: 72px; height: 72px; border-radius: 50%; background: #fff; display: grid; place-items: center; }
.yt__play::after { content: ""; border-left: 20px solid var(--color-ink); border-top: 12px solid transparent; border-bottom: 12px solid transparent; margin-left: 5px; }
.yt button:focus-visible .yt__play { outline: 3px solid #fff; outline-offset: 3px; }
.yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tile--video .yt { flex: 1; aspect-ratio: auto; border-radius: var(--radius-tile); }
.tile--video .yt__play { width: 84px; height: 84px; }