avinash-rai commited on
Commit
31ed5f6
·
1 Parent(s): f565616

fix: Dashboard confidence display and GUVI response format

Browse files
Files changed (2) hide show
  1. web/dashboard.html +540 -0
  2. web/index.html +185 -505
web/dashboard.html ADDED
@@ -0,0 +1,540 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <meta name="description" content="Sentinel Intelligence Command Center">
8
+ <title>SENTINEL | Intelligence Command Center</title>
9
+
10
+ <!-- SECURITY GATE -->
11
+ <script>
12
+ if (!sessionStorage.getItem('sentinel_auth')) {
13
+ window.location.href = '/';
14
+ }
15
+ </script>
16
+
17
+ <!-- Fonts -->
18
+ <link rel="preconnect" href="https://fonts.googleapis.com">
19
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
20
+ <link
21
+ href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700;900&family=JetBrains+Mono:wght@300;400;500&family=Rajdhani:wght@400;500;600;700&display=swap"
22
+ rel="stylesheet">
23
+
24
+ <!-- Icons -->
25
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
26
+
27
+ <!-- Cytoscape for Graph Visualization -->
28
+ <script src="https://unpkg.com/cytoscape@3.25.0/dist/cytoscape.min.js"></script>
29
+
30
+ <!-- Styles -->
31
+ <link rel="stylesheet" href="dashboard.css">
32
+ </head>
33
+
34
+ <body>
35
+
36
+ <!-- Loading Screen -->
37
+ <div class="loader" id="loader">
38
+ <div class="loader-icon">🍯</div>
39
+ <div class="loader-text" id="loader-status">INITIALIZING COMMAND CENTER...</div>
40
+ <div class="loader-bar">
41
+ <div class="loader-bar-fill"></div>
42
+ </div>
43
+ </div>
44
+
45
+ <!-- Background Effects -->
46
+ <div class="bg-grid"></div>
47
+ <div class="gradient-overlay"></div>
48
+
49
+ <!-- Main Layout -->
50
+ <div class="app-container">
51
+
52
+ <!-- Sidebar -->
53
+ <aside class="sidebar" id="sidebar">
54
+ <div class="sidebar-header">
55
+ <div class="logo">
56
+ <i class="fas fa-cube logo-icon"
57
+ style="color: var(--honey-gold); font-size: 1.5rem; margin-right: 10px;"></i>
58
+ <span class="logo-text">SENTINEL</span>
59
+ </div>
60
+ <!-- <div class="version-badge">v2.5.0</div> -->
61
+ </div>
62
+
63
+ <!-- Agent Status -->
64
+ <div class="agent-status-panel">
65
+ <div class="panel-title">
66
+ <i class="fas fa-heartbeat"></i> System Agents
67
+ </div>
68
+ <div class="agent-list" id="agent-list">
69
+ <div class="agent-item">
70
+ <span class="agent-dot loading" id="dot-detector"></span>
71
+ <span class="agent-name">Detector</span>
72
+ <span class="agent-status" id="status-detector">...</span>
73
+ </div>
74
+ <div class="agent-item">
75
+ <span class="agent-dot loading" id="dot-brain"></span>
76
+ <span class="agent-name">Brain</span>
77
+ <span class="agent-status" id="status-brain">...</span>
78
+ </div>
79
+ <div class="agent-item">
80
+ <span class="agent-dot loading" id="dot-siem"></span>
81
+ <span class="agent-name">SIEM</span>
82
+ <span class="agent-status" id="status-siem">...</span>
83
+ </div>
84
+ </div>
85
+ </div>
86
+
87
+ <!-- Navigation -->
88
+ <nav class="sidebar-nav">
89
+ <button class="nav-item active" data-view="command" onclick="SentinelDash.switchView('command')">
90
+ <i class="fas fa-satellite-dish"></i>
91
+ <span>Command Center</span>
92
+ </button>
93
+ <button class="nav-item" data-view="forensics" onclick="SentinelDash.switchView('forensics')">
94
+ <i class="fas fa-fingerprint"></i>
95
+ <span>Forensic Lab</span>
96
+ </button>
97
+ <button class="nav-item" data-view="engagement" onclick="SentinelDash.switchView('engagement')">
98
+ <i class="fas fa-mask"></i>
99
+ <span>Engagement Tool</span>
100
+ </button>
101
+ <button class="nav-item" data-view="docs" onclick="SentinelDash.switchView('docs')">
102
+ <i class="fas fa-book"></i>
103
+ <span>Documentation</span>
104
+ </button>
105
+ <button class="nav-item" data-view="settings" onclick="SentinelDash.switchView('settings')">
106
+ <i class="fas fa-cog"></i>
107
+ <span>Admin Settings</span>
108
+ </button>
109
+ </nav>
110
+
111
+ <!-- Quick Actions -->
112
+ <div class="sidebar-actions">
113
+ <button class="action-btn" onclick="SentinelDash.exportLogs('csv')" title="Export Log CSV">
114
+ <i class="fas fa-download"></i>
115
+ </button>
116
+ <button class="action-btn" onclick="document.documentElement.requestFullscreen()" title="Fullscreen">
117
+ <i class="fas fa-expand"></i>
118
+ </button>
119
+ <button class="action-btn" onclick="SentinelDash.refreshAll()" title="Refresh All">
120
+ <i class="fas fa-sync-alt"></i>
121
+ </button>
122
+ </div>
123
+
124
+ <!-- Sidebar Footer -->
125
+ <div class="sidebar-footer">
126
+ <div class="social-links"
127
+ style="display: flex; gap: 10px; margin-bottom: 10px; justify-content: center;">
128
+ <a href="https://github.com/avinash-rai-sentinel" target="_blank" class="social-btn"
129
+ style="color: var(--text-muted); transition: 0.3s;"><i class="fab fa-github"></i></a>
130
+ <a href="https://linkedin.com/in/avinash-rai-sentinel" target="_blank" class="social-btn"
131
+ style="color: var(--text-muted); transition: 0.3s;"><i class="fab fa-linkedin"></i></a>
132
+ </div>
133
+ <div class="connection-status connected" id="connection-status">
134
+ <div class="status-dot"></div>
135
+ <span>ONLINE</span>
136
+ </div>
137
+ </div>
138
+ </aside>
139
+
140
+ <!-- Main Content -->
141
+ <main class="main-content">
142
+
143
+ <!-- Top Bar -->
144
+ <header class="top-bar">
145
+ <div class="top-bar-left">
146
+ <h1 class="page-title" id="page-title">Intelligence Command Center</h1>
147
+ <span class="breadcrumb">Dashboard / Live Operations</span>
148
+ </div>
149
+ <div class="top-bar-right">
150
+ <div class="live-clock" id="live-clock">--:--:--</div>
151
+ <div class="alert-badge" id="alert-badge" title="Active Threats">
152
+ <i class="fas fa-bell"></i>
153
+ <span class="badge-count" id="alert-count">0</span>
154
+ </div>
155
+ </div>
156
+ </header>
157
+
158
+ <!-- View Container -->
159
+ <div class="view-container">
160
+
161
+ <!-- ═══════════════════════════════════════════════════════════════
162
+ VIEW 1: INTELLIGENCE COMMAND CENTER
163
+ ═══════════════════════════════════════════════════════════════ -->
164
+ <section class="view active" id="view-command">
165
+
166
+ <!-- KPI Cards Row -->
167
+ <div class="kpi-row">
168
+ <div class="kpi-card" id="kpi-interceptions">
169
+ <div class="kpi-icon"><i class="fas fa-shield-alt"></i></div>
170
+ <div class="kpi-content">
171
+ <div class="kpi-value" id="stat-interceptions">---</div>
172
+ <div class="kpi-label">Interceptions <span class="truth-tag real">REAL</span></div>
173
+ </div>
174
+ </div>
175
+ <div class="kpi-card" id="kpi-savings">
176
+ <div class="kpi-icon savings"><i class="fas fa-rupee-sign"></i></div>
177
+ <div class="kpi-content">
178
+ <div class="kpi-value" id="stat-savings">---</div>
179
+ <div class="kpi-label">Est. Savings <span class="truth-tag simulated">PROJ</span></div>
180
+ </div>
181
+ </div>
182
+ <div class="kpi-card" id="kpi-risk">
183
+ <div class="kpi-icon danger"><i class="fas fa-exclamation-triangle"></i></div>
184
+ <div class="kpi-content">
185
+ <div class="kpi-value" id="stat-risk">---</div>
186
+ <div class="kpi-label">Risk Level <span class="truth-tag real">REAL</span></div>
187
+ </div>
188
+ <div class="kpi-indicator" id="risk-indicator">
189
+ <div class="risk-bar"></div>
190
+ </div>
191
+ </div>
192
+ <div class="kpi-card" id="kpi-active">
193
+ <div class="kpi-icon active"><i class="fas fa-broadcast-tower"></i></div>
194
+ <div class="kpi-content">
195
+ <div class="kpi-value" id="stat-active">---</div>
196
+ <div class="kpi-label">Active Nodes <span class="truth-tag real">REAL</span></div>
197
+ </div>
198
+ <div class="kpi-pulse"></div>
199
+ </div>
200
+ </div>
201
+
202
+ <!-- Main Grid -->
203
+ <div class="command-grid">
204
+
205
+ <!-- Live Threat Feed -->
206
+ <div class="panel threat-feed-panel">
207
+ <div class="panel-header">
208
+ <h3><i class="fas fa-rss"></i> Live Threat Feed <span
209
+ class="truth-tag partial">HYBRID</span></h3>
210
+ <span class="live-badge"><span class="pulse-dot"></span> UPDATING</span>
211
+ </div>
212
+ <div class="panel-body">
213
+ <div class="threat-ticker" id="threat-ticker">
214
+ <div class="ticker-item loading">
215
+ <i class="fas fa-spinner fa-spin"></i> Connecting to URLHaus...
216
+ </div>
217
+ </div>
218
+ </div>
219
+ </div>
220
+
221
+ <!-- Campaign Clusters -->
222
+ <div class="panel campaigns-panel">
223
+ <div class="panel-header">
224
+ <h3><i class="fas fa-project-diagram"></i> Threat Clusters <span
225
+ class="truth-tag partial">HYBRID</span></h3>
226
+ <button class="panel-btn" onclick="SentinelDash.refreshCampaigns()">
227
+ <i class="fas fa-sync-alt"></i>
228
+ </button>
229
+ </div>
230
+ <div class="panel-body">
231
+ <div class="campaign-list" id="campaign-list">
232
+ <div class="campaign-item loading">
233
+ <i class="fas fa-spinner fa-spin"></i> Analyzing vectors...
234
+ </div>
235
+ </div>
236
+ </div>
237
+ </div>
238
+
239
+ <!-- Real-time Logs Terminal -->
240
+ <div class="panel terminal-panel">
241
+ <div class="panel-header">
242
+ <h3><i class="fas fa-terminal"></i> System Kernel Logs <span class="truth-tag real">LIVE
243
+ IO</span></h3>
244
+ <div class="terminal-controls">
245
+ <button class="terminal-btn" onclick="SentinelDash.clearTerminal()">Clear</button>
246
+ </div>
247
+ </div>
248
+ <div class="panel-body terminal-body">
249
+ <div class="terminal-output" id="terminal-output">
250
+ <div class="log-line system">[KERNEL] Establishing secure stream...</div>
251
+ </div>
252
+ </div>
253
+ </div>
254
+
255
+ </div>
256
+
257
+ <!-- INTEGRITY FOOTER -->
258
+ <div class="truth-footer">
259
+ <span>🛡️ ADMIN MODE: VERIFICATION LAYER ACTIVE</span>
260
+ <span>
261
+ TYPE: <span style="color:var(--truth-real)">REAL (Operational)</span> |
262
+ <span style="color:var(--truth-partial)">HYBRID (Enriched)</span> |
263
+ <span style="color:var(--truth-sim)">SIMULATED (Projection)</span>
264
+ </span>
265
+ <span>v2.5.0-AUDIT</span>
266
+ </div>
267
+ </section>
268
+
269
+ <!-- ═══════════════════════════════════════════════════════════════
270
+ VIEW 2: FORENSIC LAB
271
+ ═══════════════════════════════════════════════════════════════ -->
272
+ <section class="view" id="view-forensics">
273
+
274
+ <div class="forensics-grid">
275
+
276
+ <!-- Threat Graph -->
277
+ <div class="panel graph-panel">
278
+ <div class="panel-header">
279
+ <h3><i class="fas fa-project-diagram"></i> Threat Network Graph</h3>
280
+ <div class="graph-controls">
281
+ <button class="graph-btn" onclick="SentinelDash.refreshGraph()">
282
+ <i class="fas fa-sync-alt"></i> Refresh
283
+ </button>
284
+ </div>
285
+ </div>
286
+ <div class="panel-body graph-body">
287
+ <div id="threat-graph" class="graph-container"></div>
288
+ <div class="graph-legend">
289
+ <div class="legend-item">
290
+ <span class="legend-dot scammer"></span> Scammer
291
+ </div>
292
+ <div class="legend-item">
293
+ <span class="legend-dot upi"></span> UPI ID
294
+ </div>
295
+ <div class="legend-item">
296
+ <span class="legend-dot phone"></span> Phone
297
+ </div>
298
+ <div class="legend-item">
299
+ <span class="legend-dot campaign"></span> Campaign
300
+ </div>
301
+ </div>
302
+ </div>
303
+ </div>
304
+
305
+ <!-- Telemetry Table -->
306
+ <div class="panel telemetry-panel">
307
+ <div class="panel-header">
308
+ <h3><i class="fas fa-fingerprint"></i> Silent Fingerprints</h3>
309
+ <span class="record-count" id="telemetry-count">0 records</span>
310
+ </div>
311
+ <div class="panel-body">
312
+ <div class="table-container">
313
+ <table class="data-table" id="telemetry-table">
314
+ <thead>
315
+ <tr>
316
+ <th>IP Address</th>
317
+ <th>Device OS</th>
318
+ <th>Browser</th>
319
+ <th>Risk</th>
320
+ </tr>
321
+ </thead>
322
+ <tbody id="telemetry-body">
323
+ <tr class="loading-row">
324
+ <td colspan="4">
325
+ <i class="fas fa-spinner fa-spin"></i> Loading telemetry...
326
+ </td>
327
+ </tr>
328
+ </tbody>
329
+ </table>
330
+ </div>
331
+ </div>
332
+ </div>
333
+
334
+ <!-- Dossier Generator -->
335
+ <div class="panel dossier-panel">
336
+ <div class="panel-header">
337
+ <h3><i class="fas fa-file-contract"></i> Legal Dossier Generator</h3>
338
+ </div>
339
+ <div class="panel-body dossier-body">
340
+ <div class="dossier-form">
341
+ <div class="form-group">
342
+ <label>Session ID / Case Number</label>
343
+ <input type="text" id="dossier-id" class="form-input"
344
+ placeholder="e.g., SESSION_ABC123">
345
+ </div>
346
+ <button class="generate-btn" onclick="SentinelDash.generateDossier()">
347
+ <i class="fas fa-gavel"></i> Generate Legal Dossier
348
+ </button>
349
+ </div>
350
+ </div>
351
+ </div>
352
+
353
+ </div>
354
+ </section>
355
+
356
+ <!-- ═══════════════════════════════════════════════════════════════
357
+ VIEW 3: SCAMMER ENGAGEMENT TOOL
358
+ ═══════════════════════════════════════════════════════════════ -->
359
+ <section class="view" id="view-engagement">
360
+
361
+ <div class="engagement-grid">
362
+
363
+ <!-- API Testing Lab -->
364
+ <div class="panel testing-panel">
365
+ <div class="panel-header">
366
+ <h3><i class="fas fa-flask"></i> Scam Detection Lab</h3>
367
+ <span class="lab-badge">Interactive</span>
368
+ </div>
369
+ <div class="panel-body">
370
+ <div class="lab-description">
371
+ <p>Type a message <strong>as a scammer would</strong> to test the AI detection
372
+ system.</p>
373
+ </div>
374
+ <div class="test-terminal">
375
+ <div class="terminal-header">
376
+ <span class="terminal-dot red"></span>
377
+ <span class="terminal-dot yellow"></span>
378
+ <span class="terminal-dot green"></span>
379
+ <span class="terminal-title">sentinel-analyze</span>
380
+ </div>
381
+ <div class="terminal-content">
382
+ <div class="terminal-history" id="test-history">
383
+ <div class="history-item system">
384
+ [SYSTEM] Detection Lab Ready. Type a scam message.
385
+ </div>
386
+ </div>
387
+ <div class="terminal-input-line">
388
+ <span class="prompt">scammer@test:~$</span>
389
+ <input type="text" id="test-input" class="terminal-input"
390
+ placeholder="Type scam message here..."
391
+ onkeypress="SentinelDash.handleTestInput(event)">
392
+ <button class="action-btn"
393
+ onclick="SentinelDash.handleTestInput({key:'Enter', target: {value: 'GUVI_PROBE_SIMULATION'}})"
394
+ title="Simulate GUVI Probe"
395
+ style="margin-left: 10px; padding: 2px 8px; font-size: 0.7rem;">
396
+ <i class="fas fa-bug"></i> GUVI
397
+ </button>
398
+ </div>
399
+ </div>
400
+ </div>
401
+ </div>
402
+ </div>
403
+
404
+ <!-- Honeytoken Generator -->
405
+ <div class="panel honeytoken-panel">
406
+ <div class="panel-header">
407
+ <h3><i class="fas fa-honey-pot"></i> Honeytoken Generator</h3>
408
+ </div>
409
+ <div class="panel-body">
410
+ <div class="honeytoken-grid">
411
+ <div class="honeytoken-card" onclick="SentinelDash.generateHoneytoken('upi')">
412
+ <div class="token-icon"><i class="fas fa-credit-card"></i></div>
413
+ <div class="token-title">Fake UPI Link</div>
414
+ </div>
415
+ <div class="honeytoken-card" onclick="SentinelDash.generateHoneytoken('kyc')">
416
+ <div class="token-icon"><i class="fas fa-id-card"></i></div>
417
+ <div class="token-title">Fake KYC Portal</div>
418
+ </div>
419
+ </div>
420
+ <div class="honeytoken-output" id="honeytoken-output" style="display: none;">
421
+ <div class="output-label">Generated Trap Link:</div>
422
+ <div class="output-link">
423
+ <code id="honeytoken-link"></code>
424
+ <button class="copy-btn" onclick="SentinelDash.copyHoneytoken()">
425
+ <i class="fas fa-copy"></i>
426
+ </button>
427
+ </div>
428
+ </div>
429
+ </div>
430
+ </div>
431
+
432
+ <!-- Admin Export Panel -->
433
+ <div class="panel admin-panel">
434
+ <div class="panel-header">
435
+ <h3><i class="fas fa-user-shield"></i> Admin Controls</h3>
436
+ <span class="admin-badge">Restricted</span>
437
+ </div>
438
+ <div class="panel-body">
439
+ <div class="admin-section">
440
+ <h4>SIEM Integration / Export</h4>
441
+ <div class="export-options">
442
+ <button class="export-btn" onclick="SentinelDash.exportLogs('splunk')">
443
+ <i class="fas fa-database"></i> Splunk Format
444
+ </button>
445
+ <button class="export-btn" onclick="SentinelDash.exportLogs('csv')">
446
+ <i class="fas fa-file-csv"></i> CSV Export
447
+ </button>
448
+ </div>
449
+ </div>
450
+ </div>
451
+ </div>
452
+
453
+ </div>
454
+
455
+ <!-- ═══════════════════════════════════════════════════════════════
456
+ VIEW 4: DOCUMENTATION HUB
457
+ ═══════════════════════════════════════════════════════════════ -->
458
+ <section class="view" id="view-docs">
459
+ <div class="panel">
460
+ <div class="panel-header">
461
+ <h3><i class="fas fa-book-open"></i> System Documentation</h3>
462
+ </div>
463
+ <div class="panel-body">
464
+ <div class="docs-grid">
465
+ <a href="../docs/MASTER_API_CATALOG.md" target="_blank" class="doc-card">
466
+ <div class="doc-icon"><i class="fas fa-code"></i></div>
467
+ <div class="doc-title">Master API Catalog</div>
468
+ <div class="doc-desc">Exhaustive list of all endpoints and secrets</div>
469
+ </a>
470
+ <a href="../docs/README.md" target="_blank" class="doc-card">
471
+ <div class="doc-icon"><i class="fas fa-map"></i></div>
472
+ <div class="doc-title">Documentation Index</div>
473
+ <div class="doc-desc">Start here to navigate the project</div>
474
+ </a>
475
+ </div>
476
+ </div>
477
+ </div>
478
+ </section>
479
+
480
+ <!-- ═══════════════════════════════════════════════════════════════
481
+ VIEW 5: ADMIN SETTINGS
482
+ ═══════════════════════════════════════════════════════════════ -->
483
+ <section class="view" id="view-settings">
484
+ <div class="panel admin-panel-full">
485
+ <div class="panel-header">
486
+ <h3><i class="fas fa-user-lock"></i> Platform Configuration</h3>
487
+ </div>
488
+ <div class="panel-body">
489
+ <div class="settings-group">
490
+ <h4>GUVI Integration Keys</h4>
491
+ <p class="settings-desc">Securely store your API keys for the Build-a-Thon
492
+ evaluation.</p>
493
+
494
+ <div class="input-with-action">
495
+ <div class="form-group">
496
+ <label>GUVI x-api-key</label>
497
+ <input type="password" id="guvi-api-key" class="form-input"
498
+ placeholder="Enter API Key...">
499
+ </div>
500
+ <button class="save-btn" onclick="SentinelDash.saveApiKey()">
501
+ <i class="fas fa-save"></i> Save Key
502
+ </button>
503
+ </div>
504
+ <div id="key-status" class="key-status">Not Configured</div>
505
+ </div>
506
+ <div class="settings-group">
507
+ <h4>System UI Theme</h4>
508
+ <div class="theme-toggles">
509
+ <button class="theme-btn active"
510
+ onclick="SentinelDash.setTheme('cyber')">Cyberpunk</button>
511
+ <button class="theme-btn" onclick="SentinelDash.setTheme('minimal')">Enterprise
512
+ Min</button>
513
+ </div>
514
+ </div>
515
+ </div>
516
+ </div>
517
+ </section>
518
+
519
+ </div>
520
+ </section>
521
+
522
+ </div>
523
+ </main>
524
+
525
+ </div>
526
+ <!-- JavaScript -->
527
+ <script src="dashboard.js"></script>
528
+ </body>
529
+
530
+ </html>
531
+ <div class="toast" id="toast">
532
+ <i class="fas fa-check-circle" id="toast-icon"></i>
533
+ <span id="toast-message">Action completed</span>
534
+ </div>
535
+
536
+ <!-- JavaScript -->
537
+ <script src="dashboard.js"></script>
538
+ </body>
539
+
540
+ </html>
web/index.html CHANGED
@@ -4,530 +4,210 @@
4
  <head>
