.alp-button{
  --btn-bg:var(--accent-interactive);
  --btn-color:var(--color-black-950);
  font-family:var(--font-body); font-weight:600; font-size:15px;
  padding:12px 22px; border-radius:8px; border:1px solid transparent;
  cursor:pointer; display:inline-flex; align-items:center; gap:8px;
  background:var(--btn-bg); color:var(--btn-color);
  transition:transform var(--duration-fast) var(--ease-signature),
             box-shadow var(--duration-fast) ease-out,
             background var(--duration-fast) ease-out;
}
.alp-button:active{ transform:scale(0.98); }
.alp-button:hover{ background:var(--accent-interactive-hover); box-shadow:var(--elevation-2); }

.alp-button--secondary{ --btn-bg:transparent; --btn-color:var(--text-primary); border-color:var(--border-strong); }
.alp-button--secondary:hover{ background:transparent; border-color:var(--accent-interactive); color:var(--accent-interactive); box-shadow:none; }

.alp-button--ghost{ --btn-bg:transparent; --btn-color:var(--text-secondary); }
.alp-button--ghost:hover{ background:transparent; color:var(--text-primary); box-shadow:none; }

.alp-button[disabled]{ opacity:0.4; cursor:not-allowed; pointer-events:none; }

.alp-button--loading{ position:relative; color:transparent !important; pointer-events:none; }
.alp-button--loading::after{
  content:''; position:absolute; width:16px; height:16px; border-radius:50%;
  border:2px solid rgba(0,0,0,0.3); border-top-color:currentColor;
  animation:alp-spin 0.7s linear infinite;
}
@keyframes alp-spin{ to{ transform:rotate(360deg); } }