Hugging Face's logo

Spaces:
olywwe
/
testfincna
Running

App Files Community
olywwe commited on
Commit
3af8019
·
verified ·
1 Parent(s): 9585979

Crie uma platsfarmo de trader atravez de rede neural, duas redes uma de testee a outra validação em tempo real. a cada loss a rede ira traeinar novamanete, crie historico dos traders completo, com obetivo de no minimo 90% de acerto, deve fazer trader a cada 5 min, e o tempo do trader sera de 1 min, crie algo avançada , e a rede neural de muita profundidade deve, e deve utilizar volumente inteção de compra, e muita estatisca avançada e predetica, crie um rede visual tbm - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +647 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Testfincna
3
- emoji: 🌖
4
- colorFrom: purple
5
- colorTo: indigo
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: testfincna
3
+ emoji: 🐳
4
+ colorFrom: blue
5
+ colorTo: blue
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,647 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>NeuroTrade - Plataforma de Trading com IA</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
10
+ <script>
11
+ tailwind.config = {
12
+ theme: {
13
+ extend: {
14
+ colors: {
15
+ primary: '#0f172a',
16
+ secondary: '#1e293b',
17
+ accent: '#3b82f6',
18
+ success: '#10b981',
19
+ danger: '#ef4444',
20
+ warning: '#f59e0b'
21
+ }
22
+ }
23
+ }
24
+ }
25
+ </script>
26
+ <style>
27
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
28
+
29
+ body {
30
+ font-family: 'Inter', sans-serif;
31
+ background-color: #0f172a;
32
+ color: #f1f5f9;
33
+ }
34
+
35
+ .neural-network {
36
+ position: relative;
37
+ height: 300px;
38
+ width: 100%;
39
+ overflow: hidden;
40
+ }
41
+
42
+ .neuron {
43
+ position: absolute;
44
+ border-radius: 50%;
45
+ background: linear-gradient(135deg, #3b82f6, #60a5fa);
46
+ box-shadow: 0 0 15px rgba(59, 130, 246, 0.5);
47
+ display: flex;
48
+ align-items: center;
49
+ justify-content: center;
50
+ color: white;
51
+ font-weight: bold;
52
+ transition: all 0.3s ease;
53
+ }
54
+
55
+ .connection {
56
+ position: absolute;
57
+ background: rgba(59, 130, 246, 0.3);
58
+ transform-origin: 0 0;
59
+ }
60
+
61
+ .pulse {
62
+ animation: pulse 2s infinite;
63
+ }
64
+
65
+ @keyframes pulse {
66
+ 0% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7); }
67
+ 70% { box-shadow: 0 0 0 10px rgba(59, 130, 246, 0); }
68
+ 100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }
69
+ }
70
+
71
+ .trade-card {
72
+ transition: all 0.3s ease;
73
+ border-left: 4px solid transparent;
74
+ }
75
+
76
+ .trade-buy {
77
+ border-left-color: #10b981;
78
+ }
79
+
80
+ .trade-sell {
81
+ border-left-color: #ef4444;
82
+ }
83
+
84
+ .glow {
85
+ text-shadow: 0 0 10px rgba(59, 130, 246, 0.7);
86
+ }
87
+
88
+ .stat-card {
89
+ background: linear-gradient(135deg, #1e293b, #0f172a);
90
+ border: 1px solid #334155;
91
+ border-radius: 12px;
92
+ transition: transform 0.3s ease;
93
+ }
94
+
95
+ .stat-card:hover {
96
+ transform: translateY(-5px);
97
+ }
98
+
99
+ .market-indicator {
100
+ height: 8px;
101
+ border-radius: 4px;
102
+ background: linear-gradient(to right, #ef4444, #f59e0b, #10b981);
103
+ }
104
+
105
+ .progress-bar {
106
+ height: 6px;
107
+ border-radius: 3px;
108
+ background: #334155;
109
+ overflow: hidden;
110
+ }
111
+
112
+ .progress-fill {
113
+ height: 100%;
114
+ border-radius: 3px;
115
+ background: linear-gradient(to right, #3b82f6, #60a5fa);
116
+ }
117
+ </style>
118
+ </head>
119
+ <body class="min-h-screen">
120
+ <!-- Header -->
121
+ <header class="bg-primary border-b border-secondary py-4 px-6 flex justify-between items-center">
122
+ <div class="flex items-center space-x-3">
123
+ <div class="w-10 h-10 rounded-lg bg-accent flex items-center justify-center">
124
+ <i class="fas fa-brain text-white text-xl"></i>
125
+ </div>
126
+ <h1 class="text-2xl font-bold">Neuro<span class="text-accent">Trade</span></h1>
127
+ </div>
128
+
129
+ <div class="flex items-center space-x-4">
130
+ <div class="hidden md:flex items-center space-x-2 bg-secondary px-4 py-2 rounded-lg">
131
+ <i class="fas fa-server text-success"></i>
132
+ <span class="font-medium">Rede Neural Ativa</span>
133
+ </div>
134
+ <div class="flex items-center space-x-2 bg-secondary px-4 py-2 rounded-lg">
135
+ <i class="fas fa-sync-alt animate-spin text-accent"></i>
136
+ <span class="font-medium">Treinando...</span>
137
+ </div>
138
+ <button class="bg-accent hover:bg-blue-600 text-white px-4 py-2 rounded-lg font-medium transition">
139
+ <i class="fas fa-cog mr-2"></i>Configurações
140
+ </button>
141
+ </div>
142
+ </header>
143
+
144
+ <main class="container mx-auto px-4 py-8">
145
+ <!-- Dashboard Stats -->
146
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
147
+ <div class="stat-card p-6">
148
+ <div class="flex justify-between items-start">
149
+ <div>
150
+ <p class="text-gray-400 text-sm">Taxa de Acerto</p>
151
+ <h3 class="text-3xl font-bold mt-1">92.7%</h3>
152
+ </div>
153
+ <div class="w-12 h-12 rounded-full bg-green-500/20 flex items-center justify-center">
154
+ <i class="fas fa-percentage text-success text-xl"></i>
155
+ </div>
156
+ </div>
157
+ <div class="mt-4">
158
+ <div class="flex justify-between text-sm mb-1">
159
+ <span>Objetivo: 90%</span>
160
+ <span>+2.7%</span>
161
+ </div>
162
+ <div class="progress-bar">
163
+ <div class="progress-fill w-[92.7%]"></div>
164
+ </div>
165
+ </div>
166
+ </div>
167
+
168
+ <div class="stat-card p-6">
169
+ <div class="flex justify-between items-start">
170
+ <div>
171
+ <p class="text-gray-400 text-sm">Trades Realizados</p>
172
+ <h3 class="text-3xl font-bold mt-1">1,248</h3>
173
+ </div>
174
+ <div class="w-12 h-12 rounded-full bg-blue-500/20 flex items-center justify-center">
175
+ <i class="fas fa-chart-line text-accent text-xl"></i>
176
+ </div>
177
+ </div>
178
+ <div class="mt-4">
179
+ <div class="flex justify-between text-sm mb-1">
180
+ <span>Hoje: 24</span>
181
+ <span>+12%</span>
182
+ </div>
183
+ <div class="progress-bar">
184
+ <div class="progress-fill w-[88%]"></div>
185
+ </div>
186
+ </div>
187
+ </div>
188
+
189
+ <div class="stat-card p-6">
190
+ <div class="flex justify-between items-start">
191
+ <div>
192
+ <p class="text-gray-400 text-sm">Lucro Total</p>
193
+ <h3 class="text-3xl font-bold mt-1 text-success">$12,480</h3>
194
+ </div>
195
+ <div class="w-12 h-12 rounded-full bg-green-500/20 flex items-center justify-center">
196
+ <i class="fas fa-dollar-sign text-success text-xl"></i>
197
+ </div>
198
+ </div>
199
+ <div class="mt-4">
200
+ <div class="flex justify-between text-sm mb-1">
201
+ <span>Mensal: $1,840</span>
202
+ <span>+18.4%</span>
203
+ </div>
204
+ <div class="progress-bar">
205
+ <div class="progress-fill w-[92%]"></div>
206
+ </div>
207
+ </div>
208
+ </div>
209
+
210
+ <div class="stat-card p-6">
211
+ <div class="flex justify-between items-start">
212
+ <div>
213
+ <p class="text-gray-400 text-sm">Último Trade</p>
214
+ <h3 class="text-3xl font-bold mt-1 text-success">+2.4%</h3>
215
+ </div>
216
+ <div class="w-12 h-12 rounded-full bg-yellow-500/20 flex items-center justify-center">
217
+ <i class="fas fa-clock text-warning text-xl"></i>
218
+ </div>
219
+ </div>
220
+ <div class="mt-4">
221
+ <div class="flex justify-between text-sm mb-1">
222
+ <span>Tempo restante:</span>
223
+ <span>3:42 min</span>
224
+ </div>
225
+ <div class="progress-bar">
226
+ <div class="progress-fill w-[38%]"></div>
227
+ </div>
228
+ </div>
229
+ </div>
230
+ </div>
231
+
232
+ <!-- Main Content -->
233
+ <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
234
+ <!-- Neural Network Visualization -->
235
+ <div class="lg:col-span-2">
236
+ <div class="stat-card p-6 mb-8">
237
+ <div class="flex justify-between items-center mb-6">
238
+ <h2 class="text-xl font-bold">Visualização da Rede Neural</h2>
239
+ <div class="flex space-x-2">
240
+ <span class="px-3 py-1 bg-blue-500/20 text-blue-300 rounded-full text-sm">Teste</span>
241
+ <span class="px-3 py-1 bg-purple-500/20 text-purple-300 rounded-full text-sm">Validação</span>
242
+ </div>
243
+ </div>
244
+
245
+ <div class="neural-network relative rounded-xl overflow-hidden bg-secondary border border-gray-700">
246
+ <!-- Canvas para a rede neural -->
247
+ <canvas id="networkCanvas"></canvas>
248
+
249
+ <!-- Camadas da rede neural -->
250
+ <div class="absolute top-0 left-0 w-full h-full">
251
+ <!-- Input Layer -->
252
+ <div class="absolute left-4 top-1/2 transform -translate-y-1/2 flex flex-col space-y-4">
253
+ <div class="neuron w-12 h-12 pulse">I1</div>
254
+ <div class="neuron w-12 h-12 pulse">I2</div>
255
+ <div class="neuron w-12 h-12 pulse">I3</div>
256
+ <div class="neuron w-12 h-12 pulse">I4</div>
257
+ </div>
258
+
259
+ <!-- Hidden Layers -->
260
+ <div class="absolute left-1/3 top-1/2 transform -translate-y-1/2 flex flex-col space-y-4">
261
+ <div class="neuron w-10 h-10">H1</div>
262
+ <div class="neuron w-10 h-10">H2</div>
263
+ <div class="neuron w-10 h-10">H3</div>
264
+ <div class="neuron w-10 h-10">H4</div>
265
+ <div class="neuron w-10 h-10">H5</div>
266
+ </div>
267
+
268
+ <div class="absolute left-2/3 top-1/2 transform -translate-y-1/2 flex flex-col space-y-4">
269
+ <div class="neuron w-10 h-10">H6</div>
270
+ <div class="neuron w-10 h-10">H7</div>
271
+ <div class="neuron w-10 h-10">H8</div>
272
+ <div class="neuron w-10 h-10">H9</div>
273
+ <div class="neuron w-10 h-10">H10</div>
274
+ </div>
275
+
276
+ <!-- Output Layer -->
277
+ <div class="absolute right-4 top-1/2 transform -translate-y-1/2">
278
+ <div class="neuron w-14 h-14 glow">S</div>
279
+ </div>
280
+ </div>
281
+ </div>
282
+
283
+ <div class="mt-6 grid grid-cols-3 gap-4">
284
+ <div class="text-center">
285
+ <p class="text-gray-400 text-sm">Camada de Entrada</p>
286
+ <p class="font-medium">Dados de Mercado</p>
287
+ </div>
288
+ <div class="text-center">
289
+ <p class="text-gray-400 text-sm">Camadas Ocultas</p>
290
+ <p class="font-medium">Processamento</p>
291
+ </div>
292
+ <div class="text-center">
293
+ <p class="text-gray-400 text-sm">Camada de Saída</p>
294
+ <p class="font-medium">Decisão de Trade</p>
295
+ </div>
296
+ </div>
297
+ </div>
298
+
299
+ <!-- Gráfico de Performance -->
300
+ <div class="stat-card p-6">
301
+ <div class="flex justify-between items-center mb-6">
302
+ <h2 class="text-xl font-bold">Performance da Rede Neural</h2>
303
+ <select class="bg-secondary border border-gray-700 rounded-lg px-3 py-1 text-sm">
304
+ <option>Últimos 30 dias</option>
305
+ <option>Últimos 7 dias</option>
306
+ <option>Últimas 24 horas</option>
307
+ </select>
308
+ </div>
309
+ <canvas id="performanceChart" height="200"></canvas>
310
+ </div>
311
+ </div>
312
+
313
+ <!-- Painel Lateral -->
314
+ <div>
315
+ <!-- Próximo Trade -->
316
+ <div class="stat-card p-6 mb-8">
317
+ <h2 class="text-xl font-bold mb-4">Próximo Trade</h2>
318
+ <div class="text-center py-6">
319
+ <div class="text-5xl font-bold mb-2 glow">3:42</div>
320
+ <p class="text-gray-400 mb-6">Até o próximo trade automático</p>
321
+ <div class="bg-secondary rounded-xl p-4 mb-4">
322
+ <div class="flex justify-between mb-2">
323
+ <span>Ativo:</span>
324
+ <span class="font-medium">EUR/USD</span>
325
+ </div>
326
+ <div class="flex justify-between mb-2">
327
+ <span>Direção Prevista:</span>
328
+ <span class="text-success font-medium">COMPRA</span>
329
+ </div>
330
+ <div class="flex justify-between">
331
+ <span>Confiança:</span>
332
+ <span class="font-medium">94.2%</span>
333
+ </div>
334
+ </div>
335
+ <button class="w-full bg-accent hover:bg-blue-600 text-white py-3 rounded-lg font-medium transition">
336
+ <i class="fas fa-play mr-2"></i>Iniciar Trade Manual
337
+ </button>
338
+ </div>
339
+ </div>
340
+
341
+ <!-- Últimos Trades -->
342
+ <div class="stat-card p-6">
343
+ <div class="flex justify-between items-center mb-4">
344
+ <h2 class="text-xl font-bold">Histórico de Trades</h2>
345
+ <button class="text-accent text-sm">
346
+ Ver Todos <i class="fas fa-arrow-right ml-1"></i>
347
+ </button>
348
+ </div>
349
+
350
+ <div class="space-y-4 max-h-96 overflow-y-auto pr-2">
351
+ <div class="trade-card trade-buy bg-secondary/50 p-4 rounded-lg border border-gray-700">
352
+ <div class="flex justify-between items-center">
353
+ <div>
354
+ <div class="font-medium">EUR/USD</div>
355
+ <div class="text-sm text-gray-400">Compra • 1.0842</div>
356
+ </div>
357
+ <div class="text-right">
358
+ <div class="font-medium text-success">+1.2%</div>
359
+ <div class="text-sm text-gray-400">1 min atrás</div>
360
+ </div>
361
+ </div>
362
+ </div>
363
+
364
+ <div class="trade-card trade-sell bg-secondary/50 p-4 rounded-lg border border-gray-700">
365
+ <div class="flex justify-between items-center">
366
+ <div>
367
+ <div class="font-medium">GBP/JPY</div>
368
+ <div class="text-sm text-gray-400">Venda • 172.35</div>
369
+ </div>
370
+ <div class="text-right">
371
+ <div class="font-medium text-danger">-0.8%</div>
372
+ <div class="text-sm text-gray-400">3 min atrás</div>
373
+ </div>
374
+ </div>
375
+ </div>
376
+
377
+ <div class="trade-card trade-buy bg-secondary/50 p-4 rounded-lg border border-gray-700">
378
+ <div class="flex justify-between items-center">
379
+ <div>
380
+ <div class="font-medium">USD/CAD</div>
381
+ <div class="text-sm text-gray-400">Compra • 1.3456</div>
382
+ </div>
383
+ <div class="text-right">
384
+ <div class="font-medium text-success">+2.1%</div>
385
+ <div class="text-sm text-gray-400">7 min atrás</div>
386
+ </div>
387
+ </div>
388
+ </div>
389
+
390
+ <div class="trade-card trade-buy bg-secondary/50 p-4 rounded-lg border border-gray-700">
391
+ <div class="flex justify-between items-center">
392
+ <div>
393
+ <div class="font-medium">AUD/USD</div>
394
+ <div class="text-sm text-gray-400">Compra • 0.6678</div>
395
+ </div>
396
+ <div class="text-right">
397
+ <div class="font-medium text-success">+0.9%</div>
398
+ <div class="text-sm text-gray-400">12 min atrás</div>
399
+ </div>
400
+ </div>
401
+ </div>
402
+
403
+ <div class="trade-card trade-sell bg-secondary/50 p-4 rounded-lg border border-gray-700">
404
+ <div class="flex justify-between items-center">
405
+ <div>
406
+ <div class="font-medium">USD/CHF</div>
407
+ <div class="text-sm text-gray-400">Venda • 0.8921</div>
408
+ </div>
409
+ <div class="text-right">
410
+ <div class="font-medium text-success">+1.5%</div>
411
+ <div class="text-sm text-gray-400">15 min atrás</div>
412
+ </div>
413
+ </div>
414
+ </div>
415
+
416
+ <div class="trade-card trade-buy bg-secondary/50 p-4 rounded-lg border border-gray-700">
417
+ <div class="flex justify-between items-center">
418
+ <div>
419
+ <div class="font-medium">NZD/USD</div>
420
+ <div class="text-sm text-gray-400">Compra • 0.5987</div>
421
+ </div>
422
+ <div class="text-right">
423
+ <div class="font-medium text-danger">-0.3%</div>
424
+ <div class="text-sm text-gray-400">18 min atrás</div>
425
+ </div>
426
+ </div>
427
+ </div>
428
+ </div>
429
+ </div>
430
+ </div>
431
+ </div>
432
+
433
+ <!-- Estatísticas Avançadas -->
434
+ <div class="stat-card p-6 mt-8">
435
+ <h2 class="text-xl font-bold mb-6">Estatísticas Avançadas</h2>
436
+
437
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
438
+ <div class="bg-secondary/50 rounded-xl p-5 border border-gray-700">
439
+ <div class="flex items-center mb-4">
440
+ <div class="w-10 h-10 rounded-lg bg-blue-500/20 flex items-center justify-center mr-3">
441
+ <i class="fas fa-wave-square text-accent"></i>
442
+ </div>
443
+ <h3 class="font-bold">Análise de Volume</h3>
444
+ </div>
445
+ <p class="text-gray-400 text-sm mb-3">Intenção de Compra Detectada</p>
446
+ <div class="flex items-center">
447
+ <div class="w-full bg-gray-700 rounded-full h-2.5 mr-3">
448
+ <div class="bg-accent h-2.5 rounded-full" style="width: 78%"></div>
449
+ </div>
450
+ <span class="text-sm font-medium">78%</span>
451
+ </div>
452
+ </div>
453
+
454
+ <div class="bg-secondary/50 rounded-xl p-5 border border-gray-700">
455
+ <div class="flex items-center mb-4">
456
+ <div class="w-10 h-10 rounded-lg bg-green-500/20 flex items-center justify-center mr-3">
457
+ <i class="fas fa-chart-bar text-success"></i>
458
+ </div>
459
+ <h3 class="font-bold">Previsibilidade do Mercado</h3>
460
+ </div>
461
+ <p class="text-gray-400 text-sm mb-3">Tendência Algorítmica</p>
462
+ <div class="flex items-center">
463
+ <div class="w-full bg-gray-700 rounded-full h-2.5 mr-3">
464
+ <div class="bg-success h-2.5 rounded-full" style="width: 91%"></div>
465
+ </div>
466
+ <span class="text-sm font-medium">91%</span>
467
+ </div>
468
+ </div>
469
+
470
+ <div class="bg-secondary/50 rounded-xl p-5 border border-gray-700">
471
+ <div class="flex items-center mb-4">
472
+ <div class="w-10 h-10 rounded-lg bg-purple-500/20 flex items-center justify-center mr-3">
473
+ <i class="fas fa-bolt text-purple-400"></i>
474
+ </div>
475
+ <h3 class="font-bold">Reatividade da IA</h3>
476
+ </div>
477
+ <p class="text-gray-400 text-sm mb-3">Tempo Médio de Decisão</p>
478
+ <div class="flex items-center">
479
+ <div class="w-full bg-gray-700 rounded-full h-2.5 mr-3">
480
+ <div class="bg-purple-500 h-2.5 rounded-full" style="width: 96%"></div>
481
+ </div>
482
+ <span class="text-sm font-medium">96%</span>
483
+ </div>
484
+ </div>
485
+ </div>
486
+
487
+ <div class="mt-6">
488
+ <div class="flex justify-between mb-2">
489
+ <span class="text-gray-400">Indicador de Mercado</span>
490
+ <span class="text-sm">Alta Volatilidade</span>
491
+ </div>
492
+ <div class="market-indicator relative">
493
+ <div class="absolute top-0 left-1/3 w-1 h-full bg-white"></div>
494
+ <div class="absolute top-0 left-2/3 w-1 h-full bg-white"></div>
495
+ <div class="absolute top-0 left-1/2 w-1 h-full bg-yellow-400"></div>
496
+ </div>
497
+ <div class="flex justify-between text-xs text-gray-400 mt-1">
498
+ <span>Baixo Risco</span>
499
+ <span>Médio Risco</span>
500
+ <span>Alto Risco</span>
501
+ </div>
502
+ </div>
503
+ </div>
504
+ </main>
505
+
506
+ <footer class="border-t border-secondary py-6 px-4 mt-12">
507
+ <div class="container mx-auto text-center text-gray-500 text-sm">
508
+ <p>NeuroTrade © 2023 - Plataforma de Trading com Inteligência Artificial</p>
509
+ <p class="mt-2">Desempenho passado não garante resultados futuros. Trading envolve riscos.</p>
510
+ </div>
511
+ </footer>
512
+
513
+ <script>
514
+ // Inicializar gráfico de performance
515
+ const ctx = document.getElementById('performanceChart').getContext('2d');
516
+ const performanceChart = new Chart(ctx, {
517
+ type: 'line',
518
+ data: {
519
+ labels: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
520
+ datasets: [{
521
+ label: 'Taxa de Acerto (%)',
522
+ data: [82, 85, 87, 89, 90, 91, 92, 91, 93, 92, 94, 92.7],
523
+ borderColor: '#3b82f6',
524
+ backgroundColor: 'rgba(59, 130, 246, 0.1)',
525
+ borderWidth: 2,
526
+ pointBackgroundColor: '#3b82f6',
527
+ fill: true,
528
+ tension: 0.3
529
+ }]
530
+ },
531
+ options: {
532
+ responsive: true,
533
+ maintainAspectRatio: false,
534
+ plugins: {
535
+ legend: {
536
+ display: false
537
+ }
538
+ },
539
+ scales: {
540
+ y: {
541
+ beginAtZero: false,
542
+ min: 80,
543
+ max: 100,
544
+ grid: {
545
+ color: 'rgba(255, 255, 255, 0.1)'
546
+ },
547
+ ticks: {
548
+ color: '#94a3b8'
549
+ }
550
+ },
551
+ x: {
552
+ grid: {
553
+ display: false
554
+ },
555
+ ticks: {
556
+ color: '#94a3b8'
557
+ }
558
+ }
559
+ }
560
+ }
561
+ });
562
+
563
+ // Simular conexões na rede neural
564
+ function drawNetworkConnections() {
565
+ const canvas = document.getElementById('networkCanvas');
566
+ const ctx = canvas.getContext('2d');
567
+
568
+ // Ajustar tamanho do canvas ao container
569
+ canvas.width = canvas.parentElement.clientWidth;
570
+ canvas.height = canvas.parentElement.clientHeight;
571
+
572
+ // Cores das conexões
573
+ const colors = ['rgba(59, 130, 246, 0.1)', 'rgba(139, 92, 246, 0.1)', 'rgba(16, 185, 129, 0.1)'];
574
+
575
+ // Desenhar conexões entre camadas
576
+ const layers = [
577
+ {x: 50, y: [100, 150, 200, 250]}, // Input
578
+ {x: 200, y: [80, 120, 160, 200, 240]}, // Hidden 1
579
+ {x: 350, y: [80, 120, 160, 200, 240]}, // Hidden 2
580
+ {x: 500, y: [160]} // Output
581
+ ];
582
+
583
+ // Conexões entre camadas
584
+ for (let i = 0; i < layers.length - 1; i++) {
585
+ const currentLayer = layers[i];
586
+ const nextLayer = layers[i + 1];
587
+
588
+ currentLayer.y.forEach(y1 => {
589
+ nextLayer.y.forEach(y2 => {
590
+ ctx.beginPath();
591
+ ctx.moveTo(currentLayer.x, y1);
592
+ ctx.lineTo(nextLayer.x, y2);
593
+ ctx.strokeStyle = colors[Math.floor(Math.random() * colors.length)];
594
+ ctx.lineWidth = 0.5;
595
+ ctx.stroke();
596
+ });
597
+ });
598
+ }
599
+ }
600
+
601
+ // Redesenhar conexões quando a janela for redimensionada
602
+ window.addEventListener('resize', drawNetworkConnections);
603
+
604
+ // Inicializar visualização da rede
605
+ setTimeout(drawNetworkConnections, 100);
606
+
607
+ // Animação de contagem regressiva
608
+ let countdownTime = 222; // segundos
609
+
610
+ function updateCountdown() {
611
+ const minutes = Math.floor(countdownTime / 60);
612
+ const seconds = countdownTime % 60;
613
+ document.querySelector('.glow').textContent =
614
+ `${minutes}:${seconds < 10 ? '0' : ''}${seconds}`;
615
+
616
+ countdownTime--;
617
+ if (countdownTime < 0) countdownTime = 300; // Reset após 5 minutos
618
+
619
+ setTimeout(updateCountdown, 1000);
620
+ }
621
+
622
+ updateCountdown();
623
+
624
+ // Simular atualização de dados
625
+ setInterval(() => {
626
+ // Simular novo trade
627
+ const tradesContainer = document.querySelector('.max-h-96');
628
+ const firstTrade = tradesContainer.firstElementChild.cloneNode(true);
629
+ tradesContainer.insertBefore(firstTrade, tradesContainer.firstChild);
630
+
631
+ // Remover último trade se tiver mais de 10
632
+ if (tradesContainer.children.length > 10) {
633
+ tradesContainer.removeChild(tradesContainer.lastElementChild);
634
+ }
635
+
636
+ // Atualizar estatísticas
637
+ const accuracyElement = document.querySelector('.text-3xl.font-bold.mt-1');
638
+ const currentValue = parseFloat(accuracyElement.textContent.replace('%', ''));
639
+ const newValue = (currentValue + (Math.random() * 0.2 - 0.1)).toFixed(1);
640
+ accuracyElement.textContent = newValue + '%';
641
+
642
+ // Atualizar barra de progresso
643
+ document.querySelector('.progress-fill').style.width = newValue + '%';
644
+ }, 5000);
645
+ </script>
646
+ <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=olywwe/testfincna" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
647
+ </html>