:root{--rect-width:500px;--rect-height:160px;--rect-depth:120px}.scene{align-items:center;display:flex;height:var(--rect-height);justify-content:center;perspective:1500px;width:var(--rect-width)}.cuboid{height:100%;position:relative;transform-style:preserve-3d;width:100%}.cuboid-face{align-items:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:#0a1423a6;border:1px solid hsla(0,0%,100%,.25);box-shadow:0 0 20px #0003;color:#fff;display:flex;font-family:sans-serif;font-size:44px;font-weight:700;justify-content:center;padding:10px;position:absolute;text-align:center;text-shadow:0 0 15px hsla(0,0%,100%,.7);text-transform:uppercase}.back,.front{height:var(--rect-height);width:var(--rect-width)}.front{transform:translateZ(calc(var(--rect-depth)/2))}.back{transform:rotateY(180deg) translateZ(calc(var(--rect-depth)/2)) rotate(180deg)}.bottom,.top{height:var(--rect-depth);top:calc(50% - var(--rect-depth)/2);width:var(--rect-width)}.top{transform:rotateX(90deg) translateZ(calc(var(--rect-height)/2))}.bottom{transform:rotateX(-90deg) translateZ(calc(var(--rect-height)/2))}.left,.right{height:var(--rect-height);left:calc(50% - var(--rect-depth)/2);width:var(--rect-depth)}.right{transform:rotateY(90deg) translateZ(calc(var(--rect-width)/2))}.left{transform:rotateY(-90deg) translateZ(calc(var(--rect-width)/2))}@media(max-width:768px){:root{--rect-width:450px;--rect-height:130px;--rect-depth:90px}.cuboid-face{font-size:32px}}@media(max-width:480px){:root{--rect-width:280px;--rect-height:100px;--rect-depth:70px}.cuboid-face{font-size:22px}}#__nuxt,body,html{height:100%}
