Custom FPS Camera HELP!

This is my code:

local RunService = game:GetService("RunService")
local UserInputService = game:GetService("UserInputService")
local Gui = game:GetService("GuiService")

local player = game:GetService("Players").LocalPlayer

local camera = workspace.CurrentCamera
local mouse = player:GetMouse()

local character = player.Character or player.CharacterAdded:Wait()

camera.CameraType = Enum.CameraType.Scriptable
camera.CFrame = workspace:WaitForChild("CameraLocation").CFrame

--[VARIABLES]
local CameraDirection = Vector2.zero

RunService.PreRender:Connect(function(deltaTimeRender: number) 
	UserInputService.MouseBehavior = Enum.MouseBehavior.LockCenter
	local delta = UserInputService:GetMouseDelta()
	print(delta)
	camera.CFrame = camera.CFrame * CFrame.Angles(math.rad(-delta.Y),math.rad(-delta.X),0)
end)

The problem is when I rotate the with the mouse, it also moves the Z rotation, which angles the camera weirdly.

Is there anyway to rotate the Camera without rotating the Z axis?

Normally its done something like this

Personally I wound have done something like this:

camera.CFrame = CFrame.lookAlong(camera.CFrame.Position,camera.CFrame.LookVector+camera.CFrame.RightVector*-delta.X+camera.CFrame.UpVector*delta.Y,Vector3.yAxis)

That would work or do what you already have but add this after:

camera.CFrame = CFrame.lookAlong(camera.CFrame.Position,camera.CFrame.LookVector,Vector3.yAxis)

EDIT: 327 Lines across 5 scripts later along with: 1 ScreenGui, 6 Frames, 1 UIAspectRatioConstraint, 4 UICorners, 3 TextButtons, 1 UnreliableRemoteEvent, 1 RemoteEvent and 1 BinadableEvent, we get:
robloxapp-20241003-0116548.wmv (7.8 MB)