.button{justify-content:center;align-items:center;gap:var(--spacing-sm);font-family:var(--font-family);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast);white-space:nowrap;-webkit-user-select:none;user-select:none;border:1px solid #0000;outline:none;line-height:1;display:inline-flex;position:relative}.button:focus-visible{outline:.125rem solid color-mix(in srgb, var(--button-ring,var(--color-primary)) 55%, transparent);outline-offset:.125rem}.button.button--sm{height:2rem;padding:0 var(--spacing-md);font-size:var(--font-size-sm);border-radius:var(--radius-sm)}.button.button--sm .button__icon{width:1rem;height:1rem}.button.button--md{height:2.5rem;padding:0 var(--spacing-lg);font-size:var(--font-size-base);border-radius:var(--radius-md)}.button.button--md .button__icon{width:1.25rem;height:1.25rem}.button.button--lg{height:3rem;padding:0 var(--spacing-xl);font-size:var(--font-size-lg);border-radius:var(--radius-md)}.button.button--lg .button__icon{width:1.5rem;height:1.5rem}.button.button--primary{background:var(--color-primary);color:var(--color-primary-foreground);border-color:color-mix(in srgb, var(--color-primary) 86%, var(--color-shade));box-shadow:var(--shadow-button-highlight), 0 1px .125rem color-mix(in srgb, var(--color-primary) 35%, transparent)}.button.button--primary:hover:not(.button--disabled):not(.button--loading){background:var(--color-primary-hover);border-color:color-mix(in srgb, var(--color-primary-hover) 84%, var(--color-shade));box-shadow:var(--shadow-button-highlight), 0 .125rem .5rem color-mix(in srgb, var(--color-primary) 38%, transparent)}.button.button--primary:active:not(.button--disabled):not(.button--loading){background:color-mix(in srgb, var(--color-primary-hover) 86%, var(--color-shade));box-shadow:var(--shadow-button-pressed)}.button.button--pro{--button-pro:color-mix(in oklch, var(--color-plan-pro) 84%, var(--color-shade));--button-pro-hover:color-mix(in oklch, var(--color-plan-pro) 76%, var(--color-shade))}[data-theme=dark] .button.button--pro{--button-pro:color-mix(in oklch, var(--color-plan-pro) 72%, var(--color-shade));--button-pro-hover:color-mix(in oklch, var(--color-plan-pro) 64%, var(--color-shade))}.button.button--pro{background:var(--button-pro);color:var(--color-primary-foreground);border-color:color-mix(in srgb, var(--button-pro) 86%, var(--color-shade));box-shadow:var(--shadow-button-highlight), 0 1px .125rem color-mix(in srgb, var(--button-pro) 35%, transparent)}.button.button--pro:hover:not(.button--disabled):not(.button--loading){background:var(--button-pro-hover);border-color:color-mix(in srgb, var(--button-pro-hover) 84%, var(--color-shade));box-shadow:var(--shadow-button-highlight), 0 .125rem .5rem color-mix(in srgb, var(--button-pro) 38%, transparent)}.button.button--pro:active:not(.button--disabled):not(.button--loading){background:color-mix(in srgb, var(--button-pro-hover) 86%, var(--color-shade));box-shadow:var(--shadow-button-pressed)}.button.button--secondary{--button-ring:var(--color-foreground-secondary);background:var(--color-surface-overlay);color:var(--color-foreground);border-color:var(--color-border);box-shadow:var(--shadow-button-secondary)}.button.button--secondary:hover:not(.button--disabled):not(.button--loading){background:var(--color-button-secondary-hover);border-color:var(--color-border-hover);box-shadow:var(--shadow-button-secondary-hover)}.button.button--secondary:active:not(.button--disabled):not(.button--loading){background:var(--color-button-secondary-active);border-color:var(--color-border-hover);box-shadow:var(--shadow-button-pressed)}.button.button--ghost{--button-ring:var(--color-foreground-secondary);--button-ghost-tone-hover:color-mix(in srgb, var(--surface-tone) 12%, transparent);--button-ghost-tone-active:color-mix(in srgb, var(--surface-tone) 20%, transparent);color:var(--button-ghost-color,var(--color-foreground));background:0 0;border-color:#0000}.button.button--ghost:hover:not(.button--disabled):not(.button--loading){background:var(--button-ghost-tone-hover,var(--button-ghost-hover,var(--color-ghost-hover)))}.button.button--ghost:active:not(.button--disabled):not(.button--loading){background:var(--button-ghost-tone-active,var(--button-ghost-active,var(--color-ghost-active)))}.button.button--ghost-danger{--button-ring:var(--color-danger);color:var(--color-danger-text);background:0 0;border-color:#0000}.button.button--ghost-danger:hover:not(.button--disabled):not(.button--loading){background:color-mix(in srgb, var(--color-danger) 12%, transparent)}.button.button--ghost-danger:active:not(.button--disabled):not(.button--loading){background:color-mix(in srgb, var(--color-danger) 20%, transparent)}.button.button--danger{--button-ring:var(--color-danger);background:var(--color-button-danger);color:var(--color-primary-foreground);border-color:color-mix(in srgb, var(--color-button-danger) 86%, var(--color-shade));box-shadow:var(--shadow-button-highlight), 0 1px .125rem color-mix(in srgb, var(--color-button-danger) 35%, transparent)}.button.button--danger:hover:not(.button--disabled):not(.button--loading){background:var(--color-button-danger-hover);border-color:color-mix(in srgb, var(--color-button-danger-hover) 84%, var(--color-shade));box-shadow:var(--shadow-button-highlight), 0 .125rem .5rem color-mix(in srgb, var(--color-button-danger) 38%, transparent)}.button.button--danger:active:not(.button--disabled):not(.button--loading){background:color-mix(in srgb, var(--color-button-danger-hover) 86%, var(--color-shade));box-shadow:var(--shadow-button-pressed)}.button.button--danger-soft{--button-ring:var(--color-danger);background:var(--color-danger-muted);color:var(--color-danger-text);border-color:#0000}.button.button--danger-soft:hover:not(.button--disabled):not(.button--loading){background:color-mix(in srgb, var(--color-danger) 18%, transparent)}.button.button--danger-soft:active:not(.button--disabled):not(.button--loading){background:color-mix(in srgb, var(--color-danger) 26%, transparent)}.button.button--link{--button-ring:var(--color-primary-text);height:auto;color:var(--color-primary-text);border-radius:var(--radius-xs);white-space:normal;background:0 0;border-color:#0000;padding:0;text-decoration:none}.button.button--link:hover:not(.button--disabled):not(.button--loading){color:var(--color-primary-text-hover);text-underline-offset:.2em;text-decoration:underline}.button.button--disabled,.button.button--loading{opacity:.5;cursor:default}.button.button--full-width{width:100%}.button.button--truncate{min-width:0}.button.button--truncate .button__content{text-overflow:ellipsis;flex-shrink:1;min-width:0;overflow:hidden}.button.button--wrap{min-width:0;height:auto;line-height:var(--line-height-tight);white-space:normal;text-align:center}.button.button--wrap.button--sm{min-height:2rem;padding-block:var(--spacing-2xs)}.button.button--wrap.button--md{min-height:2.5rem;padding-block:var(--spacing-xs)}.button.button--wrap.button--lg{min-height:3rem;padding-block:var(--spacing-sm)}.button.button--wrap .button__content{text-align:center;flex-shrink:1;min-width:0}.button .button__icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.button.button--loading .button__icon,.button.button--loading .button__content{visibility:hidden}.button .button__spinner-wrapper{justify-content:center;align-items:center;display:inline-flex;position:absolute;inset:0}.button .button__content{display:var(--button-content-display,inline-flex);gap:var(--spacing-sm);min-width:var(--button-content-min-width,auto);flex-shrink:0;align-items:center}:is(.button .button__content) svg{flex-shrink:0}.button .button__label{position:relative}@media (pointer:coarse){.button:after{content:"";position:absolute;inset:min(0px,50% - 1.25rem)}}