.radial-button{border:1px solid var(--border-color);cursor:pointer;height:3.25rem;color:var(--text-color);background-color:var(--initial-bg);border-radius:1.875rem;justify-content:center;align-items:center;padding-inline:1.25rem;line-height:3.25rem;transition:color .3s,background-color .3s,border-color .3s;display:flex;position:relative;overflow:hidden}.radial-button:before{content:"";top:var(--y,50%);left:var(--x,50%);background:var(--hover-bg);z-index:0;border-radius:50%;width:0;height:0;transition:width .4s,height .4s;position:absolute;transform:translate(-50%,-50%)}.radial-button:hover:before{width:calc(max(var(--button-width), var(--button-height)) * 2);height:calc(max(var(--button-width), var(--button-height)) * 2)}.radial-button:hover{border-color:var(--hover-border-color)}.radial-button:hover span{color:var(--hover-text-color)}.radial-button span{z-index:1;justify-content:center;align-items:center;gap:.5rem;line-height:1;transition:color .3s;display:flex;position:relative}.radial-button span svg{color:currentColor;height:1.25rem}.button-label{padding-top:0}@media (max-width:48rem){.radial-button{border-radius:auto;height:2.625rem}.radial-button span svg{color:currentColor;width:.9375rem;height:.9375rem}}