@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;700&display=swap');
body {
font-family: 'Inter', sans-serif;
margin: 0;
overflow: hidden;
color: #1e293b;
background-color: #f8fafc;
}
.font-mono { font-family: 'JetBrains Mono', monospace; }
/* ========================================= */
/* ETHEREAL PASTEL BACKGROUND */
/* ========================================= */
.bg-ethereal {
position: fixed;
top: 0; left: 0; width: 100vw; height: 100vh;
background: linear-gradient(to bottom right, #fdfbfb 0%, #ebedee 100%);
z-index: -3;
}
.blob {
position: fixed;
border-radius: 50%;
filter: blur(90px);
z-index: -2;
opacity: 0.5;
animation: float 20s infinite alternate ease-in-out;
}
.blob-1 { top: -10%; left: -10%; width: 60vw; height: 60vh; background: #e0c3fc; }
.blob-2 { bottom: -10%; right: -10%; width: 50vw; height: 50vh; background: #8ec5fc; animation-delay: -5s; }
.blob-3 { top: 20%; left: 40%; width: 40vw; height: 40vh; background: #ffc3a0; animation-delay: -10s; }
@keyframes float {
0% { transform: translate(0, 0); }
100% { transform: translate(5%, 10%); }
}
/* ========================================= */
/* GLASSMORPHISM COMPONENTS */
/* ========================================= */
.glass {
background: rgba(255, 255, 255, 0.65);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.8);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.05);
border-radius: 1.25rem;
}
.glass-active {
background: linear-gradient(135deg, rgba(238,242,255,0.9) 0%, rgba(250,232,255,0.9) 100%);
border: 1px solid rgba(255, 255, 255, 1);
box-shadow: 0 4px 15px rgba(99, 102, 241, 0.15);
position: relative;
}
.glass-active::before {
content: '';
position: absolute;
left: -1px; top: 10%; height: 80%; width: 4px;
background: #8b5cf6;
border-radius: 0 4px 4px 0;
}
.glass-input {
background: rgba(255, 255, 255, 0.8);
border: 1px solid rgba(255, 255, 255, 1);
box-shadow: inset 0 2px 4px rgba(0,0,0,0.02);
border-radius: 9999px;
}
/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, 0.3); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(100, 116, 139, 0.5); }
/* ========================================= */
/* REALISTIC 3D BUTTERFLY ANIMATION */
/* ========================================= */
.butterfly-container {
position: relative;
width: 80px;
height: 80px;
perspective: 600px;
transform-style: preserve-3d;
animation: float-slow 4s ease-in-out infinite;
margin: 0 auto;
}
@keyframes float-slow {
0%, 100% { transform: translateY(0px) scale(1); }
50% { transform: translateY(-8px) scale(1.02); }
}
.wing {
position: absolute;
top: 0;
width: 100%;
height: 100%;
background-image: url('https://upload.wikimedia.org/wikipedia/commons/thumb/c/c8/Blue_morpho_butterfly.png/800px-Blue_morpho_butterfly.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
transform-style: preserve-3d;
backface-visibility: visible;
filter: drop-shadow(0 5px 10px rgba(59,130,246,0.4));
}
.wing-left {
left: 0;
clip-path: polygon(0 0, 50% 0, 50% 100%, 0% 100%);
transform-origin: 50% 50%;
animation: flap-left 0.15s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
}
.wing-right {
left: 0;
clip-path: polygon(50% 0, 100% 0, 100% 100%, 50% 100%);
transform-origin: 50% 50%;
animation: flap-right 0.15s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
}
@keyframes flap-left {
0% { transform: rotateY(0deg) rotateZ(0deg) rotateX(0deg); filter: brightness(1); }
50% { transform: rotateY(60deg) rotateZ(5deg) rotateX(-5deg); filter: brightness(1.2); }
100% { transform: rotateY(-10deg) rotateZ(-2deg) rotateX(2deg); filter: brightness(0.9); }
}
@keyframes flap-right {
0% { transform: rotateY(0deg) rotateZ(0deg) rotateX(0deg); filter: brightness(1); }
50% { transform: rotateY(-60deg) rotateZ(-5deg) rotateX(-5deg); filter: brightness(1.2); }
100% { transform: rotateY(10deg) rotateZ(2deg) rotateX(2deg); filter: brightness(0.9); }
}
.butterfly-body {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url('https://upload.wikimedia.org/wikipedia/commons/thumb/c/c8/Blue_morpho_butterfly.png/800px-Blue_morpho_butterfly.png');
background-size: contain;
background-position: center;
background-repeat: no-repeat;
clip-path: polygon(48% 0, 52% 0, 52% 100%, 48% 100%);
z-index: 2;
animation: body-bob 0.3s ease-in-out infinite;
}
@keyframes body-bob {
0%, 100% { transform: translateY(0) scale(1); }
50% { transform: translateY(-2px) scale(1.01); }
}
/* ========================================= */
/* 3D LOGO ANIMATIONS */
/* ========================================= */
.perspective-1000 { perspective: 1000px; }
.transform-style-3d { transform-style: preserve-3d; }
.animate-float-3d { animation: float-3d 6s ease-in-out infinite; }
.animate-pulse-ring { animation: pulse-glow 3s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
@keyframes float-3d {
0%, 100% { transform: rotateY(-10deg) rotateX(5deg) translateY(0); filter: drop-shadow(0 5px 15px rgba(59,130,246,0.4)); }
50% { transform: rotateY(10deg) rotateX(-5deg) translateY(-3px); filter: drop-shadow(0 8px 25px rgba(59,130,246,0.6)); }
}
@keyframes pulse-glow {
0%, 100% { opacity: 0.5; transform: scale(1); }
50% { opacity: 0.8; transform: scale(1.2); }
}
.orb-glow {
position: absolute;
inset: -10px;
border-radius: 50%;
border: 2px solid rgba(139, 92, 246, 0.3);
animation: pulse-ring 2s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
}
.orb-glow:nth-child(2) { animation-delay: 0.5s; border-color: rgba(59, 130, 246, 0.3); }
.orb-glow:nth-child(3) { animation-delay: 1s; border-color: rgba(236, 72, 153, 0.3); }
@keyframes pulse-ring {
0% { transform: scale(0.8); opacity: 0.8; }
100% { transform: scale(1.5); opacity: 0; }
}
/* Timeline Dots */
.timeline-dot {
position: relative;
}
.timeline-dot::before {
content: '';
position: absolute;
left: -19px;
top: 4px;
width: 10px;
height: 10px;
border-radius: 50%;
background: white;
border: 2px solid #3b82f6;
z-index: 10;
}
.timeline-line {
position: absolute;
left: 10px;
top: 24px;
bottom: -8px;
width: 2px;
background: #e2e8f0;
z-index: 0;
}
#mynetwork { outline: none; }
Network Graph
Exchange
Wallet
Smart Contract
Mixer
Bridge
AI Mission Control
Objectives
- Provide natural language prompt above.
Execution Strategy
Awaiting orchestration pipeline...
Seed(s)
-
Networks
-
Loss Amt
-
May 18, 2024 10:25:33
BTC sent from Seed Wallet
$865,737.47
May 18, 2024 10:25:43
Converted to WBTC
$865,737.18
W
May 18, 2024 10:29:22
WBTC swapped to ETH
$865,721.24
May 18, 2024 10:31:18
ETH bridged to Base
$865,700.12
May 18, 2024 10:33:27
Funds deposited to Coinbase
$865,692.01
| Date / Time (UTC) |
Tx Hash |
Asset |
From |
|
To |
Amount (USD) |
Type |
Risk Score |
Confidence |
AI Insight |
| May 18, 2024 10:25:33 |
0x7a12...7ccd9 |
BTC |
Seed Wallet
External
|
|
Whale Wallet
Internal
|
$865,737.47
(12.5376 BTC)
|
Deposit |
85 |
97% |
High value inflow from known wallet cluster |
| May 18, 2024 10:25:43 |
0x4f18...1a0s3 |
W WBTC |
Whale Wallet
Internal
|
|
WBTC (ERC20)
Smart Contract
|
$865,729.19
(37.2486 WBTC)
|
Swap |
78 |
96% |
Wrapped BTC on Ethereum network |
| May 18, 2024 10:29:22 |
0x78e6...6edc4 |
W WBTC |
WBTC (ERC20)
Smart Contract
|
|
ETH (ERC20)
Smart Contract
|
$865,721.24
(6.4562 ETH)
|
Swap |
72 |
95% |
Converted to ETH via DEX aggregation |
| May 18, 2024 10:31:18 |
0x1a06...a019 |
ETH |
ETH (ERC20)
Smart Contract
|
|
Base Bridge
Smart Contract
|
$865,700.12
(6.4562 ETH)
|
Bridge |
60 |
93% |
Bridged to Base L2 network |
| May 18, 2024 10:33:27 |
0x5c6d...b4f2 |
ETH |
Base Bridge
Smart Contract
|
|
Coinbase
Exchange
|
$865,692.01
(6.4562 ETH)
|
Deposit |
45 |
98% |
Funds deposited to exchange wallet |
...
5 / page