Hugging Face's logo

Spaces:
Cyrofranklin
/
transplante
Running

App Files Community
Cyrofranklin commited on
Commit
3eb4406
·
verified ·
1 Parent(s): 8c83ea6

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +528 -198
  2. prompts.txt +2 -1
index.html CHANGED
@@ -6,6 +6,7 @@
6
  <title>Protocolo de Transplante Hepático - HUWC</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
  <style>
10
  .slide {
11
  display: none;
@@ -42,6 +43,42 @@
42
  padding: 0.2rem 0.4rem;
43
  border-radius: 0.25rem;
44
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
45
  </style>
46
  </head>
47
  <body class="bg-gray-100 font-sans">
@@ -63,12 +100,12 @@
63
  <!-- Slide 1: Title -->
64
  <div class="slide active fade-in bg-gradient-to-br from-blue-50 to-green-50">
65
  <div class="max-w-4xl mx-auto h-full flex flex-col justify-center items-center text-center">
66
- <img src="https://via.placeholder.com/150x150?text=HUWC" alt="HUWC Logo" class="mb-8 rounded-full border-4 border-white shadow-lg">
67
  <h1 class="text-4xl md:text-5xl font-bold text-blue-800 mb-4">Protocolo de Transplante Hepático</h1>
68
  <h2 class="text-2xl md:text-3xl font-semibold text-green-700 mb-8">Hospital Universitário Walter Cantídio</h2>
69
  <div class="bg-white p-6 rounded-lg shadow-md w-full max-w-2xl">
70
- <p class="text-gray-700 mb-2"><i class="fas fa-user-md text-blue-500 mr-2"></i>Coordenação: [Nome do Coordenador]</p>
71
- <p class="text-gray-700"><i class="fas fa-calendar-alt text-green-500 mr-2"></i>Última atualização: [Data]</p>
72
  </div>
73
  </div>
74
  <div class="slide-number">1/40</div>
@@ -80,87 +117,140 @@
80
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
81
  <i class="fas fa-bullseye mr-3 text-blue-500"></i>Objetivos do Protocolo
82
  </h2>
83
- <ul class="space-y-4 text-lg text-gray-700 list-disc pl-6">
84
- <li class="fade-in">Padronizar as condutas no transplante hepático</li>
85
- <li class="fade-in">Otimizar os recursos hospitalares</li>
86
- <li class="fade-in">Garantir a segurança do paciente</li>
87
- <li class="fade-in">Reduzir complicações pós-operatórias</li>
88
- <li class="fade-in">Melhorar os desfechos clínicos</li>
89
- </ul>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
90
  </div>
91
  <div class="slide-number">2/40</div>
92
  </div>
93
 
94
  <!-- Slide 3: Equipe Multidisciplinar -->
95
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
96
- <div class="max-w-4xl mx-auto h-full flex flex-col justify-center">
97
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
98
  <i class="fas fa-users mr-3 text-blue-500"></i>Equipe Multidisciplinar
99
  </h2>
100
- <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
101
- <div class="bg-white p-4 rounded-lg shadow-sm hover:shadow-md transition-shadow">
102
- <h3 class="font-semibold text-blue-700 mb-2"><i class="fas fa-user-md text-blue-500 mr-2"></i>Médicos</h3>
103
- <ul class="text-gray-600 text-sm pl-5 space-y-1">
 
 
 
 
104
  <li>Hepatologistas</li>
105
- <li>Cirurgiões de transplante</li>
106
  <li>Anestesistas</li>
107
  <li>Intensivistas</li>
108
  </ul>
109
  </div>
110
- <div class="bg-white p-4 rounded-lg shadow-sm hover:shadow-md transition-shadow">
111
- <h3 class="font-semibold text-green-700 mb-2"><i class="fas fa-user-nurse text-green-500 mr-2"></i>Enfermagem</h3>
112
- <ul class="text-gray-600 text-sm pl-5 space-y-1">
113
- <li>Enfermeiros especializados</li>
114
- <li>Técnicos de enfermagem</li>
115
- <li>Coordenador de transplante</li>
 
 
 
 
116
  </ul>
117
  </div>
118
- <div class="bg-white p-4 rounded-lg shadow-sm hover:shadow-md transition-shadow">
119
- <h3 class="font-semibold text-purple-700 mb-2"><i class="fas fa-pills text-purple-500 mr-2"></i>Farmácia</h3>
120
- <ul class="text-gray-600 text-sm pl-5 space-y-1">
 
 
 
 
121
  <li>Farmácia clínica</li>
122
- <li>Especialistas em imunossupressão</li>
123
  </ul>
124
  </div>
125
- <div class="bg-white p-4 rounded-lg shadow-sm hover:shadow-md transition-shadow">
126
- <h3 class="font-semibold text-yellow-700 mb-2"><i class="fas fa-heart text-yellow-500 mr-2"></i>Outros</h3>
127
- <ul class="text-gray-600 text-sm pl-5 space-y-1">
 
 
 
 
128
  <li>Psicólogos</li>
129
  <li>Nutricionistas</li>
130
  <li>Assistentes sociais</li>
131
  </ul>
132
  </div>
133
  </div>
 
 
 
 
134
  </div>
135
  <div class="slide-number">3/40</div>
136
  </div>
137
 
138
  <!-- Slide 4: Indicações -->
139
  <div class="slide bg-white">
140
- <div class="max-w-4xl mx-auto h-full flex flex-col justify-center">
141
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
142
  <i class="fas fa-check-circle mr-3 text-blue-500"></i>Indicações para Transplante Hepático
143
  </h2>
144
- <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-6">
145
- <p class="text-yellow-700 font-medium"><i class="fas fa-exclamation-triangle mr-2"></i>Pacientes com doença hepática em estágio terminal sem outras opções terapêuticas</p>
146
- </div>
147
- <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
148
  <div>
149
- <h3 class="font-semibold text-green-700 mb-2">Indicações mais comuns:</h3>
 
 
 
 
 
 
150
  <ul class="text-gray-700 list-disc pl-5 space-y-2">
151
- <li>Cirrose descompensada</li>
152
- <li>Carcinoma hepatocelular</li>
153
- <li>Doenças colestáticas</li>
154
- <li>Falência hepática aguda</li>
 
155
  </ul>
156
  </div>
 
157
  <div>
158
- <h3 class="font-semibold text-red-700 mb-2">Critérios de exclusão:</h3>
 
 
 
159
  <ul class="text-gray-700 list-disc pl-5 space-y-2">
160
- <li>Infecção ativa não controlada</li>
161
- <li>Neoplasia extra-hepática</li>
162
- <li>Doença psiquiátrica grave</li>
163
- <li>Adesão inadequada</li>
 
 
164
  </ul>
165
  </div>
166
  </div>
@@ -170,40 +260,105 @@
170
 
171
  <!-- Slide 5: MELD Score -->
172
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
173
- <div class="max-w-4xl mx-auto h-full flex flex-col justify-center">
174
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
175
  <i class="fas fa-calculator mr-3 text-blue-500"></i>Escore MELD
176
  </h2>
177
- <div class="bg-white p-6 rounded-lg shadow-md mb-6">
178
- <p class="text-gray-700 mb-4">O Model for End-Stage Liver Disease (MELD) é utilizado para priorizar pacientes na lista de espera para transplante hepático.</p>
179
-
180
- <div class="grid grid-cols-1 md:grid-cols-3 gap-4 text-center mb-4">
181
- <div class="bg-blue-100 p-3 rounded-lg">
182
- <p class="font-bold text-blue-800">Bilirrubina</p>
183
- <p class="text-sm">(mg/dL)</p>
 
 
 
 
 
 
 
 
 
 
 
184
  </div>
185
- <div class="bg-green-100 p-3 rounded-lg">
186
- <p class="font-bold text-green-800">INR</p>
187
- <p class="text-sm">Relação Normalizada Internacional</p>
188
  </div>
189
- <div class="bg-purple-100 p-3 rounded-lg">
190
- <p class="font-bold text-purple-800">Creatinina</p>
191
- <p class="text-sm">(mg/dL)</p>
 
 
 
 
 
 
192
  </div>
193
  </div>
194
 
195
- <div class="bg-yellow-50 p-4 rounded-lg border-l-4 border-yellow-400">
196
- <p class="text-yellow-700 font-medium"><i class="fas fa-info-circle mr-2"></i>Fórmula MELD = 3.78×ln(bilirrubina) + 11.2×ln(INR) + 9.57×ln(creatinina) + 6.43</p>
197
- </div>
198
- </div>
199
-
200
- <div class="bg-white p-4 rounded-lg shadow-sm">
201
- <h3 class="font-semibold text-blue-700 mb-2">Interpretação:</h3>
202
- <div class="flex flex-wrap gap-2">
203
- <span class="px-3 py-1 bg-green-100 text-green-800 rounded-full text-sm">MELD ≤ 9: Baixo risco</span>
204
- <span class="px-3 py-1 bg-yellow-100 text-yellow-800 rounded-full text-sm">MELD 10-19: Risco intermediário</span>
205
- <span class="px-3 py-1 bg-orange-100 text-orange-800 rounded-full text-sm">MELD 20-29: Alto risco</span>
206
- <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-sm">MELD ≥ 30: Muito alto risco</span>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
207
  </div>
208
  </div>
209
  </div>
@@ -212,34 +367,67 @@
212
 
213
  <!-- Slide 6: Fluxograma de Avaliação -->
214
  <div class="slide bg-white">
215
- <div class="max-w-5xl mx-auto h-full flex flex-col justify-center">
216
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
217
  <i class="fas fa-project-diagram mr-3 text-blue-500"></i>Fluxograma de Avaliação Pré-Transplante
218
  </h2>
219
- <div class="bg-gray-50 p-4 rounded-lg border border-gray-200">
220
- <div class="flex flex-col items-center">
221
- <!-- This is a simplified flowchart - in a real presentation you might want to use a proper flowchart library -->
222
- <div class="flowchart-step bg-blue-100 text-blue-800 p-3 rounded-lg mb-2 w-64 text-center font-medium border-2 border-blue-300">
223
- <i class="fas fa-user-injured mr-2"></i>Paciente com indicação
 
 
 
 
224
  </div>
225
- <div class="h-8 w-0.5 bg-gray-300"></div>
226
- <div class="flowchart-step bg-green-100 text-green-800 p-3 rounded-lg mb-2 w-64 text-center font-medium border-2 border-green-300">
227
- <i class="fas fa-clipboard-check mr-2"></i>Avaliação inicial
 
 
 
 
 
 
228
  </div>
229
- <div class="h-8 w-0.5 bg-gray-300"></div>
230
- <div class="flowchart-step bg-purple-100 text-purple-800 p-3 rounded-lg mb-2 w-64 text-center font-medium border-2 border-purple-300">
231
- <i class="fas fa-vial mr-2"></i>Exames complementares
 
 
 
 
 
 
 
 
 
 
232
  </div>
233
- <div class="h-8 w-0.5 bg-gray-300"></div>
234
- <div class="flowchart-step bg-yellow-100 text-yellow-800 p-3 rounded-lg mb-2 w-64 text-center font-medium border-2 border-yellow-300">
235
- <i class="fas fa-users mr-2"></i>Reunião multidisciplinar
 
 
 
 
 
 
236
  </div>
237
- <div class="h-8 w-0.5 bg-gray-300"></div>
238
- <div class="flowchart-step bg-red-100 text-red-800 p-3 rounded-lg mb-2 w-64 text-center font-medium border-2 border-red-300">
239
- <i class="fas fa-clipboard-list mr-2"></i>Lista de espera
 
 
 
 
 
 
240
  </div>
241
  </div>
242
  </div>
 
243
  <p class="text-gray-600 mt-4 text-sm italic">* Fluxograma simplificado - consultar protocolo completo para detalhes</p>
244
  </div>
245
  <div class="slide-number">6/40</div>
@@ -247,13 +435,13 @@
247
 
248
  <!-- Slide 7: Exames Pré-Operatórios -->
249
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
250
- <div class="max-w-4xl mx-auto h-full flex flex-col justify-center">
251
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
252
  <i class="fas fa-flask mr-3 text-blue-500"></i>Exames Pré-Operatórios
253
  </h2>
254
 
255
- <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
256
- <div class="bg-white p-4 rounded-lg shadow-sm">
257
  <h3 class="font-semibold text-blue-700 mb-3 border-b pb-2 flex items-center">
258
  <i class="fas fa-vial mr-2"></i>Laboratoriais
259
  </h3>
@@ -264,73 +452,90 @@
264
  </li>
265
  <li class="flex items-start">
266
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
267
- <span>Função hepática e renal</span>
268
  </li>
269
  <li class="flex items-start">
270
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
271
- <span>Coagulograma</span>
272
  </li>
273
  <li class="flex items-start">
274
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
275
- <span>Marcadores virais</span>
 
 
 
 
 
 
 
 
276
  </li>
277
  </ul>
278
  </div>
279
 
280
- <div class="bg-white p-4 rounded-lg shadow-sm">
281
  <h3 class="font-semibold text-purple-700 mb-3 border-b pb-2 flex items-center">
282
  <i class="fas fa-x-ray mr-2"></i>Imagem
283
  </h3>
284
  <ul class="text-gray-700 text-sm space-y-2">
285
  <li class="flex items-start">
286
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
287
- <span>Ultrassom abdominal</span>
288
  </li>
289
  <li class="flex items-start">
290
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
291
- <span>Tomografia computadorizada</span>
292
  </li>
293
  <li class="flex items-start">
294
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
295
- <span>Ressonância magnética</span>
296
  </li>
297
  <li class="flex items-start">
298
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
299
- <span>Angiografia (se necessário)</span>
 
 
 
 
 
 
 
 
300
  </li>
301
  </ul>
302
  </div>
303
 
304
- <div class="bg-white p-4 rounded-lg shadow-sm">
305
  <h3 class="font-semibold text-green-700 mb-3 border-b pb-2 flex items-center">
306
  <i class="fas fa-heartbeat mr-2"></i>Cardiológicos
307
  </h3>
308
  <ul class="text-gray-700 text-sm space-y-2">
309
  <li class="flex items-start">
310
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
311
- <span>ECG</span>
 
 
 
 
312
  </li>
313
  <li class="flex items-start">
314
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
315
- <span>Ecocardiograma</span>
316
  </li>
317
  <li class="flex items-start">
318
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
319
- <span>Teste de esforço (se indicado)</span>
320
  </li>
321
  <li class="flex items-start">
322
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
323
- <span>Avaliação cardiológica</span>
324
  </li>
325
  </ul>
326
  </div>
327
  </div>
328
 
329
- <div class="bg-white p-4 rounded-lg shadow-sm mt-4">
330
- <h3 class="font-semibold text-red-700 mb-2 border-b pb-2 flex items-center">
331
- <i class="fas fa-exclamation-triangle mr-2"></i>Exames Especiais
332
- </h3>
333
- <p class="text-gray-700 text-sm">Dependendo da condição do paciente, podem ser necessários exames adicionais como biópsia hepática, avaliação psiquiátrica, entre outros.</p>
334
  </div>
335
  </div>
336
  <div class="slide-number">7/40</div>
@@ -338,7 +543,7 @@
338
 
339
  <!-- Slide 8: Procedimento Cirúrgico -->
340
  <div class="slide bg-white">
341
- <div class="max-w-4xl mx-auto h-full flex flex-col justify-center">
342
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
343
  <i class="fas fa-procedures mr-3 text-blue-500"></i>Procedimento Cirúrgico
344
  </h2>
@@ -349,117 +554,210 @@
349
  <i class="fas fa-clock mr-2"></i>Fases do Transplante
350
  </h3>
351
  <div class="space-y-4">
352
- <div class="flex items-start">
353
- <div class="bg-blue-100 text-blue-800 rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 font-bold">1</div>
354
  <div>
355
  <p class="font-medium">Hepatectomia</p>
356
- <p class="text-gray-600 text-sm">Remoção do fígado doente</p>
357
  </div>
358
  </div>
359
- <div class="flex items-start">
360
- <div class="bg-green-100 text-green-800 rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 font-bold">2</div>
361
  <div>
362
- <p class="font-medium">Implante do enxerto</p>
363
- <p class="text-gray-600 text-sm">Anastomoses vasculares e biliares</p>
364
  </div>
365
  </div>
366
- <div class="flex items-start">
367
- <div class="bg-purple-100 text-purple-800 rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 font-bold">3</div>
368
  <div>
369
  <p class="font-medium">Reperfusão</p>
370
- <p class="text-gray-600 text-sm">Restabelecimento do fluxo sanguíneo</p>
371
  </div>
372
  </div>
373
  </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
374
  </div>
375
 
376
  <div>
377
- <h3 class="font-semibold text-red-700 mb-3 flex items-center">
378
- <i class="fas fa-exclamation-triangle mr-2"></i>Considerações Técnicas
379
- </h3>
380
- <ul class="text-gray-700 space-y-3">
381
- <li class="flex items-start">
382
- <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
383
- <span>Tempo cirúrgico médio: 6-12 horas</span>
384
- </li>
385
- <li class="flex items-start">
386
- <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
387
- <span>Isquemia fria máxima: 8-12 horas</span>
388
- </li>
389
- <li class="flex items-start">
390
- <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
391
- <span>Monitorização hemodinâmica rigorosa</span>
392
- </li>
393
- <li class="flex items-start">
394
- <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
395
- <span>Uso de sangue e hemoderivados conforme necessidade</span>
396
- </li>
397
- </ul>
 
 
 
 
 
 
398
  </div>
399
  </div>
400
-
401
- <div class="bg-blue-50 p-4 rounded-lg border-l-4 border-blue-400 mt-6">
402
- <p class="text-blue-800 font-medium"><i class="fas fa-info-circle mr-2"></i>O procedimento pode variar conforme as características do doador e receptor.</p>
403
- </div>
404
  </div>
405
  <div class="slide-number">8/40</div>
406
  </div>
407
 
408
  <!-- Slide 9: Cuidados Pós-Operatórios -->
409
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
410
- <div class="max-w-4xl mx-auto h-full flex flex-col justify-center">
411
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
412
  <i class="fas fa-hospital-user mr-3 text-blue-500"></i>Cuidados Pós-Operatórios
413
  </h2>
414
 
415
  <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
416
- <div class="bg-white p-4 rounded-lg shadow-sm">
417
- <h3 class="font-semibold text-blue-700 mb-2 flex items-center">
418
- <i class="fas fa-procedures mr-2"></i>UTI
419
  </h3>
420
  <ul class="text-gray-700 text-sm space-y-2">
421
- <li>Monitorização hemodinâmica</li>
422
- <li>Ventilação mecânica</li>
423
- <li>Controle hídrico rigoroso</li>
424
- <li>Profilaxia de infecções</li>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
425
  </ul>
426
  </div>
427
 
428
- <div class="bg-white p-4 rounded-lg shadow-sm">
429
- <h3 class="font-semibold text-green-700 mb-2 flex items-center">
430
  <i class="fas fa-pills mr-2"></i>Imunossupressão
431
  </h3>
432
  <ul class="text-gray-700 text-sm space-y-2">
433
- <li>Esquema triplo inicial</li>
434
- <li>Ajuste de doses</li>
435
- <li>Monitorização de níveis</li>
436
- <li>Prevenção de efeitos adversos</li>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
437
  </ul>
438
  </div>
439
 
440
- <div class="bg-white p-4 rounded-lg shadow-sm">
441
- <h3 class="font-semibold text-purple-700 mb-2 flex items-center">
442
  <i class="fas fa-chart-line mr-2"></i>Monitorização
443
  </h3>
444
  <ul class="text-gray-700 text-sm space-y-2">
445
- <li>Função hepática diária</li>
446
- <li>Exames de imagem</li>
447
- <li>Biópsia se necessário</li>
448
- <li>Avaliação de complicações</li>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
449
  </ul>
450
  </div>
451
  </div>
452
 
453
  <div class="bg-white p-4 rounded-lg shadow-md">
454
- <h3 class="font-semibold text-red-700 mb-2 flex items-center">
455
- <i class="fas fa-exclamation-triangle mr-2"></i>Complicações Precoces
456
  </h3>
457
- <div class="flex flex-wrap gap-2">
458
- <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-xs">Hemorragia</span>
459
- <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-xs">Trombose vascular</span>
460
- <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-xs">Disfunção primária</span>
461
- <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-xs">Infecções</span>
462
- <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-xs">Rejeição aguda</span>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
463
  </div>
464
  </div>
465
  </div>
@@ -468,7 +766,7 @@
468
 
469
  <!-- Slide 10: Follow-up -->
470
  <div class="slide bg-white">
471
- <div class="max-w-4xl mx-auto h-full flex flex-col justify-center">
472
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
473
  <i class="fas fa-calendar-check mr-3 text-blue-500"></i>Follow-up Pós-Transplante
474
  </h2>
@@ -477,46 +775,66 @@
477
  <div>
478
  <h3 class="font-semibold text-green-700 mb-3">Primeiro Ano:</h3>
479
  <div class="space-y-4">
480
- <div class="flex items-start">
481
- <div class="bg-blue-100 text-blue-800 rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-3 text-xs font-bold">1</div>
482
  <div>
483
- <p class="font-medium">Consultas semanais no primeiro mês</p>
 
484
  </div>
485
  </div>
486
- <div class="flex items-start">
487
- <div class="bg-blue-100 text-blue-800 rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-3 text-xs font-bold">2</div>
488
  <div>
489
- <p class="font-medium">Mensais até 6 meses</p>
 
490
  </div>
491
  </div>
492
- <div class="flex items-start">
493
- <div class="bg-blue-100 text-blue-800 rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-3 text-xs font-bold">3</div>
494
  <div>
495
- <p class="font-medium">Bimestrais até 1 ano</p>
 
 
 
 
 
 
 
 
496
  </div>
497
  </div>
498
  </div>
499
  </div>
500
 
501
  <div>
502
- <h3 class="font-semibold text-purple-700 mb-3">Após o Primeiro Ano:</h3>
503
  <div class="space-y-4">
504
- <div class="flex items-start">
505
- <div class="bg-purple-100 text-purple-800 rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-3 text-xs font-bold">1</div>
506
  <div>
507
  <p class="font-medium">Consultas trimestrais</p>
 
 
 
 
 
 
 
 
508
  </div>
509
  </div>
510
- <div class="flex items-start">
511
- <div class="bg-purple-100 text-purple-800 rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-3 text-xs font-bold">2</div>
512
  <div>
513
- <p class="font-medium">Exames laboratoriais regulares</p>
 
514
  </div>
515
  </div>
516
- <div class="flex items-start">
517
- <div class="bg-purple-100 text-purple-800 rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-3 text-xs font-bold">3</div>
518
  <div>
519
- <p class="font-medium">Imagem anual ou conforme necessidade</p>
 
520
  </div>
521
  </div>
522
  </div>
@@ -525,13 +843,25 @@
525
 
526
  <div class="bg-yellow-50 p-4 rounded-lg border-l-4 border-yellow-400 mt-6">
527
  <h3 class="font-semibold text-yellow-800 mb-2 flex items-center">
528
- <i class="fas fa-exclamation-circle mr-2"></i>Complicações Tardias
529
  </h3>
530
- <div class="flex flex-wrap gap-2">
531
- <span class="px-3 py-1 bg-yellow-100 text-yellow-800 rounded-full text-xs">Rejeição crônica</span>
532
- <span class="px-3 py-1 bg-yellow-100 text-yellow-800 rounded-full text-xs">Recidiva da doença</span>
533
- <span class="px-3 py-1 bg-yellow-100 text-yellow-800 rounded-full text-xs">Efeitos adversos dos imunossupressores</span>
534
- <span class="px-3 py-1 bg-yellow-100 text-yellow-800 rounded-full text-xs">Neoplasias</span>
 
 
 
 
 
 
 
 
 
 
 
 
535
  </div>
536
  </div>
537
  </div>
 
6
  <title>Protocolo de Transplante Hepático - HUWC</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
  <style>
11
  .slide {
12
  display: none;
 
43
  padding: 0.2rem 0.4rem;
44
  border-radius: 0.25rem;
45
  }
46
+ .flowchart {
47
+ display: flex;
48
+ flex-direction: column;
49
+ align-items: center;
50
+ }
51
+ .flowchart-step {
52
+ width: 80%;
53
+ max-width: 500px;
54
+ margin: 10px 0;
55
+ padding: 15px;
56
+ border-radius: 8px;
57
+ box-shadow: 0 4px 6px rgba(0,0,0,0.1);
58
+ position: relative;
59
+ }
60
+ .flowchart-arrow {
61
+ width: 0;
62
+ height: 0;
63
+ border-left: 10px solid transparent;
64
+ border-right: 10px solid transparent;
65
+ border-top: 10px solid #3b82f6;
66
+ }
67
+ .comparison-table {
68
+ width: 100%;
69
+ border-collapse: collapse;
70
+ }
71
+ .comparison-table th, .comparison-table td {
72
+ border: 1px solid #ddd;
73
+ padding: 8px;
74
+ text-align: left;
75
+ }
76
+ .comparison-table th {
77
+ background-color: #f2f2f2;
78
+ }
79
+ .comparison-table tr:nth-child(even) {
80
+ background-color: #f9f9f9;
81
+ }
82
  </style>
83
  </head>
84
  <body class="bg-gray-100 font-sans">
 
100
  <!-- Slide 1: Title -->
101
  <div class="slide active fade-in bg-gradient-to-br from-blue-50 to-green-50">
102
  <div class="max-w-4xl mx-auto h-full flex flex-col justify-center items-center text-center">
103
+ <img src="https://img.freepik.com/free-vector/hospital-logo-design-vector-medical-cross_53876-136743.jpg" alt="HUWC Logo" class="mb-8 rounded-full border-4 border-white shadow-lg w-32 h-32 object-cover">
104
  <h1 class="text-4xl md:text-5xl font-bold text-blue-800 mb-4">Protocolo de Transplante Hepático</h1>
105
  <h2 class="text-2xl md:text-3xl font-semibold text-green-700 mb-8">Hospital Universitário Walter Cantídio</h2>
106
  <div class="bg-white p-6 rounded-lg shadow-md w-full max-w-2xl">
107
+ <p class="text-gray-700 mb-2"><i class="fas fa-user-md text-blue-500 mr-2"></i>Coordenação: Serviço de Hepatologia e Cirurgia</p>
108
+ <p class="text-gray-700"><i class="fas fa-calendar-alt text-green-500 mr-2"></i>Última atualização: Janeiro 2023</p>
109
  </div>
110
  </div>
111
  <div class="slide-number">1/40</div>
 
117
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
118
  <i class="fas fa-bullseye mr-3 text-blue-500"></i>Objetivos do Protocolo
119
  </h2>
120
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
121
+ <div>
122
+ <img src="https://img.freepik.com/free-vector/medical-team-concept-illustration_114360-1004.jpg" alt="Objetivos" class="w-full h-auto rounded-lg shadow mb-4">
123
+ </div>
124
+ <div>
125
+ <ul class="space-y-4 text-lg text-gray-700 list-disc pl-6">
126
+ <li class="fade-in flex items-start">
127
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-3"></i>
128
+ <span>Padronizar condutas no transplante hepático</span>
129
+ </li>
130
+ <li class="fade-in flex items-start">
131
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-3"></i>
132
+ <span>Otimizar recursos hospitalares</span>
133
+ </li>
134
+ <li class="fade-in flex items-start">
135
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-3"></i>
136
+ <span>Garantir segurança do paciente</span>
137
+ </li>
138
+ <li class="fade-in flex items-start">
139
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-3"></i>
140
+ <span>Reduzir complicações pós-operatórias</span>
141
+ </li>
142
+ <li class="fade-in flex items-start">
143
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-3"></i>
144
+ <span>Melhorar desfechos clínicos</span>
145
+ </li>
146
+ </ul>
147
+ </div>
148
+ </div>
149
  </div>
150
  <div class="slide-number">2/40</div>
151
  </div>
152
 
153
  <!-- Slide 3: Equipe Multidisciplinar -->
154
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
155
+ <div class="max-w-5xl mx-auto h-full flex flex-col justify-center">
156
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
157
  <i class="fas fa-users mr-3 text-blue-500"></i>Equipe Multidisciplinar
158
  </h2>
159
+
160
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
161
+ <div class="bg-white p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow flex flex-col items-center">
162
+ <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-3">
163
+ <i class="fas fa-user-md text-blue-600 text-2xl"></i>
164
+ </div>
165
+ <h3 class="font-semibold text-blue-700 mb-2 text-center">Médicos</h3>
166
+ <ul class="text-gray-600 text-sm text-center">
167
  <li>Hepatologistas</li>
168
+ <li>Cirurgiões</li>
169
  <li>Anestesistas</li>
170
  <li>Intensivistas</li>
171
  </ul>
172
  </div>
173
+
174
+ <div class="bg-white p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow flex flex-col items-center">
175
+ <div class="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mb-3">
176
+ <i class="fas fa-user-nurse text-green-600 text-2xl"></i>
177
+ </div>
178
+ <h3 class="font-semibold text-green-700 mb-2 text-center">Enfermagem</h3>
179
+ <ul class="text-gray-600 text-sm text-center">
180
+ <li>Enfermeiros</li>
181
+ <li>Técnicos</li>
182
+ <li>Coordenador</li>
183
  </ul>
184
  </div>
185
+
186
+ <div class="bg-white p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow flex flex-col items-center">
187
+ <div class="w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mb-3">
188
+ <i class="fas fa-pills text-purple-600 text-2xl"></i>
189
+ </div>
190
+ <h3 class="font-semibold text-purple-700 mb-2 text-center">Farmácia</h3>
191
+ <ul class="text-gray-600 text-sm text-center">
192
  <li>Farmácia clínica</li>
193
+ <li>Imunossupressão</li>
194
  </ul>
195
  </div>
196
+
197
+ <div class="bg-white p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow flex flex-col items-center">
198
+ <div class="w-16 h-16 bg-yellow-100 rounded-full flex items-center justify-center mb-3">
199
+ <i class="fas fa-heart text-yellow-600 text-2xl"></i>
200
+ </div>
201
+ <h3 class="font-semibold text-yellow-700 mb-2 text-center">Apoio</h3>
202
+ <ul class="text-gray-600 text-sm text-center">
203
  <li>Psicólogos</li>
204
  <li>Nutricionistas</li>
205
  <li>Assistentes sociais</li>
206
  </ul>
207
  </div>
208
  </div>
209
+
210
+ <div class="bg-white p-4 rounded-lg shadow-md">
211
+ <img src="https://img.freepik.com/free-vector/medical-team-concept-illustration_114360-1004.jpg" alt="Equipe multidisciplinar" class="w-full h-auto rounded-lg">
212
+ </div>
213
  </div>
214
  <div class="slide-number">3/40</div>
215
  </div>
216
 
217
  <!-- Slide 4: Indicações -->
218
  <div class="slide bg-white">
219
+ <div class="max-w-5xl mx-auto h-full flex flex-col justify-center">
220
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
221
  <i class="fas fa-check-circle mr-3 text-blue-500"></i>Indicações para Transplante Hepático
222
  </h2>
223
+
224
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
 
 
225
  <div>
226
+ <div class="bg-blue-50 p-4 rounded-lg border-l-4 border-blue-400 mb-4">
227
+ <p class="text-blue-800 font-medium"><i class="fas fa-info-circle mr-2"></i>Pacientes com doença hepática em estágio terminal sem outras opções terapêuticas</p>
228
+ </div>
229
+
230
+ <h3 class="font-semibold text-green-700 mb-3 flex items-center">
231
+ <i class="fas fa-thumbs-up mr-2"></i>Indicações mais comuns:
232
+ </h3>
233
  <ul class="text-gray-700 list-disc pl-5 space-y-2">
234
+ <li>Cirrose descompensada (Child-Pugh B/C)</li>
235
+ <li>Carcinoma hepatocelular dentro dos critérios de Milão</li>
236
+ <li>Doenças colestáticas (PBC, PSC)</li>
237
+ <li>Falência hepática aguda (critérios de King's College)</li>
238
+ <li>Doenças metabólicas (amiloidose, doença de Wilson)</li>
239
  </ul>
240
  </div>
241
+
242
  <div>
243
+ <div class="bg-red-50 p-4 rounded-lg border-l-4 border-red-400 mb-4">
244
+ <p class="text-red-800 font-medium"><i class="fas fa-exclamation-triangle mr-2"></i>Critérios de exclusão absoluta:</p>
245
+ </div>
246
+
247
  <ul class="text-gray-700 list-disc pl-5 space-y-2">
248
+ <li>Infecção ativa não controlada (incluindo HIV com carga viral detectável)</li>
249
+ <li>Neoplasia extra-hepática (exceto câncer de pele não melanoma)</li>
250
+ <li>Doença psiquiátrica grave não controlada</li>
251
+ <li>Adesão inadequada ao tratamento</li>
252
+ <li>Doença cardiopulmonar avançada irreversível</li>
253
+ <li>Dependência ativa de álcool/drogas (período mínimo de abstinência requerido)</li>
254
  </ul>
255
  </div>
256
  </div>
 
260
 
261
  <!-- Slide 5: MELD Score -->
262
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
263
+ <div class="max-w-5xl mx-auto h-full flex flex-col justify-center">
264
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
265
  <i class="fas fa-calculator mr-3 text-blue-500"></i>Escore MELD
266
  </h2>
267
+
268
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
269
+ <div class="bg-white p-6 rounded-lg shadow-md">
270
+ <p class="text-gray-700 mb-4">O Model for End-Stage Liver Disease (MELD) é utilizado para priorizar pacientes na lista de espera para transplante hepático.</p>
271
+
272
+ <div class="grid grid-cols-3 gap-3 text-center mb-4">
273
+ <div class="bg-blue-100 p-3 rounded-lg">
274
+ <p class="font-bold text-blue-800">Bilirrubina</p>
275
+ <p class="text-xs">(mg/dL)</p>
276
+ </div>
277
+ <div class="bg-green-100 p-3 rounded-lg">
278
+ <p class="font-bold text-green-800">INR</p>
279
+ <p class="text-xs">Coagulação</p>
280
+ </div>
281
+ <div class="bg-purple-100 p-3 rounded-lg">
282
+ <p class="font-bold text-purple-800">Creatinina</p>
283
+ <p class="text-xs">(mg/dL)</p>
284
+ </div>
285
  </div>
286
+
287
+ <div class="bg-yellow-50 p-4 rounded-lg border-l-4 border-yellow-400">
288
+ <p class="text-yellow-700 font-medium text-sm"><i class="fas fa-info-circle mr-2"></i>Fórmula MELD = 3.78×ln(bilirrubina) + 11.2×ln(INR) + 9.57×ln(creatinina) + 6.43</p>
289
  </div>
290
+
291
+ <div class="mt-4">
292
+ <h3 class="font-semibold text-blue-700 mb-2">Interpretação:</h3>
293
+ <div class="flex flex-wrap gap-2">
294
+ <span class="px-3 py-1 bg-green-100 text-green-800 rounded-full text-xs">≤9: Baixo risco</span>
295
+ <span class="px-3 py-1 bg-yellow-100 text-yellow-800 rounded-full text-xs">10-19: Intermediário</span>
296
+ <span class="px-3 py-1 bg-orange-100 text-orange-800 rounded-full text-xs">20-29: Alto risco</span>
297
+ <span class="px-3 py-1 bg-red-100 text-red-800 rounded-full text-xs">≥30: Muito alto</span>
298
+ </div>
299
  </div>
300
  </div>
301
 
302
+ <div class="bg-white p-4 rounded-lg shadow-md">
303
+ <canvas id="meldChart" height="300"></canvas>
304
+ <script>
305
+ document.addEventListener('DOMContentLoaded', function() {
306
+ const ctx = document.getElementById('meldChart').getContext('2d');
307
+ const meldChart = new Chart(ctx, {
308
+ type: 'bar',
309
+ data: {
310
+ labels: ['≤9', '10-19', '20-29', '≥30'],
311
+ datasets: [{
312
+ label: 'Mortalidade em 3 meses (%)',
313
+ data: [4, 27, 76, 83],
314
+ backgroundColor: [
315
+ 'rgba(75, 192, 192, 0.6)',
316
+ 'rgba(255, 206, 86, 0.6)',
317
+ 'rgba(255, 159, 64, 0.6)',
318
+ 'rgba(255, 99, 132, 0.6)'
319
+ ],
320
+ borderColor: [
321
+ 'rgba(75, 192, 192, 1)',
322
+ 'rgba(255, 206, 86, 1)',
323
+ 'rgba(255, 159, 64, 1)',
324
+ 'rgba(255, 99, 132, 1)'
325
+ ],
326
+ borderWidth: 1
327
+ }]
328
+ },
329
+ options: {
330
+ responsive: true,
331
+ plugins: {
332
+ title: {
333
+ display: true,
334
+ text: 'Mortalidade por Escore MELD',
335
+ font: {
336
+ size: 16
337
+ }
338
+ },
339
+ legend: {
340
+ display: false
341
+ }
342
+ },
343
+ scales: {
344
+ y: {
345
+ beginAtZero: true,
346
+ title: {
347
+ display: true,
348
+ text: 'Mortalidade (%)'
349
+ }
350
+ },
351
+ x: {
352
+ title: {
353
+ display: true,
354
+ text: 'Escore MELD'
355
+ }
356
+ }
357
+ }
358
+ }
359
+ });
360
+ });
361
+ </script>
362
  </div>
363
  </div>
364
  </div>
 
367
 
368
  <!-- Slide 6: Fluxograma de Avaliação -->
369
  <div class="slide bg-white">
370
+ <div class="max-w-6xl mx-auto h-full flex flex-col justify-center">
371
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
372
  <i class="fas fa-project-diagram mr-3 text-blue-500"></i>Fluxograma de Avaliação Pré-Transplante
373
  </h2>
374
+
375
+ <div class="bg-gray-50 p-6 rounded-lg border border-gray-200 overflow-auto">
376
+ <div class="flowchart min-w-max">
377
+ <div class="flowchart-step bg-blue-100 text-blue-800">
378
+ <div class="font-bold text-lg flex items-center">
379
+ <div class="w-8 h-8 bg-blue-500 text-white rounded-full flex items-center justify-center mr-3">1</div>
380
+ Indicação para Transplante
381
+ </div>
382
+ <p class="text-sm mt-2">Paciente com doença hepática terminal</p>
383
  </div>
384
+
385
+ <div class="flowchart-arrow"></div>
386
+
387
+ <div class="flowchart-step bg-green-100 text-green-800">
388
+ <div class="font-bold text-lg flex items-center">
389
+ <div class="w-8 h-8 bg-green-500 text-white rounded-full flex items-center justify-center mr-3">2</div>
390
+ Avaliação Inicial
391
+ </div>
392
+ <p class="text-sm mt-2">Consulta com hepatologista e cirurgião</p>
393
  </div>
394
+
395
+ <div class="flowchart-arrow"></div>
396
+
397
+ <div class="flowchart-step bg-purple-100 text-purple-800">
398
+ <div class="font-bold text-lg flex items-center">
399
+ <div class="w-8 h-8 bg-purple-500 text-white rounded-full flex items-center justify-center mr-3">3</div>
400
+ Exames Complementares
401
+ </div>
402
+ <ul class="text-sm mt-2 list-disc pl-5">
403
+ <li>Laboratoriais</li>
404
+ <li>Imagem</li>
405
+ <li>Avaliações especializadas</li>
406
+ </ul>
407
  </div>
408
+
409
+ <div class="flowchart-arrow"></div>
410
+
411
+ <div class="flowchart-step bg-yellow-100 text-yellow-800">
412
+ <div class="font-bold text-lg flex items-center">
413
+ <div class="w-8 h-8 bg-yellow-500 text-white rounded-full flex items-center justify-center mr-3">4</div>
414
+ Reunião Multidisciplinar
415
+ </div>
416
+ <p class="text-sm mt-2">Discussão do caso pela equipe de transplante</p>
417
  </div>
418
+
419
+ <div class="flowchart-arrow"></div>
420
+
421
+ <div class="flowchart-step bg-red-100 text-red-800">
422
+ <div class="font-bold text-lg flex items-center">
423
+ <div class="w-8 h-8 bg-red-500 text-white rounded-full flex items-center justify-center mr-3">5</div>
424
+ Inclusão na Lista de Espera
425
+ </div>
426
+ <p class="text-sm mt-2">Atribuição de escore MELD/PELD</p>
427
  </div>
428
  </div>
429
  </div>
430
+
431
  <p class="text-gray-600 mt-4 text-sm italic">* Fluxograma simplificado - consultar protocolo completo para detalhes</p>
432
  </div>
433
  <div class="slide-number">6/40</div>
 
435
 
436
  <!-- Slide 7: Exames Pré-Operatórios -->
437
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
438
+ <div class="max-w-6xl mx-auto h-full flex flex-col justify-center">
439
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
440
  <i class="fas fa-flask mr-3 text-blue-500"></i>Exames Pré-Operatórios
441
  </h2>
442
 
443
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
444
+ <div class="bg-white p-4 rounded-lg shadow-md">
445
  <h3 class="font-semibold text-blue-700 mb-3 border-b pb-2 flex items-center">
446
  <i class="fas fa-vial mr-2"></i>Laboratoriais
447
  </h3>
 
452
  </li>
453
  <li class="flex items-start">
454
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
455
+ <span>Bioquímica (TGO, TGP, FA, GGT, bilirrubinas)</span>
456
  </li>
457
  <li class="flex items-start">
458
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
459
+ <span>Coagulograma (TP, TTPA, INR, fibrinogênio)</span>
460
  </li>
461
  <li class="flex items-start">
462
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
463
+ <span>Função renal (ureia, creatinina, eletrólitos)</span>
464
+ </li>
465
+ <li class="flex items-start">
466
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
467
+ <span>Marcadores virais (HBsAg, anti-HBc, anti-HCV, HIV)</span>
468
+ </li>
469
+ <li class="flex items-start">
470
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
471
+ <span>Tipagem sanguínea e painel de anticorpos</span>
472
  </li>
473
  </ul>
474
  </div>
475
 
476
+ <div class="bg-white p-4 rounded-lg shadow-md">
477
  <h3 class="font-semibold text-purple-700 mb-3 border-b pb-2 flex items-center">
478
  <i class="fas fa-x-ray mr-2"></i>Imagem
479
  </h3>
480
  <ul class="text-gray-700 text-sm space-y-2">
481
  <li class="flex items-start">
482
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
483
+ <span>Ultrassom abdominal com Doppler</span>
484
  </li>
485
  <li class="flex items-start">
486
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
487
+ <span>Tomografia computadorizada de abdome</span>
488
  </li>
489
  <li class="flex items-start">
490
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
491
+ <span>Ressonância magnética de abdome (se indicado)</span>
492
  </li>
493
  <li class="flex items-start">
494
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
495
+ <span>Angiografia (em casos selecionados)</span>
496
+ </li>
497
+ <li class="flex items-start">
498
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
499
+ <span>Raio-X de tórax</span>
500
+ </li>
501
+ <li class="flex items-start">
502
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
503
+ <span>Densitometria óssea (se indicado)</span>
504
  </li>
505
  </ul>
506
  </div>
507
 
508
+ <div class="bg-white p-4 rounded-lg shadow-md">
509
  <h3 class="font-semibold text-green-700 mb-3 border-b pb-2 flex items-center">
510
  <i class="fas fa-heartbeat mr-2"></i>Cardiológicos
511
  </h3>
512
  <ul class="text-gray-700 text-sm space-y-2">
513
  <li class="flex items-start">
514
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
515
+ <span>ECG de 12 derivações</span>
516
+ </li>
517
+ <li class="flex items-start">
518
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
519
+ <span>Ecocardiograma transtorácico</span>
520
  </li>
521
  <li class="flex items-start">
522
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
523
+ <span>Teste ergométrico (se indicado)</span>
524
  </li>
525
  <li class="flex items-start">
526
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
527
+ <span>Avaliação cardiológica completa</span>
528
  </li>
529
  <li class="flex items-start">
530
  <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
531
+ <span>Cateterismo cardíaco (em casos selecionados)</span>
532
  </li>
533
  </ul>
534
  </div>
535
  </div>
536
 
537
+ <div class="bg-white p-4 rounded-lg shadow-md">
538
+ <img src="https://img.freepik.com/free-vector/medical-test-concept-illustration_114360-1233.jpg" alt="Exames médicos" class="w-full h-auto rounded-lg">
 
 
 
539
  </div>
540
  </div>
541
  <div class="slide-number">7/40</div>
 
543
 
544
  <!-- Slide 8: Procedimento Cirúrgico -->
545
  <div class="slide bg-white">
546
+ <div class="max-w-6xl mx-auto h-full flex flex-col justify-center">
547
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
548
  <i class="fas fa-procedures mr-3 text-blue-500"></i>Procedimento Cirúrgico
549
  </h2>
 
554
  <i class="fas fa-clock mr-2"></i>Fases do Transplante
555
  </h3>
556
  <div class="space-y-4">
557
+ <div class="flex items-start bg-blue-50 p-3 rounded-lg">
558
+ <div class="bg-blue-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 font-bold">1</div>
559
  <div>
560
  <p class="font-medium">Hepatectomia</p>
561
+ <p class="text-gray-600 text-sm">Remoção do fígado doente com preservação das estruturas vasculares e biliares</p>
562
  </div>
563
  </div>
564
+ <div class="flex items-start bg-green-50 p-3 rounded-lg">
565
+ <div class="bg-green-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 font-bold">2</div>
566
  <div>
567
+ <p class="font-medium">Implante do Enxerto</p>
568
+ <p class="text-gray-600 text-sm">Anastomoses vasculares (veia cava, veia porta, artéria hepática) e reconexão biliar</p>
569
  </div>
570
  </div>
571
+ <div class="flex items-start bg-purple-50 p-3 rounded-lg">
572
+ <div class="bg-purple-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 font-bold">3</div>
573
  <div>
574
  <p class="font-medium">Reperfusão</p>
575
+ <p class="text-gray-600 text-sm">Restabelecimento do fluxo sanguíneo ao enxerto hepático</p>
576
  </div>
577
  </div>
578
  </div>
579
+
580
+ <div class="mt-6">
581
+ <h3 class="font-semibold text-blue-700 mb-2 flex items-center">
582
+ <i class="fas fa-chart-line mr-2"></i>Dados Cirúrgicos
583
+ </h3>
584
+ <table class="comparison-table w-full">
585
+ <tr>
586
+ <th>Parâmetro</th>
587
+ <th>Valor Médio</th>
588
+ </tr>
589
+ <tr>
590
+ <td>Tempo cirúrgico</td>
591
+ <td>6-12 horas</td>
592
+ </tr>
593
+ <tr>
594
+ <td>Isquemia fria máxima</td>
595
+ <td>8-12 horas</td>
596
+ </tr>
597
+ <tr>
598
+ <td>Transfusão sanguínea</td>
599
+ <td>4-8 concentrados</td>
600
+ </tr>
601
+ <tr>
602
+ <td>Dreno abdominal</td>
603
+ <td>Sim (2-5 dias)</td>
604
+ </tr>
605
+ </table>
606
+ </div>
607
  </div>
608
 
609
  <div>
610
+ <div class="bg-white p-4 rounded-lg shadow-md mb-4">
611
+ <img src="https://img.freepik.com/free-vector/liver-anatomy-concept-illustration_114360-14864.jpg" alt="Anatomia hepática" class="w-full h-auto rounded-lg">
612
+ </div>
613
+
614
+ <div class="bg-red-50 p-4 rounded-lg border-l-4 border-red-400">
615
+ <h3 class="font-semibold text-red-700 mb-2 flex items-center">
616
+ <i class="fas fa-exclamation-triangle mr-2"></i>Desafios Técnicos
617
+ </h3>
618
+ <ul class="text-gray-700 text-sm space-y-2">
619
+ <li class="flex items-start">
620
+ <i class="fas fa-check-circle text-red-500 mt-1 mr-2"></i>
621
+ <span>Anastomose arterial (artéria hepática pequena)</span>
622
+ </li>
623
+ <li class="flex items-start">
624
+ <i class="fas fa-check-circle text-red-500 mt-1 mr-2"></i>
625
+ <span>Reconstrução do ducto biliar (risco de estenose)</span>
626
+ </li>
627
+ <li class="flex items-start">
628
+ <i class="fas fa-check-circle text-red-500 mt-1 mr-2"></i>
629
+ <span>Hemorragia (coagulopatia pré-existente)</span>
630
+ </li>
631
+ <li class="flex items-start">
632
+ <i class="fas fa-check-circle text-red-500 mt-1 mr-2"></i>
633
+ <span>Espaço reduzido (especialmente em crianças)</span>
634
+ </li>
635
+ </ul>
636
+ </div>
637
  </div>
638
  </div>
 
 
 
 
639
  </div>
640
  <div class="slide-number">8/40</div>
641
  </div>
642
 
643
  <!-- Slide 9: Cuidados Pós-Operatórios -->
644
  <div class="slide bg-gradient-to-br from-blue-50 to-green-50">
645
+ <div class="max-w-6xl mx-auto h-full flex flex-col justify-center">
646
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
647
  <i class="fas fa-hospital-user mr-3 text-blue-500"></i>Cuidados Pós-Operatórios
648
  </h2>
649
 
650
  <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
651
+ <div class="bg-white p-4 rounded-lg shadow-md">
652
+ <h3 class="font-semibold text-blue-700 mb-3 border-b pb-2 flex items-center">
653
+ <i class="fas fa-procedures mr-2"></i>UTI (1-3 dias)
654
  </h3>
655
  <ul class="text-gray-700 text-sm space-y-2">
656
+ <li class="flex items-start">
657
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
658
+ <span>Monitorização hemodinâmica invasiva</span>
659
+ </li>
660
+ <li class="flex items-start">
661
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
662
+ <span>Ventilação mecânica (12-24h)</span>
663
+ </li>
664
+ <li class="flex items-start">
665
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
666
+ <span>Controle hídrico rigoroso</span>
667
+ </li>
668
+ <li class="flex items-start">
669
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
670
+ <span>Monitorização da função do enxerto</span>
671
+ </li>
672
+ <li class="flex items-start">
673
+ <i class="fas fa-check-circle text-blue-500 mt-1 mr-2"></i>
674
+ <span>Profilaxia de infecções (antibióticos, antifúngicos)</span>
675
+ </li>
676
  </ul>
677
  </div>
678
 
679
+ <div class="bg-white p-4 rounded-lg shadow-md">
680
+ <h3 class="font-semibold text-green-700 mb-3 border-b pb-2 flex items-center">
681
  <i class="fas fa-pills mr-2"></i>Imunossupressão
682
  </h3>
683
  <ul class="text-gray-700 text-sm space-y-2">
684
+ <li class="flex items-start">
685
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
686
+ <span>Esquema triplo inicial (tacrolimus, MMF, corticóide)</span>
687
+ </li>
688
+ <li class="flex items-start">
689
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
690
+ <span>Níveis alvo de tacrolimus: 8-12 ng/mL (inicial)</span>
691
+ </li>
692
+ <li class="flex items-start">
693
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
694
+ <span>Redução progressiva de corticóide (3-6 meses)</span>
695
+ </li>
696
+ <li class="flex items-start">
697
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
698
+ <span>Monitorização de efeitos adversos (nefrotoxicidade, DM)</span>
699
+ </li>
700
+ <li class="flex items-start">
701
+ <i class="fas fa-check-circle text-green-500 mt-1 mr-2"></i>
702
+ <span>Profilaxia para CMV (valganciclovir em risco alto)</span>
703
+ </li>
704
  </ul>
705
  </div>
706
 
707
+ <div class="bg-white p-4 rounded-lg shadow-md">
708
+ <h3 class="font-semibold text-purple-700 mb-3 border-b pb-2 flex items-center">
709
  <i class="fas fa-chart-line mr-2"></i>Monitorização
710
  </h3>
711
  <ul class="text-gray-700 text-sm space-y-2">
712
+ <li class="flex items-start">
713
+ <i class="fas fa-check-circle text-purple-500 mt-1 mr-2"></i>
714
+ <span>Função hepática diária (TGO, TGP, bilirrubinas)</span>
715
+ </li>
716
+ <li class="flex items-start">
717
+ <i class="fas fa-check-circle text-purple-500 mt-1 mr-2"></i>
718
+ <span>Ultrassom com Doppler (fluxo vascular)</span>
719
+ </li>
720
+ <li class="flex items-start">
721
+ <i class="fas fa-check-circle text-purple-500 mt-1 mr-2"></i>
722
+ <span>Biópsia hepática (se disfunção do enxerto)</span>
723
+ </li>
724
+ <li class="flex items-start">
725
+ <i class="fas fa-check-circle text-purple-500 mt-1 mr-2"></i>
726
+ <span>Níveis de imunossupressores</span>
727
+ </li>
728
+ <li class="flex items-start">
729
+ <i class="fas fa-check-circle text-purple-500 mt-1 mr-2"></i>
730
+ <span>Marcadores de infecção (PCR, leucócitos)</span>
731
+ </li>
732
  </ul>
733
  </div>
734
  </div>
735
 
736
  <div class="bg-white p-4 rounded-lg shadow-md">
737
+ <h3 class="font-semibold text-red-700 mb-3 border-b pb-2 flex items-center">
738
+ <i class="fas fa-exclamation-triangle mr-2"></i>Complicações Precoces (≤30 dias)
739
  </h3>
740
+ <div class="grid grid-cols-2 md:grid-cols-5 gap-2">
741
+ <div class="bg-red-100 text-red-800 p-2 rounded text-center text-sm">
742
+ <i class="fas fa-tint block text-xl mb-1"></i>
743
+ Hemorragia (15-20%)
744
+ </div>
745
+ <div class="bg-red-100 text-red-800 p-2 rounded text-center text-sm">
746
+ <i class="fas fa-heartbeat block text-xl mb-1"></i>
747
+ Trombose vascular (5-10%)
748
+ </div>
749
+ <div class="bg-red-100 text-red-800 p-2 rounded text-center text-sm">
750
+ <i class="fas fa-liver block text-xl mb-1"></i>
751
+ Disfunção primária (5-15%)
752
+ </div>
753
+ <div class="bg-red-100 text-red-800 p-2 rounded text-center text-sm">
754
+ <i class="fas fa-bug block text-xl mb-1"></i>
755
+ Infecções (20-30%)
756
+ </div>
757
+ <div class="bg-red-100 text-red-800 p-2 rounded text-center text-sm">
758
+ <i class="fas fa-allergies block text-xl mb-1"></i>
759
+ Rejeição aguda (10-20%)
760
+ </div>
761
  </div>
762
  </div>
763
  </div>
 
766
 
767
  <!-- Slide 10: Follow-up -->
768
  <div class="slide bg-white">
769
+ <div class="max-w-6xl mx-auto h-full flex flex-col justify-center">
770
  <h2 class="text-3xl font-bold text-blue-800 mb-6 border-b-2 border-blue-200 pb-2 flex items-center">
771
  <i class="fas fa-calendar-check mr-3 text-blue-500"></i>Follow-up Pós-Transplante
772
  </h2>
 
775
  <div>
776
  <h3 class="font-semibold text-green-700 mb-3">Primeiro Ano:</h3>
777
  <div class="space-y-4">
778
+ <div class="flex items-start bg-blue-50 p-3 rounded-lg">
779
+ <div class="bg-blue-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">1</div>
780
  <div>
781
+ <p class="font-medium">1ª Semana: Consultas diárias</p>
782
+ <p class="text-gray-600 text-xs">Avaliação clínica, laboratorial e ajuste de medicações</p>
783
  </div>
784
  </div>
785
+ <div class="flex items-start bg-green-50 p-3 rounded-lg">
786
+ <div class="bg-green-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">2</div>
787
  <div>
788
+ <p class="font-medium">1º Mês: Consultas semanais</p>
789
+ <p class="text-gray-600 text-xs">Monitorização de função hepática e imunossupressão</p>
790
  </div>
791
  </div>
792
+ <div class="flex items-start bg-purple-50 p-3 rounded-lg">
793
+ <div class="bg-purple-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">3</div>
794
  <div>
795
+ <p class="font-medium">1º Trimestre: Consultas quinzenais</p>
796
+ <p class="text-gray-600 text-xs">Redução progressiva de imunossupressão</p>
797
+ </div>
798
+ </div>
799
+ <div class="flex items-start bg-yellow-50 p-3 rounded-lg">
800
+ <div class="bg-yellow-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">4</div>
801
+ <div>
802
+ <p class="font-medium">1º Ano: Consultas mensais</p>
803
+ <p class="text-gray-600 text-xs">Estabilização do esquema imunossupressor</p>
804
  </div>
805
  </div>
806
  </div>
807
  </div>
808
 
809
  <div>
810
+ <h3 class="font-semibold text-purple-700 mb-3">Longo Prazo (>1 ano):</h3>
811
  <div class="space-y-4">
812
+ <div class="flex items-start bg-blue-50 p-3 rounded-lg">
813
+ <div class="bg-blue-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">1</div>
814
  <div>
815
  <p class="font-medium">Consultas trimestrais</p>
816
+ <p class="text-gray-600 text-xs">Avaliação clínica e laboratorial</p>
817
+ </div>
818
+ </div>
819
+ <div class="flex items-start bg-green-50 p-3 rounded-lg">
820
+ <div class="bg-green-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">2</div>
821
+ <div>
822
+ <p class="font-medium">Exames anuais</p>
823
+ <p class="text-gray-600 text-xs">Imagem, densitometria, colonoscopia</p>
824
  </div>
825
  </div>
826
+ <div class="flex items-start bg-purple-50 p-3 rounded-lg">
827
+ <div class="bg-purple-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">3</div>
828
  <div>
829
+ <p class="font-medium">Monitorização de comorbidades</p>
830
+ <p class="text-gray-600 text-xs">Hipertensão, diabetes, dislipidemia</p>
831
  </div>
832
  </div>
833
+ <div class="flex items-start bg-yellow-50 p-3 rounded-lg">
834
+ <div class="bg-yellow-500 text-white rounded-full w-8 h-8 flex items-center justify-center flex-shrink-0 mr-3 text-sm font-bold">4</div>
835
  <div>
836
+ <p class="font-medium">Avaliação de qualidade de vida</p>
837
+ <p class="text-gray-600 text-xs">Retorno às atividades, saúde mental</p>
838
  </div>
839
  </div>
840
  </div>
 
843
 
844
  <div class="bg-yellow-50 p-4 rounded-lg border-l-4 border-yellow-400 mt-6">
845
  <h3 class="font-semibold text-yellow-800 mb-2 flex items-center">
846
+ <i class="fas fa-exclamation-circle mr-2"></i>Complicações Tardias (>30 dias)
847
  </h3>
848
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-2">
849
+ <div class="bg-yellow-100 text-yellow-800 p-2 rounded text-center text-sm">
850
+ <i class="fas fa-allergies block text-xl mb-1"></i>
851
+ Rejeição crônica (5-10%)
852
+ </div>
853
+ <div class="bg-yellow-100 text-yellow-800 p-2 rounded text-center text-sm">
854
+ <i class="fas fa-liver block text-xl mb-1"></i>
855
+ Recidiva da doença (varia)
856
+ </div>
857
+ <div class="bg-yellow-100 text-yellow-800 p-2 rounded text-center text-sm">
858
+ <i class="fas fa-pills block text-xl mb-1"></i>
859
+ Efeitos adversos (30-50%)
860
+ </div>
861
+ <div class="bg-yellow-100 text-yellow-800 p-2 rounded text-center text-sm">
862
+ <i class="fas fa-tumor block text-xl mb-1"></i>
863
+ Neoplasias (5-15%)
864
+ </div>
865
  </div>
866
  </div>
867
  </div>
prompts.txt CHANGED
@@ -1 +1,2 @@
1
- /Users/cyrofranklin/Desktop/Protocolo Tx Hepatico HUWC-Hsc.docx elabore uma apresentação de slides (40) usando como referencia este arquivo
 
 
1
+ /Users/cyrofranklin/Desktop/Protocolo Tx Hepatico HUWC-Hsc.docx elabore uma apresentação de slides (40) usando como referencia este arquivo
2
+ /Users/cyrofranklin/Desktop/Protocolo Tx Hepatico HUWC-Hsc.docx Elabore uma apresentação de slides (40 slides) sobre o tema deste arquivo. faça slides bem ilustrativos com tabelas, gráficos, fluxogramas e imagens