<!DOCTYPE html>
<html lang="ro">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GhostScan.ro - Scanează spirite offline!</title>
<style>
:root {
--albastru: #2A5BDA;
--verde: #2BD96A;
--galben: #FFD83B;
--albastru-inchis: #0A1A3A;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background: var(--albastru-inchis);
color: white;
font-family: 'Segoe UI', Tahoma, sans-serif;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
padding: 20px;
text-align: center;
}
.container {
max-width: 100%;
width: 100%;
}
header {
padding: 20px 0;
}
h1 {
color: var(--galben);
font-size: 2.2rem;
margin-bottom: 10px;
text-shadow: 0 0 10px rgba(255, 216, 59, 0.5);
}
.subtitle {
color: var(--verde);
font-size: 1.1rem;
margin-bottom: 20px;
}
.ghost-container {
position: relative;
margin: 20px auto;
width: 200px;
height: 220px;
}
.ghost {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 150px;
height: 180px;
}
.ghost-body {
width: 150px;
height: 120px;
background: var(--albastru);
border-radius: 75px 75px 0 0;
position: absolute;
bottom: 0;
}
.ghost-eye {
width: 24px;
height: 36px;
background: var(--verde);
border-radius: 50%;
position: absolute;
top: 50px;
animation: blink 4s infinite;
}
.ghost-eye.left { left: 35px; }
.ghost-eye.right { right: 35px; }
.ghost-tie {
width: 30px;
height: 40px;
background: var(--galben);
position: absolute;
bottom: -20px;
left: 60px;
clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.ghost-hat {
width: 80px;
height: 20px;
background: #333;
position: absolute;
top: 20px;
left: 35px;
border-radius: 5px;
}
.ghost-hat-top {
width: 50px;
height: 30px;
background: #222;
position: absolute;
top: -30px;
left: 15px;
border-radius: 10px 10px 0 0;
}
.scan-btn {
background: var(--albastru);
color: var(--galben);
border: none;
padding: 18px 40px;
font-size: 1.5rem;
border-radius: 50px;
cursor: pointer;
margin: 25px 0;
font-weight: bold;
box-shadow: 0 0 20px var(--verde);
transition: all 0.3s;
width: 90%;
max-width: 400px;
}
.scan-btn:active {
transform: scale(0.98);
box-shadow: 0 0 30px var(--galben);
}
#result {
background: rgba(255, 216, 59, 0.15);
border: 2px solid var(--galben);
border-radius: 15px;
padding: 20px;
margin: 20px 0;
min-height: 120px;
display: none;
font-size: 1.2rem;
width: 90%;
max-width: 500px;
margin-left: auto;
margin-right: auto;
}
.counter {
color: var(--verde);
font-size: 1.1rem;
margin: 15px 0;
}
.vpn-section {
background: linear-gradient(90deg, var(--albastru-inchis), var(--albastru));
padding: 15px;
border-radius: 10px;
margin: 30px 0;
width: 90%;
max-width: 500px;
}
.vpn-btn {
background: var(--verde);
color: var(--albastru-inchis);
border: none;
padding: 12px 25px;
font-size: 1.1rem;
border-radius: 30px;
cursor: pointer;
font-weight: bold;
margin-top: 15px;
width: 100%;
}
footer {
margin-top: auto;
padding: 20px 0;
color: #aaa;
font-size: 0.8rem;
width: 100%;
}
@keyframes blink {
0%, 45%, 55%, 100% { height: 36px; }
50% { height: 8px; }
}
/* ANIMATIE SCANARE */
.scan-animation {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: radial-gradient(circle, transparent 20%, var(--albastru-inchis) 90%);
pointer-events: none;
opacity: 0;
z-index: 100;
}
</style>
</head>
<body>
<div class="container">
<header>
<h1>GHOSTSCAN.RO</h1>
<p class="subtitle">Scanează spirite offline - fără internet!</p>
</header>
<div class="ghost-container">
<div class="ghost">
<div class="ghost-hat"></div>
<div class="ghost-hat-top"></div>
<div class="ghost-body">
<div class="ghost-eye left"></div>
<div class="ghost-eye right"></div>
<div class="ghost-tie"></div>
</div>
</div>
</div>
<button class="scan-btn" id="scanButton">★ SCANEAZĂ ACUM! ★</button>
<div id="result"></div>
<div class="counter">Spirite detectate astăzi: <span id="counter">12.441</span></div>
<div class="vpn-section">
<h3>🚨 ATENȚIE! Spiritele sunt pretutindeni</h3>
<p>Protejează-ți dispozitivul cu GhostVPN™</p>
<button class="vpn-btn" id="vpnButton">ACTIVEAZĂ PROTECȚIA (6.66€/lună)</button>
</div>
<div class="scan-animation" id="scanAnimation"></div>
</div>
<footer>
<p>GhostScan este o aplicație de divertisment. Rezultatele sunt simulate.</p>
<p>© 2025 GhostScan | Funcționează 100% offline</p>
</footer>
<script>
// Lista cu rezultate amuzante
const ghostResults = [
"👻 FANTOMĂ CORPORATISTĂ DETECTATĂ!\nNivel: 8/10\nSe hrănește cu deadline-uri ratate și cafea rece.",
"🧛♂️ VAMPIR DIGITAL ÎN ROUTER!\nNivel: 7/10\nÎți fură viteza de internet noaptea.",
"💸 SPIRITUL CONTULUI DE BANCĂ\nNivel: 9/10\nDevine mai activ înainte de salariu.",
"😴 SPIRIDUȘUL PROCRASTINĂRII\nNivel: MAXIM\nSe manifestă prin seriale Netflix și scrollat TikTok.",
"👁️ OCHIUL LUI SAURON PE CAMERĂ\nNivel: 6/10\nRecomandare: acoperă camera cu bandă izolatoare.",
"☕ ENTITATE DE LUNI DIMINEAȚĂ\nNivel: 10/10\nRemediu: 3 cafele + o plimbare în parc.",
"📱 FANTOMA TELEFONULUI PIERDUT\nNivel: 5/10\nSe aude vibrația dar nu găsești telefonul."
];
const scanButton = document.getElementById('scanButton');
const vpnButton = document.getElementById('vpnButton');
const resultDiv = document.getElementById('result');
const counterEl = document.getElementById('counter');
const scanAnimation = document.getElementById('scanAnimation');
scanButton.addEventListener('click', startScan);
vpnButton.addEventListener('click', activateVPN);
function startScan() {
// Resetare
scanButton.disabled = true;
scanButton.textContent = 'SCANARE ÎN DESFĂȘURARE...';
resultDiv.style.display = 'none';
// Animatie scanare
scanAnimation.style.opacity = '1';
scanAnimation.style.background = 'radial-gradient(circle, #2BD96A 0%, #0A1A3A 90%)';
// Efect sonor
playScanSound();
// Procesare scanare
setTimeout(() => {
showResult();
scanButton.disabled = false;
scanButton.textContent = '★ SCANEAZĂ DIN NOU! ★';
scanAnimation.style.opacity = '0';
// Actualizează contor
counterEl.textContent = (parseInt(counterEl.textContent) + 1).toLocaleString();
}, 3000);
}
function showResult() {
const randomResult = ghostResults[Math.floor(Math.random() * ghostResults.length)];
resultDiv.innerHTML = randomResult.replace(/\n/g, '<br>');
resultDiv.style.display = 'block';
}
function activateVPN() {
vpnButton.textContent = 'PROTECȚIE ACTIVĂ!';
vpnButton.style.background = '#FFD83B';
vpnButton.style.color = '#0A1A3A';
// Mesaj VPN fictiv
setTimeout(() => {
resultDiv.innerHTML = "🛡️ <strong>GHOSTVPN ACTIVAT!</strong><br>Routerul tău este protejat împotriva spiritelor digitale. Spirite blocate: 0";
resultDiv.style.display = 'block';
}, 1000);
}
function playScanSound() {
// Sunet scanare generat programatic
try {
const audioCtx = new (window.AudioContext || window.webkitAudioContext)();
const oscillator = audioCtx.createOscillator();
const gainNode = audioCtx.createGain();
oscillator.type = 'sine';
oscillator.frequency.setValueAtTime(800, audioCtx.currentTime);
oscillator.frequency.exponentialRampToValueAtTime(200, audioCtx.currentTime + 1);
gainNode.gain.setValueAtTime(0.3, audioCtx.currentTime);
gainNode.gain.exponentialRampToValueAtTime(0.01, audioCtx.currentTime + 2);
oscillator.connect(gainNode);
gainNode.connect(audioCtx.destination);
oscillator.start();
setTimeout(() => {
oscillator.stop();
}, 2500);
} catch (e) {
console.log("Eroare audio", e);
}
}
// Easter egg
let clickCount = 0;
scanButton.addEventListener('dblclick', () => {
clickCount++;
if (clickCount >= 3) {
resultDiv.innerHTML = "🎉 MOD SECRET ACTIVAT!<br>Ai primit VIP GRATIS pe viață!<br>(doar nu le spune la spirite)";
resultDiv.style.display = 'block';
clickCount = 0;
}
});
</script>
</body>
</html>