.varlet-ripple { position: absolute; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); top: 0; left: 0; border-radius: 50%; opacity: 0; will-change: transform, opacity; pointer-events: none;}.varlet-ripple--enter { position: relative; z-index: 1;}
.varlet--hidden { overflow: hidden;}
@-webkit-keyframes varlet-skeleton-animation { from { -webkit-transform: translateX(-100%); transform: translateX(-100%); } to { -webkit-transform: translateX(100%); transform: translateX(100%); }}@keyframes varlet-skeleton-animation { from { -webkit-transform: translateX(-100%); transform: translateX(-100%); } to { -webkit-transform: translateX(100%); transform: translateX(100%); }}.varlet-skeleton { width: 100%;}.varlet-skeleton__content { padding: 16px;}.varlet-skeleton__card { position: relative; overflow: hidden; width: 100%; height: 160px; background-color: rgba(0, 0, 0, 0.12); margin-bottom: 16px;}.varlet-skeleton__article { display: flex; width: 100%;}.varlet-skeleton__avatar { position: relative; overflow: hidden; flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; background-color: rgba(0, 0, 0, 0.12); margin-right: 16px;}.varlet-skeleton__section { width: 100%; padding-top: 8px;}.varlet-skeleton__title { position: relative; overflow: hidden; width: 50%; height: 16px; background-color: rgba(0, 0, 0, 0.12); border-radius: 10px;}.varlet-skeleton__row { position: relative; overflow: hidden; width: 100%; height: 16px; background-color: rgba(0, 0, 0, 0.12); margin-top: 16px; border-radius: 10px;}.varlet-skeleton__fullscreen { position: fixed; overflow: hidden; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, 0.12);}.varlet-skeleton--animation:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; -webkit-animation: varlet-skeleton-animation 1.2s infinite; animation: varlet-skeleton-animation 1.2s infinite; background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0.3), hsla(0, 0%, 100%, 0));}