.button,.btn{--button-bg:var(--c-bg);--button-fg:var(--c-fg);--button-border:var(--c-border);--button-radius:var(--r-base);--button-pad-y:var(--sp-1);--button-pad-x:var(--sp-2);align-items:center;gap:var(--space-2);padding:var(--button-pad-y)var(--button-pad-x);border-radius:var(--button-radius);border:var(--border-width)solid var(--button-border);background:var(--button-bg);color:var(--button-fg);cursor:pointer;transition:var(--t-fast);transition-property:var(--t-props-ui);display:inline-flex}.button:hover,.btn:hover{background:var(--button-hover-bg,var(--c-bg-2));border-color:var(--button-hover-border,currentColor)}.button svg,.btn svg{width:var(--space-4);height:var(--space-4);fill:currentColor;flex-shrink:0}.button:disabled,.btn:disabled,.btnDisabled{opacity:.6;cursor:not-allowed;pointer-events:none}.button--state-loading{cursor:wait}.button--state-success{--button-bg:var(--c-success);--button-fg:var(--c-bg);--button-border:var(--c-success);--button-hover-bg:var(--c-success);--button-hover-border:var(--c-success)}.button--state-failed{--button-bg:var(--c-error);--button-fg:var(--c-bg);--button-border:var(--c-error);--button-hover-bg:var(--c-error);--button-hover-border:var(--c-error)}.button__status{align-items:center;gap:var(--space-2);display:inline-flex}.button--primary,.btnPrimary{--button-bg:var(--c-bg-2);--button-fg:var(--c-fg);--button-border:var(--c-border)}.button--primary:hover,.btnPrimary:hover{--button-bg:var(--c-bg)}.button--primary:active,.btnPrimary:active{transform:translateY(var(--space-0-25))}.button--ghost,.btnGhost{--button-bg:transparent;--button-border:var(--c-border)}.button--ghost:hover,.btnGhost:hover{--button-bg:var(--c-bg-2);--button-border:currentColor}.button--outline{--button-bg:transparent;--button-border:var(--c-border)}.button--outline:hover{--button-bg:var(--c-bg-2);--button-border:currentColor}.button--icon{--button-pad-y:var(--space-1);--button-pad-x:var(--space-1);border-radius:var(--r-pill)}.button--compact{--button-pad-y:var(--space-1);--button-pad-x:var(--space-2)}.button--secondary{--button-bg:var(--c-bg-2);--button-border:var(--c-border);--button-fg:var(--c-fg)}.button--secondary:hover{--button-bg:var(--c-bg)}.button--danger,.btnError{--button-bg:var(--c-error);--button-fg:var(--c-bg);--button-border:var(--c-error)}.button--danger:hover,.btnError:hover{--button-bg:var(--c-bg);--button-fg:var(--c-error);--button-border:var(--c-error)}.btnSuccess{--button-bg:var(--c-success);--button-fg:var(--c-bg);--button-border:var(--c-success)}.btnSuccess:hover{--button-bg:var(--c-bg);--button-fg:var(--c-success);--button-border:var(--c-success)}.btnWarning{--button-bg:var(--c-warning);--button-fg:var(--c-bg);--button-border:var(--c-warning)}.btnWarning:hover{--button-bg:var(--c-bg);--button-fg:var(--c-warning);--button-border:var(--c-warning)}