/******** radius *******/
/******** 间隙 *******/
/******** fontSize *******/
/******** 组件尺寸 *******/
/******** z-index *******/
/******** borderSize *******/
/******** borderStyle *******/
/******** shadow distance *******/
/******** size *******/
/******** spacing *******/
/******** shadow *******/
/******** opacity *******/
/******** fontWeight ********/
/******** Animation *******/
/******** color *******/
/******** diff *******/
/******** icon hover *******/
/******** media *******/
.pd-Avatar {
  display: inline-block;
  position: relative;
  outline: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  white-space: nowrap;
  box-sizing: border-box;
  line-height: 1;
}
.pd-Avatar-circle {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  background: #e5e6eb;
}
.pd-Avatar-circle img {
  width: 100%;
  height: 100%;
}
.pd-Avatar-square {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  overflow: hidden;
}
.pd-Avatar-square img {
  width: 100%;
  height: 100%;
}
.pd-Avatar-decoration {
  width: 120%;
  height: 120%;
  position: absolute;
  top: -10%;
  left: -10%;
  right: 0;
  bottom: 0;
}
.pd-Avatar-defaultBg {
  background-color: var(--color-fill-4);
}