local UserInputService = game:GetService("UserInputService")
local Players = game:GetService("Players")

local player = Players.LocalPlayer
local playerGui = player:WaitForChild("PlayerGui")

-- 1. Create ScreenGui
local screenGui = Instance.new("ScreenGui")
screenGui.Name = "KeyOverlayGui"
screenGui.ResetOnSpawn = false
screenGui.Parent = playerGui

-- 2. Create Container Frame (Compact & Small)
local container = Instance.new("Frame")
container.Name = "KeyContainer"
container.Size = UDim2.new(0, 150, 0, 100)
container.Position = UDim2.new(0.02, 0, 0.75, 0) -- Bottom-left corner
container.BackgroundTransparency = 1
container.Parent = screenGui

-- Styling Constants
local DEFAULT_COLOR = Color3.fromRGB(230, 230, 230)
local PRESSED_COLOR = Color3.fromRGB(100, 180, 255)
local TEXT_DEFAULT = Color3.fromRGB(80, 140, 220)
local TEXT_PRESSED = Color3.fromRGB(255, 255, 255)

-- Helper function to create styled key buttons
local function createKeyButton(name, text, position, size)
	local frame = Instance.new("Frame")
	frame.Name = name
	frame.Size = size
	frame.Position = position
	frame.BackgroundColor3 = DEFAULT_COLOR
	frame.BackgroundTransparency = 0.2
	frame.BorderSizePixel = 0
	frame.Parent = container

	local uiCorner = Instance.new("UICorner")
	uiCorner.CornerRadius = UDim.new(0, 8)
	uiCorner.Parent = frame

	local label = Instance.new("TextLabel")
	label.Name = "Label"
	label.Size = UDim2.new(1, 0, 1, 0)
	label.BackgroundTransparency = 1
	label.Text = text
	label.TextColor3 = TEXT_DEFAULT
	label.TextSize = 22
	label.Font = Enum.Font.FredokaOne
	label.Parent = frame

	return frame
end

-- 3. Create Key Frames (W, A, S, D Layout)
local keys = {
	W = createKeyButton("W", "W", UDim2.new(0, 52, 0, 0), UDim2.new(0, 45, 0, 45)),
	A = createKeyButton("A", "A", UDim2.new(0, 3, 0, 50), UDim2.new(0, 45, 0, 45)),
	S = createKeyButton("S", "S", UDim2.new(0, 52, 0, 50), UDim2.new(0, 45, 0, 45)),
	D = createKeyButton("D", "D", UDim2.new(0, 101, 0, 50), UDim2.new(0, 45, 0, 45)),
}

-- Mapping KeyCodes to GUI Frames
local keyMapping = {
	[Enum.KeyCode.W] = keys.W,
	[Enum.KeyCode.A] = keys.A,
	[Enum.KeyCode.S] = keys.S,
	[Enum.KeyCode.D] = keys.D,
}

-- 4. Listen for Key Presses
UserInputService.InputBegan:Connect(function(input, gameProcessed)
	if gameProcessed then return end
	
	local keyFrame = keyMapping[input.KeyCode]
	if keyFrame then
		keyFrame.BackgroundColor3 = PRESSED_COLOR
		keyFrame.Label.TextColor3 = TEXT_PRESSED
	end
end)

UserInputService.InputEnded:Connect(function(input, gameProcessed)
	local keyFrame = keyMapping[input.KeyCode]
	if keyFrame then
		keyFrame.BackgroundColor3 = DEFAULT_COLOR
		keyFrame.Label.TextColor3 = TEXT_DEFAULT
	end
end)