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

@keyframes spin {
  0% {
    --rotate: 0deg;
  }

  100% {
    --rotate: 360deg;
  }
}

.calculator-glow {
  --glow-color-1: var(--bardic-dark);
  --glow-color-2: #2a3350;
  --glow-color-3: #130b1f;
  overflow: hidden;
}
.calculator-glow::after {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  margin: 0 auto;
  filter: blur(calc(55rem / 6));
  /* background-image: linear-gradient(var(--rotate), #5ddcff, #3c67e3 43%, #4e00c2); */
  /* Very dark colors, inside the box */
  z-index: -1;
  /* background-image: linear-gradient(var(--rotate), #162529, #2a3350 43%, #130b1f); */
  /* background-image: linear-gradient(var(--rotate), #193d47, #142558 43%, #4d1b98); */
  /* background-image: linear-gradient(var(--rotate), var(--bardic-blue), #3c67e3 43%); */
  background-image: linear-gradient(
    var(--rotate),
    var(--glow-color-1),
    var(--glow-color-2) 43%,
    var(--glow-color-3)
  );
  opacity: 1;
  transition: opacity 0.5s;
  animation: spin 15s linear infinite;
}

.dark-glow {
  --glow-color-1: var(--bardic-dark);
  --glow-color-2: var(--bardic-dark);
  overflow: hidden;
  /* --glow-color-2: var(--bardic-dark); */
}
.light-glow {
  --glow-color-1: var(--pico-background-color);
  --glow-color-2: var(--bardic-light);
  --glow-color-3: white;
}

.glow::after {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  margin: 0 auto;
  filter: blur(calc(55rem / 6));
  /* background-image: linear-gradient(var(--rotate), #5ddcff, #3c67e3 43%, #4e00c2); */
  /* Very dark colors, inside the box */
  z-index: -1;
  /* background-image: linear-gradient(var(--rotate), #162529, #2a3350 43%, #130b1f); */
  /* background-image: linear-gradient(var(--rotate), #193d47, #142558 43%, #4d1b98); */
  /* background-image: linear-gradient(var(--rotate), var(--bardic-blue), #3c67e3 43%); */
  background-image: linear-gradient(
    var(--rotate),
    var(--glow-color-1),
    var(--glow-color-2) 43%
  );
  opacity: 1;
  transition: opacity 0.5s;
  animation: spin 15s linear infinite;
}
