<style>
css-doodle {
  --color: @pd(
    #00b8a9, #f6416c, #f8f3d4, #00b8a9
  );
  --rule: (
    @grid: 10x1 / 70vmin;
    @place-cell: center;
    @size: 20% 1px;
    background: var(--color);
    transform-origin: 0 center;
    transform: 
      translateX(50%) 
      rotate(calc(1turn / @size * @i));
    :after, :before {
      content: '';
      @size: 61.8% 1px;
      position: absolute;
      top: 0; left: 0;
      background: inherit;
      transform-origin: inherit; 
      transform: rotate(@pn(±23deg));
    }
    filter: @M4(drop-shadow(
      calc(5px * @n * @n) 0 0 var(--color)
    )); 
  );
}
html, body {
  margin: 0;
  height: 100%;
  background: #07100d;
  display: grid;
  place-items: center;
}
</style>

<css-doodle click-to-update use="var(--rule)"></css-doodle>