main.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BI6ZONE</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
            min-height: 100vh;
            background: radial-gradient(ellipse at top, hsl(45, 100%, 15%) 0%, hsl(0, 0%, 5%) 50%, hsl(0, 0%, 0%) 100%);
            position: relative;
            overflow-x: hidden;
        }

        /* Halftone pattern overlays */
        body::before {
            content: '';
            position: absolute;
            inset: 0;
            background-image: radial-gradient(circle, rgba(255,255,255,0.1) 1px, transparent 1px);
            background-size: 20px 20px;
            mask-image: radial-gradient(ellipse at center, black 40%, transparent 70%);
            opacity: 0.3;
            pointer-events: none;
        }

        body::after {
            content: '';
            position: absolute;
            inset: 0;
            background-image: radial-gradient(circle, rgba(255,255,255,0.05) 2px, transparent 2px);
            background-size: 40px 40px;
            mask-image: radial-gradient(ellipse at 70% 30%, black 30%, transparent 60%);
            opacity: 0.2;
            pointer-events: none;
        }

        .container {
            position: relative;
            z-index: 10;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-height: 100vh;
            padding: 1rem;
        }

        .header {
            text-align: center;
            margin-bottom: 2rem;
        }

        .title {
            font-size: 4rem;
            font-weight: 900;
            color: hsl(45, 100%, 70%);
            margin-bottom: 0.5rem;
            letter-spacing: -0.025em;
            text-shadow: 
                0 0 20px hsl(45, 100%, 50%), 
                0 0 40px hsl(45, 100%, 50%), 
                0 0 60px hsl(45, 100%, 50%);
        }

        .cursor {
            animation: pulse 1s infinite;
        }

        @keyframes pulse {
            0%, 50% { opacity: 1; }
            51%, 100% { opacity: 0; }
        }

        .version {
            color: hsl(45, 50%, 50%);
            font-size: 1rem;
            font-weight: 300;
        }

        .button-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1rem;
            margin-bottom: 2rem;
            max-width: 18rem;
        }

        .button {
            width: 4rem;
            height: 4rem;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-decoration: none;
            color: hsl(45, 100%, 70%);
            background: rgba(255, 215, 0, 0.1);
            border: 1px solid rgba(255, 215, 0, 0.3);
            border-radius: 0.75rem;
            backdrop-filter: blur(8px);
            transition: all 0.3s ease;
            font-size: 0.75rem;
            font-weight: 300;
            text-align: center;
            line-height: 1.2;
        }

        .button:hover {
            background: rgba(255, 215, 0, 0.2);
            border-color: rgba(255, 215, 0, 0.5);
            box-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
            transform: translateY(-2px);
        }

        .button-icon {
            width: 18px;
            height: 18px;
            margin-bottom: 0.25rem;
            stroke: currentColor;
            fill: none;
            stroke-width: 2;
        }

        .footer {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1.5rem;
        }

        .link-row {
            display: flex;
            align-items: center;
            gap: 0.75rem;
            flex-wrap: wrap;
            justify-content: center;
        }

        .footer-link {
            color: hsl(45, 100%, 70%);
            text-decoration: underline;
            cursor: pointer;
            font-size: 0.75rem;
            font-weight: 300;
        }
        
        .footer-link:hover {
            color: hsl(45, 100%, 80%);
            text-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
        }

        .credit {
            color: hsl(45, 50%, 50%);
            font-size: 0.75rem;
            margin-top: 2rem;
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        @media (min-width: 768px) {
            .title {
                font-size: 5rem;
            }
        }
    </style>
</head>
<body>
    <div class="container">
        <!-- Header -->
        <div class="header">
            <h1 class="title">
                <span id="typewriter"></span><span class="cursor">|</span>
            </h1>
            <p class="version">version 10 / release build</p>
        </div>

        <!-- Main buttons grid -->
        <div class="button-grid">
            <a href="g.html" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><rect width="14" height="20" x="5" y="2" rx="2" ry="2"/><path d="M12 18h.01"/></svg>
                games
            </a>
            <a href="a.html" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><rect width="7" height="7" x="3" y="3" rx="1"/><rect width="7" height="7" x="14" y="3" rx="1"/><rect width="7" height="7" x="14" y="14" rx="1"/><rect width="7" height="7" x="3" y="14" rx="1"/></svg>
                apps
            </a>
            <a href="https://bi6streamz.vercel.app" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><path d="m9 12 2 2 4-4"/><path d="M21 12c.552 0 1-.448 1-1V5c0-.552-.448-1-1-1H3c-.552 0-1 .448-1 1v6c0 .552.448 1 1 1"/><path d="M3 12v6c0 .552.448 1 1 1h16c.552 0 1-.448 1-1v-6"/></svg>
                movies
            </a>
            <a href="https://bi6music.netlify.app" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><polygon points="12,2 22,8.5 22,15.5 12,22 2,15.5 2,8.5"/><line x1="12" y1="22" x2="12" y2="15.5"/><polyline points="22,8.5 12,15.5 2,8.5"/></svg>
                music
            </a>
            <a href="disremake.html" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
                chat
            </a>
            <a href="hwbot.html" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><rect width="16" height="20" x="4" y="2" rx="2" ry="2"/><path d="M9 22v-4h6v4"/><path d="M8 6h.01"/><path d="M16 6h.01"/><path d="M12 6h.01"/><path d="M12 10h.01"/><path d="M12 14h.01"/><path d="M16 10h.01"/><path d="M16 14h.01"/><path d="M8 10h.01"/><path d="M8 14h.01"/></svg>
                hwbot
            </a>
            <a href="https://bi6web.vercel.app" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M12 1v6m0 6v6"/><path d="m21 12-6 0m-6 0-6 0"/><path d="m16.24 7.76-4.24 4.24m0 0L7.76 16.24m8.48 0L12 12"/></svg>
                proxy
            </a>
            <a href="admin.html" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="m22 9-3-3 3-3"/></svg>
                admin
            </a>
            <a href="s.html" class="button">
                <svg class="button-icon" viewBox="0 0 24 24"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg>
                settings
            </a>
        </div>

        <!-- Footer navigation -->
        <div class="footer">
            <!-- Top row links -->
            <div class="link-row">
                <a href="ul.html" class="footer-link">update log</a>
                <span class="separator">•</span>
                <a href="/faq/index.html" class="footer-link">FAQ</a>
                <span class="separator">•</span>
                <a id="openBlankLink" class="footer-link">open blank</a>
            </div>

            <!-- Bottom row links -->
            <div class="link-row">
                <a href="https://github.com/bi66ie619/" target="_blank" class="footer-link">github</a>
                <span class="separator">•</span>
                <a href="https://docs.google.com/forms/d/1t52FBl9fUIm6ftWzFQTSw4dutoIOP1rTe8AnQ4cg1pY/viewform?edit_requested=true" target="_blank" class="footer-link">support</a>
            </div>

            <!-- Creator credit -->
            <div class="credit">
                <span>✦</span>
                <span>ubg site created by Jericho</span>
                <span>✦</span>
            </div>
        </div>
    </div>

    <script>
        // Typewriter effect
        const typewriter = document.getElementById('typewriter');
        const text = 'BI6ZONE';
        let i = 0;

        function typeEffect() {
            if (i < text.length) {
                typewriter.textContent += text.charAt(i);
                i++;
                setTimeout(typeEffect, 150);
            }
        }

        // Start typewriter effect when page loads
        window.addEventListener('load', typeEffect);
    </script>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            var openBlankLink = document.getElementById('openBlankLink');
        
            openBlankLink.addEventListener('click', function(event) {
                event.preventDefault();
        
                var newTab = window.open('about:blank', '_blank');
        
                if (newTab) {
                    var newTabBody = newTab.document.body;
                    newTabBody.style.padding = '0';
                    newTabBody.style.margin = '0';
                    newTabBody.style.border = 'hidden';
        
                    var iframe = document.createElement('iframe');
                    iframe.src = window.location.href;
                    iframe.style.width = '100%';
                    iframe.style.height = '100%';
                    iframe.style.border = 'hidden';

                    iframe.onload = function() {
                        var links = iframe.contentDocument.querySelectorAll('a[target="_blank"]');
                        links.forEach(function(link) {
                            link.addEventListener('click', function(event) {
                                event.preventDefault();
                                iframe.contentWindow.location.href = link.href;
                            });
                        });
                    };
        
                    newTab.document.body.appendChild(iframe);
                } else {
                    alert("couldn't manage to open a new tab :(");
                }
            });
        });
        </script> 
    
