.button{--button-bg:var(--base-100);--button-fg:var(--base-500);--button-hover-bg:var(--base-300);--button-hover-fg:var(--base-500);--button-ring:transparent;--button-radius:.35rem;--button-ease-power:cubic-bezier(.22,1,.36,1);align-items:center;gap:.3rem;width:max-content;text-decoration:none;display:inline-flex}.button--light{--button-bg:var(--base-100);--button-fg:var(--base-500);--button-hover-bg:var(--base-300);--button-hover-fg:var(--base-500);--button-ring:var(--rule)}.button--dark{--button-bg:var(--base-500);--button-fg:var(--base-300);--button-hover-bg:var(--base-300);--button-hover-fg:var(--base-500);--button-ring:var(--rule-lime)}.button__label,.button__icon{border-radius:var(--button-radius);min-height:3rem;color:var(--button-fg);isolation:isolate;transition:color .3s var(--button-ease-power);justify-content:center;align-items:center;display:inline-flex;position:relative;overflow:hidden}.button__label{padding:0 1.6rem}.button__label:before,.button__icon:before{content:"";border-radius:var(--button-radius);background-color:var(--button-hover-bg);transition:transform .35s var(--button-ease-power);z-index:1;position:absolute;inset:0;transform:translateY(100%)}.button__label:after,.button__icon:after{content:"";border-radius:var(--button-radius);background-color:var(--button-bg);box-shadow:inset 0 0 0 1px var(--button-ring);transition:transform .35s var(--button-ease-power);z-index:0;position:absolute;inset:0;transform:scale(1)}.button--default .button__icon{aspect-ratio:1;width:3rem;font-size:1.15rem}.button--no-icon .button__label{padding:0 2rem}.button p.mono{letter-spacing:.08em;z-index:2;margin:0;position:relative}.button__icon>*{transition:transform .35s var(--button-ease-power);z-index:2;position:relative}.button:hover .button__label,.button:hover .button__icon{color:var(--button-hover-fg)}.button:hover .button__label:before,.button:hover .button__icon:before{transform:translateY(0)}.button:hover .button__label:after,.button:hover .button__icon:after{transform:scale(.9)}.button:hover .button__icon>*{transform:translate(.15rem)}.button:focus-visible{outline:2px solid var(--base-300);outline-offset:3px;border-radius:var(--button-radius)}@media (prefers-reduced-motion:reduce){.button__label,.button__icon,.button__label:before,.button__icon:before,.button__label:after,.button__icon:after,.button__icon>*{transition-duration:1ms}}@media (max-width:1000px){.button__label,.button__icon{min-height:2.75rem}.button__label{padding:0 1.25rem}.button--default .button__icon{width:2.75rem}}