How does one control the nesting of parameters within a form in phoenix?

I am working on changing the UI of the reset password form generated by phx_gen_auth. The current state of said form is as follows:

<div class="flex min-h-full flex-col justify-center py-12 sm:px-6 lg:px-8">
  <div class="sm:mx-auto sm:w-full sm:max-w-md">
    <h2 class="mt-6 text-center text-3xl font-bold tracking-tight text-gray-900">Reset password</h2>
  </div>

  <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
    <div class="bg-white py-8 px-4 shadow sm:rounded-lg sm:px-10">
      <.form let={f} for={@changeset} action={Routes.account_reset_password_path(@conn, :update, @token)} class="space-y-6">
        <%= if @changeset.action do %>
          <div class="alert alert-danger">
            <p>Oops, something went wrong! Please check the errors below.</p>
          </div>
        <% end %>

        <div>
          <%= label f, :password, "New password", class: "block text-sm font-medium text-gray-700" %>
          <div class="mt-1">
            <%= password_input f, :password, required: true, id: "password", name: "password", type: "password", autocomplete: "current-password", class: "block w-full appearance-none rounded-md border border-gray-300 px-3 py-2 placeholder-gray-400 shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-indigo-500 sm:text-sm" %>
          </div>
          <%= error_tag f, :password %>
        </div>

        <div>
          <%= label f, :password_confirmation, "Confirm new password", class: "block text-sm font-medium text-gray-700" %>
          <div class="mt-1">
            <%= password_input f, :password_confirmation, required: true, type: "password", autocomplete: "current-password", class: "block w-full appearance-none rounded-md border border-gray-300 px-3 py-2 placeholder-gray-400 shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-indigo-500 sm:text-sm" %>
          </div>
          <%= error_tag f, :password_confirmation %>
        </div>
      
        <%= submit "Reset password", class: "flex w-full justify-center rounded-md border border-transparent bg-indigo-600 py-2 px-4 text-sm font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" %>

        <div class="flex items-center justify-between">
          <div class="text-sm">
            <%= link "Register account", to: Routes.account_registration_path(@conn, :new), class: "font-medium text-indigo-600 hover:text-indigo-500" %>
          </div>

          <div class="text-sm">
            <%= link "Sign in to existing account", to: Routes.account_session_path(@conn, :new), class: "font-medium text-indigo-600 hover:text-indigo-500" %>
          </div>
        </div>
      </.form>
    </div>
  </div>
</div>

When the params hit the controller, the shape is as follows:

%{      
  "_csrf_token" => "LwoWc1UTKTp5GEJfaBAbVRERBjI2AQV7IzrB2IHxNWzi8hJbdUCznrNM",
  "_method" => "put",
  "account" => %{"password_confirmation" => "password"},
  "password" => "password1234",
  "token" => "hEo-B4dUBnuThrqBTntws_hFBmqSVMA_JDFJcMh_2sk"
}

My question is, why is only the “password_confirmation” input nested under the key “account”? Am I able to control / change this?