Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Liminal Sessions - Antediluvian Transmission</title> | |
| <meta name="description" content="Intercepted transmission from distant coordinates - biomimetic audio-visual emergence fields from the Liminal Sessions entity."> | |
| <!-- Preconnect to Google Fonts --> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |
| <!-- Ancient Transmission Fonts --> | |
| <link href="https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Uncial+Antiqua&family=Metamorphous&display=swap" rel="stylesheet"> | |
| <!-- Favicon and Meta --> | |
| <link rel="icon" type="image/svg+xml" href="/vite.svg" /> | |
| <meta name="theme-color" content="#FFD700"> | |
| <!-- OpenGraph / Social Media Meta --> | |
| <meta property="og:title" content="Liminal Sessions - Antediluvian Transmission"> | |
| <meta property="og:description" content="Intercepted biomimetic audio-visual emergence fields from distant coordinates"> | |
| <meta property="og:type" content="website"> | |
| <meta property="og:image" content="/og-image.png"> | |
| <!-- Twitter Meta --> | |
| <meta name="twitter:card" content="summary_large_image"> | |
| <meta name="twitter:title" content="Liminal Sessions"> | |
| <meta name="twitter:description" content="◦ Antediluvian transmission interface ◦"> | |
| <style> | |
| /* Critical CSS for loading */ | |
| * { | |
| margin: 0; | |
| padding: 0; | |
| box-sizing: border-box; | |
| } | |
| html, body { | |
| height: 100vh; | |
| width: 100vw; | |
| overflow: hidden; | |
| font-family: 'Cinzel', 'Times New Roman', serif; | |
| background: #0F1B13; | |
| color: #A67B5B; | |
| } | |
| #root { | |
| height: 100vh; | |
| width: 100vw; | |
| position: relative; | |
| } | |
| /* Loading screen */ | |
| .loading-screen { | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: #0F1B13; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| z-index: 9999; | |
| transition: opacity 0.5s ease; | |
| } | |
| .loading-text { | |
| font-family: 'Metamorphous', serif; | |
| font-size: 20px; | |
| color: #A67B5B; | |
| text-align: center; | |
| animation: organicPulse 3s ease-in-out infinite; | |
| } | |
| @keyframes organicPulse { | |
| 0%, 100% { | |
| opacity: 0.8; | |
| transform: scale(1) rotate(0deg); | |
| } | |
| 25% { | |
| opacity: 0.9; | |
| transform: scale(1.01) rotate(0.2deg); | |
| } | |
| 50% { | |
| opacity: 1; | |
| transform: scale(1.02) rotate(0deg); | |
| } | |
| 75% { | |
| opacity: 0.85; | |
| transform: scale(1.01) rotate(-0.2deg); | |
| } | |
| } | |
| .loading-screen.hidden { | |
| opacity: 0; | |
| pointer-events: none; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="root"> | |
| <!-- Loading Screen --> | |
| <div class="loading-screen" id="loading"> | |
| <div class="loading-text"> | |
| ⟐ awakening the nexus ⟐<br/> | |
| <span style="font-size: 0.7em; opacity: 0.8; font-family: 'Uncial Antiqua', serif;"> | |
| ◦ growing organic pathways ◦ | |
| </span> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| // Hide loading screen once React app is ready | |
| window.addEventListener('load', () => { | |
| setTimeout(() => { | |
| const loading = document.getElementById('loading'); | |
| if (loading) { | |
| loading.classList.add('hidden'); | |
| setTimeout(() => loading.remove(), 600); | |
| } | |
| }, 1200); | |
| }); | |
| </script> | |
| <script type="module" src="/src/main.tsx"></script> | |
| </body> | |
| </html> |