File size: 9,007 Bytes
7912cc3
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
fb72993
 
 
 
 
 
 
 
 
 
 
 
7912cc3
fb72993
 
 
 
 
7912cc3
fb72993
11b974a
7912cc3
 
 
11b974a
7912cc3
11b974a
7912cc3
 
11b974a
 
 
 
7912cc3
 
 
11b974a
7912cc3
 
 
11b974a
7912cc3
11b974a
 
 
 
 
fb72993
11b974a
 
fb72993
7912cc3
fb72993
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
7912cc3
 
11b974a
7912cc3
e0ef379
 
 
7912cc3
 
 
 
e0ef379
 
7912cc3
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!DOCTYPE html>
<html lang="en" class="dark">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SpectreWorks | The Digital Ghost</title>
    <link rel="icon" type="image/x-icon" href="https://cdn-icons-png.flaticon.com/512/6104/6104526.png">
    <script src="https://cdn.tailwindcss.com"></script>
    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
    <script src="https://unpkg.com/feather-icons"></script>
    <link rel="stylesheet" href="style.css">
    <script>
        tailwind.config = {
            darkMode: 'class',
            theme: {
                extend: {
                    colors: {
                        primary: '#22c55e', // green-500
                        secondary: '#f97316', // orange-500
                        dark: '#0f172a', // slate-900
                        darker: '#020617', // slate-950
                        surface: '#1e293b', // slate-800
                    }
                }
            }
        }
    </script>
</head>
<body class="bg-darker text-gray-300 font-sans antialiased overflow-x-hidden">

    <!-- Navbar Component -->
    <spectre-navbar></spectre-navbar>

    <!-- Main Container -->
    <div class="container mx-auto px-4 py-8 flex flex-col lg:flex-row gap-6">
        
        <!-- Sidebar Component -->
        <div class="w-full lg:w-1/4">
            <spectre-sidebar></spectre-sidebar>
        </div>

        <!-- Main Content Area -->
        <main class="w-full lg:w-3/4 space-y-8">
            
            <!-- Hero Section -->
            <section class="relative rounded-2xl overflow-hidden bg-surface border border-gray-700 shadow-2xl">
                <div class="absolute inset-0 bg-gradient-to-r from-primary/10 to-secondary/10"></div>
                <div class="absolute top-0 right-0 p-4 opacity-20">
                    <i data-feather="cpu" class="w-64 h-64 text-primary"></i>
                </div>
                <div class="relative p-8 md:p-12">
                    <span class="inline-block py-1 px-3 rounded-full bg-primary/20 text-primary text-xs font-bold tracking-wider mb-4 border border-primary/30">V 4.2.0 // AUTO-UPDATED</span>
                    <h1 class="text-4xl md:text-5xl font-extrabold text-white mb-4">Become a <span class="text-transparent bg-clip-text bg-gradient-to-r from-primary to-secondary">Digital Ghost</span>.</h1>
                    <p class="text-lg text-gray-400 max-w-2xl mb-8">
                        Navigate the gig economy with avant-garde OSINT capabilities. Our automated AI module ensures you remain invisible while extracting critical insights.
                    </p>
                    <div class="flex gap-4">
                        <a href="#" class="px-6 py-3 bg-primary hover:bg-green-600 text-black font-bold rounded-lg transition-all flex items-center gap-2 shadow-[0_0_15px_rgba(34,197,94,0.5)]">
                            <i data-feather="play"></i> Initialize OSINT
                        </a>
                        <a href="#" class="px-6 py-3 bg-surface hover:bg-gray-700 border border-gray-600 text-white font-bold rounded-lg transition-all flex items-center gap-2">
                            <i data-feather="shield"></i> Stealth Protocol
                        </a>
                    </div>
                </div>
            </section>

            <!-- Dashboard Grid -->
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <!-- OSINT Module -->
                <div class="bg-surface rounded-xl p-6 border border-gray-700 shadow-lg relative overflow-hidden group">
                    <div class="flex justify-between items-center mb-6">
                        <div>
                            <h2 class="text-xl font-bold text-white flex items-center gap-2">
                                <i data-feather="activity" class="text-primary"></i> Live OSINT Feed
                            </h2>
                            <p class="text-xs text-gray-500 mt-1">NVD • CISA • URLhaus • MalwareBazaar • GitHub • USGS • NOAA • CoinGecko</p>
                        </div>
                        <div class="flex items-center gap-3">
                            <button onclick="window.refreshOSINT()" class="text-xs px-3 py-1.5 rounded bg-primary/20 text-primary hover:bg-primary/30 transition flex items-center gap-1">
                                <i data-feather="refresh-cw" class="w-3 h-3"></i> Refresh
                            </button>
                            <span class="animate-pulse w-3 h-3 bg-primary rounded-full shadow-[0_0_10px_#22c55e]"></span>
                        </div>
                    </div>
                    <div id="osint-stream" class="space-y-3 max-h-96 overflow-y-auto pr-2 custom-scrollbar">
                        <div class="text-center py-8 text-gray-500 text-sm">
                            <i data-feather="loader" class="animate-spin inline-block w-5 h-5 mb-2"></i>
                            <p>Initializing intelligence feed...</p>
                        </div>
                    </div>
