.cube-cell{position:relative;min-width:0;--cube-roll-ms: .54s;--cube-roll-delay: 0ms;--cube-roll-depth: 0px;--cube-roll-ease: cubic-bezier(.62, .02, .16, 1)}.cube-cell--rolling{pointer-events:none}.cube-cell--rolling .cube-roll-box,.cube-cell--rolling .cube-roll-face{will-change:transform,opacity}.cube-roll-face{position:absolute;top:0;right:0;bottom:0;left:0}.cube-roll-shade{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:9px;background:#000;pointer-events:none;opacity:0}.cube-roll-box{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d}.cube-roll-box--row{animation:cube-roll-quarter-row var(--cube-roll-ms) var(--cube-roll-ease) var(--cube-roll-delay) both}.cube-roll-box--column{animation:cube-roll-quarter-column var(--cube-roll-ms) var(--cube-roll-ease) var(--cube-roll-delay) both}@keyframes cube-roll-quarter-row{0%{transform:rotateY(0)}to{transform:rotateY(-90deg)}}@keyframes cube-roll-quarter-column{0%{transform:rotateX(0)}to{transform:rotateX(-90deg)}}.cube-roll-box>.cube-roll-face--out{transform:translateZ(var(--cube-roll-depth))}.cube-roll-box--row>.cube-roll-face--in{transform:rotateY(90deg) translateZ(var(--cube-roll-depth))}.cube-roll-box--column>.cube-roll-face--in{transform:rotateX(90deg) translateZ(var(--cube-roll-depth))}.cube-roll-box .cube-roll-shade--out{animation:cube-roll-darken var(--cube-roll-ms) ease-in var(--cube-roll-delay) both}.cube-roll-box .cube-roll-shade--in{animation:cube-roll-lighten var(--cube-roll-ms) ease-out var(--cube-roll-delay) both}@keyframes cube-roll-darken{0%{opacity:0}to{opacity:.62}}@keyframes cube-roll-lighten{0%{opacity:.62}to{opacity:0}}.cube-roll-slab{overflow:hidden;border-radius:9px}.cube-roll-slab--row>.cube-roll-face--out{animation:cube-roll-slab-out-row var(--cube-roll-ms) var(--cube-roll-ease) var(--cube-roll-delay) both}.cube-roll-slab--row>.cube-roll-face--in{animation:cube-roll-slab-in-row var(--cube-roll-ms) var(--cube-roll-ease) var(--cube-roll-delay) both}.cube-roll-slab--column>.cube-roll-face--out{animation:cube-roll-slab-out-column var(--cube-roll-ms) var(--cube-roll-ease) var(--cube-roll-delay) both}.cube-roll-slab--column>.cube-roll-face--in{animation:cube-roll-slab-in-column var(--cube-roll-ms) var(--cube-roll-ease) var(--cube-roll-delay) both}@keyframes cube-roll-slab-out-row{0%{transform:translate(0)}to{transform:translate(-100%)}}@keyframes cube-roll-slab-in-row{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes cube-roll-slab-out-column{0%{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes cube-roll-slab-in-column{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.cube-roll-flap--row>.cube-roll-face--out{animation:cube-roll-flap-out-row calc(var(--cube-roll-ms) / 2) ease-in var(--cube-roll-delay) both}.cube-roll-flap--row>.cube-roll-face--in{animation:cube-roll-flap-in-row calc(var(--cube-roll-ms) / 2) ease-out calc(var(--cube-roll-delay) + var(--cube-roll-ms) / 2) both}.cube-roll-flap--column>.cube-roll-face--out{animation:cube-roll-flap-out-column calc(var(--cube-roll-ms) / 2) ease-in var(--cube-roll-delay) both}.cube-roll-flap--column>.cube-roll-face--in{animation:cube-roll-flap-in-column calc(var(--cube-roll-ms) / 2) ease-out calc(var(--cube-roll-delay) + var(--cube-roll-ms) / 2) both}@keyframes cube-roll-flap-out-row{0%{transform:rotateY(0);opacity:1}to{transform:rotateY(-90deg);opacity:1}}@keyframes cube-roll-flap-in-row{0%{transform:rotateY(90deg);opacity:1}to{transform:rotateY(0);opacity:1}}@keyframes cube-roll-flap-out-column{0%{transform:rotateX(0);opacity:1}to{transform:rotateX(-90deg);opacity:1}}@keyframes cube-roll-flap-in-column{0%{transform:rotateX(90deg);opacity:1}to{transform:rotateX(0);opacity:1}}.cube-roll-settle>.cube-roll-face--out{animation:cube-roll-settle-out calc(var(--cube-roll-ms) * .55) ease-in var(--cube-roll-delay) both}.cube-roll-settle>.cube-roll-face--in{animation:cube-roll-settle-in calc(var(--cube-roll-ms) * .7) cubic-bezier(.16,1,.3,1) calc(var(--cube-roll-delay) + var(--cube-roll-ms) * .3) both}@keyframes cube-roll-settle-out{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.9) translateY(8px)}}@keyframes cube-roll-settle-in{0%{opacity:0;transform:scale(1.08) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}@media (prefers-reduced-motion: reduce){.cube-cell *{animation-duration:1ms!important;animation-delay:0ms!important}}