<button class="ccb-rotate" aria-label="Close"><span></span><span></span></button>

.ccb-rotate {
  width: 36px; height: 36px;
  border: none; border-radius: 50%;
  background: rgba(255,255,255,0.06);
  position: relative; cursor: pointer;
  transition: background 0.2s, transform 0.3s;
}
.ccb-rotate span {
  position: absolute; top: 50%; left: 50%;
  width: 16px; height: 2px;
  background: #f0eeff; border-radius: 2px;
  transform-origin: center;
}
.ccb-rotate span:nth-child(1) { transform: translate(-50%,-50%) rotate(45deg); }
.ccb-rotate span:nth-child(2) { transform: translate(-50%,-50%) rotate(-45deg); }
.ccb-rotate:hover {
  background: rgba(255,108,138,0.18);
  transform: rotate(90deg) scale(1.08);
}
.ccb-rotate:hover span { background: #ff6c8a; }