<script>
    // Show update message after 1.5 seconds
    setTimeout(() => document.getElementById("updateBox").style.display = "block", 1500);
</script>
    
    <script type="module">
  // Import the functions you need from the SDKs you need
  import { initializeApp } from "https://www.gstatic.com/firebasejs/11.4.0/firebase-app.js";
  import { getAnalytics } from "https://www.gstatic.com/firebasejs/11.4.0/firebase-analytics.js";
  // TODO: Add SDKs for Firebase products that you want to use
  // https://firebase.google.com/docs/web/setup#available-libraries

  // Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later, measurementId is optional
  const firebaseConfig = {
    apiKey: "AIzaSyAe5Rx6v9v7a_AbppRkEWs6tEkVd3DbyLI",
    authDomain: "bi6zone-51b18.firebaseapp.com",
    databaseURL: "https://bi6zone-51b18-default-rtdb.firebaseio.com",
    projectId: "bi6zone-51b18",
    storageBucket: "bi6zone-51b18.firebasestorage.app",
    messagingSenderId: "787996595081",
    appId: "1:787996595081:web:f85edbb0001124f2cf0758",
    measurementId: "G-HHJW0NJFK5"
  };

  // Initialize Firebase
  const app = initializeApp(firebaseConfig);
  const analytics = getAnalytics(app);
    </script>
    
    <script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-database.js"></script>
<script src="track.js"></script>
    <script>
   window.onload = function() {
      alert("Bi6Web Proxy will be down for now as I need to find a different site hoster and It is a bit of a struggle to fix some of the coding neccessary for it to run properly via NPM, echo export, etc. -Jericho");
    };
</script>
</body>
</html>