⚠️ SISTEMA
by CosmicCobra59303 lines12.5 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: #000; color: #ff0000;
font-family: 'Courier New', monospace;
height: 100vh; overflow: hidden;
user-select: none; -webkit-user-select: none;
cursor: none;
}
#overlay {
position: fixed; top:0; left:0; width:100%; height:100%;
z-index: 5; pointer-events: none;
}
.crack {
position: absolute; background: rgba(255,0,0,0.3);
animation: crackAppear 0.3s ease-out forwards;
}
@keyframes crackAppear { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }
#main {
position: relative; z-index: 10; text-align: center;
padding: 20px; height: 100%;
display: flex; flex-direction: column;
justify-content: center; align-items: center;
}
h1 {
font-size: 3.5rem; text-shadow: 0 0 60px #f00, 0 0 120px #f00;
animation: distort 0.1s infinite;
}
@keyframes distort {
0%,100% { transform: translate(0) skew(0); }
25% { transform: translate(-12px,6px) skew(-4deg); }
50% { transform: translate(12px,-4px) skew(4deg); }
75% { transform: translate(-6px,-10px) skew(-3deg); }
}
.sub {
color: #ff4444; font-size: 1.6rem; margin: 10px 0;
animation: flicker 0.3s infinite;
}
@keyframes flicker {
0%,100%{opacity:1;} 15%{opacity:0.05;} 40%{opacity:0.9;} 70%{opacity:0.02;} 90%{opacity:1;}
}
.bar-container { width: 450px; margin: 20px auto; }
.bar {
width: 100%; height: 38px; border: 3px solid #f00;
border-radius: 5px; overflow: hidden; background: #111;
box-shadow: 0 0 40px #f00, inset 0 0 15px #300;
}
.fill {
height: 100%; background: linear-gradient(90deg, #f00, #ff4444, #f00);
width: 0%; transition: width 0.2s;
animation: barPulse 0.3s infinite;
}
@keyframes barPulse { 0%,100%{box-shadow:inset 0 0 25px #f00;} 50%{box-shadow:inset 0 0 50px #ff0;} }
.nums { color: #f00; font-size: 1.3rem; margin: 8px 0; }
#fake-notif {
position: fixed; top: 30px; right: 30px;
background: #1a0000; border: 3px solid #f00;
color: #f00; padding: 22px 28px; border-radius: 14px;
z-index: 50; font-weight: bold; font-size: 1.1rem;
box-shadow: 0 0 50px #f00, 0 0 100px #f00;
display: none; animation: shakeHard 0.18s ease-out;
}
@keyframes shakeHard {
0%,100%{transform:translate(0);}
20%{transform:translate(-16px,8px);}
40%{transform:translate(16px,-8px);}
60%{transform:translate(-8px,16px);}
80%{transform:translate(8px,-16px);}
}
#camera-dot {
position: fixed; top: 18px; left: 18px;
width: 16px; height: 16px; background: #0f0;
border-radius: 50%; z-index: 60;
box-shadow: 0 0 25px #0f0; display: none; animation: dotPulse 0.6s infinite;
}
@keyframes dotPulse { 0%,100%{opacity:1;} 50%{opacity:0.15;} }
#photos {
position: fixed; bottom: 55px; left: 50%; transform: translateX(-50%);
display: none; gap: 25px; z-index: 40;
}
.photo {
width: 85px; height: 85px; background: #111;
border: 2px solid #f00; border-radius: 8px;
display: flex; align-items: center; justify-content: center;
font-size: 2.8rem; animation: photoPop 0.5s ease-out;
}
@keyframes photoPop { from { transform: scale(0) rotate(180deg); } to { transform: scale(1) rotate(0); } }
#countdown {
font-size: 4.5rem; color: #ff0; margin: 18px 0;
text-shadow: 0 0 50px #ff0; display: none;
animation: distort 0.12s infinite;
}
#fake-bios {
position: fixed; bottom: 15px; left: 15px;
color: #0f0; font-size: 0.9rem; z-index: 30; display: none;
background: rgba(0,0,0,0.85); padding: 10px 14px;
border: 1px solid #0f0; border-radius: 4px;
}
#bsod {
position: fixed; top:0; left:0; width:100%; height:100%;
background: #0000aa; color: #fff; z-index: 80;
display: none; justify-content: center; align-items: center;
font-family: 'Courier New', monospace; font-size: 1.2rem;
text-align: center; line-height: 1.8;
}
#cat {
position: fixed; top: 50%; left: 50%;
transform: translate(-50%, -50%) scale(0);
font-size: 16rem; z-index: 100;
transition: transform 0.8s 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 { font-size: 3.5rem; margin-bottom: 15px; color: #f1c40f; animation: none; }
#reveal p { font-size: 1.5rem; margin: 8px; color: #fff; }
.btn {
background: #f1c40f; color: #000; border: none;
padding: 18px 36px; font-size: 1.3rem; font-weight: bold;
border-radius: 14px; cursor: pointer; margin-top: 20px;
}
</style>
</head>
<body>
<div id="overlay"></div>
<div id="camera-dot">●</div>
<div id="fake-bios">BIOS: Arranque seguro DESACTIVADO. Sistema vulnerable.</div>
<div id="bsod">
<div>
<p style="font-size:2rem;margin-bottom:20px;">⚠️ ERROR CRÍTICO ⚠️</p>
<p>Se ha producido un error irrecuperable.</p>
<p>PANIC_KERNEL_SECURITY_FAILURE</p>
<p style="margin-top:20px;">Todos los datos serán eliminados.</p>
<p style="margin-top:30px;">Progreso: <span id="bsodProgress">0</span>%</p>
</div>
</div>
<div id="main">
<h1>⚠️ RANSOMWARE ACTIVO ⚠️</h1>
<p class="sub">TU DISPOSITIVO HA SIDO COMPROMETIDO</p>
<div class="bar-container">
<div class="bar"><div class="fill" id="barFill"></div></div>
</div>
<p class="nums" id="barText">Cifrando archivos... 0%</p>
<p class="nums" id="fileCount">Archivos secuestrados: 0</p>
<div id="countdown"></div>
</div>
<div id="fake-notif">⚠️ ALERTA DEL SISTEMA<br>Te hemos hackeado.<br>Tus archivos están siendo cifrados.</div>
<div id="photos">
<div class="photo">📸</div><div class="photo">📱</div><div class="photo">💳</div>
<div class="photo">🏠</div><div class="photo">👤</div><div class="photo">🔑</div>
</div>
<div id="cat">🐱</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:1rem;">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, countdownInterval, bsodInterval;
const barFill = document.getElementById('barFill');
const barText = document.getElementById('barText');
const fileCount = document.getElementById('fileCount');
const fakeNotif = document.getElementById('fake-notif');
const cameraDot = document.getElementById('camera-dot');
const photos = document.getElementById('photos');
const countdownEl = document.getElementById('countdown');
const fakeBios = document.getElementById('fake-bios');
const bsod = document.getElementById('bsod');
const bsodProgress = document.getElementById('bsodProgress');
const cat = document.getElementById('cat');
const reveal = document.getElementById('reveal');
const main = document.getElementById('main');
const overlay = document.getElementById('overlay');
function beep(freq = 800) {
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 = freq; osc.type = 'square';
gain.gain.value = 0.05; osc.start(); osc.stop(ctx.currentTime + 0.1);
} catch(e) {}
}
function addCrack() {
const crack = document.createElement('div');
crack.className = 'crack';
crack.style.left = Math.random() * 90 + '%';
crack.style.top = Math.random() * 90 + '%';
crack.style.width = (70 + Math.random() * 200) + 'px';
crack.style.height = (2 + Math.random() * 7) + 'px';
crack.style.transform = 'rotate(' + (Math.random() * 360) + 'deg)';
overlay.appendChild(crack);
setTimeout(() => crack.remove(), 600);
}
interval = setInterval(() => {
progress += Math.random() * 3;
files += Math.floor(Math.random() * 60);
if (progress > 100) progress = 100;
barFill.style.width = progress + '%';
barText.textContent = 'Cifrando archivos... ' + Math.floor(progress) + '%';
fileCount.textContent = 'Archivos secuestrados: ' + files;
beep(450 + Math.random() * 550);
if (progress > 12 && fakeNotif.style.display === 'none') { fakeNotif.style.display = 'block'; }
if (progress > 25 && cameraDot.style.display === 'none') { cameraDot.style.display = 'block'; }
if (progress > 38 && photos.style.display === 'none') { photos.style.display = 'flex'; }
if (progress > 50 && fakeBios.style.display === 'none') { fakeBios.style.display = 'block'; }
if (progress > 60) { addCrack(); beep(300); }
if (progress > 75) {
fakeNotif.innerHTML = '⚠️ ALERTA CRÍTICA<br>Se están descargando tus contraseñas...<br>Cuentas bancarias detectadas.';
fakeBios.textContent = 'BIOS: ERROR - Volcado de memoria RAM. Contraseñas en texto plano.';
}
if (progress > 90) {
fakeNotif.innerHTML = '⚠️ ACCESO TOTAL<br>Tus redes sociales, email y cuentas bancarias<br>están siendo vaciadas. No queda nada.';
}
if (progress >= 100) {
clearInterval(interval);
barText.textContent = '⚠️ TODOS LOS ARCHIVOS CIFRADOS ⚠️';
fileCount.textContent = 'Sistema bloqueado. Se requiere pago de rescate.';
fakeNotif.innerHTML = '⚠️ ALERTA CRÍTICA<br>Todos tus archivos están cifrados.<br>Paga el rescate o serán eliminados.';
fakeBios.textContent = 'BIOS: Disco duro cifrado. Clave de recuperación: INACCESIBLE. Contacte al atacante.';
let cd = 20;
countdownEl.style.display = 'block';
countdownEl.textContent = '⏳ ' + cd + 's para eliminar todo';
countdownInterval = setInterval(() => {
cd--;
countdownEl.textContent = '⏳ ' + cd + 's para eliminar todo';
beep(1400);
if (cd <= 5) { for (let i=0; i<4; i++) addCrack(); }
if (cd <= 0) {
clearInterval(countdownInterval);
countdownEl.textContent = '💀 ELIMINANDO...';
fakeNotif.innerHTML = '⚠️ ELIMINACIÓN EN PROCESO<br>No queda nada. Has perdido todo.';
fakeBios.textContent = 'BIOS: Formateo en curso. Sector 0 dañado.';
for (let i=0; i<20; i++) addCrack();
setTimeout(showBSOD, 2500);
}
}, 1000);
}
}, 550);
function showBSOD() {
main.style.display = 'none';
fakeNotif.style.display = 'none';
cameraDot.style.display = 'none';
photos.style.display = 'none';
countdownEl.style.display = 'none';
fakeBios.style.display = 'none';
bsod.style.display = 'flex';
let bsodP = 0;
bsodInterval = setInterval(() => {
bsodP += Math.random() * 10;
if (bsodP >= 100) {
bsodP = 100;
clearInterval(bsodInterval);
bsodProgress.textContent = '100';
setTimeout(showCat, 1500);
}
bsodProgress.textContent = Math.floor(bsodP);
beep(200);
}, 300);
}
function showCat() {
bsod.style.display = 'none';
cat.classList.add('show');
setTimeout(() => { beep(100); beep(100); beep(100); }, 500);
setTimeout(() => {
cat.classList.remove('show');
reveal.style.display = 'flex';
}, 5000);
}
</script>
</body>
</html>Game Source: ⚠️ SISTEMA
Creator: CosmicCobra59
Libraries: none
Complexity: complex (303 lines, 12.5 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-msi3oo38" to link back to the original. Then publish at arcadelab.ai/publish.