5
  <meta charset="UTF-8">
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <meta name="description" content="Sentinel Intelligence Command Center">
8
- <title>SENTINEL | Intelligence Command Center</title>
9
-
10
  <!-- Fonts -->
11
  <link rel="preconnect" href="https://fonts.googleapis.com">
12
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
13
  <link
14
- href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700;900&family=JetBrains+Mono:wght@300;400;500&family=Rajdhani:wght@400;500;600;700&display=swap"
15
  rel="stylesheet">
16
-
17
- <!-- Icons -->
18
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
19
 
20
- <!-- Cytoscape for Graph Visualization -->
21
- <script src="https://unpkg.com/cytoscape@3.25.0/dist/cytoscape.min.js"></script>
22
-
23
- <!-- Styles -->
24
- <link rel="stylesheet" href="dashboard.css">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
25
  </head>
26
 
27
  <body>
28
 
29
- <!-- Loading Screen -->
30
- <div class="loader" id="loader">
31
- <div class="loader-icon">🍯</div>
32
- <div class="loader-text" id="loader-status">INITIALIZING COMMAND CENTER...</div>
33
- <div class="loader-bar">
34
- <div class="loader-bar-fill"></div>
35
- </div>
36
- </div>
37
-
38
- <!-- Background Effects -->
39
- <div class="bg-grid"></div>
40
- <div class="gradient-overlay"></div>
41
 
