:root {
  --home-card-border: 1px solid rgb(255, 255, 255);
  --home-panel-radius: calc(var(--radius) + 4px);
}

.cube-frame::after {
  border-radius: 50%;
  background: radial-gradient(
    ellipse at center,
    rgba(255, 255, 255, 0.24) 0%,
    rgba(255, 255, 255, 0.13) 28%,
    rgba(255, 255, 255, 0.045) 54%,
    rgba(255, 255, 255, 0) 76%
    );
  filter: blur(24px);
  content: "";
  position: absolute;
  bottom: 54px;
  left: 50%;
  width: 390px;
  height: 96px;
  transform: translateX(-50%) rotateX(68deg);
  pointer-events: none;
}

.cube-frame::before {
  border-radius: 50% 50% 46% 46%;
  background: radial-gradient(
    ellipse at 50% 0%,
    rgba(255, 255, 255, 0.25) 0%,
    rgba(255, 255, 255, 0.115) 30%,
    rgba(255, 255, 255, 0.04) 58%,
    rgba(255, 255, 255, 0) 82%
    ),
    linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.105) 0%,
    rgba(255, 255, 255, 0.062) 42%,
    rgba(255, 255, 255, 0) 100%
    );
  opacity: 0.8;
  filter: blur(16px);
  content: "";
  position: absolute;
  top: -8%;
  left: 50%;
  width: min(230px, 52%);
  height: 99%;
  transform: translateX(-50%);
  pointer-events: none;
}

.cube-grid-bg {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.035), transparent 21rem);
  background-size: 38px 38px;
  -webkit-mask-image: radial-gradient(circle at center, black 0%, transparent 72%);
  mask-image: radial-gradient(circle at center, black 0%, transparent 72%);
  position: absolute;
  inset: 0;
}

.cube-ring {
  border: 1px solid rgba(255, 255, 255, 0.025);
  border-radius: 50%;
  position: absolute;
  width: 400px;
  height: 400px;
}

.ring-b {
  opacity: 0.22;
  width: 500px;
  height: 500px;
  transform: rotateX(64deg) rotateZ(-34deg);
}

.ring-a {
  transform: rotateX(68deg) rotateZ(24deg);
}

@media (width < 1024px) {
  .cube-ring {
    width: 300px;
    height: 300px;
  }

  .ring-b {
    width: 380px;
    height: 380px;
  }
}