.specular-button{position:relative;isolation:isolate;--specular-presence:0;--specular-x:25%;--specular-y:0px}.specular-button:after,.specular-button:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .22s ease-out}.specular-button:before{z-index:1;padding:1px;background:radial-gradient(ellipse 150px 80px at var(--specular-x) var(--specular-y),var(--specular-color),transparent 85%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.specular-button:after{z-index:0;background:radial-gradient(ellipse 140px 65px at var(--specular-x) var(--specular-y),var(--specular-color),transparent 80%)}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.specular-button:not(:disabled):before{opacity:calc(var(--specular-presence) * .5)}.specular-button:not(:disabled):after{opacity:calc(var(--specular-presence) * .1)}}.specular-button:focus-visible{outline:2px solid var(--specular-color);outline-offset:3px}@media (prefers-reduced-motion:reduce){.specular-button:after,.specular-button:before{transition:none}}