\n \n
", "css": "body, html { margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; background-color: #000; font-family: 'Courier New', Courier, monospace; color: #fff; }\n#canvas-container { position: relative; width: 100vw; height: 100vh; overflow: hidden; }\n#void-canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }\n#overlay { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 2; pointer-events: none; }\n#glitch-text { font-size: 5rem; font-weight: 900; letter-spacing: 1rem; text-transform: uppercase; animation: glitch 2s infinite; color: #fff; text-shadow: 2px 0 #f00, -2px 0 #0ff; }\n#subtext { font-size: 1.2rem; opacity: 0.6; margin-top: 20px; letter-spacing: 2px; }\n@keyframes glitch { 0% { transform: translate(0); } 10% { transform: translate(-5px, 5px); } 20% { transform: translate(5px, -5px); } 30% { transform: translate(0); } 40% { transform: translate(-5px, 0); } 50% { transform: translate(5px, 0); } 60% { transform: translate(0); } 100% { transform: translate(0); } }", "js": "const canvas = document.getElementById('void-canvas');\nconst ctx = canvas.getContext('2d');\nlet width, height, particles = [];\n\nfunction resize() { width = canvas.width = window.innerWidth; height = canvas.height = window.innerHeight; }\nwindow.addEventListener('resize', resize);\nresize();\n\nclass Particle {\n constructor() { this.reset(); }\n reset() { \n this.x = Math.random() * width;\n this.y = Math.random() * height;\n this.vx = (Math.random() - 0.5) * 0.5;\n this.vy = (Math.random() - 0.5) * 0.5;\n this.size = Math.random() * 2;\n this.life = Math.random() * 100;\n }\n update() { \n this.x += this.vx;\n this.y += this.vy;\n if (this.x < 0 || this.x > width || this.y < 0 || this.y > height) this.reset();\n this.life -= 0.2;\n if (this.life <= 0) this.reset();\n }\n draw() { \n ctx.fillStyle = `rgba(255, 255, 255, ${this.life / 100})`;\n ctx.beginPath();\n ctx.fillRect(this.x, this.y, this.size, this.size);\n }\n}\n\nfor (let i = 0; i < 300; i++) { particles.push(new Particle()); }\n\nfunction animate() { \n ctx.fillStyle = 'rgba(0, 0, 0, 0.1)';\n ctx.fillRect(0, 0, width, height);\n \n const centerX = width / 2;\n const centerY = height / 2;\n \n particles.forEach(p =>
\n
\nVACÍO
\n¿Quién observa al observador?
\n