.main-card {
  position: absolute;
  width: 100%;
  height: 100%;
  box-shadow:
    var(--panel-bs, 
    1px 1px 0 1px #f9f9fb,
    -1px 0 28px 0 rgba(34, 33, 81, 0.01),
    28px 28px 28px 0 rgba(34, 33, 81, 0.25));
  border-radius: 32px;
  transform:
    rotateX(var(--panel-rx, 51deg))
    rotateZ(var(--panel-rz, 43deg))
    scale(var(--panel-scale, 0.4));
}

.custom-panel {
  transform:
    perspective(800px)
    rotateY(var(--panel-ry, 25deg))
    rotateX(10deg)
    scale(var(--panel-scale, 0.6));
  filter: blur(var(--panel-blur, 2px));
  opacity: 0.5;
  border-radius: 2rem;
  width: 200px;
  height: 200px;
}

.custom-panel-2 {
  transform:
    perspective(800px)
    rotateY(var(--panel-ry, 25deg))
    rotateX(var(--panel-rx, 10deg))
    scale(var(--panel-scale, 0.6));
  filter: blur(var(--panel-blur, 2px));
  opacity: 0.5;
  border-radius: 2rem;
  width: 240px;
  height: 240px;
  background: linear-gradient(325deg, #3657fa, #fa325a);
}