<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Key Generator</title>
    <style>
        body {
            margin: 0;
            background-color: black;
            color: maroon;
            font-family: 'Courier New', Courier, monospace;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            height: 100vh;
            overflow: hidden;
        }

        .button {
            background: linear-gradient(45deg, maroon, black);
            border: 2px solid maroon;
            color: white;
            padding: 15px 30px;
            font-size: 24px;
            font-weight: bold;
            border-radius: 10px;
            cursor: pointer;
            text-shadow: 0 0 10px maroon;
            box-shadow: 0 0 15px maroon, 0 0 30px maroon;
            transition: transform 0.2s ease, box-shadow 0.2s ease;
            animation: pulse 2s infinite;
        }

        .button:hover {
            transform: scale(1.1);
            box-shadow: 0 0 20px maroon, 0 0 40px maroon;
        }

        @keyframes pulse {
            0% {
                box-shadow: 0 0 15px maroon, 0 0 30px maroon;
            }
            50% {
                box-shadow: 0 0 25px maroon, 0 0 50px maroon;
            }
            100% {
                box-shadow: 0 0 15px maroon, 0 0 30px maroon;
            }
        }

        .loading-bar-container {
            width: 80%;
            background: black;
            border: 2px solid maroon;
            border-radius: 10px;
            overflow: hidden;
            margin-top: 20px;
            box-shadow: 0 0 10px maroon;
        }

        .loading-bar {
            width: 0;
            height: 15px;
            background: linear-gradient(90deg, maroon, black);
            box-shadow: 0 0 10px maroon;
            transition: width 0.1s ease;
        }

        .key-display {
            font-size: 28px;
            font-weight: bold;
            margin-top: 20px;
            padding: 10px;
            color: white;
            text-shadow: 0 0 15px maroon;
            background: linear-gradient(45deg, black, maroon);
            border: 2px solid maroon;
            border-radius: 10px;
            box-shadow: 0 0 10px maroon;
        }
    </style>
    <script>
        document.addEventListener('keydown', function(event) {
            if (event.key === 'F12' || (event.ctrlKey && event.shiftKey && event.key === 'I')) {
                event.preventDefault();
                alert('Inspecting is disabled!');
            }
        });

        document.addEventListener('contextmenu', function(event) {
            event.preventDefault();
            alert('Right-click is disabled!');
        });
    </script>
</head>
<body>
    <button class="button" onclick="generateKey()">Generate Key</button>
    <div class="loading-bar-container">
        <div class="loading-bar" id="loadingBar"></div>
    </div>
    <div class="key-display" id="keyDisplay"></div>

    <script>
        function generateKey() {
            const loadingBar = document.getElementById('loadingBar');
            const keyDisplay = document.getElementById('keyDisplay');
            loadingBar.style.width = '0';
            keyDisplay.textContent = '';

            let progress = 0;
            const interval = setInterval(() => {
                progress += 1;
                loadingBar.style.width = progress + '%';

                if (progress >= 100) {
                    clearInterval(interval);
                    const key = generateCustomKey();
                    keyDisplay.textContent = key;
                }
            }, 100);
        }

        function generateCustomKey() {
            const length = 10;
            let key = '';
            const characters = 'A12BCD*E234FG;@#$%^234H24I2324[][]JK43224L234M234NO24PQR43STUVW234XYZ';

            for (let i = 0; i < length; i++) {
                if (i === 3) {
                    key += '5';
                } else {
                    key += characters.charAt(Math.floor(Math.random() * characters.length));
                }
            }

            return key;
        }
    </script>
</body>
</html>