</div>
                <!-- Android Security Intelligence -->
                <div class="bg-surface rounded-xl p-6 border border-gray-700 shadow-lg">
                    <div class="flex justify-between items-center mb-6">
                        <h2 class="text-xl font-bold text-white flex items-center gap-2">
                            <i data-feather="shield" class="text-secondary"></i> Android Security Intel
                        </h2>
                        <a href="https://nvd.nist.gov/vuln/search/results?is_cve_id_search=true&cve_id=CVE-" target="_blank" class="text-xs bg-secondary/20 text-secondary px-2 py-1 rounded border border-secondary/30 hover:bg-secondary/30 transition">VIEW NVD</a>
                    </div>

                    <div id="android-security-feed" class="space-y-4">
                        <div class="text-center py-4 text-gray-500 text-sm">
                            <i data-feather="loader" class="animate-spin inline-block w-4 h-4"></i>
                            Loading Android security data...
                        </div>
                    </div>
                </div>
</div>

            <!-- Stealth Status -->
            <spectre-stealth-panel></spectre-stealth-panel>
            <!-- Real-Time Risk Assessment -->
            <div class="bg-gradient-to-r from-gray-900 to-gray-800 rounded-xl p-6 border-l-4 border-secondary flex items-start gap-4">
                <i data-feather="shield" class="text-secondary mt-1"></i>
                <div class="flex-1">
                    <h3 class="text-white font-bold text-lg flex items-center gap-2">
                        Real-Time Threat Intelligence
                        <span class="text-xs px-2 py-0.5 rounded bg-green-900/50 text-green-400 animate-pulse">LIVE</span>
                        <span class="text-[10px] text-gray-600 ml-2">Press Ctrl+R to refresh</span>
                    </h3>
                    <p class="text-sm text-gray-400 mt-1" id="threat-summary">
                        Initializing threat analysis from NIST NVD, CISA KEV, URLhaus, MalwareBazaar, and multiple intelligence sources...
                    </p>
                    <div class="mt-3 flex items-center gap-4 text-xs">
                        <div class="flex items-center gap-2">
                            <span class="w-2 h-2 rounded-full bg-red-500"></span>
                            <span class="text-gray-500">Active Exploits</span>
                        </div>
                        <div class="flex items-center gap-2">
                            <span class="w-2 h-2 rounded-full bg-orange-500"></span>
                            <span class="text-gray-500">Critical CVEs</span>
                        </div>
                        <div class="flex items-center gap-2">
                            <span class="w-2 h-2 rounded-full bg-purple-500"></span>
                            <span class="text-gray-500">Malware URLs</span>
                        </div>
                        <div class="flex items-center gap-2">
                            <span class="w-2 h-2 rounded-full bg-green-500"></span>
                            <span class="text-gray-500">Intelligence</span>
                        </div>
                    </div>
                </div>
            </div>
</main>
    </div>
    <!-- AI Chat Assistant -->
    <chat-assistant></chat-assistant>
    
    <!-- Web Components Scripts -->
    <script src="components/navbar.js"></script>
    <script src="components/sidebar.js"></script>
    <script src="components/stealth-panel.js"></script>
    <script src="components/chat-assistant.js"></script>
<!-- Main Logic -->
    <script src="script.js"></script>
    <script>feather.replace();</script>
<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
</body>
</html>