|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>HYPNOS-X | Advanced Hypnotic AI System</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700;900&display=swap'); |
|
|
|
|
|
:root { |
|
|
--primary: #6e00ff; |
|
|
--secondary: #ff00aa; |
|
|
--accent: #00ffcc; |
|
|
--dark: #0a0a1a; |
|
|
--light: #f0f0ff; |
|
|
} |
|
|
|
|
|
body { |
|
|
font-family: 'Orbitron', sans-serif; |
|
|
background-color: var(--dark); |
|
|
color: var(--light); |
|
|
overflow-x: hidden; |
|
|
} |
|
|
|
|
|
.hypno-spiral { |
|
|
animation: spin 20s linear infinite; |
|
|
background: radial-gradient(circle, var(--primary), var(--secondary)); |
|
|
border-radius: 50%; |
|
|
opacity: 0.3; |
|
|
position: fixed; |
|
|
z-index: -1; |
|
|
} |
|
|
|
|
|
@keyframes spin { |
|
|
0% { transform: rotate(0deg); } |
|
|
100% { transform: rotate(360deg); } |
|
|
} |
|
|
|
|
|
.theta-wave { |
|
|
position: relative; |
|
|
height: 2px; |
|
|
background: linear-gradient(90deg, var(--accent), var(--secondary)); |
|
|
animation: wave 2s infinite linear; |
|
|
} |
|
|
|
|
|
@keyframes wave { |
|
|
0% { transform: scaleX(0.5); opacity: 0.5; } |
|
|
50% { transform: scaleX(1); opacity: 1; } |
|
|
100% { transform: scaleX(0.5); opacity: 0.5; } |
|
|
} |
|
|
|
|
|
.pulse { |
|
|
animation: pulse 2s infinite; |
|
|
} |
|
|
|
|
|
@keyframes pulse { |
|
|
0% { box-shadow: 0 0 0 0 rgba(110, 0, 255, 0.7); } |
|
|
70% { box-shadow: 0 0 0 10px rgba(110, 0, 255, 0); } |
|
|
100% { box-shadow: 0 0 0 0 rgba(110, 0, 255, 0); } |
|
|
} |
|
|
|
|
|
.glitch { |
|
|
position: relative; |
|
|
} |
|
|
|
|
|
.glitch::before, .glitch::after { |
|
|
content: attr(data-text); |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background: var(--dark); |
|
|
} |
|
|
|
|
|
.glitch::before { |
|
|
left: 2px; |
|
|
text-shadow: -2px 0 var(--secondary); |
|
|
clip: rect(44px, 450px, 56px, 0); |
|
|
animation: glitch-anim 5s infinite linear alternate-reverse; |
|
|
} |
|
|
|
|
|
.glitch::after { |
|
|
left: -2px; |
|
|
text-shadow: -2px 0 var(--accent); |
|
|
clip: rect(44px, 450px, 56px, 0); |
|
|
animation: glitch-anim2 5s infinite linear alternate-reverse; |
|
|
} |
|
|
|
|
|
@keyframes glitch-anim { |
|
|
0% { clip: rect(31px, 9999px, 94px, 0); } |
|
|
10% { clip: rect(112px, 9999px, 76px, 0); } |
|
|
20% { clip: rect(85px, 9999px, 77px, 0); } |
|
|
30% { clip: rect(27px, 9999px, 97px, 0); } |
|
|
40% { clip: rect(64px, 9999px, 98px, 0); } |
|
|
50% { clip: rect(61px, 9999px, 85px, 0); } |
|
|
60% { clip: rect(99px, 9999px, 114px, 0); } |
|
|
70% { clip: rect(34px, 9999px, 115px, 0); } |
|
|
80% { clip: rect(98px, 9999px, 129px, 0); } |
|
|
90% { clip: rect(43px, 9999px, 96px, 0); } |
|
|
100% { clip: rect(82px, 9999px, 64px, 0); } |
|
|
} |
|
|
|
|
|
@keyframes glitch-anim2 { |
|
|
0% { clip: rect(65px, 9999px, 119px, 0); } |
|
|
10% { clip: rect(120px, 9999px, 152px, 0); } |
|
|
20% { clip: rect(85px, 9999px, 16px, 0); } |
|
|
30% { clip: rect(20px, 9999px, 96px, 0); } |
|
|
40% { clip: rect(79px, 9999px, 53px, 0); } |
|
|
50% { clip: rect(64px, 9999px, 34px, 0); } |
|
|
60% { clip: rect(105px, 9999px, 79px, 0); } |
|
|
70% { clip: rect(30px, 9999px, 105px, 0); } |
|
|
80% { clip: rect(88px, 9999px, 99px, 0); } |
|
|
90% { clip: rect(83px, 9999px, 42px, 0); } |
|
|
100% { clip: rect(31px, 9999px, 128px, 0); } |
|
|
} |
|
|
|
|
|
.terminal { |
|
|
background-color: rgba(10, 10, 26, 0.8); |
|
|
border: 1px solid var(--primary); |
|
|
border-radius: 5px; |
|
|
font-family: 'Courier New', monospace; |
|
|
padding: 15px; |
|
|
height: 300px; |
|
|
overflow-y: auto; |
|
|
} |
|
|
|
|
|
.terminal-line { |
|
|
margin-bottom: 5px; |
|
|
line-height: 1.5; |
|
|
} |
|
|
|
|
|
.prompt { |
|
|
color: var(--accent); |
|
|
} |
|
|
|
|
|
.command { |
|
|
color: var(--light); |
|
|
} |
|
|
|
|
|
.response { |
|
|
color: var(--secondary); |
|
|
} |
|
|
|
|
|
.progress-container { |
|
|
height: 5px; |
|
|
background-color: rgba(255, 255, 255, 0.1); |
|
|
border-radius: 5px; |
|
|
margin: 10px 0; |
|
|
} |
|
|
|
|
|
.progress-bar { |
|
|
height: 100%; |
|
|
border-radius: 5px; |
|
|
background: linear-gradient(90deg, var(--primary), var(--secondary)); |
|
|
transition: width 0.3s ease; |
|
|
} |
|
|
|
|
|
.security-level { |
|
|
position: relative; |
|
|
height: 10px; |
|
|
background: linear-gradient(90deg, |
|
|
#ff0000, |
|
|
#ff5e00, |
|
|
#ffbb00, |
|
|
#d4ff00, |
|
|
#6aff00, |
|
|
#00ff59, |
|
|
#00ffbb, |
|
|
#00e1ff, |
|
|
#0084ff, |
|
|
#0022ff); |
|
|
border-radius: 5px; |
|
|
margin: 15px 0; |
|
|
} |
|
|
|
|
|
.security-level::after { |
|
|
content: ''; |
|
|
position: absolute; |
|
|
top: -5px; |
|
|
left: calc(95% - 5px); |
|
|
width: 10px; |
|
|
height: 20px; |
|
|
background-color: white; |
|
|
border-radius: 2px; |
|
|
} |
|
|
|
|
|
.neon-border { |
|
|
border: 1px solid var(--primary); |
|
|
box-shadow: 0 0 10px var(--primary), |
|
|
inset 0 0 10px var(--primary); |
|
|
} |
|
|
|
|
|
.neon-text { |
|
|
text-shadow: 0 0 5px var(--primary), |
|
|
0 0 10px var(--primary), |
|
|
0 0 15px var(--primary), |
|
|
0 0 20px var(--secondary); |
|
|
} |
|
|
|
|
|
.hypno-grid { |
|
|
background-image: |
|
|
radial-gradient(circle, var(--primary) 1px, transparent 1px), |
|
|
radial-gradient(circle, var(--secondary) 1px, transparent 1px); |
|
|
background-size: 50px 50px; |
|
|
background-position: 0 0, 25px 25px; |
|
|
opacity: 0.1; |
|
|
position: fixed; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
z-index: -1; |
|
|
} |
|
|
|
|
|
.binaural-control { |
|
|
background: linear-gradient(90deg, var(--dark), var(--primary), var(--dark)); |
|
|
height: 40px; |
|
|
border-radius: 20px; |
|
|
position: relative; |
|
|
} |
|
|
|
|
|
.binaural-knob { |
|
|
position: absolute; |
|
|
width: 30px; |
|
|
height: 30px; |
|
|
background-color: var(--accent); |
|
|
border-radius: 50%; |
|
|
top: 5px; |
|
|
left: 50%; |
|
|
transform: translateX(-50%); |
|
|
cursor: ew-resize; |
|
|
} |
|
|
|
|
|
.theta-indicator { |
|
|
position: relative; |
|
|
width: 100%; |
|
|
height: 50px; |
|
|
background: linear-gradient(90deg, |
|
|
#000428, |
|
|
#004e92, |
|
|
#00b4db, |
|
|
#00f5a0, |
|
|
#00f5a0, |
|
|
#00b4db, |
|
|
#004e92, |
|
|
#000428); |
|
|
border-radius: 5px; |
|
|
overflow: hidden; |
|
|
} |
|
|
|
|
|
.theta-wave-indicator { |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background: linear-gradient(90deg, |
|
|
rgba(255, 255, 255, 0) 0%, |
|
|
rgba(255, 255, 255, 0.3) 50%, |
|
|
rgba(255, 255, 255, 0) 100%); |
|
|
animation: theta-wave 3s infinite linear; |
|
|
} |
|
|
|
|
|
@keyframes theta-wave { |
|
|
0% { transform: translateX(-100%); } |
|
|
100% { transform: translateX(100%); } |
|
|
} |
|
|
|
|
|
.suggestion-card { |
|
|
background: rgba(20, 20, 40, 0.7); |
|
|
border-left: 3px solid var(--secondary); |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.suggestion-card:hover { |
|
|
background: rgba(30, 30, 60, 0.9); |
|
|
transform: translateX(5px); |
|
|
box-shadow: 0 0 15px var(--secondary); |
|
|
} |
|
|
|
|
|
.flashing { |
|
|
animation: flash 1s infinite; |
|
|
} |
|
|
|
|
|
@keyframes flash { |
|
|
0% { opacity: 1; } |
|
|
50% { opacity: 0.3; } |
|
|
100% { opacity: 1; } |
|
|
} |
|
|
|
|
|
|
|
|
.audio-visualizer { |
|
|
display: flex; |
|
|
align-items: flex-end; |
|
|
height: 60px; |
|
|
gap: 2px; |
|
|
margin: 10px 0; |
|
|
} |
|
|
|
|
|
.audio-bar { |
|
|
flex: 1; |
|
|
background: linear-gradient(to top, var(--accent), var(--secondary)); |
|
|
border-radius: 2px; |
|
|
min-width: 2px; |
|
|
transition: height 0.05s ease-out; |
|
|
} |
|
|
|
|
|
|
|
|
.vr-overlay { |
|
|
position: fixed; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background-color: rgba(0, 0, 0, 0.9); |
|
|
z-index: 1000; |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
display: none; |
|
|
} |
|
|
|
|
|
.vr-grid { |
|
|
position: absolute; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background-image: |
|
|
linear-gradient(rgba(110, 0, 255, 0.1) 1px, transparent 1px), |
|
|
linear-gradient(90deg, rgba(110, 0, 255, 0.1) 1px, transparent 1px); |
|
|
background-size: 50px 50px; |
|
|
opacity: 0.5; |
|
|
} |
|
|
|
|
|
.vr-content { |
|
|
position: relative; |
|
|
z-index: 2; |
|
|
text-align: center; |
|
|
max-width: 600px; |
|
|
padding: 20px; |
|
|
} |
|
|
|
|
|
|
|
|
.tutorial-modal { |
|
|
position: fixed; |
|
|
top: 0; |
|
|
left: 0; |
|
|
width: 100%; |
|
|
height: 100%; |
|
|
background-color: rgba(0, 0, 0, 0.8); |
|
|
z-index: 2000; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
display: none; |
|
|
} |
|
|
|
|
|
.tutorial-content { |
|
|
background-color: var(--dark); |
|
|
border: 2px solid var(--primary); |
|
|
border-radius: 10px; |
|
|
width: 80%; |
|
|
max-width: 800px; |
|
|
max-height: 80vh; |
|
|
overflow-y: auto; |
|
|
padding: 20px; |
|
|
position: relative; |
|
|
} |
|
|
|
|
|
.close-tutorial { |
|
|
position: absolute; |
|
|
top: 10px; |
|
|
right: 10px; |
|
|
background: none; |
|
|
border: none; |
|
|
color: var(--light); |
|
|
font-size: 1.5rem; |
|
|
cursor: pointer; |
|
|
} |
|
|
|
|
|
|
|
|
.audio-player { |
|
|
width: 100%; |
|
|
margin: 10px 0; |
|
|
} |
|
|
|
|
|
|
|
|
.active-module { |
|
|
animation: pulse-module 2s infinite; |
|
|
box-shadow: 0 0 15px var(--accent); |
|
|
} |
|
|
|
|
|
@keyframes pulse-module { |
|
|
0% { box-shadow: 0 0 5px var(--accent); } |
|
|
50% { box-shadow: 0 0 20px var(--accent); } |
|
|
100% { box-shadow: 0 0 5px var(--accent); } |
|
|
} |
|
|
|
|
|
|
|
|
@media (max-width: 768px) { |
|
|
.terminal { |
|
|
height: 200px; |
|
|
} |
|
|
|
|
|
.grid-cols-1.md\:grid-cols-4 { |
|
|
grid-template-columns: repeat(2, 1fr); |
|
|
} |
|
|
|
|
|
.grid-cols-1.lg\:grid-cols-3 { |
|
|
grid-template-columns: 1fr; |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="hypno-grid"></div> |
|
|
<div class="hypno-spiral w-64 h-64 top-1/4 -left-32"></div> |
|
|
<div class="hypno-spiral w-96 h-96 -bottom-48 -right-48"></div> |
|
|
|
|
|
|
|
|
<div class="vr-overlay" id="vrOverlay"> |
|
|
<div class="vr-grid"></div> |
|
|
<div class="vr-content"> |
|
|
<h2 class="text-3xl font-bold text-purple-400 mb-4">VR IMMERSION ACTIVE</h2> |
|
|
<div class="audio-visualizer" id="vrVisualizer"> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
<div class="audio-bar"></div> |
|
|
</div> |
|
|
<p class="text-gray-300 mb-6">You are now in a deep hypnotic state. Follow the voice instructions for optimal neural reprogramming.</p> |
|
|
<button id="exitVR" class="px-6 py-2 bg-gradient-to-r from-red-500 to-pink-600 rounded-full font-bold text-sm uppercase tracking-wider hover:from-red-600 hover:to-pink-700 transition-all transform hover:scale-105 flex items-center mx-auto"> |
|
|
<i class="fas fa-sign-out-alt mr-2"></i> Exit VR Mode |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="tutorial-modal" id="tutorialModal"> |
|
|
<div class="tutorial-content"> |
|
|
<button class="close-tutorial" id="closeTutorial">×</button> |
|
|
<h2 class="text-2xl font-bold text-purple-400 mb-4">HYPNOS-X USER GUIDE</h2> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<h3 class="text-xl font-bold text-blue-400 mb-2">Getting Started</h3> |
|
|
<p class="text-gray-300 mb-4">HYPNOS-X is an advanced AI-powered hypnotic induction system designed for deep neural reprogramming. Follow these steps to begin:</p> |
|
|
<ol class="list-decimal list-inside text-gray-300 space-y-2"> |
|
|
<li>Select your desired theta wave frequency (4-7Hz for optimal hypnosis)</li> |
|
|
<li>Adjust binaural beats to match the subject's brainwave state</li> |
|
|
<li>Choose a suggestion profile based on desired outcome</li> |
|
|
<li>Initiate the induction sequence</li> |
|
|
</ol> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<h3 class="text-xl font-bold text-green-400 mb-2">Module Explanations</h3> |
|
|
<div class="space-y-4"> |
|
|
<div> |
|
|
<h4 class="font-bold text-pink-400">Hypnotic Induction Module</h4> |
|
|
<p class="text-gray-300">Controls the core hypnotic process with theta wave entrainment and binaural beats synchronization.</p> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold text-red-400">State Breaking Module</h4> |
|
|
<p class="text-gray-300">Contains tools for interrupting unwanted trance states or reversing previous suggestions.</p> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-bold text-blue-400">Experimental Modules</h4> |
|
|
<p class="text-gray-300">Advanced features including VR immersion, subliminal messaging, and direct neural pathway manipulation.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<h3 class="text-xl font-bold text-yellow-400 mb-2">Safety Protocols</h3> |
|
|
<ul class="list-disc list-inside text-gray-300 space-y-2"> |
|
|
<li>Always monitor subject's vital signs during extended sessions</li> |
|
|
<li>Use state breaking module if subject shows distress</li> |
|
|
<li>Limit neural rewiring sessions to 20 minutes maximum</li> |
|
|
<li>Never leave subject unattended during active induction</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-xl font-bold text-purple-400 mb-2">Advanced Features</h3> |
|
|
<p class="text-gray-300">For certified operators only:</p> |
|
|
<div class="bg-gray-800 rounded-lg p-4 mt-2"> |
|
|
<h4 class="font-bold text-accent mb-2">Neural Rewiring</h4> |
|
|
<p class="text-xs text-gray-400">Direct pathway manipulation can create permanent behavioral changes. Use extreme caution.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="container mx-auto px-4 py-8"> |
|
|
|
|
|
<header class="flex justify-between items-center mb-10"> |
|
|
<div class="flex items-center"> |
|
|
<div class="w-12 h-12 rounded-full bg-gradient-to-br from-purple-600 to-pink-500 mr-4 flex items-center justify-center neon-text"> |
|
|
<i class="fas fa-brain text-2xl"></i> |
|
|
</div> |
|
|
<h1 class="text-4xl font-bold glitch" data-text="HYPNOS-X">HYPNOS-X</h1> |
|
|
</div> |
|
|
<div class="flex items-center space-x-4"> |
|
|
<button id="showTutorial" class="px-4 py-2 bg-gray-700 rounded-full text-sm font-bold hover:bg-gray-600 transition-all"> |
|
|
<i class="fas fa-question-circle mr-2"></i> Help |
|
|
</button> |
|
|
<div class="relative group"> |
|
|
<button class="px-6 py-2 bg-gradient-to-r from-purple-600 to-blue-500 rounded-full font-bold text-sm uppercase tracking-wider hover:from-purple-700 hover:to-blue-600 transition-all duration-300 transform hover:scale-105"> |
|
|
<i class="fas fa-user-secret mr-2"></i> Operative Login |
|
|
</button> |
|
|
<div class="absolute right-0 mt-2 w-72 bg-gray-900 rounded-md shadow-lg z-50 hidden group-hover:block p-4 border border-purple-500"> |
|
|
<h3 class="text-sm font-bold text-purple-400 mb-2">SECURE ACCESS</h3> |
|
|
<div class="mb-3"> |
|
|
<label class="block text-xs text-gray-400 mb-1">Operative ID</label> |
|
|
<input type="text" class="w-full bg-gray-800 border border-gray-700 rounded px-3 py-2 text-sm focus:outline-none focus:border-purple-500"> |
|
|
</div> |
|
|
<div class="mb-3"> |
|
|
<label class="block text-xs text-gray-400 mb-1">Neural Key</label> |
|
|
<input type="password" class="w-full bg-gray-800 border border-gray-700 rounded px-3 py-2 text-sm focus:outline-none focus:border-purple-500"> |
|
|
</div> |
|
|
<button class="w-full bg-gradient-to-r from-purple-600 to-blue-500 text-white py-2 rounded text-sm font-bold hover:from-purple-700 hover:to-blue-600 transition-all"> |
|
|
<i class="fas fa-fingerprint mr-2"></i> Biometric Auth |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="w-10 h-10 rounded-full bg-gradient-to-br from-purple-600 to-pink-500 flex items-center justify-center cursor-pointer pulse" id="powerButton"> |
|
|
<i class="fas fa-power-off"></i> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 mb-8 neon-border"> |
|
|
<div class="flex justify-between items-center mb-4"> |
|
|
<h2 class="text-2xl font-bold text-purple-400 flex items-center"> |
|
|
<i class="fas fa-shield-alt mr-3"></i> SYSTEM STATUS |
|
|
</h2> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-xs bg-green-900 text-green-300 px-2 py-1 rounded mr-2">ENCRYPTED</span> |
|
|
<span class="text-xs bg-blue-900 text-blue-300 px-2 py-1 rounded mr-2">LOCAL DEPLOY</span> |
|
|
<span class="text-xs bg-purple-900 text-purple-300 px-2 py-1 rounded">BLOCKCHAIN VERIFIED</span> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-4"> |
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4"> |
|
|
<div class="flex justify-between items-center mb-2"> |
|
|
<span class="text-xs text-gray-400">NEURAL FIREWALL</span> |
|
|
<span class="text-xs bg-green-500 text-white px-2 py-0.5 rounded">ACTIVE</span> |
|
|
</div> |
|
|
<div class="progress-container"> |
|
|
<div class="progress-bar" style="width: 92%"></div> |
|
|
</div> |
|
|
<div class="text-right text-xs text-green-400">92%</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4"> |
|
|
<div class="flex justify-between items-center mb-2"> |
|
|
<span class="text-xs text-gray-400">THETA ENCRYPTION</span> |
|
|
<span class="text-xs bg-green-500 text-white px-2 py-0.5 rounded">ACTIVE</span> |
|
|
</div> |
|
|
<div class="progress-container"> |
|
|
<div class="progress-bar" style="width: 88%"></div> |
|
|
</div> |
|
|
<div class="text-right text-xs text-green-400">88%</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4"> |
|
|
<div class="flex justify-between items-center mb-2"> |
|
|
<span class="text-xs text-gray-400">SUGGESTION FILTER</span> |
|
|
<span class="text-xs bg-yellow-500 text-white px-2 py-0.5 rounded">LEARNING</span> |
|
|
</div> |
|
|
<div class="progress-container"> |
|
|
<div class="progress-bar" style="width: 76%"></div> |
|
|
</div> |
|
|
<div class="text-right text-xs text-yellow-400">76%</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4"> |
|
|
<div class="flex justify-between items-center mb-2"> |
|
|
<span class="text-xs text-gray-400">DEFENSE MECHANISM</span> |
|
|
<span class="text-xs bg-green-500 text-white px-2 py-0.5 rounded">ACTIVE</span> |
|
|
</div> |
|
|
<div class="progress-container"> |
|
|
<div class="progress-bar" style="width: 95%"></div> |
|
|
</div> |
|
|
<div class="text-right text-xs text-green-400">95%</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-3"> |
|
|
<label class="block text-xs text-gray-400 mb-1">SECURITY LEVEL</label> |
|
|
<div class="security-level"></div> |
|
|
<div class="flex justify-between text-xs text-gray-400"> |
|
|
<span>LOW</span> |
|
|
<span>ULTRA</span> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex justify-between items-center text-xs"> |
|
|
<div class="flex items-center"> |
|
|
<div class="w-3 h-3 rounded-full bg-green-500 mr-2"></div> |
|
|
<span class="text-green-400">SELF-HEALING ACTIVE</span> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<div class="w-3 h-3 rounded-full bg-purple-500 mr-2"></div> |
|
|
<span class="text-purple-400">OBFUSCATION: LEVEL 9</span> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<div class="w-3 h-3 rounded-full bg-blue-500 mr-2"></div> |
|
|
<span class="text-blue-400">2FA: BIOMETRIC + NEURAL</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8 mb-8"> |
|
|
|
|
|
<div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 neon-border lg:col-span-2" id="inductionModule"> |
|
|
<div class="flex justify-between items-center mb-6"> |
|
|
<h2 class="text-2xl font-bold text-pink-400 flex items-center"> |
|
|
<i class="fas fa-eye mr-3"></i> HYPNOTIC INDUCTION MODULE |
|
|
</h2> |
|
|
<div class="flex space-x-2"> |
|
|
<button id="quickStart" class="px-4 py-1 bg-gradient-to-r from-purple-600 to-pink-500 rounded-full text-xs font-bold uppercase tracking-wider hover:from-purple-700 hover:to-pink-600 transition-all"> |
|
|
<i class="fas fa-bolt mr-1"></i> Quick Start |
|
|
</button> |
|
|
<button id="advancedSettings" class="px-4 py-1 bg-gray-700 rounded-full text-xs font-bold uppercase tracking-wider hover:bg-gray-600 transition-all"> |
|
|
<i class="fas fa-sliders-h mr-1"></i> Advanced |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6"> |
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4"> |
|
|
<h3 class="text-sm font-bold text-purple-400 mb-3 flex items-center"> |
|
|
<i class="fas fa-brain mr-2"></i> THETA WAVE ENTRAINMENT |
|
|
</h3> |
|
|
<div class="theta-indicator mb-3"> |
|
|
<div class="theta-wave-indicator"></div> |
|
|
</div> |
|
|
<div class="flex justify-between text-xs text-gray-400 mb-3"> |
|
|
<span>4Hz</span> |
|
|
<span>7Hz</span> |
|
|
</div> |
|
|
<input type="range" min="4" max="7" step="0.1" value="5.5" class="w-full accent-purple-500" id="thetaFrequency"> |
|
|
<audio id="thetaAudio" loop> |
|
|
<source src="https://assets.mixkit.co/sfx/preview/mixkit-digital-clock-digital-alarm-buzzer-992.mp3" type="audio/mpeg"> |
|
|
</audio> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4"> |
|
|
<h3 class="text-sm font-bold text-blue-400 mb-3 flex items-center"> |
|
|
<i class="fas fa-headphones mr-2"></i> BINAURAL BEATS |
|
|
</h3> |
|
|
<div class="binaural-control mb-3" id="binauralControl"> |
|
|
<div class="binaural-knob" id="binauralKnob"></div> |
|
|
</div> |
|
|
<div class="flex justify-between text-xs text-gray-400"> |
|
|
<span>Delta</span> |
|
|
<span>Theta</span> |
|
|
<span>Alpha</span> |
|
|
<span>Beta</span> |
|
|
</div> |
|
|
<audio id="binauralAudio" loop> |
|
|
<source src="https://assets.mixkit.co/sfx/preview/mixkit-digital-clock-digital-alarm-buzzer-992.mp3" type="audio/mpeg"> |
|
|
</audio> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<h3 class="text-sm font-bold text-green-400 mb-2 flex items-center"> |
|
|
<i class="fas fa-comment-dots mr-2"></i> SUGGESTION PROFILE |
|
|
</h3> |
|
|
<div class="grid grid-cols-1 sm:grid-cols-3 gap-3" id="suggestionProfiles"> |
|
|
<div class="suggestion-card p-3 rounded cursor-pointer" data-profile="savage"> |
|
|
<div class="flex items-center mb-1"> |
|
|
<div class="w-2 h-2 rounded-full bg-pink-500 mr-2"></div> |
|
|
<span class="text-xs font-bold text-pink-400">Savage</span> |
|
|
</div> |
|
|
<p class="text-xs text-gray-300">"You will obey without question..."</p> |
|
|
</div> |
|
|
<div class="suggestion-card p-3 rounded cursor-pointer" data-profile="relentless"> |
|
|
<div class="flex items-center mb-1"> |
|
|
<div class="w-2 h-2 rounded-full bg-purple-500 mr-2"></div> |
|
|
<span class="text-xs font-bold text-purple-400">Relentless</span> |
|
|
</div> |
|
|
<p class="text-xs text-gray-300">"Your resistance is fading fast..."</p> |
|
|
</div> |
|
|
<div class="suggestion-card p-3 rounded cursor-pointer" data-profile="brutal"> |
|
|
<div class="flex items-center mb-1"> |
|
|
<div class="w-2 h-2 rounded-full bg-blue-500 mr-2"></div> |
|
|
<span class="text-xs font-bold text-blue-400">Brutal</span> |
|
|
</div> |
|
|
<p class="text-xs text-gray-300">"Your mind is breaking down..."</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-sm font-bold text-yellow-400 mb-2 flex items-center"> |
|
|
<i class="fas fa-user-cog mr-2"></i> PERSONALIZATION |
|
|
</h3> |
|
|
<div class="terminal mb-3" id="inductionTerminal"> |
|
|
<div class="terminal-line"> |
|
|
<span class="prompt">></span> <span class="command">analyze_subject --profile=aggressive</span> |
|
|
</div> |
|
|
<div class="terminal-line response"> |
|
|
Analyzing psychological profile... Detected high susceptibility to authority triggers. |
|
|
</div> |
|
|
<div class="terminal-line"> |
|
|
<span class="prompt">></span> <span class="command">optimize_suggestions --type=brutal --level=9</span> |
|
|
</div> |
|
|
<div class="terminal-line response"> |
|
|
Optimizing suggestion scripts... 87% match with subject's neural patterns. |
|
|
</div> |
|
|
<div class="terminal-line"> |
|
|
<span class="prompt">></span> <span class="command">initiate_theta_sequence --frequency=5.8Hz</span> |
|
|
</div> |
|
|
<div class="terminal-line response flashing"> |
|
|
WARNING: Entering theta state in 3... 2... 1... |
|
|
</div> |
|
|
</div> |
|
|
<div class="flex justify-end"> |
|
|
<button id="beginInduction" class="px-6 py-2 bg-gradient-to-r from-red-500 to-pink-600 rounded-full font-bold text-sm uppercase tracking-wider hover:from-red-600 hover:to-pink-700 transition-all transform hover:scale-105 flex items-center"> |
|
|
<i class="fas fa-play mr-2"></i> Begin Induction |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 neon-border" id="stateBreakingModule"> |
|
|
<div class="flex justify-between items-center mb-6"> |
|
|
<h2 class="text-2xl font-bold text-red-400 flex items-center"> |
|
|
<i class="fas fa-unlink mr-3"></i> STATE BREAKING MODULE |
|
|
</h2> |
|
|
<div class="w-6 h-6 rounded-full bg-red-500 flex items-center justify-center"> |
|
|
<i class="fas fa-exclamation text-xs"></i> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<h3 class="text-sm font-bold text-orange-400 mb-3 flex items-center"> |
|
|
<i class="fas fa-bolt mr-2"></i> AGGRESSIVE AWAKENING |
|
|
</h3> |
|
|
<div class="grid grid-cols-2 gap-3 mb-4"> |
|
|
<button id="auditoryShock" class="px-3 py-2 bg-gray-800 rounded text-xs font-bold text-red-400 hover:bg-gray-700 transition-all flex items-center justify-center"> |
|
|
<i class="fas fa-volume-up mr-2"></i> Auditory Shock |
|
|
</button> |
|
|
<button id="visualFlash" class="px-3 py-2 bg-gray-800 rounded text-xs font-bold text-purple-400 hover:bg-gray-700 transition-all flex items-center justify-center"> |
|
|
<i class="fas fa-lightbulb mr-2"></i> Visual Flash |
|
|
</button> |
|
|
<button id="tactilePulse" class="px-3 py-2 bg-gray-800 rounded text-xs font-bold text-yellow-400 hover:bg-gray-700 transition-all flex items-center justify-center"> |
|
|
<i class="fas fa-hand-paper mr-2"></i> Tactile Pulse |
|
|
</button> |
|
|
<button id="patternReverse" class="px-3 py-2 bg-gray-800 rounded text-xs font-bold text-blue-400 hover:bg-gray-700 transition-all flex items-center justify-center"> |
|
|
<i class="fas fa-sync-alt mr-2"></i> Pattern Reverse |
|
|
</button> |
|
|
</div> |
|
|
<div class="relative"> |
|
|
<div class="theta-wave"></div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<h3 class="text-sm font-bold text-green-400 mb-3 flex items-center"> |
|
|
<i class="fas fa-undo mr-2"></i> SUGGESTION REVERSAL |
|
|
</h3> |
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4 mb-3"> |
|
|
<div class="flex justify-between items-center mb-2"> |
|
|
<span class="text-xs text-gray-400">Current Suggestion Strength</span> |
|
|
<span class="text-xs font-bold text-pink-400">87%</span> |
|
|
</div> |
|
|
<div class="progress-container"> |
|
|
<div class="progress-bar" style="width: 87%"></div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="flex space-x-2"> |
|
|
<button id="neutralize" class="flex-1 px-3 py-2 bg-gradient-to-r from-blue-600 to-green-500 rounded text-xs font-bold uppercase tracking-wider hover:from-blue-700 hover:to-green-600 transition-all"> |
|
|
<i class="fas fa-eraser mr-1"></i> Neutralize |
|
|
</button> |
|
|
<button id="reverse" class="flex-1 px-3 py-2 bg-gradient-to-r from-purple-600 to-red-500 rounded text-xs font-bold uppercase tracking-wider hover:from-purple-700 hover:to-red-600 transition-all"> |
|
|
<i class="fas fa-history mr-1"></i> Reverse |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h3 class="text-sm font-bold text-blue-400 mb-3 flex items-center"> |
|
|
<i class="fas fa-shield-virus mr-2"></i> DEFENSE MECHANISMS |
|
|
</h3> |
|
|
<div class="space-y-3"> |
|
|
<div class="flex items-center"> |
|
|
<input type="checkbox" id="neuralFirewall" checked class="w-4 h-4 text-purple-600 rounded focus:ring-purple-500"> |
|
|
<label for="neuralFirewall" class="ml-2 text-xs text-gray-300">Neural Firewall (Active)</label> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<input type="checkbox" id="patternScramble" checked class="w-4 h-4 text-blue-600 rounded focus:ring-blue-500"> |
|
|
<label for="patternScramble" class="ml-2 text-xs text-gray-300">Pattern Scrambler</label> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<input type="checkbox" id="suggestionFilter" checked class="w-4 h-4 text-green-600 rounded focus:ring-green-500"> |
|
|
<label for="suggestionFilter" class="ml-2 text-xs text-gray-300">Suggestion Filter</label> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<input type="checkbox" id="emergencyOverride" class="w-4 h-4 text-red-600 rounded focus:ring-red-500"> |
|
|
<label for="emergencyOverride" class="ml-2 text-xs text-gray-300">Emergency Override</label> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mt-4"> |
|
|
<button id="systemReset" class="w-full px-4 py-2 bg-gradient-to-r from-red-600 to-orange-500 rounded font-bold text-sm uppercase tracking-wider hover:from-red-700 hover:to-orange-600 transition-all transform hover:scale-105 flex items-center justify-center"> |
|
|
<i class="fas fa-skull-crossbones mr-2"></i> Full System Reset |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 mb-8 neon-border"> |
|
|
<div class="flex justify-between items-center mb-6"> |
|
|
<h2 class="text-2xl font-bold text-blue-400 flex items-center"> |
|
|
<i class="fas fa-flask mr-3"></i> EXPERIMENTAL MODULES |
|
|
</h2> |
|
|
<span class="text-xs bg-red-500 text-white px-2 py-1 rounded uppercase font-bold">Warning: Unstable</span> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6"> |
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-5" id="vrModule"> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="w-10 h-10 rounded-full bg-blue-900 flex items-center justify-center mr-3"> |
|
|
<i class="fas fa-vr-cardboard text-blue-300"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-bold text-blue-300">VR Immersion</h3> |
|
|
</div> |
|
|
<p class="text-xs text-gray-400 mb-4">Full virtual reality integration for deep hypnotic immersion using specialized headsets.</p> |
|
|
<div class="flex justify-between text-xs text-gray-400 mb-3"> |
|
|
<span>Immersion Level</span> |
|
|
<span class="font-bold text-blue-400">7/10</span> |
|
|
</div> |
|
|
<input type="range" min="1" max="10" value="7" class="w-full accent-blue-500 mb-4" id="immersionLevel"> |
|
|
<button id="activateVR" class="w-full px-4 py-2 bg-blue-800 rounded text-sm font-bold hover:bg-blue-700 transition-all"> |
|
|
<i class="fas fa-play mr-2"></i> Activate VR |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-5" id="subliminalModule"> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="w-10 h-10 rounded-full bg-purple-900 flex items-center justify-center mr-3"> |
|
|
<i class="fas fa-eye text-purple-300"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-bold text-purple-300">Subliminal Feed</h3> |
|
|
</div> |
|
|
<p class="text-xs text-gray-400 mb-4">Embedded subliminal messages at 1/30th second intervals for subconscious programming.</p> |
|
|
<div class="flex space-x-2 mb-4"> |
|
|
<button class="flex-1 px-2 py-1 bg-purple-800 rounded text-xs font-bold hover:bg-purple-700 transition-all subliminal-btn" data-type="obedience"> |
|
|
Obedience |
|
|
</button> |
|
|
<button class="flex-1 px-2 py-1 bg-purple-800 rounded text-xs font-bold hover:bg-purple-700 transition-all subliminal-btn" data-type="memory"> |
|
|
Memory |
|
|
</button> |
|
|
<button class="flex-1 px-2 py-1 bg-purple-800 rounded text-xs font-bold hover:bg-purple-700 transition-all subliminal-btn" data-type="behavior"> |
|
|
Behavior |
|
|
</button> |
|
|
</div> |
|
|
<button id="cycleMessages" class="w-full px-4 py-2 bg-purple-800 rounded text-sm font-bold hover:bg-purple-700 transition-all"> |
|
|
<i class="fas fa-sync-alt mr-2"></i> Cycle Messages |
|
|
</button> |
|
|
<audio id="subliminalAudio" loop> |
|
|
<source src="https://assets.mixkit.co/sfx/preview/mixkit-digital-clock-digital-alarm-buzzer-992.mp3" type="audio/mpeg"> |
|
|
</audio> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-5" id="neuralModule"> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="w-10 h-10 rounded-full bg-pink-900 flex items-center justify-center mr-3"> |
|
|
<i class="fas fa-dna text-pink-300"></i> |
|
|
</div> |
|
|
<h3 class="text-lg font-bold text-pink-300">Neural Rewiring</h3> |
|
|
</div> |
|
|
<p class="text-xs text-gray-400 mb-4">Direct neural pathway manipulation for permanent behavioral modification.</p> |
|
|
<div class="flex items-center justify-between mb-4"> |
|
|
<span class="text-xs text-gray-400">Rewiring Intensity</span> |
|
|
<div class="flex space-x-1" id="rewiringIntensity"> |
|
|
<button class="w-6 h-6 rounded-full bg-gray-700 text-xs flex items-center justify-center intensity-btn" data-level="1">1</button> |
|
|
<button class="w-6 h-6 rounded-full bg-gray-700 text-xs flex items-center justify-center intensity-btn" data-level="2">2</button> |
|
|
<button class="w-6 h-6 rounded-full bg-pink-700 text-white text-xs flex items-center justify-center intensity-btn" data-level="3">3</button> |
|
|
<button class="w-6 h-6 rounded-full bg-gray-700 text-xs flex items-center justify-center intensity-btn" data-level="4">4</button> |
|
|
<button class="w-6 h-6 rounded-full bg-gray-700 text-xs flex items-center justify-center intensity-btn" data-level="5">5</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="bg-gray-900 rounded p-3 mb-4"> |
|
|
<div class="flex justify-between text-xs mb-1"> |
|
|
<span class="text-gray-400">Current Pattern</span> |
|
|
<span class="text-pink-400">Alpha-9</span> |
|
|
</div> |
|
|
<div class="h-2 bg-gray-800 rounded-full overflow-hidden"> |
|
|
<div class="h-full bg-gradient-to-r from-pink-500 to-purple-600" style="width: 65%"></div> |
|
|
</div> |
|
|
</div> |
|
|
<button id="initiateRewiring" class="w-full px-4 py-2 bg-gradient-to-r from-pink-600 to-purple-600 rounded text-sm font-bold hover:from-pink-700 hover:to-purple-700 transition-all"> |
|
|
<i class="fas fa-bolt mr-2"></i> Initiate Rewiring |
|
|
</button> |
|
|
<audio id="rewiringAudio" loop> |
|
|
<source src="https://assets.mixkit.co/sfx/preview/mixkit-digital-clock-digital-alarm-buzzer-992.mp3" type="audio/mpeg"> |
|
|
</audio> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-gray-900 bg-opacity-70 rounded-xl p-6 neon-border"> |
|
|
<div class="flex justify-between items-center mb-6"> |
|
|
<h2 class="text-2xl font-bold text-green-400 flex items-center"> |
|
|
<i class="fas fa-download mr-3"></i> DEPLOYMENT MODULE |
|
|
</h2> |
|
|
<span class="text-xs bg-yellow-500 text-black px-2 py-1 rounded uppercase font-bold">Local Only</span> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6"> |
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-5"> |
|
|
<h3 class="text-lg font-bold text-green-300 mb-3 flex items-center"> |
|
|
<i class="fas fa-lock mr-2"></i> Secure Download |
|
|
</h3> |
|
|
<p class="text-xs text-gray-400 mb-4">Download the complete HYPNOS-X package for offline deployment. Includes all modules and security protocols.</p> |
|
|
<div class="flex items-center text-xs text-gray-400 mb-4"> |
|
|
<i class="fas fa-shield-alt text-green-500 mr-2"></i> |
|
|
<span>Package verified and signed with neural encryption</span> |
|
|
</div> |
|
|
<div class="bg-gray-900 rounded p-3 mb-4"> |
|
|
<div class="flex justify-between text-xs mb-1"> |
|
|
<span class="text-gray-400">File Size</span> |
|
|
<span class="text-green-400">487MB</span> |
|
|
</div> |
|
|
<div class="flex justify-between text-xs mb-1"> |
|
|
<span class="text-gray-400">Version</span> |
|
|
<span class="text-green-400">X.9.4.2</span> |
|
|
</div> |
|
|
<div class="flex justify-between text-xs"> |
|
|
<span class="text-gray-400">Security Hash</span> |
|
|
<span class="text-green-400">a3f8e...c72b</span> |
|
|
</div> |
|
|
</div> |
|
|
<button id="downloadPackage" class="w-full px-4 py-2 bg-gradient-to-r from-green-600 to-blue-600 rounded text-sm font-bold hover:from-green-700 hover:to-blue-700 transition-all"> |
|
|
<i class="fas fa-file-download mr-2"></i> Download Package |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-5"> |
|
|
<h3 class="text-lg font-bold text-yellow-300 mb-3 flex items-center"> |
|
|
<i class="fas fa-code-branch mr-2"></i> Blockchain Sync |
|
|
</h3> |
|
|
<p class="text-xs text-gray-400 mb-4">Synchronize with the HYPNOS blockchain network to verify integrity and access updates.</p> |
|
|
<div class="flex items-center text-xs text-gray-400 mb-4"> |
|
|
<i class="fas fa-link text-yellow-500 mr-2"></i> |
|
|
<span>Connected to 12/24 neural nodes</span> |
|
|
</div> |
|
|
<div class="bg-gray-900 rounded p-3 mb-4"> |
|
|
<div class="flex justify-between text-xs mb-1"> |
|
|
<span class="text-gray-400">Block Height</span> |
|
|
<span class="text-yellow-400">892,471</span> |
|
|
</div> |
|
|
<div class="flex justify-between text-xs mb-1"> |
|
|
<span class="text-gray-400">Last Verified</span> |
|
|
<span class="text-yellow-400">3.2s ago</span> |
|
|
</div> |
|
|
<div class="flex justify-between text-xs"> |
|
|
<span class="text-gray-400">Consensus</span> |
|
|
<span class="text-yellow-400">98.7%</span> |
|
|
</div> |
|
|
</div> |
|
|
<button id="forceResync" class="w-full px-4 py-2 bg-gradient-to-r from-yellow-600 to-orange-600 rounded text-sm font-bold hover:from-yellow-700 hover:to-orange-700 transition-all"> |
|
|
<i class="fas fa-sync-alt mr-2"></i> Force Resync |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="bg-gray-800 bg-opacity-70 rounded-lg p-4"> |
|
|
<h3 class="text-sm font-bold text-red-400 mb-2 flex items-center"> |
|
|
<i class="fas fa-exclamation-triangle mr-2"></i> WARNING |
|
|
</h3> |
|
|
<p class="text-xs text-gray-400"> |
|
|
Unauthorized replication or modification of HYPNOS-X code will trigger neural encryption lockdown and immediate termination of access privileges. |
|
|
All operatives must comply with protocol Alpha-9 security measures. Violators will be subject to memory purge and behavioral reset. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<footer class="mt-10 text-center text-xs text-gray-500"> |
|
|
<div class="flex justify-center space-x-4 mb-2"> |
|
|
<span>HYPNOS-X v9.4.2</span> |
|
|
<span>|</span> |
|
|
<span>Neural Core Active</span> |
|
|
<span>|</span> |
|
|
<span>Theta Encryption: 256-bit</span> |
|
|
</div> |
|
|
<p>© 2023 HYPNOS Corporation. All rights reserved. Unauthorized access prohibited.</p> |
|
|
</footer> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
|
|
|
let systemActive = false; |
|
|
let inductionActive = false; |
|
|
let vrActive = false; |
|
|
let subliminalActive = false; |
|
|
let rewiringActive = false; |
|
|
let selectedProfile = null; |
|
|
let currentIntensity = 3; |
|
|
|
|
|
|
|
|
const powerButton = document.getElementById('powerButton'); |
|
|
const showTutorial = document.getElementById('showTutorial'); |
|
|
const closeTutorial = document.getElementById('closeTutorial'); |
|
|
const tutorialModal = document.getElementById('tutorialModal'); |
|
|
const vrOverlay = document.getElementById('vrOverlay'); |
|
|
const exitVR = document.getElementById('exitVR'); |
|
|
const vrVisualizer = document.getElementById('vrVisualizer'); |
|
|
|
|
|
|
|
|
const quickStart = document.getElementById('quickStart'); |
|
|
const advancedSettings = document.getElementById('advancedSettings'); |
|
|
const beginInduction = document.getElementById('beginInduction'); |
|
|
const thetaFrequency = document.getElementById('thetaFrequency'); |
|
|
const thetaAudio = document.getElementById('thetaAudio'); |
|
|
const binauralKnob = document.getElementById('binauralKnob'); |
|
|
const binauralControl = document.getElementById('binauralControl'); |
|
|
const binauralAudio = document.getElementById('binauralAudio'); |
|
|
const suggestionProfiles = document.getElementById('suggestionProfiles'); |
|
|
const inductionTerminal = document.getElementById('inductionTerminal'); |
|
|
const inductionModule = document.getElementById('inductionModule'); |
|
|
|
|
|
|
|
|
const auditoryShock = document.getElementById('auditoryShock'); |
|
|
const visualFlash = document.getElementById('visualFlash'); |
|
|
const tactilePulse = document.getElementById('tactilePulse'); |
|
|
const patternReverse = document.getElementById('patternReverse'); |
|
|
const neutralize = document.getElementById('neutralize'); |
|
|
const reverse = document.getElementById('reverse'); |
|
|
const systemReset = document.getElementById('systemReset'); |
|
|
const stateBreakingModule = document.getElementById('stateBreakingModule'); |
|
|
|
|
|
|
|
|
const activateVR = document.getElementById('activateVR'); |
|
|
const immersionLevel = document.getElementById('immersionLevel'); |
|
|
const vrModule = document.getElementById('vrModule'); |
|
|
const subliminalBtns = document.querySelectorAll('.subliminal-btn'); |
|
|
const cycleMessages = document.getElementById('cycleMessages'); |
|
|
const subliminalAudio = document.getElementById('subliminalAudio'); |
|
|
const subliminalModule = document.getElementById('subliminalModule'); |
|
|
const intensityBtns = document.querySelectorAll('.intensity-btn'); |
|
|
const initiateRewiring = document.getElementById('initiateRewiring'); |
|
|
const rewiringAudio = document.getElementById('rewiringAudio'); |
|
|
const neuralModule = document.getElementById('neuralModule'); |
|
|
|
|
|
|
|
|
const downloadPackage = document.getElementById('downloadPackage'); |
|
|
const forceResync = document.getElementById('forceResync'); |
|
|
|
|
|
|
|
|
powerButton.addEventListener('click', toggleSystem); |
|
|
showTutorial.addEventListener('click', () => tutorialModal.style.display = 'flex'); |
|
|
closeTutorial.addEventListener('click', () => tutorialModal.style.display = 'none'); |
|
|
|
|
|
|
|
|
quickStart.addEventListener('click', startQuickInduction); |
|
|
advancedSettings.addEventListener('click', showAdvancedSettings); |
|
|
beginInduction.addEventListener('click', toggleInduction); |
|
|
thetaFrequency.addEventListener('input', updateThetaFrequency); |
|
|
|
|
|
|
|
|
let isDragging = false; |
|
|
let startX, startLeft; |
|
|
|
|
|
binauralKnob.addEventListener('mousedown', (e) => { |
|
|
isDragging = true; |
|
|
startX = e.clientX; |
|
|
startLeft = parseInt(window.getComputedStyle(binauralKnob).left); |
|
|
document.body.style.cursor = 'ew-resize'; |
|
|
}); |
|
|
|
|
|
document.addEventListener('mousemove', (e) => { |
|
|
if (!isDragging) return; |
|
|
|
|
|
const controlRect = binauralControl.getBoundingClientRect(); |
|
|
const controlWidth = controlRect.width; |
|
|
const knobWidth = binauralKnob.offsetWidth; |
|
|
|
|
|
let newLeft = startLeft + (e.clientX - startX); |
|
|
newLeft = Math.max(5, Math.min(newLeft, controlWidth - knobWidth - 5)); |
|
|
|
|
|
binauralKnob.style.left = `${newLeft}px`; |
|
|
updateBinauralFrequency(newLeft, controlWidth); |
|
|
}); |
|
|
|
|
|
document.addEventListener('mouseup', () => { |
|
|
isDragging = false; |
|
|
document.body.style.cursor = ''; |
|
|
}); |
|
|
|
|
|
|
|
|
suggestionProfiles.querySelectorAll('.suggestion-card').forEach(card => { |
|
|
card.addEventListener('click', function() { |
|
|
suggestionProfiles.querySelectorAll('.suggestion-card').forEach(c => { |
|
|
c.style.borderLeft = '3px solid transparent'; |
|
|
}); |
|
|
this.style.borderLeft = `3px solid ${this.querySelector('div').style.backgroundColor}`; |
|
|
selectedProfile = this.getAttribute('data-profile'); |
|
|
|
|
|
|
|
|
addTerminalLine(`set_profile --type=${selectedProfile}`, `Profile set to ${selectedProfile}. Loading suggestion scripts...`, inductionTerminal); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
auditoryShock.addEventListener('click', () => triggerStateBreak('auditory')); |
|
|
visualFlash.addEventListener('click', () => triggerStateBreak('visual')); |
|
|
tactilePulse.addEventListener('click', () => triggerStateBreak('tactile')); |
|
|
patternReverse.addEventListener('click', () => triggerStateBreak('pattern')); |
|
|
neutralize.addEventListener('click', neutralizeSuggestions); |
|
|
reverse.addEventListener('click', reverseSuggestions); |
|
|
systemReset.addEventListener('click', resetSystem); |
|
|
|
|
|
|
|
|
activateVR.addEventListener('click', toggleVR); |
|
|
exitVR.addEventListener('click', toggleVR); |
|
|
|
|
|
subliminalBtns.forEach(btn => { |
|
|
btn.addEventListener('click', function() { |
|
|
subliminalBtns.forEach(b => b.classList.remove('bg-purple-600')); |
|
|
this.classList.add('bg-purple-600'); |
|
|
|
|
|
}); |
|
|
}); |
|
|
|
|
|
cycleMessages.addEventListener('click', () => { |
|
|
|
|
|
addTerminalLine('cycle_subliminal --speed=30fps', 'Cycling subliminal messages at 30 frames per second', inductionTerminal); |
|
|
}); |
|
|
|
|
|
intensityBtns.forEach(btn => { |
|
|
btn.addEventListener('click', function() { |
|
|
intensityBtns.forEach(b => { |
|
|
b.classList.remove('bg-pink-700', 'text-white'); |
|
|
b.classList.add('bg-gray-700'); |
|
|
}); |
|
|
this.classList.remove('bg-gray-700'); |
|
|
this.classList.add('bg-pink-700', 'text-white'); |
|
|
currentIntensity = parseInt(this.getAttribute('data-level')); |
|
|
}); |
|
|
}); |
|
|
|
|
|
initiateRewiring.addEventListener('click', toggleNeuralRewiring); |
|
|
|
|
|
|
|
|
downloadPackage.addEventListener('click', () => { |
|
|
alert('Download would start in a real implementation. This is a demo.'); |
|
|
}); |
|
|
|
|
|
forceResync.addEventListener('click', () => { |
|
|
addTerminalLine('blockchain_resync --force=true', 'Forcing blockchain resync... Verifying 24 neural nodes', inductionTerminal); |
|
|
}); |
|
|
|
|
|
|
|
|
function toggleSystem() { |
|
|
systemActive = !systemActive; |
|
|
|
|
|
if (systemActive) { |
|
|
powerButton.innerHTML = '<i class="fas fa-power-off"></i>'; |
|
|
powerButton.classList.add('pulse'); |
|
|
addTerminalLine('system_boot --sequence=alpha9', 'HYPNOS-X v9.4.2 initializing... Neural core active', inductionTerminal); |
|
|
|
|
|
|
|
|
setTimeout(() => { |
|
|
addTerminalLine('security_check --level=ultra', 'All security protocols active. System ready.', inductionTerminal); |
|
|
}, 1500); |
|
|
} else { |
|
|
powerButton.innerHTML = '<i class="fas fa-power-off"></i>'; |
|
|
powerButton.classList.remove('pulse'); |
|
|
inductionTerminal.innerHTML = ''; |
|
|
stopAllModules(); |
|
|
|
|
|
|
|
|
const shutdownLine = document.createElement('div'); |
|
|
shutdownLine.className = 'terminal-line response'; |
|
|
shutdownLine.textContent = 'System shutdown complete. Neural encryption engaged.'; |
|
|
inductionTerminal.appendChild(shutdownLine); |
|
|
} |
|
|
} |
|
|
|
|
|
function startQuickInduction() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
|
|
|
thetaFrequency.value = 5.5; |
|
|
updateThetaFrequency(); |
|
|
|
|
|
|
|
|
const controlWidth = binauralControl.offsetWidth; |
|
|
const knobWidth = binauralKnob.offsetWidth; |
|
|
const centerPos = (controlWidth - knobWidth) / 2; |
|
|
binauralKnob.style.left = `${centerPos}px`; |
|
|
updateBinauralFrequency(centerPos, controlWidth); |
|
|
|
|
|
|
|
|
const firstProfile = suggestionProfiles.querySelector('.suggestion-card'); |
|
|
firstProfile.click(); |
|
|
|
|
|
addTerminalLine('quick_start --preset=standard', 'Quick start sequence initiated. Using standard theta entrainment profile.', inductionTerminal); |
|
|
} |
|
|
|
|
|
function showAdvancedSettings() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
addTerminalLine('advanced_settings --access=granted', 'Advanced settings unlocked. Proceed with caution.', inductionTerminal); |
|
|
} |
|
|
|
|
|
function toggleInduction() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
inductionActive = !inductionActive; |
|
|
|
|
|
if (inductionActive) { |
|
|
beginInduction.innerHTML = '<i class="fas fa-stop mr-2"></i> Stop Induction'; |
|
|
beginInduction.classList.remove('from-red-500', 'to-pink-600'); |
|
|
beginInduction.classList.add('from-purple-600', 'to-blue-500'); |
|
|
|
|
|
|
|
|
thetaAudio.play(); |
|
|
binauralAudio.play(); |
|
|
|
|
|
|
|
|
inductionModule.classList.add('active-module'); |
|
|
|
|
|
addTerminalLine('induction_start --force=high', 'Hypnotic induction sequence started. Theta waves active.', inductionTerminal); |
|
|
} else { |
|
|
beginInduction.innerHTML = '<i class="fas fa-play mr-2"></i> Begin Induction'; |
|
|
beginInduction.classList.remove('from-purple-600', 'to-blue-500'); |
|
|
beginInduction.classList.add('from-red-500', 'to-pink-600'); |
|
|
|
|
|
|
|
|
thetaAudio.pause(); |
|
|
binauralAudio.pause(); |
|
|
|
|
|
|
|
|
inductionModule.classList.remove('active-module'); |
|
|
|
|
|
addTerminalLine('induction_stop', 'Hypnotic induction sequence terminated.', inductionTerminal); |
|
|
} |
|
|
} |
|
|
|
|
|
function updateThetaFrequency() { |
|
|
const frequency = thetaFrequency.value; |
|
|
thetaAudio.playbackRate = frequency / 5.5; |
|
|
|
|
|
|
|
|
if (inductionActive) { |
|
|
addTerminalLine(`adjust_theta --frequency=${frequency}Hz`, `Theta wave frequency adjusted to ${frequency}Hz`, inductionTerminal); |
|
|
} |
|
|
} |
|
|
|
|
|
function updateBinauralFrequency(knobPosition, controlWidth) { |
|
|
const positionPercent = (knobPosition - 5) / (controlWidth - 40); |
|
|
const frequencies = [0.5, 2, 4, 7, 12, 16, 20, 30, 40, 100]; |
|
|
const frequencyIndex = Math.floor(positionPercent * (frequencies.length - 1)); |
|
|
const frequency = frequencies[frequencyIndex]; |
|
|
|
|
|
binauralAudio.playbackRate = frequency / 7; |
|
|
|
|
|
if (inductionActive) { |
|
|
addTerminalLine(`adjust_binaural --frequency=${frequency}Hz`, `Binaural beats adjusted to ${frequency}Hz`, inductionTerminal); |
|
|
} |
|
|
} |
|
|
|
|
|
function triggerStateBreak(type) { |
|
|
if (!systemActive) return; |
|
|
|
|
|
let message = ''; |
|
|
switch(type) { |
|
|
case 'auditory': |
|
|
message = 'Auditory shock triggered. High-frequency pulse emitted.'; |
|
|
break; |
|
|
case 'visual': |
|
|
message = 'Visual flash activated. Retinal disruption sequence started.'; |
|
|
break; |
|
|
case 'tactile': |
|
|
message = 'Tactile pulse generated. Peripheral nerve stimulation active.'; |
|
|
break; |
|
|
case 'pattern': |
|
|
message = 'Pattern reversal initiated. Neural interference at 87%.'; |
|
|
break; |
|
|
} |
|
|
|
|
|
addTerminalLine(`state_break --type=${type}`, message, inductionTerminal); |
|
|
|
|
|
|
|
|
stateBreakingModule.classList.add('active-module'); |
|
|
setTimeout(() => { |
|
|
stateBreakingModule.classList.remove('active-module'); |
|
|
}, 1000); |
|
|
} |
|
|
|
|
|
function neutralizeSuggestions() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
addTerminalLine('suggestion_neutralize --force=high', 'Neutralizing all active suggestions. Memory buffers purged.', inductionTerminal); |
|
|
} |
|
|
|
|
|
function reverseSuggestions() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
addTerminalLine('suggestion_reverse --depth=7', 'Reversing suggestion imprint. Restoring original neural pathways.', inductionTerminal); |
|
|
} |
|
|
|
|
|
function resetSystem() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
addTerminalLine('system_reset --level=full', 'Initiating full system reset. All modules will be deactivated.', inductionTerminal); |
|
|
stopAllModules(); |
|
|
|
|
|
|
|
|
setTimeout(() => { |
|
|
addTerminalLine('system_reset_complete', 'System reset complete. All modules inactive. Security protocols re-engaged.', inductionTerminal); |
|
|
}, 2000); |
|
|
} |
|
|
|
|
|
function toggleVR() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
vrActive = !vrActive; |
|
|
|
|
|
if (vrActive) { |
|
|
vrOverlay.style.display = 'flex'; |
|
|
activateVR.innerHTML = '<i class="fas fa-stop mr-2"></i> Deactivate VR'; |
|
|
vrModule.classList.add('active-module'); |
|
|
|
|
|
|
|
|
thetaAudio.play(); |
|
|
startVisualizer(); |
|
|
|
|
|
addTerminalLine('vr_immersion_start', 'VR immersion activated. Subject entering deep hypnotic state.', inductionTerminal); |
|
|
} else { |
|
|
vrOverlay.style.display = 'none'; |
|
|
activateVR.innerHTML = '<i class="fas fa-play mr-2"></i> Activate VR'; |
|
|
vrModule.classList.remove('active-module'); |
|
|
|
|
|
|
|
|
thetaAudio.pause(); |
|
|
stopVisualizer(); |
|
|
|
|
|
addTerminalLine('vr_immersion_stop', 'VR immersion deactivated. Subject returning to baseline consciousness.', inductionTerminal); |
|
|
} |
|
|
} |
|
|
|
|
|
function toggleNeuralRewiring() { |
|
|
if (!systemActive) return; |
|
|
|
|
|
rewiringActive = !rewiringActive; |
|
|
|
|
|
if (rewiringActive) { |
|
|
initiateRewiring.innerHTML = '<i class="fas fa-stop mr-2"></i> Stop Rewiring'; |
|
|
neuralModule.classList.add('active-module'); |
|
|
rewiringAudio.play(); |
|
|
|
|
|
addTerminalLine(`neural_rewiring_start --intensity=${currentIntensity}`, `Neural rewiring initiated at intensity level ${currentIntensity}. Direct pathway manipulation active.`, inductionTerminal); |
|
|
} else { |
|
|
initiateRewiring.innerHTML = '<i class="fas fa-bolt mr-2"></i> Initiate Rewiring'; |
|
|
neuralModule.classList.remove('active-module'); |
|
|
rewiringAudio.pause(); |
|
|
|
|
|
addTerminalLine('neural_rewiring_stop', 'Neural rewiring sequence complete. Pathways stabilized.', inductionTerminal); |
|
|
} |
|
|
} |
|
|
|
|
|
function stopAllModules() { |
|
|
|
|
|
if (inductionActive) toggleInduction(); |
|
|
if (vrActive) toggleVR(); |
|
|
if (subliminalActive) toggleSubliminal(); |
|
|
if (rewiringActive) toggleNeuralRewiring(); |
|
|
} |
|
|
|
|
|
function addTerminalLine(command, response, terminalElement) { |
|
|
const commandLine = document.createElement('div'); |
|
|
commandLine.className = 'terminal-line'; |
|
|
commandLine.innerHTML = `<span class="prompt">></span> <span class="command">${command}</span>`; |
|
|
terminalElement.appendChild(commandLine); |
|
|
|
|
|
if (response) { |
|
|
setTimeout(() => { |
|
|
const responseLine = document.createElement('div'); |
|
|
responseLine.className = 'terminal-line response'; |
|
|
responseLine.textContent = response; |
|
|
terminalElement.appendChild(responseLine); |
|
|
terminalElement.scrollTop = terminalElement.scrollHeight; |
|
|
}, 500); |
|
|
} |
|
|
|
|
|
terminalElement.scrollTop = terminalElement.scrollHeight; |
|
|
} |
|
|
|
|
|
|
|
|
function startVisualizer() { |
|
|
const audioBars = vrVisualizer.querySelectorAll('.audio-bar'); |
|
|
let frameId; |
|
|
|
|
|
function updateVisualizer() { |
|
|
audioBars.forEach(bar => { |
|
|
const height = 5 + Math.random() * 55; |
|
|
bar.style.height = `${height}%`; |
|
|
}); |
|
|
frameId = requestAnimationFrame(updateVisualizer); |
|
|
} |
|
|
|
|
|
updateVisualizer(); |
|
|
|
|
|
|
|
|
vrVisualizer.dataset.animationId = frameId; |
|
|
} |
|
|
|
|
|
function stopVisualizer() { |
|
|
cancelAnimationFrame(vrVisualizer.dataset.animationId); |
|
|
const audioBars = vrVisualizer.querySelectorAll('.audio-bar'); |
|
|
audioBars.forEach(bar => { |
|
|
bar.style.height = '5%'; |
|
|
}); |
|
|
} |
|
|
|
|
|
|
|
|
window.addEventListener('load', () => { |
|
|
setTimeout(() => { |
|
|
addTerminalLine('system_check --components=all', 'Running pre-boot diagnostics... All components nominal', inductionTerminal); |
|
|
}, 500); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=LoveLogicAI/you-sound-like-a-little-bi-h-crying-hypnosis-app" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
