MatverseHub commited on
Commit
efe6a17
·
verified ·
1 Parent(s): 0d4db79

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +503 -19
index.html CHANGED
@@ -1,19 +1,503 @@
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="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>MatVerse 6.0 - Modular Architecture Dashboard</title>
7
+ <script src="https://cdn.jsdelivr.net/npm/react@18.0.0/umd/react.development.js"></script>
8
+ <script src="https://cdn.jsdelivr.net/npm/react-dom@18.0.0/umd/react-dom.development.js"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/@babel/standalone/babel.js"></script>
10
+ <script src="https://cdn.tailwindcss.com"></script>
11
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
12
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
13
+ <style>
14
+ body { font-family: 'Inter', sans-serif; }
15
+ .gradient-bg { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); }
16
+ .card-hover { transition: all 0.3s ease; }
17
+ .card-hover:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.2); }
18
+ .timeline-line { background: linear-gradient(to bottom, #667eea, #764ba2); }
19
+ .status-badge { padding: 2px 8px; border-radius: 12px; font-size: 12px; font-weight: 600; }
20
+ .status-stable { background-color: #10b981; color: white; }
21
+ .status-validated { background-color: #3b82f6; color: white; }
22
+ .status-in-progress { background-color: #f59e0b; color: white; }
23
+ .status-active { background-color: #10b981; color: white; }
24
+ .status-deploying { background-color: #3b82f6; color: white; }
25
+ .status-integrating { background-color: #f59e0b; color: white; }
26
+ </style>
27
+ </head>
28
+ <body>
29
+ <div id="root"></div>
30
+
31
+ <script type="text/babel">
32
+ const { useState, useEffect } = React;
33
+
34
+ const ModuleCard = ({ module }) => {
35
+ const getStatusClass = (status) => {
36
+ switch(status.toLowerCase()) {
37
+ case 'estável': return 'status-stable';
38
+ case 'validado': return 'status-validated';
39
+ case 'mvpmvp': return 'status-in-progress';
40
+ case 'vivo': return 'status-active';
41
+ case 'ativo': return 'status-active';
42
+ case 'em deploy': return 'status-deploying';
43
+ case 'em integração': return 'status-integrating';
44
+ default: return 'status-stable';
45
+ }
46
+ };
47
+
48
+ return (
49
+ <div className="bg-white rounded-lg shadow-lg p-6 card-hover">
50
+ <div className="flex justify-between items-start mb-4">
51
+ <div>
52
+ <h3 className="text-xl font-bold text-gray-800">{module.name}</h3>
53
+ <span className={`status-badge ${getStatusClass(module.status)}`}>{module.status}</span>
54
+ </div>
55
+ <div className="text-sm text-gray-500">
56
+ <i className="fas fa-code-branch mr-1"></i>
57
+ {module.repository}
58
+ </div>
59
+ </div>
60
+ <div className="space-y-2 text-sm">
61
+ <div className="flex">
62
+ <span className="font-semibold text-gray-600 w-24">Função:</span>
63
+ <span className="text-gray-700">{module.function}</span>
64
+ </div>
65
+ <div className="flex">
66
+ <span className="font-semibold text-gray-600 w-24">Stack:</span>
67
+ <span className="text-gray-700">{module.stack}</span>
68
+ </div>
69
+ </div>
70
+ </div>
71
+ );
72
+ };
73
+
74
+ const TimelineItem = ({ quarter, year, milestone, details }) => (
75
+ <div className="flex mb-6">
76
+ <div className="flex flex-col items-center mr-4">
77
+ <div className="w-4 h-4 bg-purple-600 rounded-full"></div>
78
+ <div className="w-0.5 h-full bg-purple-300 mt-2"></div>
79
+ </div>
80
+ <div className="flex-1">
81
+ <div className="bg-white rounded-lg p-4 shadow-md">
82
+ <div className="flex justify-between items-center mb-2">
83
+ <h4 className="font-bold text-purple-600">{quarter} {year}</h4>
84
+ <span className="text-sm text-gray-500">Meta</span>
85
+ </div>
86
+ <h5 className="font-semibold text-gray-800 mb-1">{milestone}</h5>
87
+ <p className="text-sm text-gray-600">{details}</p>
88
+ </div>
89
+ </div>
90
+ </div>
91
+ );
92
+
93
+ const App = () => {
94
+ const [activeTab, setActiveTab] = useState('overview');
95
+
96
+ const modules = [
97
+ {
98
+ name: "matverse-core",
99
+ function: "Núcleo de coerência semântica (Ψ)",
100
+ stack: "FastAPI + NumPy",
101
+ status: "estável",
102
+ repository: "MatVerse-Hub/matverse-core"
103
+ },
104
+ {
105
+ name: "Enterprise",
106
+ function: "Governança Ω-GATE + QCVaR",
107
+ stack: "Python + Pytest",
108
+ status: "validado",
109
+ repository: "Symbios-Matverse/Enterprise"
110
+ },
111
+ {
112
+ name: "Pose",
113
+ function: "Proof of Semantic Existence (PoSE-PQC)",
114
+ stack: "Python puro + HMAC",
115
+ status: "v1.0",
116
+ repository: "MatVerse-py/Pose"
117
+ },
118
+ {
119
+ name: "SymbiOS",
120
+ function: "Sistema operacional simbiótico Web4",
121
+ stack: "FastAPI + JS",
122
+ status: "MVPMVP",
123
+ repository: "MatVerse-Hub/SymbiOS"
124
+ },
125
+ {
126
+ name: "Organismo",
127
+ function: "Kernel Σ–Ω vivo + dashboard Gradio",
128
+ stack: "Python + React/Three.js",
129
+ status: "vivo",
130
+ repository: "MatVerse-py/organismo"
131
+ },
132
+ {
133
+ name: "MMCC",
134
+ function: "Agregador Planetário (Ω_global)",
135
+ stack: "Python CLI",
136
+ status: "validado",
137
+ repository: "Symbios-Matverse/pro-science-MMCC"
138
+ },
139
+ {
140
+ name: "ODA-QF",
141
+ function: "Organismo Digital Autônomo Quântico-Fractal",
142
+ stack: "Python + Solidity",
143
+ status: "validado",
144
+ repository: "MatVerse-py/ODA-QF"
145
+ },
146
+ {
147
+ name: "SuperKernel-6.0",
148
+ function: "Hamiltoniano + homologia persistente",
149
+ stack: "Python + Solidity",
150
+ status: "ativo",
151
+ repository: "MatVerse-py/SuperKernel-6.0"
152
+ },
153
+ {
154
+ name: "Superkernel",
155
+ function: "Oráculo Polygon + PoSE on-chain",
156
+ stack: "Python + Solidity",
157
+ status: "em deploy",
158
+ repository: "MatVerse-Hub/Superkernel"
159
+ },
160
+ {
161
+ name: "Captals",
162
+ function: "Ecossistema DeFi antifrágil (Ω-Funds, Ω-Bonds)",
163
+ stack: "FastAPI + Hardhat + React",
164
+ status: "em integração",
165
+ repository: "MatVerse-Hub/Captals"
166
+ },
167
+ {
168
+ name: "PrimeFramework",
169
+ function: "quântico-semântico (QIG-Σ)",
170
+ stack: "Python + Qiskit",
171
+ status: "pronto",
172
+ repository: "MatVerse-Hub/Prime"
173
+ }
174
+ ];
175
+
176
+ const timeline = [
177
+ {
178
+ quarter: "Q1",
179
+ year: "2026",
180
+ milestone: "Publicar whitepapers CVaR–POVM e ΦΩ-Dynamics",
181
+ details: "Prime + Core.Eng"
182
+ },
183
+ {
184
+ quarter: "Q2",
185
+ year: "2026",
186
+ milestone: "Deploy PoLE-M (Polygon)",
187
+ details: "Superkernel"
188
+ },
189
+ {
190
+ quarter: "Q3",
191
+ year: "2026",
192
+ milestone: "Dashboard global de métricas (Grafana/Poetry)",
193
+ details: "MMCC + Organismo"
194
+ },
195
+ {
196
+ quarter: "Q4",
197
+ year: "2026",
198
+ milestone: "DAO científica antifrágil (PoLE-DAO)",
199
+ details: "Enterprise + Pose"
200
+ },
201
+ {
202
+ quarter: "2027",
203
+ year: "",
204
+ milestone: "SymbiOS v6.0 Planetary Release",
205
+ details: "integração completa Web4"
206
+ }
207
+ ];
208
+
209
+ return (
210
+ <div className="min-h-screen bg-gray-50">
211
+ {/* Header */}
212
+ <header className="gradient-bg text-white">
213
+ <div className="container mx-auto px-4 py-6">
214
+ <div className="flex justify-between items-center">
215
+ <div>
216
+ <h1 className="text-3xl font-bold">MatVerse 6.0</h1>
217
+ <p className="text-purple-200">Arquitetura Modular Digital Antifrágil</p>
218
+ </div>
219
+ <div className="text-sm">
220
+ <a href="https://huggingface.co/spaces/akhaliq/anycoder" className="text-white hover:underline">
221
+ Built with anycoder
222
+ </a>
223
+ </div>
224
+ </div>
225
+ </div>
226
+ </header>
227
+
228
+ {/* Navigation Tabs */}
229
+ <div className="bg-white shadow-sm">
230
+ <div className="container mx-auto px-4">
231
+ <div className="flex space-x-8">
232
+ {['overview', 'modules', 'governance', 'roadmap', 'protocol'].map((tab) => (
233
+ <button
234
+ key={tab}
235
+ onClick={() => setActiveTab(tab)}
236
+ className={`py-4 px-2 border-b-2 font-medium text-sm ${
237
+ activeTab === tab
238
+ ? 'border-purple-600 text-purple-600'
239
+ : 'border-transparent text-gray-500 hover:text-gray-700'
240
+ }`}
241
+ >
242
+ {tab.charAt(0).toUpperCase() + tab.slice(1)}
243
+ </button>
244
+ ))}
245
+ </div>
246
+ </div>
247
+ </div>
248
+
249
+ {/* Main Content */}
250
+ <div className="container mx-auto px-4 py-8">
251
+ {activeTab === 'overview' && (
252
+ <div>
253
+ <div className="bg-white rounded-lg shadow-lg p-8 mb-8">
254
+ <h2 className="text-2xl font-bold mb-4">Visão Geral do Ecossistema</h2>
255
+ <p className="text-gray-600 mb-6">
256
+ Cada repositório atua como um "órgão" do Organismo Digital Antifrágil,
257
+ trabalhando em conjunto através do protocolo Ω-GATE para criar um sistema
258
+ modular, escalável e governado por métricas de coerência semântica.
259
+ </p>
260
+ <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
261
+ <div className="text-center p-6 bg-purple-50 rounded-lg">
262
+ <div className="text-3xl font-bold text-purple-600 mb-2">11</div>
263
+ <div className="text-gray-700">Módulos Ativos</div>
264
+ </div>
265
+ <div className="text-center p-6 bg-blue-50 rounded-lg">
266
+ <div className="text-3xl font-bold text-blue-600 mb-2">Ω-GATE</div>
267
+ <div className="text-gray-700">Protocolo de Governança</div>
268
+ </div>
269
+ <div className="text-center p-6 bg-green-50 rounded-lg">
270
+ <div className="text-3xl font-bold text-green-600 mb-2">2026-2027</div>
271
+ <div className="text-gray-700">Roadmap Modular</div>
272
+ </div>
273
+ </div>
274
+ </div>
275
+
276
+ <div className="bg-white rounded-lg shadow-lg p-8">
277
+ <h3 className="text-xl font-bold mb-4">Módulos Principais</h3>
278
+ <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
279
+ {modules.map((module, index) => (
280
+ <ModuleCard key={index} module={module} />
281
+ ))}
282
+ </div>
283
+ </div>
284
+ </div>
285
+ )}
286
+
287
+ {activeTab === 'modules' && (
288
+ <div>
289
+ <h2 className="text-2xl font-bold mb-6">Estrutura Padrão de Módulos</h2>
290
+ <div className="bg-white rounded-lg shadow-lg p-6 mb-6">
291
+ <div className="mb-4">
292
+ <h3 className="text-lg font-semibold mb-2">Estrutura de Diretório</h3>
293
+ <pre className="bg-gray-100 p-4 rounded text-sm overflow-x-auto">
294
+ {`matverse-module-template/
295
+ ├── .github/
296
+ │ └── workflows/
297
+ │ └── ci.yml
298
+ ├── src/
299
+ │ └── matverse_[nome]/
300
+ │ ├── __init__.py
301
+ │ ├── core.py
302
+ │ ├── api.py
303
+ │ └── pose.py
304
+ ├── tests/
305
+ │ ├── test_core.py
306
+ │ └── test_api.py
307
+ ├── docs/
308
+ │ ├── architecture.md
309
+ │ └── evidence_note.json
310
+ ├── evidence/
311
+ │ └── 00000001.json
312
+ ├── pyproject.toml
313
+ ├── requirements.txt
314
+ ├── Dockerfile
315
+ ├── LICENSE
316
+ ├── README.md
317
+ └── Ω_state.log`}
318
+ </pre>
319
+ </div>
320
+ <div>
321
+ <h3 className="text-lg font-semibold mb-2">pyproject.toml</h3>
322
+ <pre className="bg-gray-100 p-4 rounded text-sm overflow-x-auto">
323
+ {`[project]
324
+ name = "matverse-[nome-do-módulo]"
325
+ version = "6.0.0"
326
+ description = "Módulo oficial MatVerse — Governado por Ω-GATE"
327
+ authors = [{name = "Mateus Áreas", email = "mateus@matverse.os"}]
328
+ license = {text = "MIT"}
329
+ readme = "README.md"
330
+ requires-python = ">=3.10"
331
+
332
+ [dependencies]
333
+ fastapi>=0.104.0
334
+ uvicorn[standard]>=0.24.0
335
+ pydantic>=2.5.0
336
+ numpy>=1.24.0
337
+ requests>=2.31.0
338
+
339
+ [project.optional-dependencies]
340
+ dev = ["pytest>=7.4", "ruff", "mypy", "httpx"]
341
+ pose = ["cryptography>=41.0"]`}
342
+ </pre>
343
+ </div>
344
+ </div>
345
+
346
+ <div className="bg-white rounded-lg shadow-lg p-6">
347
+ <h3 className="text-lg font-semibold mb-4">Endpoints Ω-GATE Bridge v2</h3>
348
+ <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
349
+ <div className="border-l-4 border-purple-500 pl-4">
350
+ <div className="font-semibold">GET /health</div>
351
+ <div className="text-sm text-gray-600">Status do órgão</div>
352
+ </div>
353
+ <div className="border-l-4 border-purple-500 pl-4">
354
+ <div className="font-semibold">GET /metrics</div>
355
+ <div className="text-sm text-gray-600">Métricas locais (Ψ, Θ, CVaR)</div>
356
+ </div>
357
+ <div className="border-l-4 border-purple-500 pl-4">
358
+ <div className="font-semibold">POST /omega</div>
359
+ <div className="text-sm text-gray-600">Cálculo do Ω local</div>
360
+ </div>
361
+ <div className="border-l-4 border-purple-500 pl-4">
362
+ <div className="font-semibold">POST /pose</div>
363
+ <div className="text-sm text-gray-600">Geração de evidência</div>
364
+ </div>
365
+ </div>
366
+ </div>
367
+ </div>
368
+ )}
369
+
370
+ {activeTab === 'governance' && (
371
+ <div>
372
+ <div className="bg-white rounded-lg shadow-lg p-8 mb-6">
373
+ <h2 className="text-2xl font-bold mb-6">Governança e Identidade</h2>
374
+ <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
375
+ <div>
376
+ <h3 className="text-lg font-semibold mb-4">Fórmula de Governança Ω-GATE</h3>
377
+ <div className="bg-gray-50 p-4 rounded-lg">
378
+ <p className="font-mono text-lg mb-2">Ω = 0.40·Ψ + 0.30·Θ + 0.20·(1-CVaR) + 0.05·PoLE + 0.05·COG</p>
379
+ <p className="text-sm text-gray-600">Constante Civilizacional (λ) = 0.27</p>
380
+ </div>
381
+ </div>
382
+ <div>
383
+ <h3 className="text-lg font-semibold mb-4">Princípio de Antifragilidade</h3>
384
+ <div className="bg-green-50 p-4 rounded-lg">
385
+ <p className="font-mono text-lg">dΩ/dt ≥ 0</p>
386
+ <p className="text-sm text-gray-600">Crescimento contínuo da coerência semântica</p>
387
+ </div>
388
+ </div>
389
+ </div>
390
+ </div>
391
+
392
+ <div className="bg-white rounded-lg shadow-lg p-6">
393
+ <h3 className="text-lg font-semibold mb-4">Arquivos Obrigatórios</h3>
394
+ <div className="space-y-3">
395
+ <div className="flex items-center">
396
+ <i className="fas fa-file-alt text-purple-600 mr-3"></i>
397
+ <div>
398
+ <div className="font-medium">README.md</div>
399
+ <div className="text-sm text-gray-600">Contém governança, licença e documentação</div>
400
+ </div>
401
+ </div>
402
+ <div className="flex items-center">
403
+ <i className="fas fa-file-code text-blue-600 mr-3"></i>
404
+ <div>
405
+ <div className="font-medium">evidence_note.json</div>
406
+ <div className="text-sm text-gray-600">Para PoSE auditável</div>
407
+ </div>
408
+ </div>
409
+ <div className="flex items-center">
410
+ <i className="fas fa-file-text text-green-600 mr-3"></i>
411
+ <div>
412
+ <div className="font-medium">Ω_state.log</div>
413
+ <div className="text-sm text-gray-600">Histórico temporal de Ω</div>
414
+ </div>
415
+ </div>
416
+ <div className="flex items-center">
417
+ <i className="fas fa-key text-red-600 mr-3"></i>
418
+ <div>
419
+ <div className="font-medium">pose_signature.key</div>
420
+ <div className="text-sm text-gray-600">Assinatura PQC</div>
421
+ </div>
422
+ </div>
423
+ </div>
424
+ </div>
425
+ </div>
426
+ )}
427
+
428
+ {activeTab === 'roadmap' && (
429
+ <div>
430
+ <div className="bg-white rounded-lg shadow-lg p-8">
431
+ <h2 className="text-2xl font-bold mb-8">Roadmap Modular 2026-2027</h2>
432
+ <div className="relative">
433
+ <div className="timeline-line absolute left-4 top-0 bottom-0 w-0.5"></div>
434
+ {timeline.map((item, index) => (
435
+ <TimelineItem key={index} {...item} />
436
+ ))}
437
+ </div>
438
+ </div>
439
+ </div>
440
+ )}
441
+
442
+ {activeTab === 'protocol' && (
443
+ <div>
444
+ <div className="bg-white rounded-lg shadow-lg p-8 mb-6">
445
+ <h2 className="text-2xl font-bold mb-6">Protocolo de Comunicação Intermodular</h2>
446
+ <div className="bg-gray-900 text-green-400 p-6 rounded-lg font-mono text-sm overflow-x-auto">
447
+ {`{
448
+ "psi": 0.91,
449
+ "theta": 0.88,
450
+ "cvar": 0.07,
451
+ "omega_local": 0.923,
452
+ "pole": 0.95,
453
+ "timestamp": 1733702000,
454
+ "signature": "POSE_PQC_SIGNATURE"
455
+ }`}
456
+ </div>
457
+ </div>
458
+
459
+ <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
460
+ <div className="bg-white rounded-lg shadow-lg p-6">
461
+ <h3 className="text-lg font-semibold mb-4">Assinatura</h3>
462
+ <p className="text-gray-600 mb-4">
463
+ Gerada por Pose.PoSEPQC para garantir autenticidade e integridade dos dados.
464
+ </p>
465
+ <div className="bg-blue-50 p-4 rounded-lg">
466
+ <div className="flex items-center">
467
+ <i className="fas fa-shield-alt text-blue-600 mr-2"></i>
468
+ <span className="text-sm font-medium">Validação via Enterprise.validate_governance_barrier</span>
469
+ </div>
470
+ </div>
471
+ </div>
472
+ <div className="bg-white rounded-lg shadow-lg p-6">
473
+ <h3 className="text-lg font-semibold mb-4">Auditoria</h3>
474
+ <p className="text-gray-600 mb-4">
475
+ Armazenada pelo ODA-QF em Prometheus/Grafana para monitoramento contínuo.
476
+ </p>
477
+ <div className="bg-green-50 p-4 rounded-lg">
478
+ <div className="flex items-center">
479
+ <i className="fas fa-chart-line text-green-600 mr-2"></i>
480
+ <span className="text-sm font-medium">Monitoramento em tempo real</span>
481
+ </div>
482
+ </div>
483
+ </div>
484
+ </div>
485
+ </div>
486
+ )}
487
+ </div>
488
+
489
+ {/* Footer */}
490
+ <footer className="bg-gray-800 text-white py-8 mt-12">
491
+ <div className="container mx-auto px-4 text-center">
492
+ <p className="mb-2">MatVerse 6.0 - Arquitetura Modular Digital Antifrágil</p>
493
+ <p className="text-gray-400 text-sm">© 2024 MatVerse. Todos os direitos reservados.</p>
494
+ </div>
495
+ </footer>
496
+ </div>
497
+ );
498
+ };
499
+
500
+ ReactDOM.render(<App />, document.getElementById('root'));
501
+ </script>
502
+ </body>
503
+ </html>