@property --shine-angle{syntax:"<angle>";initial-value:0deg;inherits:false}:root{--btn-bd-w:1.5px;--btn-gap-lg:0.5rem;--btn-gap-md:0.375rem;--btn-gap-sm:0.25rem}.button-large,.button-medium,.button-small{align-items:center;background:var(--btn-bg,transparent);border:var(--btn-bd-w) solid var(--btn-bd,transparent);border-radius:var(--btn-radius,var(--radius-0));color:var(--btn-fg,var(--primary-accent));display:inline-flex;flex-shrink:0;font-family:var(--text-font);gap:var(--btn-gap,.5rem);justify-content:center;line-height:1;overflow:hidden;position:relative;text-decoration:none;transition:background .2s,color .2s,border-color .2s,transform .2s,box-shadow .2s;user-select:none}.button-large:focus-visible,.button-medium:focus-visible,.button-small:focus-visible{outline:2px solid color-mix(in srgb,currentColor 40%,transparent);outline-offset:2px}.button-large{--btn-px:1.2em;--btn-py:1.25rem;--btn-gap:var(--btn-gap-lg);--btn-radius:var(--radius-1);--icon:24px;padding:var(--btn-py) var(--btn-px)}.button-medium{--btn-px:1em;--btn-py:1rem;--btn-gap:var(--btn-gap-md);--btn-radius:var(--radius-0);--icon:18px}.button-medium,.button-small{padding:var(--btn-py) var(--btn-px)}.button-small{--btn-px:1em;--btn-py:0.75rem;--btn-gap:var(--btn-gap-sm);--btn-radius:var(--radius-0);--icon:20px}.button-large[data-pill],.button-medium[data-pill],.button-small[data-pill]{border-radius:9999px}.button-large[data-icon=left],.button-medium[data-icon=left],.button-small[data-icon=left]{flex-direction:row-reverse}.button-large[data-icon=right],.button-medium[data-icon=right],.button-small[data-icon=right]{flex-direction:row}.button-large svg,.button-medium svg,.button-small svg{fill:none;height:var(--icon);stroke:currentColor;width:var(--icon)}:is(.button-large,.button-medium,.button-small)[data-variant=primary]{--btn-bg:var(--primary-accent);--btn-fg:var(--white);--btn-bd:var(--primary-accent);--hover-bg:var(--bg-primary-tint-0);--hover-fg:var(--primary-accent);--hover-bd:transparent}:is(.button-large,.button-medium,.button-small)[data-variant=secondary]{--btn-bg:var(--dark);--btn-fg:var(--white);--btn-bd:var(--dark);--hover-bg:var(--bg-lilac-tint-0);--hover-fg:var(--lilac-accent);--hover-bd:transparent}[data-theme=dark] :is(.button-large,.button-medium,.button-small)[data-variant=secondary]{--btn-bg:var(--tofu-gray-92);--btn-fg:var(--dark);--btn-bd:var(--tofu-gray-92)}:is(.button-large,.button-medium,.button-small)[data-variant=outline]{--btn-bg:transparent;--btn-fg:var(--dark);--btn-bd:var(--dark);--ripple:var(--dark-opacity-005)}:is(.button-large,.button-medium,.button-small)[data-variant=outline][data-color=primary]{--btn-fg:var(--primary-accent);--btn-bd:var(--primary-accent);--ripple:var(--primary-opacity-005)}:is(.button-large,.button-medium,.button-small)[data-variant=outline][data-color=white]{--btn-fg:var(--white);--btn-bd:var(--white);--ripple:hsla(0,0%,100%,.05)}:is(.button-large,.button-medium,.button-small)[data-variant=link]{--btn-bg:transparent;--btn-fg:var(--primary-accent);--btn-bd:transparent;border-radius:0;font-weight:var(--fw-semibold);height:auto;justify-content:space-between;padding:0}:is(.button-large,.button-medium,.button-small)[data-variant=link][data-color=white]{--btn-fg:var(--white)}:is(.button-large,.button-medium,.button-small)[data-variant=link][data-color=dark]{--btn-fg:var(--dark)}:is(.button-large,.button-medium,.button-small)[data-variant=shine]{--btn-fg:var(--dark);--shine-from:var(--brand-400);--shine-to:var(--indigo-400);background:transparent;border:none}:is(.button-large,.button-medium,.button-small)[data-variant=shine][data-color=white]{--btn-fg:var(--white)}:is(.button-large,.button-medium,.button-small)[data-variant=shine]:before{animation:shine-border 4s linear infinite;background:conic-gradient(from var(--shine-angle),var(--shine-from),var(--shine-to),var(--shine-from));border-radius:inherit;content:"";inset:0;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;padding:3px;position:absolute}.button-large:not([data-variant=link]):hover,.button-medium:not([data-variant=link]):hover,.button-small:not([data-variant=link]):hover{background:var(--hover-bg,var(--btn-bg));border-color:var(--hover-bd,var(--btn-bd));box-shadow:0 1px 0 color-mix(in srgb,currentColor 20%,transparent);color:var(--hover-fg,var(--btn-fg));transform:translateY(-2px)}:is(.button-large,.button-medium,.button-small)[data-variant=shine]:hover{box-shadow:0 0 16px oklch(from var(--brand-300) l c h/.5),0 0 32px var(--bg-lilac-tint-2-05)}:is(.button-large,.button-medium,.button-small)[data-variant=shine]:hover:before{background:conic-gradient(from var(--shine-angle),var(--brand-300),var(--indigo-300),var(--brand-300));padding:2.5px}@keyframes shine-border{to{--shine-angle:360deg}}:is(.button-large,.button-medium,.button-small)[data-variant=outline]:before{background:var(--ripple,transparent);border-radius:50%;content:"";height:20px;inset:50% auto auto 50%;opacity:0;position:absolute;transform:translate(-50%,-50%) scale(1);transition:transform .5s ease,opacity .5s ease;width:20px}:is(.button-large,.button-medium,.button-small)[data-variant=outline]:hover:before{opacity:1;transform:translate(-50%,-50%) scale(25)}@media (max-width:500px){:is(.button-large,.button-medium,.button-small)[data-variant=outline],:is(.button-large,.button-medium,.button-small)[data-variant=primary],:is(.button-large,.button-medium,.button-small)[data-variant=secondary],:is(.button-large,.button-medium,.button-small)[data-variant=shine]{width:100%}}