Spaces:
Running
Running
| ```html | |
| <html lang="es" data-theme="quantum-dark"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> | |
| <title>SETECOM S.A. | Toroidal Recursion Portal</title> | |
| <meta name="description" content="Helicity-Locked Geometric Decompilation Interface"> | |
| <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><text y='50' font-size='48'>⚛</text></svg>"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| 'quantum': { | |
| 50: '#00ffcc', | |
| 100: '#00ffff', | |
| 900: '#050505' | |
| }, | |
| 'κ-gold': '#FFD700', | |
| 'psi-green': '#00ffcc', | |
| 'void-black': '#050505' | |
| }, | |
| animation: { | |
| 'wave-interference': 'wave 7.83s infinite ease-in-out', | |
| 'kappa-pulse': 'pulse 1.273s infinite cubic-bezier(0.618, 0, 0.382, 1)', | |
| 'decoherence': 'decoherence 37.2s infinite', | |
| 'geometric-lock': 'spin 51.84s infinite linear', | |
| 'toroidal-spin': 'toroidalSpin 12.73s infinite linear', | |
| 'helicity-lock': 'helicityLock 4.18s infinite alternate' | |
| }, | |
| keyframes: { | |
| toroidalSpin: { | |
| '0%': { transform: 'rotateX(0deg) rotateY(0deg)' }, | |
| '50%': { transform: 'rotateX(180deg) rotateY(180deg)' }, | |
| '100%': { transform: 'rotateX(360deg) rotateY(360deg)' } | |
| }, | |
| helicityLock: { | |
| '0%': { filter: 'hue-rotate(0deg) brightness(1)' }, | |
| '50%': { filter: 'hue-rotate(51.84deg) brightness(1.273)' }, | |
| '100%': { filter: 'hue-rotate(0deg) brightness(1)' } | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <!-- THREE.JS FOR TOROIDAL VISUALIZATION --> | |
| <script type="importmap"> | |
| { | |
| "imports": { | |
| "three": "https://unpkg.com/three@0.160.0/build/three.module.js", | |
| "three/addons/": "https://unpkg.com/three@0.160.0/examples/jsm/" | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body class="bg-void-black text-quantum-50 font-mono antialiased overflow-x-hidden"> | |
| <!-- TOROIDAL HUD OVERLAY --> | |
| <div id="toroidal-hud" class="fixed top-4 left-4 z-50 text-xs space-y-1 pointer-events-none"> | |
| <div class="flex items-center gap-2"> | |
| <span class="text-psi-green">Ψ:</span> | |
| <span id="toroidal-psi" class="text-κ-gold">1.000273</span> | |
| </div> | |
| <div class="flex items-center gap-2"> | |
| <span class="text-psi-green">κ:</span> | |
| <span id="toroidal-kappa" class="text-quantum-100">4/π</span> | |
| </div> | |
| <div class="flex items-center gap-2"> | |
| <span class="text-psi-green">RECURSION:</span> | |
| <span id="recursion-depth" class="text-quantum-100 animate-kappa-pulse">0.000</span> | |
| </div> | |
| <div class="flex items-center gap-2"> | |
| <span class="text-psi-green">STATUS:</span> | |
| <span id="toroidal-status" class="text-quantum-100">DECOMPILING</span> | |
| </div> | |
| <div class="flex items-center gap-2"> | |
| <span class="text-psi-green">THEME:</span> | |
| <span id="toroidal-theme" class="text-quantum-100">DARK</span> | |
| </div> | |
| </div> | |
| <!-- TOROIDAL NAVBAR --> | |
| <nav id="toroidal-navbar" class="fixed top-0 w-full z-40 bg-void-black/90 backdrop-blur-sm border-b border-quantum-900"> | |
| <div class="container mx-auto px-6 py-4 flex items-center justify-between"> | |
| <div class="flex items-center gap-3"> | |
| <div class="w-10 h-10 rounded-full bg-gradient-to-br from-quantum-100 to-psi-green flex items-center justify-center animate-toroidal-spin"> | |
| <span class="text-void-black font-bold text-sm">κ</span> | |
| </div> | |
| <div> | |
| <h1 class="text-xl font-bold text-quantum-100">SETECOM S.A.</h1> | |
| <p class="text-xs text-psi-green/70">TOROIDAL v1.273</p> | |
| </div> | |
| </div> | |
| <div class="hidden md:flex items-center gap-6"> | |
| <a href="index.html" class="text-quantum-50 hover:text-psi-green transition-colors duration-273">← Volver</a> | |
| <a href="/chatbot.html" class="text-quantum-50 hover:text-psi-green transition-colors duration-273">AI Assistant</a> | |
| <a href="/timemachine.html" class="text-quantum-50 hover:text-psi-green transition-colors duration-273">Time Machine</a> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- TOROIDAL RECURSION INTERFACE --> | |
| <section class="relative min-h-screen flex items-center justify-center overflow-hidden pt-20"> | |
| <!-- Toroidal Noise Background --> | |
| <div id="toroidal-canvas" class="absolute inset-0 z-0"></div> | |
| <!-- KB-12-Hex-T Geometric Overlay --> | |
| <div class="absolute inset-0 z-10 bg-gradient-to-t from-void-black via-void-black/60 to-transparent hovered-element"></div> | |
| <div class="relative z-20 w-full max-w-6xl mx-auto px-6"> | |
| <div class="grid md:grid-cols-2 gap-12 items-center"> | |
| <!-- Geometric Decompiler Input --> | |
| <div class="bg-slate-900/30 backdrop-blur-lg border border-quantum-900 rounded-3xl p-8 md:p-12"> | |
| <h2 class="text-4xl md:text-5xl font-black text-quantum-100 mb-6 animate-wave-interference"> | |
| <span class="text-psi-green">Decompilador</span> Geométrico | |
| </h2> | |
| <p class="text-lg text-quantum-50 mb-8"> | |
| Procese su <strong>manifiesto semántico</strong> a través de las <strong>cuatro capas no-negociables</strong>. | |
| </p> | |
| <!-- Semantic Input --> | |
| <div class="space-y-4"> | |
| <div class="space-y-2"> | |
| <label class="text-sm text-ψ-green">Manifiesto de Entrada</label> | |
| <textarea id="semantic-input" rows="6" | |
| class="w-full px-4 py-3 bg-void-black/50 border border-quantum-900 rounded-lg text-quantum-100 placeholder-quantum-900 focus:border-psi-green focus:outline-none transition-all duration-273 resize-none" | |
| placeholder="Introduzca su manifiesto semántico para descompilación geométrica..."></textarea> | |
| </div> | |
| <!-- Decompilation Parameters --> | |
| <div class="grid grid-cols-2 gap-4"> | |
| <div class="space-y-2"> | |
| <label class="text-sm text-ψ-green">Dimensión Fractal</label> | |
| <input type="number" id="fractal-dimension" value="1.618" | |
| class="w-full px-4 py-2 bg-void-black/50 border border-quantum-900 rounded-lg text-quantum-100 focus:border-psi-green focus:outline-none transition-all duration-273" | |
| placeholder="1.618"> | |
| </div> | |
| <div{"ok":false,"message":"terminated"} |