How can I properly control the numbers and dots that appear in pagination?

'mid_size' => 2, controls how many numbers are shown each side of the current page. Currently you have it set to 2, which means you’ll get 5 numbers (current and 2 each side).. except on the first and last page where you get 2 on one side but there are no numbers to show on the other side.

You can dynamically set the mid_size based on which page you are currently on:

global $wp_query;

$mid_size = 1; // default to 1 number each side

// Check if we are on the first or last page
$current_page = get_query_var('paged');
if ( !$current_page || $current_page == $wp_query->max_num_pages ) {
    $mid_size = 2; // 2 numbers before/after the current page
}

$args = wp_parse_args( $args, [
    'mid_size' => $mid_size,
    //... rest of code

All you do is check the paged query var, if it isn’t set you’re on the first page, if it equals the total number of pages you’re on the last page.

If you’re on page 3 or 2 pages from the last page you will have 1 number on one side and 2 on the other since the first and last page isn’t included in the ‘mid_size’, but I’m not sure there is a way to easily prevent that as you can’t control the start and end numbers independently.

I also just noticed that your previous/next posts links are the wrong way round (check your live example). They work opposite to how you would expect. If you read the docs, they say:

Because post queries are usually sorted in reverse chronological order, next_posts_link() usually points to older entries (toward the end of the set) and previous_posts_link() usually points to newer entries (toward the beginning of the set).