button, input[type="file"]::file-selector-button, input[type="submit"], a.button-like, span.button-like {
  display: inline-block;
  font-size: inherit;
  margin: var(--spacing-8th) var(--spacing-8th) var(--spacing-8th) 0;
  padding: calc(var(--spacing-half) - var(--border-width));
  border-radius: var(--radius-sm);
  font-weight: 500;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: var(--border-width) solid;
  transition:
    background-color var(--transition-base),
    border-color var(--transition-base),
    color var(--transition-base),
    box-shadow var(--transition-base);
  background-color: hsl(var(--color-surface));
  border-color: hsl(var(--color-border));
  color: var(--color-text);
  &:hover, &:focus {
    background-color: hsl(var(--color-accent));
    color: hsl(var(--color-bg));
  }
  &.danger {
    &:hover, &:focus { background-color: hsl(var(--hue-error) var(--sat-error) calc(var(--light-error) + 10%)); }
  }
  &.primary {
    background-color: hsl(var(--color-accent));
    border-color: hsl(var(--color-accent));
    color: hsl(var(--color-bg));
    &:hover, &:focus { background-color: hsl(var(--color-accent-hover)); }
    &.danger {
      background-color: hsl(var(--color-error));
      border-color: hsl(var(--color-error));
      color: hsl(var(--color-bg));
      &:hover, &:focus { background-color: hsl(var(--hue-error) var(--sat-error) calc(var(--light-error) + 10%)); }
    }
  }
  &.secondary {
    background-color: hsl(var(--color-secondary));
    border-color: hsl(var(--color-secondary));
    color: hsl(var(--color-bg));
    &:hover, &:focus { background-color: hsl(var(--hue-secondary) var(--sat-secondary) calc(var(--light-secondary) + 10%)); }
    &.danger {
      background-color: hsl(var(--color-error-muted));
      border-color: hsl(var(--color-error-muted));
      color: hsl(var(--color-bg));
      &:hover, &:focus { background-color: hsl(var(--hue-error-muted) var(--sat-error-muted) calc(var(--light-error-muted) + 10%)); }
    }
  }
  &:disabled, &.disabled {
    opacity: 0.5;
    cursor: revert;
    pointer-events: none;
  }
}