.reflectionContainer {
  position: relative;
  display: inline-block;
}

.originalContent {
  position: relative;
  z-index: 1;
}

.reflection {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  margin-top: var(--reflection-gap, 8px);
  transform: scaleY(-1) skewX(var(--reflection-skew, 0deg));
  transform-origin: top center;
  opacity: var(--reflection-opacity, 0.3);
  filter: blur(var(--reflection-blur, 2px));
  pointer-events: none;
  user-select: none;
  -webkit-mask-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0.15) 40%,
    rgba(0, 0, 0, 0) 100%
  );
  mask-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0.15) 40%,
    rgba(0, 0, 0, 0) 100%
  );
}