42
- <!-- Main Layout -->
43
- <div class="app-container">
 
 
44
 
45
- <!-- Sidebar -->
46
- <aside class="sidebar" id="sidebar">
47
- <div class="sidebar-header">
48
- <div class="logo">
49
- <i class="fas fa-cube logo-icon"
50
- style="color: var(--honey-gold); font-size: 1.5rem; margin-right: 10px;"></i>
51
- <span class="logo-text">SENTINEL</span>
52
- </div>
53
- <!-- <div class="version-badge">v2.5.0</div> -->
54
  </div>
55
-
56
- <!-- Agent Status -->
57
- <div class="agent-status-panel">
58
- <div class="panel-title">
59
- <i class="fas fa-heartbeat"></i> System Agents
60
- </div>
61
- <div class="agent-list" id="agent-list">
62
- <div class="agent-item">
63
- <span class="agent-dot loading" id="dot-detector"></span>
64
- <span class="agent-name">Detector</span>
65
- <span class="agent-status" id="status-detector">...</span>
66
- </div>
67
- <div class="agent-item">
68
- <span class="agent-dot loading" id="dot-brain"></span>
69
- <span class="agent-name">Brain</span>
70
- <span class="agent-status" id="status-brain">...</span>
71
- </div>
72
- <div class="agent-item">
73
- <span class="agent-dot loading" id="dot-siem"></span>
74
- <span class="agent-name">SIEM</span>
75
- <span class="agent-status" id="status-siem">...</span>
76
- </div>
77
- </div>
78
  </div>
