css光点围绕边框转圈圈

以下是实现CSS光点围绕边框转圈圈的代码和效果演示：

<div class="container">
  <div class="box"></div>
</div>

.container {
  position: relative;
  width: 200px;
  height: 200px;
  border: 2px solid #fff;
}

.box {
  position: absolute;
  top: -10px;
  left: -10px;
  width: 220px;  height: 220px;
  border: 2px solid transparent;
  border-radius: 50%;
  box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ff00de, 0 0 70px #ff00de, 0 0 80px #ff00de, 0 0 100px #ff00de, 0 0 150px #ff00de;
  animation: rotate 4s linear infinite;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);  }
}

效果演示：https://codepen.io/pen/?&editable=true&editors=110

--相关问题--:
1. 如何实现CSS动画效果？
2. 如何使用CSS实现边框渐变色？
3. 如何使用CSS实现圆