How could I properly position these letters?

Hi, I've been trying to re-make Roblox's old axis system and everything works, but the letters are tilted weirdly. I've been trying to fix this for ten minutes and failed.

Video Here: https://player.vimeo.com/video/358945865

Here's what my StarterGui looks like: https://i.imgur.com/q2ikbEI.png

Code Here:

function setPos(p,cf)
    p.Position = cf
end
function setCF(p,cf)
    p.CFrame = cf
end

local gui = script.Parent.XYZ_Loc
local viewport = gui.Viewport
viewport.CurrentCamera = workspace.CurrentCamera

local x = CFrame.new(-2.02571487, -1.48418903, -2.94356537)
local y = CFrame.new(-1.62891006, 3.23608112, 1.49020386)
local z = CFrame.new(2.91730118, -1.53606987, 1.92480469)

local o = viewport.Object

game:GetService("RunService").RenderStepped:Connect(function()
    setPos(o,(workspace.CurrentCamera.CFrame*(CFrame.new(0,0,-8)*CFrame.new(workspace.CurrentCamera.CFrame.LookVector.X,0,0))).Position)
    setCF(viewport.X,CFrame.new((o.CFrame*x).Position,Vector3.new(workspace.CurrentCamera.CFrame.LookVector.X,0,0)))
    setCF(viewport.Y,CFrame.new((o.CFrame*y).Position,Vector3.new(workspace.CurrentCamera.CFrame.LookVector.X,0,0)))
    setCF(viewport.Z,CFrame.new((o.CFrame*z).Position,Vector3.new(workspace.CurrentCamera.CFrame.LookVector.X,0,0)))
end)