尝试修改旋转渐变的 Codepen 示例

问：

我找到了 Kevin Powell 的一款很棒的 Codepen，展示了如何在矩形卡片后面制作渐变动画。我想对此进行调整，以允许卡片成为多边形 - 特别是向上的箭头。任何帮助非常感谢

https://codepen.io/kevinpowell/pen/QWVKZjx

CSS：

@property --gradient-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

:root {
  --clr-1: #052b2f;
  --clr-2: #073438;
  --clr-3: #0e4b50;
  --clr-4: #2d8f85;
  --clr-5: #637c54;
}

body {
  background: var(--clr-2);
  min-height: 100vh;
  display: grid;
  place-content: center;
}

.card {
  height: 60vh;
  aspect-ratio: 1 / 1.5;
  background: var(--clr-1);
  border-radius: 0.5rem;

  position: relative;
}

.card::before,
.card::after {
  content: "";
  position: absolute;
  inset: -0.5rem;
  z-index: -1;
  background: conic-gradient(
    from var(--gradient-angle),
    var(--clr-3),
    var(--clr-4),
    var(--clr-5),
    var(--clr-4),
    var(--clr-3)
  );
  border-radius: inherit;
  animation: rotation 20s linear infinite;
}

.card::after {
  filter: blur(3.5rem);
}

@keyframes rotation {
  0% {
    --gradient-angle: 0deg;
  }
  100% {
    --gradient-angle: 360deg;
  }
}

我已经调整了 CSS，并通过调整其尺寸设法使卡片成为一条窄线，但一直无法弄清楚如何将动画圆锥形渐变放置在多边形后面。