⚠️ SISTEMA
by CosmicCobra59168 lines6.3 KB
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>⚠️ SISTEMA</title>
<style>
* { margin:0; padding:0; box-sizing:border-box; }
body {
background: #0a0000; color: #ff0000;
font-family: 'Courier New', monospace;
height: 100vh; overflow: hidden;
user-select: none; -webkit-user-select: none;
display: flex; justify-content: center; align-items: center;
flex-direction: column;
}
#main { text-align: center; z-index: 10; }
h1 { font-size: 2.5rem; text-shadow: 0 0 30px #f00; animation: glitch 0.2s infinite; }
@keyframes glitch {
0%,100% { transform: translate(0); }
25% { transform: translate(-5px,3px); }
50% { transform: translate(5px,-2px); }
75% { transform: translate(-3px,-4px); }
}
.sub { color: #ff4444; font-size: 1.3rem; margin: 15px 0; animation: blink 0.8s infinite; }
@keyframes blink { 0%,100%{opacity:1;} 50%{opacity:0.3;} }
.bar { width: 350px; height: 28px; border: 2px solid #f00; margin: 20px auto; border-radius: 4px; overflow: hidden; background: #111; }
.fill { height: 100%; background: #f00; width: 0%; transition: width 0.4s; box-shadow: 0 0 15px #f00; }
.nums { color: #f00; font-size: 1rem; margin-top: 8px; }
#alert {
position: fixed; top: 20px; right: 20px;
background: #1a0000; border: 2px solid #f00;
color: #f00; padding: 15px 20px;
border-radius: 10px; z-index: 50;
box-shadow: 0 0 25px #f00;
display: none; font-weight: bold; font-size: 1rem;
animation: shake 0.3s ease-out;
}
@keyframes shake {
0%,100%{transform:translate(0);}
20%{transform:translate(-8px,4px);}
40%{transform:translate(8px,-4px);}
60%{transform:translate(-4px,8px);}
80%{transform:translate(4px,-8px);}
}
#cat {
position: fixed; top: 50%; left: 50%;
transform: translate(-50%, -50%) scale(0);
font-size: 10rem; z-index: 100;
transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
#cat.show { transform: translate(-50%, -50%) scale(1); }
#reveal {
position: fixed; top: 0; left: 0; width: 100%; height: 100%;
background: #1a1a2e; z-index: 200;
display: none; justify-content: center; align-items: center;
flex-direction: column; color: #f1c40f; text-align: center;
}
#reveal h1 { animation: none; font-size: 2.5rem; margin-bottom: 10px; color: #f1c40f; }
#reveal p { font-size: 1.2rem; margin: 5px; color: #fff; }
.btn {
background: #f1c40f; color: #000; border: none;
padding: 12px 24px; font-size: 1rem; font-weight: bold;
border-radius: 8px; cursor: pointer; margin-top: 15px;
}
.btn:hover { background: #fff; }
#glitch-overlay {
position: fixed; top: 0; left: 0; width: 100%; height: 100%;
pointer-events: none; z-index: 30; display: none;
}
</style>
</head>
<body>
<div id="main">
<h1>⚠️ SISTEMA COMPROMETIDO ⚠️</h1>
<p class="sub">Se ha detectado un ransomware en tu dispositivo</p>
<div class="bar"><div class="fill" id="barFill"></div></div>
<p class="nums" id="barText">Cifrando archivos... 0%</p>
<p class="nums" id="fileCount">Archivos cifrados: 0</p>
</div>
<div id="alert">🔔 NOTIFICACIÓN: Te hemos hackeado. Tus archivos están siendo cifrados.</div>
<div id="cat">🐱</div>
<div id="glitch-overlay"></div>
<div id="reveal">
<h1>🎉 ¡ERA UNA BROMA! 🎉</h1>
<p>No te han hackeado. Esto es solo un juego inofensivo.</p>
<p>Simulación creada por <b>VideojuCan</b></p>
<p>Creado por <b>MineCanft e</b></p>
<p style="font-size:0.9rem;">No se ha modificado ningún archivo real 😄</p>
<button class="btn" onclick="location.reload()">🔄 Repetir broma</button>
</div>
<script>
let progress = 0;
let files = 0;
let interval;
const barFill = document.getElementById('barFill');
const barText = document.getElementById('barText');
const fileCount = document.getElementById('fileCount');
const alertBox = document.getElementById('alert');
const cat = document.getElementById('cat');
const reveal = document.getElementById('reveal');
const main = document.getElementById('main');
const glitchOverlay = document.getElementById('glitch-overlay');
// Sonido beep
function beep() {
try {
const ctx = new (window.AudioContext || window.webkitAudioContext)();
const osc = ctx.createOscillator();
const gain = ctx.createGain();
osc.connect(gain); gain.connect(ctx.destination);
osc.frequency.value = 800; osc.type = 'square';
gain.gain.value = 0.1; osc.start(); osc.stop(ctx.currentTime + 0.15);
} catch(e) {}
}
interval = setInterval(() => {
progress += Math.random() * 5;
files += Math.floor(Math.random() * 30);
if (progress > 100) progress = 100;
barFill.style.width = progress + '%';
barText.textContent = 'Cifrando archivos... ' + Math.floor(progress) + '%';
fileCount.textContent = 'Archivos cifrados: ' + files;
beep();
// Mostrar alerta al 30%
if (progress > 30 && alertBox.style.display === 'none') {
alertBox.style.display = 'block';
}
// Efecto glitch al 60%
if (progress > 60) {
document.body.style.animation = 'glitch 0.1s infinite';
}
// Al llegar al 100%
if (progress >= 100) {
clearInterval(interval);
barText.textContent = '⚠️ TODOS LOS ARCHIVOS CIFRADOS ⚠️';
fileCount.textContent = 'Sistema bloqueado. Paga el rescate.';
// Esperar 2 segundos y mostrar el GATO
setTimeout(() => {
main.style.display = 'none';
alertBox.style.display = 'none';
cat.classList.add('show');
beep(); beep(); beep();
}, 2000);
// Revelar broma
setTimeout(() => {
cat.classList.remove('show');
reveal.style.display = 'flex';
}, 4500);
}
}, 500);
</script>
</body>
</html>Game Source: ⚠️ SISTEMA
Creator: CosmicCobra59
Libraries: none
Complexity: moderate (168 lines, 6.3 KB)
The full source code is displayed above on this page.
Remix Instructions
To remix this game, copy the source code above and modify it. Add a ARCADELAB header at the top with "remix_of: sistema-cosmiccobra59" to link back to the original. Then publish at arcadelab.ai/publish.