如何计算垂直屏幕的旋转轴?

Question

这里有一个使用 css 实现的正方体,主要在容器上使用了 transform: rotateX(126.373deg) rotateY(194.517deg);的设置,现在希望使用 rotate3d() 方法来使正方体绕着垂直于屏幕的轴进行旋转。应该怎么求这个旋转轴的坐标?

<div class="cube" style="transform: rotateX(126.373deg) rotateY(194.517deg);">
      <div class="side">
        1
      </div>
      <div class="side">
        2
      </div>
      <div class="side">
        3
      </div>
      <div class="side">
        4
      </div>
      <div class="side">
        5
      </div>
      <div class="side">
        6
      </div>
    </div>

*, *:before, *:after {
  box-sizing: border-box; 
}

body {
  background: #252525;
  display: flex;
  height: 100vh;
}

.cube {
  position: relative;
  margin: auto;
  height: 200px;
  width: 200px;
  transform-style: preserve-3d
}

.cube > div {
  overflow: hidden;
  position: absolute;
  opacity: 0.9;
  height: 200px;
  width: 200px;
  background: white;
  border: 1px solid black;
  font-size: 48px;
  text-align: center;
  line-height: 200px;
 }

.cube > div:first-child {
  transform: rotateX(90deg)     translateZ(100px);
 }

.cube > div:nth-child(2) {
  transform: translateZ(100px);
 }

.cube > div:nth-child(3) {
  transform: rotateY(90deg) translateZ(100px);
 }

.cube > div:nth-child(4) {
  transform: rotateY(180deg) translateZ(100px);
}

.cube > div:nth-child(5) {
  transform: rotateY(-90deg) translateZ(100px);
 }

.cube > div:nth-child(6) {
  transform: rotateX(-90deg) rotate(180deg) translateZ(100px);
 }