.gooey-nav-container{position:relative;display:flex;justify-content:center;align-items:center;min-height:4rem;filter:url(#gooey-nav-filter)}.gooey-nav-container nav ul{list-style:none;padding:0;margin:0;display:flex;gap:.25rem}.gooey-nav-container nav li{position:relative}.gooey-nav-container nav a{display:block;padding:.75rem 1rem;color:hsl(var(--foreground));text-decoration:none;font-size:.875rem;font-weight:500;position:relative;z-index:2;transition:color .4s ease;cursor:pointer}.gooey-nav-container .effect{position:absolute;pointer-events:none;border-radius:999px;transition:all .4s cubic-bezier(.4,.6,.5,1.3);z-index:1}.gooey-nav-container .filter{background:hsl(var(--primary))}.gooey-nav-container .text{display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:500;color:hsl(var(--primary-foreground));transition:opacity .2s ease;opacity:0}.gooey-nav-container .text.active{opacity:1}.gooey-nav-container .particle{position:absolute;top:50%;left:50%;width:20px;height:20px;opacity:0;transform:translate(-50%,-50%);animation:bubble var(--time) forwards}.gooey-nav-container .particle .point{position:absolute;top:50%;left:50%;width:100%;height:100%;background:var(--color);border-radius:50%;transform:translate(-50%,-50%) scale(var(--scale))}@keyframes bubble{0%{transform:translate(-50%,-50%) translate(var(--start-x),var(--start-y)) scale(1);opacity:1}to{transform:translate(-50%,-50%) translate(var(--end-x),var(--end-y)) scale(0);opacity:1}}:root{--color-1:hsl(var(--primary));--color-2:hsl(var(--secondary-foreground));--color-3:hsl(var(--accent-foreground));--color-4:#ff6b6b}.dark{--color-2:hsl(var(--secondary));--color-3:hsl(var(--accent))}