79
-
80
- <!-- Navigation -->
81
- <nav class="sidebar-nav">
82
- <button class="nav-item active" data-view="command" onclick="SentinelDash.switchView('command')">
83
- <i class="fas fa-satellite-dish"></i>
84
- <span>Command Center</span>
85
- </button>
86
- <button class="nav-item" data-view="forensics" onclick="SentinelDash.switchView('forensics')">
87
- <i class="fas fa-fingerprint"></i>
88
- <span>Forensic Lab</span>
89
- </button>
90
- <button class="nav-item" data-view="engagement" onclick="SentinelDash.switchView('engagement')">
91
- <i class="fas fa-mask"></i>
92
- <span>Engagement Tool</span>
93
- </button>
94
- <button class="nav-item" data-view="docs" onclick="SentinelDash.switchView('docs')">
95
- <i class="fas fa-book"></i>
96
- <span>Documentation</span>
97
- </button>
98
- <button class="nav-item" data-view="settings" onclick="SentinelDash.switchView('settings')">
99
- <i class="fas fa-cog"></i>
100
- <span>Admin Settings</span>
101
- </button>
102
- </nav>
103
-
104
- <!-- Quick Actions -->
105
- <div class="sidebar-actions">
106
- <button class="action-btn" onclick="SentinelDash.exportLogs('csv')" title="Export Log CSV">
107
- <i class="fas fa-download"></i>
108
- </button>
109
- <button class="action-btn" onclick="document.documentElement.requestFullscreen()" title="Fullscreen">
110
- <i class="fas fa-expand"></i>
111
- </button>
112
- <button class="action-btn" onclick="SentinelDash.refreshAll()" title="Refresh All">
113
- <i class="fas fa-sync-alt"></i>
114
- </button>
115
- </div>
116
-
117
- <!-- Sidebar Footer -->
118
- <div class="sidebar-footer">
119
- <div class="social-links"
120
- style="display: flex; gap: 10px; margin-bottom: 10px; justify-content: center;">
121
- <a href="https://github.com/avinash-rai-sentinel" target="_blank" class="social-btn"
122
- style="color: var(--text-muted); transition: 0.3s;"><i class="fab fa-github"></i></a>
123
- <a href="https://linkedin.com/in/avinash-rai-sentinel" target="_blank" class="social-btn"
124
- style="color: var(--text-muted); transition: 0.3s;"><i class="fab fa-linkedin"></i></a>
125
- </div>
126
- <div class="connection-status connected" id="connection-status">
127
- <div class="status-dot"></div>
128
- <span>ONLINE</span>
129
- </div>
130
  </div>
