<div class="box">
  <sh></sh>
</div>

.box {
  --r-top: 10px;
  --r-right: 40px;
  --r-bottom: 30px;
  --r-left: 20px;
  
  width: 150px;
  height: 150px;
  border: 2px solid green;  
  border-radius: var(--r-top) var(--r-right) var(--r-bottom) var(--r-left);
  position: relative;
  transform: translate(0);
  transform-style: preserve-3d;
}
.box sh {
  position: absolute;
  inset: -152px;
  border: 150px solid #0000;
  border-radius: calc(150px + var(--r-top)) calc(150px + var(--r-right)) calc(150px + var(--r-bottom)) calc(150px + var(--r-left));
  transform: translateZ(-1px);
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}
.box sh:before {
  content:"";
  position: absolute;
  inset: -5px;
  transform: translate(10px,8px);
  background: conic-gradient(from 90deg at 40% -25%, #ffd700, #f79d03, #ee6907, #e6390a, #de0d0d, #d61039, #cf1261, #c71585, #cf1261, #d61039, #de0d0d, #ee6907, #f79d03, #ffd700, #ffd700, #ffd700);
  filter: blur(10px);
  border-radius: var(--r-top) var(--r-right) var(--r-bottom) var(--r-left);
}

body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-content: center;
  background: repeating-linear-gradient(-45deg, #fff 0 20px, #f9f9f9 0 40px);
}