Blame for index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CyberDoor Access</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script src="https://cdn.jsdelivr.net/npm/qrcode-generator@1.4.4/qrcode.min.js"></script>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=Rajdhani:wght@300;500;700&display=swap');
        
        body {
            font-family: 'Rajdhani', sans-serif;
            background-color: #0a0a1a;
            color: #00fffc;
            overflow: hidden;
        }
        
        .cyber-font {
            font-family: 'Orbitron', sans-serif;
        }
        
        .cyber-border {
            border: 2px solid #00fffc;
            box-shadow: 0 0 15px #00fffc, inset 0 0 15px #00fffc;
        }
        
        .cyber-glow {
            text-shadow: 0 0 10px #00fffc, 0 0 20px #00fffc;
        }
        
        .cyber-bg {
            background: rgba(0, 10, 20, 0.85);
        }
        
        .scanline {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(
                to bottom,
                transparent 0%,
                rgba(0, 255, 252, 0.1) 50%,
                transparent 100%
            );
            background-size: 100% 8px;
            pointer-events: none;
            animation: scan 8s linear infinite;
        }
        
        @keyframes scan {
            0% { transform: translateY(-100%); }
            100% { transform: translateY(100%); }
        }
        
        .grid-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: 
                linear-gradient(rgba(0, 255, 252, 0.05) 1px, transparent 1px),
                linear-gradient(90deg, rgba(0, 255, 252, 0.05) 1px, transparent 1px);
            background-size: 20px 20px;
            pointer-events: none;
        }
        
        .pulse {
            animation: pulse 2s infinite;
        }
        
        @keyframes pulse {
            0% { box-shadow: 0 0 0 0 rgba(0, 255, 252, 0.7); }
            70% { box-shadow: 0 0 0 10px rgba(0, 255, 252, 0); }
            100% { box-shadow: 0 0 0 0 rgba(0, 255, 252, 0); }
        }
        
        .flicker {
            animation: flicker 0.5s infinite alternate;
        }
        
        @keyframes flicker {
            0% { opacity: 0.9; }
            100% { opacity: 1; }
        }
    </style>
</head>
<body class="min-h-screen flex flex-col items-center justify-center relative overflow-hidden">
    <div class="grid-overlay"></div>
    <div class="scanline"></div>
    
    <div class="cyber-bg cyber-border rounded-lg p-8 max-w-md w-full relative z-10">
        <div class="flex justify-between items-center mb-6">
            <h1 class="cyber-font cyber-glow text-3xl font-bold">CYBERDOOR</h1>
            <div class="flex items-center">
                <div class="w-3 h-3 bg-red-500 rounded-full mr-2 pulse"></div>
                <span class="text-xs">LIVE</span>
            </div>
        </div>
        
        <div class="text-center mb-6">
            <p class="text-sm mb-1">TEMPORARY ACCESS CODE</p>
            <p class="cyber-font text-xs mb-4">VALID FOR <span id="countdown">60</span> SECONDS</p>
        </div>
        
        <div class="flex justify-center mb-6">
            <div id="qrcode" class="p-4 bg-white rounded cyber-border flicker"></div>
        </div>
        
        <div class="text-center">
            <p class="text-xs mb-2">SCAN TO ENTER SECURE ZONE</p>
            <div class="flex justify-center">
                <div class="w-16 h-1 bg-cyan-400"></div>
            </div>
        </div>
        
        <div class="mt-6 flex justify-between items-center text-xs">
            <div>
                <i class="fas fa-shield-alt mr-1"></i>
                <span>SECURITY LEVEL: MAX</span>
            </div>
            <div>
                <i class="fas fa-user-clock mr-1"></i>
                <span id="current-time">--:--:--</span>
            </div>
        </div>
    </div>
    
    <div class="absolute bottom-4 left-0 right-0 text-center text-xs opacity-70">
        <p>NEUROCORP SECURITY SYSTEMS v4.2.7</p>
    </div>
    
    <script>
        // Generate random token for QR code
        function generateToken() {
            const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
            let token = '';
            for (let i = 0; i < 16; i++) {
                token += chars.charAt(Math.floor(Math.random() * chars.length));
            }
            return 'CYBERDOOR-' + token;
        }
        
        // Generate QR code
        function generateQRCode() {
            const token = generateToken();
            const typeNumber = 4;
            const errorCorrectionLevel = 'M';
            const qr = qrcode(typeNumber, errorCorrectionLevel);
            qr.addData(token);
            qr.make();
            
            document.getElementById('qrcode').innerHTML = qr.createImgTag(4);
            const img = document.querySelector('#qrcode img');
            img.style.width = '100%';
            img.style.height = '100%';
            
            return token;
        }
        
        // Update countdown timer
        function startCountdown() {
            let seconds = 60;
            const countdownElement = document.getElementById('countdown');
            
            const timer = setInterval(() => {
                seconds--;
                countdownElement.textContent = seconds;
                
                if (seconds <= 0) {
                    clearInterval(timer);
                    generateQRCode();
                    startCountdown();
                }
            }, 1000);
        }
        
        // Update current time
        function updateClock() {
            const now = new Date();
            const timeString = now.toLocaleTimeString();
            document.getElementById('current-time').textContent = timeString;
        }
        
        // Initialize
        document.addEventListener('DOMContentLoaded', () => {
            generateQRCode();
            startCountdown();
            updateClock();
            setInterval(updateClock, 1000);
            
            // Add some random flickering for cyberpunk effect
            setInterval(() => {
                if (Math.random() > 0.9) {
                    document.querySelector('.cyber-border').classList.add('flicker');
                    setTimeout(() => {
                        document.querySelector('.cyber-border').classList.remove('flicker');
                    }, 200);
                }
            }, 3000);
        });
    </script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=jsio/test" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body>
</html>