diff --git a/src/styles.css b/src/styles.css index 2c7ee4e..2a88874 100644 --- a/src/styles.css +++ b/src/styles.css @@ -424,23 +424,24 @@ audio.hidden-audio { .pulse-tentacles .tentacle-web { position: absolute; - inset: -6px; + inset: -10px; border-radius: 50%; - background: radial-gradient( - circle, - rgba(0, 0, 0, 0) 0%, - rgba(0, 0, 0, 0) 48%, - currentColor 58%, - currentColor 70%, - rgba(0, 0, 0, 0) 100% - ); - opacity: calc(0.22 + var(--pulse, 0) * 0.45); - filter: blur(2px); + background: + conic-gradient( + from 0deg, + rgba(0, 0, 0, 0) 0deg, + currentColor 12deg, + rgba(0, 0, 0, 0) 24deg, + currentColor 36deg, + rgba(0, 0, 0, 0) 48deg + ); + opacity: calc(0.12 + var(--pulse, 0) * 0.35); + filter: blur(6px); mask-image: radial-gradient( circle, rgba(0, 0, 0, 0) 0%, - rgba(0, 0, 0, 0.8) 52%, - rgba(0, 0, 0, 1) 72%, + rgba(0, 0, 0, 0.55) 45%, + rgba(0, 0, 0, 1) 65%, rgba(0, 0, 0, 0) 100% ); mask-size: 100% 100%; @@ -448,8 +449,8 @@ audio.hidden-audio { -webkit-mask-image: radial-gradient( circle, rgba(0, 0, 0, 0) 0%, - rgba(0, 0, 0, 0.8) 52%, - rgba(0, 0, 0, 1) 72%, + rgba(0, 0, 0, 0.55) 45%, + rgba(0, 0, 0, 1) 65%, rgba(0, 0, 0, 0) 100% ); -webkit-mask-size: 100% 100%;