HitmanZ's Dark Mode Toggle

Toggle dark mode with F key... has some bugs like the Killed/kill text is still black lol

// ==UserScript==
// @name         HitmanZ's Dark Mode Toggle
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Toggle dark mode with F key... has some bugs like the Killed/kill text is still black lol
// @author       HitmanZ
// @license      MIT
// @match        *://gats.io/*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    let darkMode = localStorage.getItem('gatsDarkMode') === 'true';

    document.addEventListener('keydown', (e) => {
        if (e.key.toLowerCase() === 'f') {
            darkMode = !darkMode;
            localStorage.setItem('gatsDarkMode', darkMode);
            applyMenuStyle();
            applyFloatingTextStyle();
            showStatus(darkMode ? 'Dark Mode ON' : 'Dark Mode OFF');
        }
    });

    function showStatus(text) {
        const div = document.createElement('div');
        div.textContent = text;
        div.style.position = 'absolute';
        div.style.top = '80px';
        div.style.left = '50%';
        div.style.transform = 'translateX(-50%)';
        div.style.background = 'rgba(0,0,0,0.7)';
        div.style.color = 'white';
        div.style.padding = '10px';
        div.style.zIndex = 9999;
        div.style.fontSize = '20px';
        document.body.appendChild(div);
        setTimeout(() => div.remove(), 1500);
    }

    function applyMenuStyle() {
        const menu = document.querySelector('#menu');
        if (menu) {
            menu.style.color = darkMode ? 'white' : '';
        }
    }

    function applyFloatingTextStyle() {
        const allFloating = document.querySelectorAll('[style*="font-size"]');
        allFloating.forEach(el => {
            const isFloating = el.textContent.includes('+') || el.textContent.includes('killed') || el.textContent.includes('XP');
            if (isFloating) {
                el.style.color = darkMode ? 'white' : '';
                el.style.textShadow = darkMode ? '0 0 2px black' : '';
            }
        });
    }

    const overrideCanvas = () => {
        const canvas = document.querySelector('canvas');
        if (!canvas) return;

        const ctx = canvas.getContext('2d');
        const originalFillRect = ctx.fillRect.bind(ctx);

        ctx.fillRect = function (x, y, w, h) {
            if (darkMode && x === 0 && y === 0) {
                ctx.fillStyle = '#3b373d';
            }
            originalFillRect(x, y, w, h);
        };

        const originalStrokeStyle = Object.getOwnPropertyDescriptor(CanvasRenderingContext2D.prototype, 'strokeStyle');
        Object.defineProperty(ctx, 'strokeStyle', {
            set(value) {
                if (darkMode && typeof value === 'string' && value.includes('#')) {
                    value = '#5e5661'; // Slightly lighter grid lines
                }
                originalStrokeStyle.set.call(this, value);
            },
            get() {
                return originalStrokeStyle.get.call(this);
            }
        });

        const originalStroke = ctx.stroke.bind(ctx);
        ctx.stroke = function () {
            if (darkMode && ctx.lineWidth === 2) {
                ctx.strokeStyle = 'white'; // Bullet trace color
            }
            originalStroke();
        };
    };

    const loop = () => {
        overrideCanvas();
        applyMenuStyle();
        applyFloatingTextStyle();
        requestAnimationFrame(loop);
    };

    loop();
})();