.border-glow-card {
  --edge-proximity: 0;
  --cursor-angle: 45deg;
  --edge-sensitivity: 30;
  --color-sensitivity: calc(var(--edge-sensitivity) + 20);
  --border-radius: 28px;
  --glow-padding: 40px;
  --cone-spread: 25;
  --card-bg: transparent;
  --fill-opacity: 0.5;

  position: relative;
  border-radius: var(--border-radius);
  isolation: isolate;
  transform: translate3d(0, 0, 0.01px);
  overflow: visible;
}

.border-glow-card::before,
.border-glow-card::after,
.border-glow-card > .edge-light {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  transition: opacity 0.25s ease-out;
  z-index: -1;
  pointer-events: none;
}

.border-glow-card:not(:hover):not(.sweep-active)::before,
.border-glow-card:not(:hover):not(.sweep-active)::after,
.border-glow-card:not(:hover):not(.sweep-active) > .edge-light {
  opacity: 0;
  transition: opacity 0.75s ease-in-out;
}

.border-glow-card::before {
  border: 2px solid transparent;
  background:
    linear-gradient(var(--card-bg, transparent) 0 100%) padding-box,
    conic-gradient(
      from var(--cursor-angle) at center,
      #c084fc calc(var(--cone-spread) * 1%),
      transparent calc((var(--cone-spread) + 15) * 1%),
      transparent calc((100 - var(--cone-spread) - 15) * 1%),
      #f472b6 calc((100 - var(--cone-spread)) * 1%)
    ) border-box;

  opacity: calc((var(--edge-proximity) - var(--color-sensitivity)) / (100 - var(--color-sensitivity)));

  mask: none;
  -webkit-mask: none;
}

.border-glow-card::after {
  display: none;
}

.border-glow-card > .edge-light {
  inset: calc(var(--glow-padding) * -1);
  mix-blend-mode: plus-lighter;
  opacity: calc((var(--edge-proximity) - var(--edge-sensitivity)) / (100 - var(--edge-sensitivity)));
  mask: none;
  -webkit-mask: none;
}

.border-glow-card > .edge-light::before {
  content: "";
  position: absolute;
  inset: var(--glow-padding);
  border-radius: inherit;
  box-shadow:
    0 0 6px 0 #c084fc,
    0 0 15px 0 #f472b6,
    0 0 25px 2px #22d3ee,
    0 0 50px 2px #34d399;
}

.border-glow-inner {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
  overflow: auto;
}
