1.rainbow-hover {
2  font-size: 16px;
3  font-weight: 700;
4  color: #ff7576;
5  background-color: #2B3044;
6  border: none;
7  outline: none;
8  cursor: pointer;
9  padding: 12px 24px;
10  position: relative;
11  line-height: 24px;
12  border-radius: 9px;
13  box-shadow: 0px 1px 2px #2B3044,
14    0px 4px 16px #2B3044;
15  transform-style: preserve-3d;
16  transform: scale(var(--s, 1)) perspective(600px)
17    rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
18  perspective: 600px;
19  transition: transform 0.1s;
20}
21
22.sp {
23  background: linear-gradient(
24      90deg,
25      #866ee7,
26      #ea60da,
27      #ed8f57,
28      #fbd41d,
29      #2cca91
30    );
31  -webkit-background-clip: text;
32  -webkit-text-fill-color: transparent;
33  background-clip: text;
34  text-fill-color: transparent;
35  display: block;
36}
37
38.rainbow-hover:active {
39  transition: 0.3s;
40  transform: scale(0.93);
41}