/* glitch-new.css — v3 Efecto de "rotura de pantalla / fallo de sistema". La distorsión (transform/filter en ) ahora la controla JS frame a frame con valores aleatorios, en ráfagas irregulares — por eso aquí ya NO hay @keyframes infinitos para eso. Independiente del sistema de glitch anterior. */ html { /* transición desactivada a propósito: los cambios de filter/transform deben notarse como cortes bruscos, no como algo suave y previsible */ transition: none; } /* ============================================================ CAPA DE RUIDO / SCANLINES / SPLIT RGB — solo visible durante cada ráfaga de distorsión (clase añadida/quitada por JS), nunca en bucle continuo. ============================================================ */ #glitchNewOverlay { position: fixed; inset: -6%; z-index: 999999; display: none; pointer-events: none; background: transparent; } #glitchNewOverlay.glitchNewActive { display: block; } #glitchNewOverlay.glitchNewNoise::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient( 0deg, rgba(255, 255, 255, 0.08) 0px, rgba(255, 255, 255, 0.08) 2px, rgba(0, 0, 0, 0.12) 2px, rgba(0, 0, 0, 0.12) 4px ); mix-blend-mode: overlay; } #glitchNewOverlay.glitchNewNoise::after { content: ""; position: absolute; inset: 0; mix-blend-mode: screen; filter: blur(0.3px); background: repeating-linear-gradient( 90deg, rgba(0, 255, 120, 0.14) 0px, rgba(0, 255, 120, 0.14) 12px, transparent 12px, transparent 34px ), repeating-linear-gradient( 90deg, rgba(255, 0, 60, 0.14) 0px, rgba(255, 0, 60, 0.14) 8px, transparent 8px, transparent 26px ); } /* ============================================================ FLASHES — sólidos, brevísimos (controlados por JS, 70-140ms). Sin transición: deben aparecer y cortar de golpe. ============================================================ */ #glitchNewOverlay { transition: none; } @media (prefers-reduced-motion: reduce) { html { filter: none !important; transform: none !important; } #glitchNewOverlay.glitchNewNoise::before, #glitchNewOverlay.glitchNewNoise::after { display: none !important; } }