.resize-box {
      position: relative;
      width: 100%;
      /* background: #fff;  // 由外层控制 */
      /* border-radius: 6px; // 由外层控制 */
      /* border: 1px solid #eee; // 可选 */
      will-change: height;
      transform: translateZ(0);
      -webkit-transform: translateZ(0);
      overflow: hidden; /* 也可以加一层保险 */
}

.resize-box.resizing {
      transition: none !important;
}

.resize-handle {
      position: absolute;
      bottom: -10px;
      left: 50%;
      transform: translateX(-50%);
      width: 60px;
      height: 20px;
      display: flex;
      justify-content: center;
      align-items: center;
      background: transparent;
      z-index: 100;
      touch-action: none;
}

.resize-line {
      width: 20px;
      height: 2px;
      background: #D8D8D8;
      border-radius: 1px;
      position: relative;
}

.resize-dots {
      position: absolute;
      top: -4px;
      left: 50%;
      transform: translateX(-50%);
      width: 10px;
      height: 10px;
      background: radial-gradient(circle, #999 1px, transparent 1px) 0 0 / 3px 3px;
}