:root{--gradient-color1:252,212,80;--gradient-color2:195,241,221;--gradient-color3:0,70,173;--gradient-color4:204,0,0;--color-interactive:140,100,255;--circle-size:140%}.blur-filter{filter:blur(50px);-webkit-filter:blur(50px);transform:translateZ(0);will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}@supports not (-webkit-backdrop-filter:blur(1px)){.blur-filter{filter:url(#blurFilter) blur(50px)}}.gradient-base{position:absolute;top:calc(50% - var(--circle-size) / 2);left:calc(50% - var(--circle-size) / 2);height:var(--circle-size);width:var(--circle-size);mix-blend-mode:hard-light;transform:translateZ(0);-webkit-transform:translateZ(0);backface-visibility:hidden;-webkit-backface-visibility:hidden;perspective:1000px;-webkit-perspective:1000px}.color1{transform-origin:calc(45%);animation:move-in-circle 20s infinite reverse;background:radial-gradient(circle at center,rgba(var(--gradient-color1),.2) 0,rgba(var(--gradient-color1),0) 50%) no-repeat}.color2{top:-50%;left:0;transform-origin:calc(50% + 400px);animation:move-in-circle 40s linear infinite;background:radial-gradient(circle at center,rgba(var(--gradient-color2),.3) 0,rgba(var(--gradient-color2),0) 50%) no-repeat}.color3{left:25%;transform-origin:calc(50% - 200px)}@keyframes move-horizontal{0%{transform:translateX(-50%) translateY(-10%)}50%{transform:translateX(50%) translateY(10%)}to{transform:translateX(-50%) translateY(-10%)}}.color3{animation:move-horizontal 40s ease infinite;opacity:.5;background:radial-gradient(circle at center,rgba(var(--gradient-color3),.3) 0,rgba(var(--gradient-color3),0) 50%) no-repeat}.color4{top:calc(50% - var(--circle-size));left:-50%;height:var(--circle-size);width:var(--circle-size);transform-origin:calc(100%) calc(50% + 200px)}@keyframes move-in-circle{0%{transform:rotate(0deg)}50%{transform:rotate(180deg)}to{transform:rotate(1turn)}}.color4{animation:move-in-circle 20s ease infinite;background:radial-gradient(circle at center,rgba(var(--gradient-color4),.2) 0,rgba(var(--gradient-color4),0) 50%) no-repeat}.interactive{left:-50%;top:-50%;height:100%;width:100%;opacity:.7;background:radial-gradient(circle at center,rgba(var(--color-interactive),.3) 0,rgba(var(--color-interactive),0) 50%) no-repeat}@supports (-webkit-appearance:none){.gradient-base{mix-blend-mode:screen}}