.youtube-player {
  overflow: hidden;
  border: 1px solid #e1d4e9;
  border-radius: 17px;
  background: #fffaf4;
  box-shadow: var(--shadow);
  scroll-margin-top: 105px;
}
.youtube-list-item { list-style: none; }
.youtube-stage {
  position: relative;
  min-height: 200px;
  aspect-ratio: 16 / 9;
  background: #291e42;
}
.youtube-stage iframe, .youtube-cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.youtube-cover {
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 10px;
  padding: 18px;
  isolation: isolate;
  overflow: hidden;
  text-align: center;
  color: #fffcf2;
  background: radial-gradient(ellipse at 95% 115%,#664294,transparent 68%), #2b2049;
}
.youtube-cover::before, .youtube-cover::after {
  position: absolute;
  z-index: -1;
  content: "";
  pointer-events: none;
}
.youtube-cover::before {
  width: 450px;
  height: 330px;
  top: -256px;
  right: -75px;
  border: 1px solid #b79ad878;
  border-radius: 47% 53% 58% 42%;
  transform: rotate(-14deg);
  box-shadow: 0 0 0 20px #ad89d026, 0 0 0 44px #ad89d015;
}
.youtube-cover::after {
  width: 240px;
  height: 170px;
  bottom: -118px;
  left: -47px;
  border: 2px dashed #ffcdb97f;
  border-radius: 48%;
  transform: rotate(22deg);
}
.youtube-kicker {
  color: #e6efa6;
  font-size: .71rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.youtube-title {
  display: -webkit-box;
  max-width: 26ch;
  font-size: clamp(1.05rem, 3vw, 2rem);
  line-height: 1.15;
  text-wrap: balance;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.youtube-play {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-height: 44px;
  margin-top: 3px;
  padding: 8px 14px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: #e6efa6;
  color: #2d2543;
  font-size: .88rem;
  font-weight: 800;
  text-decoration: none;
}
.prose .youtube-play { color: #2d2543; }
.youtube-play:hover { background: #f2f8c9; }
.youtube-play:focus-visible { outline-color: #fff0d7; }
.youtube-caption {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 5px 12px;
  padding: 10px 13px;
  color: #5b4e65;
  font-size: .78rem;
}
.youtube-actions { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.youtube-actions a { color: #513775; font-weight: 800; text-underline-offset: 3px; }
.youtube-cover[hidden], .youtube-close[hidden] { display: none; }
.video-jump { margin-top: 12px; }