.ice-cube{--size: 8.5rem;position:relative;flex-shrink:0;width:calc(var(--size) * 1.7);height:calc(var(--size) * 1.7);display:grid;place-items:center;perspective:calc(var(--size) * 7)}.ice-cube__spin{position:relative;width:var(--size);height:var(--size);transform-style:preserve-3d;animation:cube-spin 18s linear infinite,cube-bob 5s ease-in-out infinite}.ice-cube__face{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;border-radius:calc(var(--size) * .13);border:1px solid rgba(186,230,253,.45);background:linear-gradient(145deg,#bae6fd47,#2563eb24);box-shadow:inset 0 0 calc(var(--size) * .25) #7dd3fc40;color:#ffffffeb;-webkit-backface-visibility:visible;backface-visibility:visible}.ice-cube__face svg{width:45%;height:45%;stroke-width:1.4}.ice-cube__face--front{transform:translateZ(calc(var(--size) / 2))}.ice-cube__face--back{transform:rotateY(180deg) translateZ(calc(var(--size) / 2))}.ice-cube__face--right{transform:rotateY(90deg) translateZ(calc(var(--size) / 2))}.ice-cube__face--left{transform:rotateY(-90deg) translateZ(calc(var(--size) / 2))}.ice-cube__face--top{transform:rotateX(90deg) translateZ(calc(var(--size) / 2))}.ice-cube__face--bottom{transform:rotateX(-90deg) translateZ(calc(var(--size) / 2))}.ice-cube__shadow{position:absolute;bottom:4%;left:50%;width:60%;height:12%;transform:translate(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(56,189,248,.45),transparent);filter:blur(6px);animation:shadow-pulse 5s ease-in-out infinite}@keyframes cube-spin{0%{transform:rotateX(-22deg) rotateY(0)}to{transform:rotateX(-22deg) rotateY(360deg)}}@keyframes cube-bob{50%{translate:0 calc(var(--size) * -.09)}}@keyframes shadow-pulse{50%{opacity:.6;width:50%}}
