// Animated Icons
// --------------------------

/* 这里是一个动态的 CSS 选择器，@{fa-css-prefix} 会在编译时被替换为具体的内容。
   这个选择器用于为特定的元素设置旋转动画效果。 */
   .@{fa-css-prefix}-spin {
    /* 使用 WebKit 浏览器内核的动画属性，设置一个名为'fa-spin'的动画，持续时间为 2 秒，无限循环，线性过渡。 */
    -webkit-animation: fa-spin 2s infinite linear;
    /* 标准的 CSS 动画属性，设置同样的动画效果。 */
            animation: fa-spin 2s infinite linear;
  }
  
  .@{fa-css-prefix}-pulse {
    /* 使用 WebKit 浏览器内核的动画属性，设置一个名为'fa-spin'的动画，持续时间为 1 秒，无限循环，分为 8 步过渡。 */
    -webkit-animation: fa-spin 1s infinite steps(8);
    /* 标准的 CSS 动画属性，设置同样的动画效果。 */
            animation: fa-spin 1s infinite steps(8);
  }
  
  /* 定义一个名为'fa-spin'的关键帧动画，用于在 WebKit 浏览器内核中实现旋转效果。 */
  @-webkit-keyframes fa-spin {
    /* 在动画的 0% 状态下，设置元素的旋转角度为 0 度。 */
    0% {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
    }
    /* 在动画的 100% 状态下，设置元素的旋转角度为 359 度，实现旋转效果。 */
    100% {
      -webkit-transform: rotate(359deg);
              transform: rotate(359deg);
    }
  }
  
  /* 定义一个名为'fa-spin'的关键帧动画，用于在标准的 CSS 环境中实现旋转效果。 */
  @keyframes fa-spin {
    /* 在动画的 0% 状态下，设置元素的旋转角度为 0 度。 */
    0% {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
    }
    /* 在动画的 100% 状态下，设置元素的旋转角度为 359 度，实现旋转效果。 */
    100% {
      -webkit-transform: rotate(359deg);
              transform: rotate(359deg);
    }
  }