131
- </aside>
132
-
133
- <!-- Main Content -->
134
- <main class="main-content">
135
-
136
- <!-- Top Bar -->
137
- <header class="top-bar">
138
- <div class="top-bar-left">
139
- <h1 class="page-title" id="page-title">Intelligence Command Center</h1>
140
- <span class="breadcrumb">Dashboard / Live Operations</span>
141
- </div>
142
- <div class="top-bar-right">
143
- <div class="live-clock" id="live-clock">--:--:--</div>
144
- <div class="alert-badge" id="alert-badge" title="Active Threats">
145
- <i class="fas fa-bell"></i>
146
- <span class="badge-count" id="alert-count">0</span>
147
- </div>
148
- </div>
149
- </header>
150
-
151
- <!-- View Container -->
152
- <div class="view-container">
153
-
154
- <!-- ═══════════════════════════════════════════════════════════════
155
- VIEW 1: INTELLIGENCE COMMAND CENTER
156
- ═══════════════════════════════════════════════════════════════ -->
157
- <section class="view active" id="view-command">
158
-
159
- <!-- KPI Cards Row -->
160
- <div class="kpi-row">
161
- <div class="kpi-card" id="kpi-interceptions">
162
- <div class="kpi-icon"><i class="fas fa-shield-alt"></i></div>
163
- <div class="kpi-content">
164
- <div class="kpi-value" id="stat-interceptions">---</div>
165
- <div class="kpi-label">Interceptions <span class="truth-tag real">REAL</span></div>
166
- </div>
167
- </div>
168
- <div class="kpi-card" id="kpi-savings">
169
- <div class="kpi-icon savings"><i class="fas fa-rupee-sign"></i></div>
170
- <div class="kpi-content">
171
- <div class="kpi-value" id="stat-savings">---</div>
172
- <div class="kpi-label">Est. Savings <span class="truth-tag simulated">PROJ</span></div>
173
- </div>
174
- </div>
175
- <div class="kpi-card" id="kpi-risk">
176
- <div class="kpi-icon danger"><i class="fas fa-exclamation-triangle"></i></div>
177
- <div class="kpi-content">
178
- <div class="kpi-value" id="stat-risk">---</div>
179
- <div class="kpi-label">Risk Level <span class="truth-tag real">REAL</span></div>
180
- </div>
181
- <div class="kpi-indicator" id="risk-indicator">
182
- <div class="risk-bar"></div>
183
- </div>
184
- </div>
185
- <div class="kpi-card" id="kpi-active">
186
- <div class="kpi-icon active"><i class="fas fa-broadcast-tower"></i></div>
187
- <div class="kpi-content">
188
- <div class="kpi-value" id="stat-active">---</div>
189
- <div class="kpi-label">Active Nodes <span class="truth-tag real">REAL</span></div>
190
- </div>
191
- <div class="kpi-pulse"></div>
192
- </div>
193
- </div>
194
-
195
- <!-- Main Grid -->
196
- <div class="command-grid">
197
-
198
- <!-- Live Threat Feed -->
199
- <div class="panel threat-feed-panel">
200
- <div class="panel-header">
201
- <h3><i class="fas fa-rss"></i> Live Threat Feed <span
202
- class="truth-tag partial">HYBRID</span></h3>
203
- <span class="live-badge"><span class="pulse-dot"></span> UPDATING</span>
204
- </div>
205
- <div class="panel-body">
206
- <div class="threat-ticker" id="threat-ticker">
207
- <div class="ticker-item loading">
208
- <i class="fas fa-spinner fa-spin"></i> Connecting to URLHaus...
209
- </div>
210
- </div>
211
- </div>
212
- </div>
213
-
214
- <!-- Campaign Clusters -->
215
- <div class="panel campaigns-panel">
216
- <div class="panel-header">
217
- <h3><i class="fas fa-project-diagram"></i> Threat Clusters <span
218
- class="truth-tag partial">HYBRID</span></h3>
219
- <button class="panel-btn" onclick="SentinelDash.refreshCampaigns()">
220
- <i class="fas fa-sync-alt"></i>
221
- </button>
222
- </div>
223
- <div class="panel-body">
224
- <div class="campaign-list" id="campaign-list">
225
- <div class="campaign-item loading">
226
- <i class="fas fa-spinner fa-spin"></i> Analyzing vectors...
227
- </div>
228
- </div>
229
- </div>
230
- </div>
231
-
232
- <!-- Real-time Logs Terminal -->
233
- <div class="panel terminal-panel">
234
- <div class="panel-header">
235
- <h3><i class="fas fa-terminal"></i> System Kernel Logs <span class="truth-tag real">LIVE
236
- IO</span></h3>
237
- <div class="terminal-controls">
238
- <button class="terminal-btn" onclick="SentinelDash.clearTerminal()">Clear</button>
239
- </div>
240
- </div>
241
- <div class="panel-body terminal-body">
242
- <div class="terminal-output" id="terminal-output">
243
- <div class="log-line system">[KERNEL] Establishing secure stream...</div>
244
- </div>
245
- </div>
246
- </div>
247
-
248
- </div>
249
-
250
- <!-- INTEGRITY FOOTER -->
251
- <div class="truth-footer">
252
- <span>🛡️ ADMIN MODE: VERIFICATION LAYER ACTIVE</span>
253
- <span>
254
- TYPE: <span style="color:var(--truth-real)">REAL (Operational)</span> |
255
- <span style="color:var(--truth-partial)">HYBRID (Enriched)</span> |
256
- <span style="color:var(--truth-sim)">SIMULATED (Projection)</span>
257
- </span>
258
- <span>v2.5.0-AUDIT</span>
259
- </div>
260
- </section>
261
-
262
- <!-- ═══════════════════════════════════════════════════════════════
263
- VIEW 2: FORENSIC LAB
264
- ═══════════════════════════════════════════════════════════════ -->
265
- <section class="view" id="view-forensics">
266
-
267
- <div class="forensics-grid">
268
-
269
- <!-- Threat Graph -->
270
- <div class="panel graph-panel">
271
- <div class="panel-header">
272
- <h3><i class="fas fa-project-diagram"></i> Threat Network Graph</h3>
273
- <div class="graph-controls">
274
- <button class="graph-btn" onclick="SentinelDash.refreshGraph()">
275
- <i class="fas fa-sync-alt"></i> Refresh
276
- </button>
277
- </div>
278
- </div>
279
- <div class="panel-body graph-body">
280
- <div id="threat-graph" class="graph-container"></div>
281
- <div class="graph-legend">
282
- <div class="legend-item">
283
- <span class="legend-dot scammer"></span> Scammer
284
- </div>
285
- <div class="legend-item">
286
- <span class="legend-dot upi"></span> UPI ID
287
- </div>
288
- <div class="legend-item">
289
- <span class="legend-dot phone"></span> Phone
290
- </div>
291
- <div class="legend-item">
292
- <span class="legend-dot campaign"></span> Campaign
293
- </div>
294
- </div>
295
- </div>
296
- </div>
297
-
298
- <!-- Telemetry Table -->
299
- <div class="panel telemetry-panel">
300
- <div class="panel-header">
301
- <h3><i class="fas fa-fingerprint"></i> Silent Fingerprints</h3>
302
- <span class="record-count" id="telemetry-count">0 records</span>
303
- </div>
304
- <div class="panel-body">
305
- <div class="table-container">
306
- <table class="data-table" id="telemetry-table">
307
- <thead>
308
- <tr>
309
- <th>IP Address</th>
310
- <th>Device OS</th>
311
- <th>Browser</th>
312
- <th>Risk</th>
313
- </tr>
314
- </thead>
315
- <tbody id="telemetry-body">
316
- <tr class="loading-row">
317
- <td colspan="4">
318
- <i class="fas fa-spinner fa-spin"></i> Loading telemetry...
319
- </td>
320
- </tr>
321
- </tbody>
322
- </table>
323
- </div>
324
- </div>
325
- </div>
326
-
327
- <!-- Dossier Generator -->
328
- <div class="panel dossier-panel">
329
- <div class="panel-header">
330
- <h3><i class="fas fa-file-contract"></i> Legal Dossier Generator</h3>
331
- </div>
332
- <div class="panel-body dossier-body">
333
- <div class="dossier-form">
334
- <div class="form-group">
335
- <label>Session ID / Case Number</label>
336
- <input type="text" id="dossier-id" class="form-input"
337
- placeholder="e.g., SESSION_ABC123">
338
- </div>
339
- <button class="generate-btn" onclick="SentinelDash.generateDossier()">
340
- <i class="fas fa-gavel"></i> Generate Legal Dossier
341
- </button>
342
- </div>
343
- </div>
344
- </div>
345
-
346
- </div>
347
- </section>
348
-
349
- <!-- ═══════════════════════════════════════════════════════════════
350
- VIEW 3: SCAMMER ENGAGEMENT TOOL
351
- ═══════════════════════════════════════════════════════════════ -->
352
- <section class="view" id="view-engagement">
353
-
354
- <div class="engagement-grid">
355
-
356
- <!-- API Testing Lab -->
357
- <div class="panel testing-panel">
358
- <div class="panel-header">
359
- <h3><i class="fas fa-flask"></i> Scam Detection Lab</h3>
360
- <span class="lab-badge">Interactive</span>
361
- </div>
362
- <div class="panel-body">
363
- <div class="lab-description">
364
- <p>Type a message <strong>as a scammer would</strong> to test the AI detection
365
- system.</p>
366
- </div>
367
- <div class="test-terminal">
368
- <div class="terminal-header">
369
- <span class="terminal-dot red"></span>
370
- <span class="terminal-dot yellow"></span>
371
- <span class="terminal-dot green"></span>
372
- <span class="terminal-title">sentinel-analyze</span>
373
- </div>
374
- <div class="terminal-content">
375
- <div class="terminal-history" id="test-history">
376
- <div class="history-item system">
377
- [SYSTEM] Detection Lab Ready. Type a scam message.
378
- </div>
379
- </div>
380
- <div class="terminal-input-line">
381
- <span class="prompt">scammer@test:~$</span>
382
- <input type="text" id="test-input" class="terminal-input"
383
- placeholder="Type scam message here..."
384
- onkeypress="SentinelDash.handleTestInput(event)">
385
- <button class="action-btn"
386
- onclick="SentinelDash.handleTestInput({key:'Enter', target: {value: 'GUVI_PROBE_SIMULATION'}})"
387
- title="Simulate GUVI Probe"
388
- style="margin-left: 10px; padding: 2px 8px; font-size: 0.7rem;">
389
- <i class="fas fa-bug"></i> GUVI
390
- </button>
391
- </div>
392
- </div>
393
- </div>
394
- </div>
395
- </div>
396
-
397
- <!-- Honeytoken Generator -->
398
- <div class="panel honeytoken-panel">
399
- <div class="panel-header">
400
- <h3><i class="fas fa-honey-pot"></i> Honeytoken Generator</h3>
401
- </div>
402
- <div class="panel-body">
403
- <div class="honeytoken-grid">
404
- <div class="honeytoken-card" onclick="SentinelDash.generateHoneytoken('upi')">
405
- <div class="token-icon"><i class="fas fa-credit-card"></i></div>
406
- <div class="token-title">Fake UPI Link</div>
407
- </div>
408
- <div class="honeytoken-card" onclick="SentinelDash.generateHoneytoken('kyc')">
409
- <div class="token-icon"><i class="fas fa-id-card"></i></div>
410
- <div class="token-title">Fake KYC Portal</div>
411
- </div>
412
- </div>
413
- <div class="honeytoken-output" id="honeytoken-output" style="display: none;">
414
- <div class="output-label">Generated Trap Link:</div>
415
- <div class="output-link">
416
- <code id="honeytoken-link"></code>
417
- <button class="copy-btn" onclick="SentinelDash.copyHoneytoken()">
418
- <i class="fas fa-copy"></i>
419
- </button>
420
- </div>
421
- </div>
422
- </div>
423
- </div>
424
-
425
- <!-- Admin Export Panel -->
426
- <div class="panel admin-panel">
427
- <div class="panel-header">
428
- <h3><i class="fas fa-user-shield"></i> Admin Controls</h3>
429
- <span class="admin-badge">Restricted</span>
430
- </div>
431
- <div class="panel-body">
432
- <div class="admin-section">
433
- <h4>SIEM Integration / Export</h4>
434
- <div class="export-options">
435
- <button class="export-btn" onclick="SentinelDash.exportLogs('splunk')">
436
- <i class="fas fa-database"></i> Splunk Format
437
- </button>
438
- <button class="export-btn" onclick="SentinelDash.exportLogs('csv')">
439
- <i class="fas fa-file-csv"></i> CSV Export
440
- </button>
441
- </div>
442
- </div>
443
- </div>
444
- </div>
445
-
446
- </div>
447
-
448
- <!-- ═══════════════════════════════════════════════════════════════
449
- VIEW 4: DOCUMENTATION HUB
450
- ═══════════════════════════════════════════════════════════════ -->
451
- <section class="view" id="view-docs">
452
- <div class="panel">
453
- <div class="panel-header">
454
- <h3><i class="fas fa-book-open"></i> System Documentation</h3>
455
- </div>
456
- <div class="panel-body">
457
- <div class="docs-grid">
458
- <a href="../docs/MASTER_API_CATALOG.md" target="_blank" class="doc-card">
459
- <div class="doc-icon"><i class="fas fa-code"></i></div>
460
- <div class="doc-title">Master API Catalog</div>
461
- <div class="doc-desc">Exhaustive list of all endpoints and secrets</div>
462
- </a>
463
- <a href="../docs/README.md" target="_blank" class="doc-card">
464
- <div class="doc-icon"><i class="fas fa-map"></i></div>
465
- <div class="doc-title">Documentation Index</div>
466
- <div class="doc-desc">Start here to navigate the project</div>
467
- </a>
468
- </div>
469
- </div>
470
- </div>
471
- </section>
472
-
473
- <!-- ═══════════════════════════════════════════════════════════════
474
- VIEW 5: ADMIN SETTINGS
475
- ═══════════════════════════════════════════════════════════════ -->
476
- <section class="view" id="view-settings">
477
- <div class="panel admin-panel-full">
478
- <div class="panel-header">
479
- <h3><i class="fas fa-user-lock"></i> Platform Configuration</h3>
480
- </div>
481
- <div class="panel-body">
482
- <div class="settings-group">
483
- <h4>GUVI Integration Keys</h4>
484
- <p class="settings-desc">Securely store your API keys for the Build-a-Thon
485
- evaluation.</p>
486
-
487
- <div class="input-with-action">
488
- <div class="form-group">
489
- <label>GUVI x-api-key</label>
490
- <input type="password" id="guvi-api-key" class="form-input"
491
- placeholder="Enter API Key...">
492
- </div>
493
- <button class="save-btn" onclick="SentinelDash.saveApiKey()">
494
- <i class="fas fa-save"></i> Save Key
495
- </button>
496
- </div>
497
- <div id="key-status" class="key-status">Not Configured</div>
498
- </div>
499
- <div class="settings-group">
500
- <h4>System UI Theme</h4>
501
- <div class="theme-toggles">
502
- <button class="theme-btn active"
503
- onclick="SentinelDash.setTheme('cyber')">Cyberpunk</button>
504
- <button class="theme-btn" onclick="SentinelDash.setTheme('minimal')">Enterprise
505
- Min</button>
506
- </div>
507
- </div>
508
- </div>
509
- </div>
510
- </section>
511
 
 
 
 
 
 
 
 
 
 
 
 
 
 
512
  </div>
