arkorty/B.Tech-Project-III
1
0
Fork 0
mirror of https://github.com/arkorty/B.Tech-Project-III.git synced 2026-04-19 12:41:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
Arkaprabha Chakraborty
2026-04-05 00:43:23 +05:30
commit 8be37d3e92
425 changed files with 101853 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

514
thirdeye/stitch_logs.html Normal file
View File

@@ -0,0 +1,514 @@
<!DOCTYPE html>
<html class="dark" lang="en"><head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>ThirdEye | System Logs</title>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&amp;family=Inter+Tight:wght@400;500;600;700;800;900&amp;family=JetBrains+Mono:wght@400;500;700&amp;family=Poppins:wght@400;500;600;700&amp;family=Space+Grotesk:wght@400;500;600;700&amp;display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&amp;display=swap" rel="stylesheet"/>
<style>
body {
background-color: #09090B;
font-family: 'Inter', sans-serif;
margin: 0;
overflow-x: hidden;
}
.font-mono {
font-family: 'JetBrains Mono', monospace;
}
.font-poppins {
font-family: 'Poppins', sans-serif;
}
.font-headline {
font-family: 'Inter Tight', sans-serif;
}
/* Updated Glass Panel Style based on SCREEN_25 */
.glass-panel {
background: linear-gradient(180deg, rgba(28, 20, 45, 0.7) 0%, rgba(18, 14, 28, 0.9) 100%);
backdrop-filter: blur(12px);
border: 1px solid rgba(167, 139, 250, 0.12);
position: relative;
overflow: hidden;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glass-panel::before {
content: '';
position: absolute;
left: 0;
top: 20%;
height: 60%;
width: 2px;
background: linear-gradient(to bottom, transparent, #A78BFA, transparent);
opacity: 0.4;
}
.glass-panel:hover {
border-color: rgba(167, 139, 250, 0.3);
box-shadow: 0 0 30px rgba(167, 139, 250, 0.1);
}
.neon-glow-violet {
box-shadow: 0 0 20px rgba(167, 139, 250, 0.15);
}
.neon-border-violet {
border-color: rgba(167, 139, 250, 0.3);
}
.status-strip-error { border-left: 4px solid #ee7d77; }
.status-strip-warning { border-left: 4px solid #ffb300; }
.status-strip-success { border-left: 4px solid #00daf3; }
.status-strip-info { border-left: 4px solid #a88cfb; }
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-track { background: #09090B; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: rgba(167, 139, 250, 0.3); border-radius: 2px; }
.crt-overlay {
position: relative;
overflow: hidden;
}
.crt-overlay::after {
content: " ";
display: block;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.15) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.03), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.03));
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
@keyframes blink {
0%, 100% { opacity: 1; }
50% { opacity: 0; }
}
.terminal-cursor {
display: inline-block;
width: 8px;
height: 14px;
background-color: #a88cfb;
animation: blink 1s step-end infinite;
vertical-align: middle;
margin-left: 4px;
}
.syntax-timestamp { color: #8b5cf6; }
.syntax-agent { color: #c7b4ff; font-weight: 600; }
.syntax-key { color: #a88cfb; }
.syntax-string { color: #e7e4ec; opacity: 0.9; }
.syntax-ip { color: #00daf3; font-style: italic; }
</style>
<script id="tailwind-config">
tailwind.config = {
darkMode: "class",
theme: {
extend: {
colors: {
"surface-container": "#19191d",
"primary-fixed": "#9cf0ff",
"tertiary": "#ff6f78",
"tertiary-fixed": "#fe3c56",
"on-tertiary-container": "#000000",
"error-dim": "#bb5551",
"tertiary-container": "#fe3c56",
"inverse-surface": "#fcf8fb",
"surface-container-lowest": "#000000",
"surface-container-high": "#1f1f24",
"surface-bright": "#2b2c32",
"on-secondary": "#260069",
"primary": "#00daf3",
"on-surface": "#e7e4ec",
"secondary-container": "#432390",
"on-error": "#490106",
"surface": "#0e0e10",
"inverse-primary": "#006976",
"secondary-dim": "#a88cfb",
"on-secondary-container": "#c7b4ff",
"secondary": "#a88cfb",
"outline-variant": "#47474e",
"on-primary": "#004750",
"on-tertiary-fixed-variant": "#2c0005",
"on-surface-variant": "#acaab1",
"primary-dim": "#00cbe2",
"tertiary-dim": "#ff6f78",
"surface-variant": "#25252b",
"surface-tint": "#00daf3",
"on-primary-container": "#00e5ff",
"surface-dim": "#0e0e10",
"secondary-fixed": "#e8ddff",
"primary-fixed-dim": "#49e7ff",
"surface-container-highest": "#25252b",
"secondary-fixed-dim": "#dbcdff",
"on-tertiary-fixed": "#000000",
"on-primary-fixed-variant": "#006571",
"tertiary-fixed-dim": "#eb2d4b",
"surface-container-low": "#131316",
"primary-container": "#004f58",
"on-tertiary": "#49000d",
"error": "#ee7d77",
"on-secondary-fixed-variant": "#6448b2",
"on-secondary-fixed": "#472894",
"error-container": "#7f2927",
"outline": "#75757c",
"background": "#0e0e10",
"on-primary-fixed": "#00464f",
"inverse-on-surface": "#565457",
"on-background": "#e7e4ec",
"on-error-container": "#ff9993"
},
fontFamily: {
"headline": ["Inter Tight"],
"body": ["Inter"],
"label": ["Space Grotesk"],
"mono": ["JetBrains Mono"]
},
borderRadius: {"DEFAULT": "0.25rem", "lg": "0.5rem", "xl": "0.75rem", "full": "9999px"},
},
},
}
</script>
</head>
<body class="text-on-surface flex min-h-screen overflow-hidden">
<!-- SideNavBar -->
<aside class="fixed left-0 top-0 h-full w-[220px] bg-[#0C0C0E] flex flex-col py-6 border-r border-outline-variant/10 z-50">
<div class="px-6 mb-10">
<div class="flex items-center gap-3">
<div class="w-8 h-8 bg-secondary/20 flex items-center justify-center rounded-lg border border-secondary/30">
<span class="material-symbols-outlined text-secondary text-lg" style="font-variation-settings: 'FILL' 1;">security</span>
</div>
<div>
<h1 class="text-lg font-bold text-violet-400 font-poppins leading-none">ThirdEye</h1>
<p class="text-[10px] text-zinc-500 tracking-[0.2em] uppercase font-poppins mt-1">Sovereign Intel</p>
</div>
</div>
</div>
<nav class="flex-1 px-4 space-y-1">
<a class="flex items-center gap-3 px-4 py-3 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 transition-all rounded-lg group" href="#">
<span class="material-symbols-outlined text-lg">dashboard</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">Overview</span>
</a>
<a class="flex items-center gap-3 px-4 py-3 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 transition-all rounded-lg group" href="#">
<span class="material-symbols-outlined text-lg">biotech</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">Intelligence</span>
</a>
<a class="flex items-center gap-3 px-4 py-3 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 transition-all rounded-lg group" href="#">
<span class="material-symbols-outlined text-lg">visibility</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">Surveillance</span>
</a>
<a class="flex items-center gap-3 px-4 py-3 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 transition-all rounded-lg group" href="#">
<span class="material-symbols-outlined text-lg">hub</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">Networks</span>
</a>
<a class="flex items-center gap-3 px-4 py-3 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 transition-all rounded-lg group" href="#">
<span class="material-symbols-outlined text-lg">database</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">Archive</span>
</a>
<a class="flex items-center gap-3 px-4 py-3 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 transition-all rounded-lg group" href="#">
<span class="material-symbols-outlined text-lg">settings</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">Settings</span>
</a>
</nav>
<div class="px-4 mt-auto space-y-1">
<a class="flex items-center gap-3 px-4 py-3 text-violet-400 bg-violet-500/10 border-l-2 border-violet-500 rounded-r-lg" href="#">
<span class="material-symbols-outlined text-lg" style="font-variation-settings: 'FILL' 1;">terminal</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">System Logs</span>
</a>
<a class="flex items-center gap-3 px-4 py-3 text-zinc-500 hover:text-zinc-300 hover:bg-zinc-800/50 transition-all rounded-lg" href="#">
<span class="material-symbols-outlined text-lg">help_center</span>
<span class="text-xs font-medium tracking-widest uppercase font-poppins">Support</span>
</a>
</div>
</aside>
<!-- Main Content Area -->
<main class="flex-1 ml-[220px] flex flex-col h-screen overflow-hidden bg-[#09090B]">
<!-- TopNavBar -->
<header class="bg-[#0F0F12]/80 backdrop-blur-xl flex justify-between items-center w-full px-6 h-14 z-40 border-b border-outline-variant/10">
<div class="flex items-center gap-4">
<div class="flex items-center bg-[#141419] rounded-lg px-3 py-1.5 border border-outline-variant/20">
<span class="material-symbols-outlined text-zinc-500 text-sm mr-2">search</span>
<input class="bg-transparent border-none focus:ring-0 text-[10px] font-mono text-on-surface-variant w-48 placeholder-zinc-600 uppercase" placeholder="QUERY LOGS..." type="text"/>
</div>
</div>
<div class="flex items-center gap-6">
<div class="flex items-center gap-4">
<button class="text-zinc-500 hover:text-violet-300 transition-colors">
<span class="material-symbols-outlined text-xl">sensors</span>
</button>
<button class="text-zinc-500 hover:text-violet-300 transition-colors">
<span class="material-symbols-outlined text-xl">security</span>
</button>
<button class="text-zinc-500 hover:text-violet-300 transition-colors relative">
<span class="material-symbols-outlined text-xl">notifications</span>
<span class="absolute top-0 right-0 w-1.5 h-1.5 bg-violet-500 rounded-full"></span>
</button>
</div>
<div class="h-8 w-px bg-outline-variant/20 mx-2"></div>
<div class="flex items-center gap-3">
<div class="text-right">
<p class="text-[10px] font-mono text-on-surface leading-tight">OP_7742</p>
<p class="text-[8px] font-mono text-violet-400 leading-tight uppercase">System Admin</p>
</div>
<img alt="Operator Profile" class="w-8 h-8 rounded-lg border border-violet-500/30" src="https://lh3.googleusercontent.com/aida-public/AB6AXuA4-u7rg2NAI_lvlV3V1as06MQzIinBx3VO-xdU-1xsV-FKd6PdZD6mpMVxtAT82VRFNmwDTJ7pWjgLl7pIYRVXe9hGDF_tK56T1zhfAoLhKB7empSuRxxyRwsmAlpn7nIxgtFxHHXYKZJfr9jb-k0Mh8lovt6lDgo94nOHKcrxzlzAuaCdZ9DbnxiwHDxdv5oE75WW8E_AazYUIS_rjWvz8kIBRPEUkuCOpSRTdi4MlwforGISQbJ8am6tFTfbTwWuEcEZivYdHREn"/>
</div>
</div>
</header>
<!-- Log Content -->
<div class="flex-1 p-6 overflow-hidden flex flex-col gap-6">
<!-- Analytics Top Bar -->
<section class="grid grid-cols-4 gap-4">
<div class="glass-panel p-4 rounded-xl flex flex-col justify-between h-24 border-l-4 border-violet-500 font-poppins neon-glow-violet">
<div class="flex justify-between items-start">
<span class="text-[10px] font-poppins text-zinc-500 tracking-wider uppercase">Ingestion Rate</span>
<span class="material-symbols-outlined text-violet-400 text-sm">trending_up</span>
</div>
<div>
<span class="text-2xl font-mono font-bold text-on-surface">1.2<span class="text-xs text-violet-500 ml-1">GB/s</span></span>
<div class="w-full bg-surface-container-low h-1 mt-2 rounded-full overflow-hidden">
<div class="bg-violet-500 h-full w-[65%]"></div>
</div>
</div>
</div>
<div class="glass-panel p-4 rounded-xl flex flex-col justify-between h-24 border-l-4 border-primary font-poppins neon-glow-violet">
<div class="flex justify-between items-start">
<span class="text-[10px] font-poppins text-zinc-500 tracking-wider uppercase">Active Agents</span>
<span class="material-symbols-outlined text-primary text-sm" style="font-variation-settings: 'FILL' 1;">groups</span>
</div>
<div>
<span class="text-2xl font-mono font-bold text-on-surface">242</span>
<div class="flex gap-0.5 mt-2">
<div class="h-1 flex-1 bg-primary"></div>
<div class="h-1 flex-1 bg-primary"></div>
<div class="h-1 flex-1 bg-primary"></div>
<div class="h-1 flex-1 bg-zinc-800"></div>
<div class="h-1 flex-1 bg-zinc-800"></div>
</div>
</div>
</div>
<div class="glass-panel p-4 rounded-xl flex flex-col justify-between h-24 border-l-4 border-error font-poppins neon-glow-violet">
<div class="flex justify-between items-start">
<span class="text-[10px] font-poppins text-zinc-500 tracking-wider uppercase">Threat Level</span>
<span class="material-symbols-outlined text-error text-sm">warning</span>
</div>
<div>
<span class="text-2xl font-mono font-bold text-error">CRITICAL</span>
<p class="text-[8px] font-mono text-zinc-500 mt-1 uppercase">3 Ongoing breaches</p>
</div>
</div>
<div class="glass-panel p-4 rounded-xl flex flex-col justify-between h-24 border-l-4 border-secondary font-poppins neon-glow-violet">
<div class="flex justify-between items-start">
<span class="text-[10px] font-poppins text-zinc-500 tracking-wider uppercase">Memory Usage</span>
<span class="material-symbols-outlined text-secondary text-sm">memory</span>
</div>
<div class="flex items-end justify-between">
<span class="text-2xl font-mono font-bold text-on-surface">84<span class="text-xs text-secondary ml-1">%</span></span>
<div class="flex gap-1 items-end h-8">
<div class="w-1 bg-secondary/30 h-2"></div>
<div class="w-1 bg-secondary/50 h-4"></div>
<div class="w-1 bg-secondary/70 h-6"></div>
<div class="w-1 bg-secondary h-8"></div>
</div>
</div>
</div>
</section>
<!-- Main Log Viewer & Console -->
<div class="flex-1 flex flex-col gap-4 overflow-hidden">
<!-- Table Section -->
<section class="flex-1 glass-panel rounded-xl neon-border-violet flex flex-col overflow-hidden crt-overlay neon-glow-violet">
<!-- Filter Header -->
<div class="flex items-center justify-between px-6 py-4 border-b border-outline-variant/10 z-10 relative bg-[#0F0F12]/50">
<div class="flex items-center gap-6">
<button class="text-xs font-poppins font-semibold text-violet-400 border-b-2 border-violet-400 pb-1 uppercase tracking-widest">All Logs</button>
<button class="text-xs font-poppins font-medium text-zinc-500 hover:text-zinc-300 transition-colors uppercase tracking-widest">Critical</button>
<button class="text-xs font-poppins font-medium text-zinc-500 hover:text-zinc-300 transition-colors uppercase tracking-widest">Warnings</button>
<button class="text-xs font-poppins font-medium text-zinc-500 hover:text-zinc-300 transition-colors uppercase tracking-widest">Agent Activity</button>
</div>
<div class="flex items-center gap-4">
<span class="text-[10px] font-mono text-zinc-500">SORT: DESCENDING</span>
<button class="bg-violet-500/10 hover:bg-violet-500/20 text-violet-400 p-1.5 rounded-lg border border-violet-500/20 transition-all">
<span class="material-symbols-outlined text-sm">filter_alt</span>
</button>
<button class="bg-violet-500 text-black px-4 py-1.5 rounded-md text-[10px] font-bold font-poppins uppercase tracking-tighter hover:bg-violet-400 transition-all">
Export PDF
</button>
</div>
</div>
<!-- Log Table Body -->
<div class="flex-1 overflow-y-auto custom-scrollbar relative z-10">
<table class="w-full text-left border-collapse">
<thead class="sticky top-0 bg-[#141419]/90 backdrop-blur-md z-20 border-b border-outline-variant/10">
<tr>
<th class="px-6 py-3 text-[10px] font-poppins font-bold text-zinc-500 uppercase tracking-widest w-48">Timestamp</th>
<th class="px-4 py-3 text-[10px] font-poppins font-bold text-zinc-500 uppercase tracking-widest w-24">Level</th>
<th class="px-4 py-3 text-[10px] font-poppins font-bold text-zinc-500 uppercase tracking-widest w-32">Agent ID</th>
<th class="px-6 py-3 text-[10px] font-poppins font-bold text-zinc-500 uppercase tracking-widest">Message Payload</th>
<th class="px-6 py-3 text-[10px] font-poppins font-bold text-zinc-500 uppercase tracking-widest w-20 text-right">Status</th>
</tr>
</thead>
<tbody class="divide-y divide-outline-variant/5">
<tr class="hover:bg-violet-500/[0.05] transition-colors group status-strip-error">
<td class="px-6 py-3 font-mono text-[11px] syntax-timestamp">2024-05-20 14:22:01.442</td>
<td class="px-4 py-3">
<span class="text-[9px] font-mono px-2 py-0.5 rounded bg-error/10 text-error border border-error/20 font-bold shadow-[0_0_5px_rgba(238,125,119,0.2)]">ERROR</span>
</td>
<td class="px-4 py-3 font-mono text-[11px] syntax-agent">AX-982_CORE</td>
<td class="px-6 py-3 font-mono text-[11px] truncate">
<span class="syntax-string">Unauthorized handshake from peer</span> <span class="syntax-ip">[192.168.1.104]</span>. <span class="syntax-key">{"action": "TERMINATE_SESSION"}</span>
</td>
<td class="px-6 py-3 text-right">
<span class="material-symbols-outlined text-error text-lg" style="font-variation-settings: 'FILL' 1;">dangerous</span>
</td>
</tr>
<tr class="hover:bg-violet-500/[0.05] transition-colors group status-strip-info">
<td class="px-6 py-3 font-mono text-[11px] syntax-timestamp">2024-05-20 14:21:58.112</td>
<td class="px-4 py-3">
<span class="text-[9px] font-mono px-2 py-0.5 rounded bg-violet-500/10 text-violet-400 border border-violet-500/20 font-bold">INFO</span>
</td>
<td class="px-4 py-3 font-mono text-[11px] syntax-agent">SYS_MONITOR</td>
<td class="px-6 py-3 font-mono text-[11px] truncate">
<span class="syntax-string">Key rotation complete. Nodes synced.</span> <span class="syntax-key">{"latency": "12ms", "status": "nominal"}</span>
</td>
<td class="px-6 py-3 text-right">
<span class="material-symbols-outlined text-violet-400 text-lg">info</span>
</td>
</tr>
<tr class="hover:bg-violet-500/[0.05] transition-colors group status-strip-success">
<td class="px-6 py-3 font-mono text-[11px] syntax-timestamp">2024-05-20 14:21:45.890</td>
<td class="px-4 py-3">
<span class="text-[9px] font-mono px-2 py-0.5 rounded bg-primary/10 text-primary border border-primary/20 font-bold">SUCCESS</span>
</td>
<td class="px-4 py-3 font-mono text-[11px] syntax-agent">SCAN_AGENT_04</td>
<td class="px-6 py-3 font-mono text-[11px] truncate">
<span class="syntax-string">Quantum hash verification PASSED.</span> <span class="syntax-key">{"sector": "7B", "integrity": 1.0}</span>
</td>
<td class="px-6 py-3 text-right">
<span class="material-symbols-outlined text-primary text-lg" style="font-variation-settings: 'FILL' 1;">check_circle</span>
</td>
</tr>
<tr class="hover:bg-violet-500/[0.05] transition-colors group status-strip-warning">
<td class="px-6 py-3 font-mono text-[11px] syntax-timestamp">2024-05-20 14:21:12.001</td>
<td class="px-4 py-3">
<span class="text-[9px] font-mono px-2 py-0.5 rounded bg-yellow-500/10 text-yellow-500 border border-yellow-500/20 font-bold">WARN</span>
</td>
<td class="px-4 py-3 font-mono text-[11px] syntax-agent">THERMAL_REG</td>
<td class="px-6 py-3 font-mono text-[11px] truncate">
<span class="syntax-string">Blade rack 4 temp high.</span> <span class="syntax-key">{"temp": "72°C", "limit": "70°C"}</span>
</td>
<td class="px-6 py-3 text-right">
<span class="material-symbols-outlined text-yellow-500 text-lg">report_problem</span>
</td>
</tr>
<tr class="hover:bg-violet-500/[0.05] transition-colors group status-strip-info">
<td class="px-6 py-3 font-mono text-[11px] syntax-timestamp">2024-05-20 14:20:55.223</td>
<td class="px-4 py-3">
<span class="text-[9px] font-mono px-2 py-0.5 rounded bg-violet-500/10 text-violet-400 border border-violet-500/20 font-bold">INFO</span>
</td>
<td class="px-4 py-3 font-mono text-[11px] syntax-agent">USER_AUTH</td>
<td class="px-6 py-3 font-mono text-[11px] truncate">
<span class="syntax-string">Admin login sequence initiated.</span> <span class="syntax-key">{"terminal": "ST-09", "auth": "biometric"}</span>
</td>
<td class="px-6 py-3 text-right">
<span class="material-symbols-outlined text-violet-400 text-lg">verified_user</span>
</td>
</tr>
</tbody>
</table>
</div>
<!-- Footer Log Stats -->
<div class="px-6 py-3 border-t border-outline-variant/10 flex items-center justify-between text-[10px] font-mono text-zinc-500 relative z-10 bg-[#0F0F12]/50">
<div class="flex items-center gap-4">
<span class="flex items-center gap-1.5"><span class="w-1.5 h-1.5 bg-violet-500 rounded-full animate-pulse"></span> LIVE RECAPITULATION</span>
<span>|</span>
<span>Showing 1,240 events of 44,901</span>
</div>
<div class="flex items-center gap-4">
<span>PAGE 1 OF 3,741</span>
<div class="flex gap-1">
<button class="w-6 h-6 flex items-center justify-center rounded border border-outline-variant/20 hover:bg-violet-500/10 hover:text-violet-400 transition-colors">
<span class="material-symbols-outlined text-sm">chevron_left</span>
</button>
<button class="w-6 h-6 flex items-center justify-center rounded border border-outline-variant/20 hover:bg-violet-500/10 hover:text-violet-400 transition-colors">
<span class="material-symbols-outlined text-sm">chevron_right</span>
</button>
</div>
</div>
</div>
</section>
<!-- Interactive Console -->
<section class="h-32 glass-panel rounded-xl neon-border-violet crt-overlay flex flex-col overflow-hidden neon-glow-violet">
<div class="flex items-center justify-between px-4 py-1.5 border-b border-violet-500/20 bg-violet-500/5 relative z-10">
<div class="flex items-center gap-2">
<span class="material-symbols-outlined text-xs text-violet-400">terminal</span>
<span class="text-[9px] font-poppins font-bold text-violet-400 uppercase tracking-widest">Master Terminal Output</span>
</div>
<div class="flex gap-1.5">
<div class="w-2 h-2 rounded-full bg-zinc-700"></div>
<div class="w-2 h-2 rounded-full bg-zinc-700"></div>
<div class="w-2 h-2 rounded-full bg-violet-500/40"></div>
</div>
</div>
<div class="flex-1 p-3 font-mono text-[10px] overflow-y-auto custom-scrollbar relative z-10 space-y-1">
<p class="text-zinc-500">[0.000000] Initializing ThirdEye Sovereign Kernel v4.2.0-stable...</p>
<p class="text-zinc-500">[0.012441] Probing for regional satellite clusters... 12 found.</p>
<p class="text-violet-400/80">[1.442091] Authentication layer engaged. Handshaking with local nodes.</p>
<p class="text-primary/80">[2.112440] Network topology re-aligned. Current threat vector: STABLE.</p>
<div class="flex items-center text-on-surface">
<span class="text-violet-400 mr-2">op_7742@thirdeye:~$</span>
<span class="opacity-70">tail -f /var/log/kernel_events.log --grep "CRITICAL"</span>
<span class="terminal-cursor"></span>
</div>
</div>
</section>
</div>
</div>
<!-- System Ticker -->
<footer class="h-8 bg-[#0C0C0E] border-t border-outline-variant/10 px-6 flex items-center overflow-hidden">
<div class="flex items-center whitespace-nowrap animate-ticker gap-12 w-full">
<div class="flex items-center gap-2 text-[10px] font-mono text-violet-400/70">
<span class="font-bold uppercase">[SYSTEM]</span> Kernel optimization complete. (v4.2.0-stable)
</div>
<div class="flex items-center gap-2 text-[10px] font-mono text-zinc-500">
<span class="font-bold text-primary/70 uppercase">[NET]</span> Sub-layer latency dropped below 5ms for all local clusters.
</div>
<div class="flex items-center gap-2 text-[10px] font-mono text-zinc-500">
<span class="font-bold text-error/70 uppercase">[SEC]</span> Brute force attempt blocked from 45.1.22.88. Target: Archive_Vault.
</div>
<div class="flex items-center gap-2 text-[10px] font-mono text-violet-400/70">
<span class="font-bold uppercase">[AI]</span> Neural agent AX-982 is retraining on high-entropy log clusters.
</div>
</div>
</footer>
</main>
<!-- Sidebar Detail Visual (Floating) -->
<div class="fixed right-6 bottom-14 w-64 glass-panel rounded-xl p-4 neon-border-violet hidden xl:block z-50 crt-overlay neon-glow-violet">
<div class="flex justify-between items-center mb-4 relative z-10">
<h3 class="text-[10px] font-poppins font-bold text-violet-400 uppercase tracking-widest">Selected Event Details</h3>
<button class="text-zinc-500 hover:text-on-surface">
<span class="material-symbols-outlined text-sm">close</span>
</button>
</div>
<div class="space-y-4 relative z-10">
<div class="bg-black/40 rounded-lg p-3 border border-outline-variant/10">
<p class="text-[8px] font-mono text-zinc-500 uppercase mb-1">Raw Signature</p>
<p class="text-[10px] font-mono text-violet-300 break-all opacity-80">
SHA256: 8a7f11c2...b9921e
</p>
</div>
<div class="bg-black/40 rounded-lg p-3 border border-outline-variant/10">
<p class="text-[8px] font-mono text-zinc-500 uppercase mb-1">Geolocation</p>
<div class="flex items-center justify-between">
<span class="text-[10px] font-mono text-on-surface">Moscow, RU</span>
<span class="text-[10px] font-mono text-error font-bold italic">PROXIED</span>
</div>
</div>
<div class="flex gap-2">
<button class="flex-1 bg-violet-500/10 border border-violet-500/30 py-2 rounded-md text-[9px] font-bold text-violet-400 uppercase tracking-tighter hover:bg-violet-500/20 transition-all font-poppins">Trace Route</button>
<button class="flex-1 bg-error/10 border border-error/30 py-2 rounded-md text-[9px] font-bold text-error uppercase tracking-tighter hover:bg-error/20 transition-all font-poppins">Isolate Node</button>
</div>
</div>
</div>
</body></html>