.cube-stage{background:radial-gradient(circle at center, transparent, #000 95%), linear-gradient(var(--cube-grid) 2px, transparent 0) 0 0 / 20px 20px, linear-gradient(90deg, var(--cube-grid) 2px, #000 0) 0 0 / 20px 20px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow:hidden}.cube-main{flex:none;position:relative}.cube-fit{transform-origin:50%;position:absolute;top:50%;left:50%;translate:-50% -50%}.cube-container{perspective:800px;height:200px;transform-style:preserve-3d;animation:2s cubic-bezier(.4,.1,.6,.9) infinite cube-bounce;display:flex;position:relative}.cube-surface{width:100%;height:20px;transform-style:preserve-3d;will-change:transform;flex:none;margin:auto;animation:2s cubic-bezier(.4,.1,.6,.9) -1.5s infinite cube-tilt;position:relative;transform:translateY(50px)rotateX(105deg)rotate(0)}.cube-stage[data-measuring] .cube-container,.cube-stage[data-measuring] .cube-surface,.cube-stage[data-sway=off] .cube-container,.cube-stage[data-sway=off] .cube-surface{animation:none}.cube-block{transform-style:preserve-3d;position:absolute;bottom:0}.cube-outer,.cube-inner{width:20px;transform-style:preserve-3d;display:block;position:relative}.cube-outer{transition:transform .3s}.cube-inner{transform:rotateX(-90deg)translateZ(20px)}.cube-face{background:var(--cube-block);flex-wrap:wrap;align-content:flex-start;width:16px;height:16px;display:flex;position:absolute}.cube-face--bottom:before,.cube-face--left:before,.cube-face--right:before{content:"";background:#000;width:100%;height:100%}.cube-face--bottom{transform-origin:top;transform:rotateX(-90deg)translateY(4px)translateZ(16px)}.cube-face--front{transform:translateZ(-4px)}.cube-face--left{transform-origin:0;transform:rotateY(270deg)translate(-20px)}.cube-face--right{transform-origin:100% 0;transform:rotateY(-270deg)translate(20px)}.cube-face--bottom:before{opacity:.2}.cube-face--left:before,.cube-face--right:before{opacity:.4}.cube-ampm{letter-spacing:.18em;color:var(--cube-block);opacity:.65;-webkit-user-select:none;user-select:none;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;font-weight:600;position:absolute;bottom:12px;left:16px}@keyframes cube-bounce{0%,50%,to{transform:translateY(0)}25%,75%{transform:translateY(10px)}}@keyframes cube-tilt{0%,to{transform:translateY(50px)rotateX(105deg)rotate(-7deg)}50%{transform:translateY(50px)rotateX(105deg)rotate(7deg)}}