513
- </section>
514
-
515
- </div>
516
- </main>
517
-
518
  </div>
519
- <!-- JavaScript -->
520
- <script src="dashboard.js"></script>
521
- </body>
522
-
523
- </html>
524
- <div class="toast" id="toast">
525
- <i class="fas fa-check-circle" id="toast-icon"></i>
526
- <span id="toast-message">Action completed</span>
527
- </div>
528
 
529
- <!-- JavaScript -->
530
- <script src="dashboard.js"></script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
531
  </body>
532
 
533
  </html>
 
4
  <head>
5
  <meta charset="UTF-8">
6
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+ <title>SENTINEL | Project Overview</title>
 
 
8
  <!-- Fonts -->
9
  <link rel="preconnect" href="https://fonts.googleapis.com">
 
10
  <link
11
+ href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=JetBrains+Mono:wght@300;400&family=Rajdhani:wght@400;600&display=swap"
12
  rel="stylesheet">
 
 
13
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
14
 
15
+ <style>
16
+ :root {
17
+ --bg-color: #030407;
18
+ --text-color: #c0c7d0;
19
+ --accent-color: #ffd700;
20
+ /* Honey Gold */
21
+ --border-color: #1a1f2e;
22
+ --panel-bg: rgba(10, 14, 23, 0.8);
23
+ }
24
+
25
+ body {
26
+ background-color: var(--bg-color);
27
+ color: var(--text-color);
28
+ font-family: 'Rajdhani', sans-serif;
29
+ margin: 0;
30
+ padding: 0;
31
+ display: flex;
32
+ flex-direction: column;
33
+ align-items: center;
34
+ justify-content: center;
35
+ min-height: 100vh;
36
+ overflow-x: hidden;
37
+ }
38
+
39
+ .background-grid {
40
+ position: fixed;
41
+ top: 0;
42
+ left: 0;
43
+ width: 100%;
44
+ height: 100%;
45
+ background-image: linear-gradient(var(--border-color) 1px, transparent 1px),
46
+ linear-gradient(90deg, var(--border-color) 1px, transparent 1px);
47
+ background-size: 50px 50px;
48
+ opacity: 0.1;
49
+ z-index: -1;
50
+ }
51
+
52
+ .container {
53
+ max-width: 800px;
54
+ width: 90%;
55
+ text-align: center;
56
+ padding: 40px;
57
+ background: var(--panel-bg);
58
+ border: 1px solid var(--border-color);
59
+ border-radius: 12px;
60
+ box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
61
+ backdrop-filter: blur(5px);
62
+ }
63
+
64
+ h1 {
65
+ font-family: 'Orbitron', sans-serif;
66
+ font-size: 3rem;
67
+ color: var(--accent-color);
68
+ margin-bottom: 10px;
69
+ text-shadow: 0 0 10px rgba(255, 215, 0, 0.3);
70
+ }
71
+
72
+ .subtitle {
73
+ font-size: 1.2rem;
74
+ margin-bottom: 40px;
75
+ font-family: 'JetBrains Mono', monospace;
76
+ opacity: 0.8;
77
+ letter-spacing: 1px;
78
+ }
79
+
80
+ .info-grid {
81
+ display: grid;
82
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
83
+ gap: 20px;
84
+ text-align: left;
85
+ margin-bottom: 40px;
86
+ }
87
+
88
+ .info-card {
89
+ background: rgba(255, 255, 255, 0.03);
90
+ border: 1px solid var(--border-color);
91
+ padding: 20px;
92
+ border-radius: 8px;
93
+ }
94
+
95
+ .info-card h3 {
96
+ color: #fff;
97
+ margin-top: 0;
98
+ font-size: 1.1rem;
99
+ border-bottom: 1px solid var(--border-color);
100
+ padding-bottom: 10px;
101
+ }
102
+
103
+ .info-card p {
104
+ font-size: 0.95rem;
105
+ line-height: 1.5;
106
+ }
107
+
108
+ .btn {
109
+ background: transparent;
110
+ color: var(--accent-color);
111
+ border: 2px solid var(--accent-color);
112
+ padding: 15px 40px;
113
+ font-family: 'Orbitron', sans-serif;
114
+ font-size: 1.1rem;
115
+ cursor: pointer;
116
+ transition: 0.3s;
117
+ text-transform: uppercase;
118
+ letter-spacing: 2px;
119
+ position: relative;
120
+ overflow: hidden;
121
+ }
122
+
123
+ .btn:hover {
124
+ background: var(--accent-color);
125
+ color: #000;
126
+ box-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
127
+ }
128
+
129
+ .footer {
130
+ margin-top: 30px;
131
+ font-size: 0.8rem;
132
+ opacity: 0.5;
133
+ }
134
+ </style>
135
  </head>
