.loader{--cell-size:52px;--cell-spacing:1px;--cells:3;--total-size:calc(var(--cells) * (var(--cell-size) + 2 * var(--cell-spacing)));width:var(--total-size);height:var(--total-size);flex-wrap:wrap;display:flex}.cell{flex:0 0 var(--cell-size);margin:var(--cell-spacing);box-sizing:border-box;background-color:#0000;border-radius:4px;animation:1.5s infinite ripple}.w-10{width:2.5rem;height:2.5rem}.w-16{width:4rem;height:4rem}.w-24{width:6rem;height:6rem}.h-full{height:100%}.w-full{width:100%}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.5)}}.cell.d-1{animation-delay:.1s}.cell.d-2{animation-delay:.2s}.cell.d-3{animation-delay:.3s}.cell.d-4{animation-delay:.4s}.cell:first-child{--cell-color:#d4f5ff}.cell:nth-child(2){--cell-color:#b2efff}.cell:nth-child(3){--cell-color:#7de7ff}.cell:nth-child(4){--cell-color:#40d5ff}.cell:nth-child(5){--cell-color:#14b8ff}.cell:nth-child(6){--cell-color:#0098ff}.cell:nth-child(7){--cell-color:#0080ff}.cell:nth-child(8){--cell-color:#0070df}.cell:nth-child(9){--cell-color:#0858a0}@keyframes ripple{0%{background-color:#0000}30%{background-color:var(--cell-color)}60%{background-color:#0000}to{background-color:#0000}}