136
 
137
  <body>
138
 
139
+ <div class="background-grid"></div>
 
 
 
 
 
 
 
 
 
 
 
140
 
141
+ <div class="container">
142
+ <i class="fas fa-shield-alt" style="font-size: 4rem; color: var(--accent-color); margin-bottom: 20px;"></i>
143
+ <h1>SENTINEL</h1>
144
+ <div class="subtitle">AUTONOMOUS SCAM INTELLIGENCE PLATFORM</div>
145
 
146
+ <div class="info-grid">
147
+ <div class="info-card">
148
+ <h3><i class="fas fa-code-branch"></i> Mission</h3>
149
+ <p>To actively disrupt cyber fraud networks targeting Indian citizens by deploying autonomous AI
150
+ honeypots that waste scammer time and extract actionable intelligence.</p>
 
 
 
 
151
  </div>
152
+ <div class="info-card">
153
+ <h3><i class="fas fa-microchip"></i> Technology</h3>
154
+ <p>Powered by <strong>LLMs</strong> (Groq), <strong>FastAPI</strong>, and <strong>Graph
155
+ Forensics</strong>. Implements MITRE ATT&CK extraction and automated legal dossier generation.
156
+ </p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
157
  </div>
158
+ <div class="info-card">
159
+ <h3><i class="fas fa-lock"></i> Access</h3>
160
+ <p>The operational Command Center is restricted to authorized personnel. Public access is limited to
161
+ project documentation and overview.</p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
162
  </div>
163
+ </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
164
 
165
+ <button class="btn" onclick="requestAccess()">
166
+ Access Command Center
167
+ </button>
168
+
169
+ <div class="footer">
170
+ &copy; 2026 Sentinel Project | Built for India AI Impact Buildathon
171
+ <div style="margin-top: 15px; display: flex; gap: 15px; justify-content: center; font-size: 1.2rem;">
172
+ <a href="https://avinashanalytics.github.io/" target="_blank" title="Portfolio"
173
+ style="color: var(--accent-color);"><i class="fas fa-globe"></i></a>
174
+ <a href="https://github.com/avinashanalytics" target="_blank" title="GitHub"
175
+ style="color: var(--text-color);"><i class="fab fa-github"></i></a>
176
+ <a href="https://linkedin.com/in/avinashanalytics" target="_blank" title="LinkedIn"
177
+ style="color: #0077b5;"><i class="fab fa-linkedin"></i></a>
178
  </div>
179
+ </div>
 
 
 
 
180
  </div>
 
 
 
 
 
 
 
 
 
181
 
182
+ <script>
183
+ // Secure server-side validation
184
+ async function requestAccess() {
185
+ const password = prompt("ENTER SECURITY CLEARANCE CODE:");
186
+ if (!password) return;
187
+
188
+ try {
189
+ const response = await fetch('/api/v1/auth/login', {
190
+ method: 'POST',
191
+ headers: { 'Content-Type': 'application/json' },
192
+ body: JSON.stringify({ password: password })
193
+ });
194
+
195
+ if (response.ok) {
196
+ sessionStorage.setItem('sentinel_auth', 'true');
197
+ document.querySelector('h1').innerText = "ACCESS GRANTED";
198
+ document.querySelector('h1').style.color = "#0f0";
199
+ setTimeout(() => {
200
+ window.location.href = "/dashboard.html";
201
+ }, 800);
202
+ } else {
203
+ alert("ACCESS DENIED: Invalid Credentials");
204
+ }
205
+ } catch (e) {
206
+ console.error(e);
207
+ alert("SYSTEM ERROR: Auth Service Unreachable");
208
+ }
209
+ }
210
+ </script>
211
  </body>
212
 
213
  </html>