{/* Header */}

{isTermos ? 'Documento legal' : 'LGPD · Lei 13.709/2018'}

{titulo}

{/* Conteúdo */}

{isTermos ? : }

{/* Rodapé */}

{!lido && (

↓ Role até o final para confirmar a leitura

)}

); } function SecaoDoc({ titulo, children }) { return (

{titulo}

{children}

); } function ConteudoTermos() { return (

Última atualização: Abril de 2026 · Versão 1.0

Ao acessar ou utilizar o Hematolog.IA, você concorda com estes Termos de Uso. Se não concordar com qualquer parte, não utilize o serviço. O uso continuado após alterações constitui aceitação das novas condições. O Hematolog.IA é uma plataforma de apoio diagnóstico hematológico baseada em inteligência artificial, destinada exclusivamente a profissionais de saúde habilitados (biomédicos, hematologistas, analistas clínicos).

⚠ O serviço é uma ferramenta de apoio e segunda opinião. Não substitui o julgamento clínico profissional nem laudos oficiais. O acesso é restrito a profissionais de saúde com registro válido no CRBM, CRM ou conselho equivalente. Ao se cadastrar, você declara possuir habilitação profissional e ser responsável pelo uso das informações geradas pela plataforma. Você pode utilizar o Hematolog.IA para: (i) análise de esfregaços sanguíneos; (ii) consulta à assistente Hema; (iii) participação na comunidade profissional; (iv) exportação de laudos para fins clínicos. É vedado qualquer uso para fins não clínicos, comercialização de dados ou acesso automatizado sem autorização. Imagens, casos clínicos e informações publicadas na comunidade são de responsabilidade exclusiva do usuário que as publicou. O Hematolog.IA não se responsabiliza por diagnósticos baseados exclusivamente nas sugestões da IA. Toda decisão clínica deve ser validada pelo profissional responsável. Todo o conteúdo da plataforma (interface, algoritmos, marca, textos) é de propriedade do Hematolog.IA. O conteúdo gerado pelo usuário (posts, comentários, imagens) permanece de sua propriedade, sendo concedida licença de uso à plataforma para exibição na comunidade. O plano Pro é cobrado mensalmente ou anualmente conforme contratado. O cancelamento pode ser realizado a qualquer momento sem multa, com acesso mantido até o fim do período pago. Não há reembolso de períodos parciais, exceto conforme o Código de Defesa do Consumidor (Lei 8.078/90). O Hematolog.IA não garante que os resultados da IA sejam livres de erros. A plataforma não se responsabiliza por danos decorrentes do uso indevido das análises geradas. O usuário assume integral responsabilidade pelas decisões clínicas tomadas com base nas sugestões da plataforma. Reservamo-nos o direito de modificar, suspender ou encerrar o serviço a qualquer momento, com aviso prévio de 30 dias para usuários ativos. Alterações materiais nos termos serão comunicadas por e-mail. Estes termos são regidos pelas leis brasileiras. Fica eleito o foro da Comarca de São Paulo/SP para dirimir quaisquer controvérsias, com renúncia expressa a qualquer outro, por mais privilegiado que seja.

Dúvidas? Contato: juridico@hematologia.app

); } function ConteudoLGPD() { return (

Última atualização: Abril de 2026 · Lei 13.709/2018

O Hematolog.IA, CNPJ XX.XXX.XXX/0001-XX, é o controlador dos dados pessoais coletados nesta plataforma, conforme a Lei Geral de Proteção de Dados (LGPD — Lei 13.709/2018). Encarregado (DPO): dpo@hematologia.app Dados de identificação: nome completo, e-mail, registro profissional (CRBM/CRM), estado, especialidade.

Dados de uso: imagens enviadas para análise, histórico de análises, conversas com a Hema, posts e comentários na comunidade.

Dados técnicos: endereço IP, tipo de dispositivo, logs de acesso.

⚠ Imagens de esfregaços devem ser anonimizadas antes do upload. Não envie imagens que identifiquem diretamente o paciente. Seus dados são tratados para: (i) prestação do serviço contratado — base legal: execução de contrato (Art. 7º, V); (ii) melhoria dos algoritmos de IA — base legal: legítimo interesse, com dados anonimizados (Art. 7º, IX); (iii) comunicações sobre o serviço — base legal: legítimo interesse (Art. 7º, IX); (iv) cumprimento de obrigações legais (Art. 7º, II). Seus dados não são vendidos a terceiros. Podemos compartilhá-los com: (i) Anthropic (processamento das análises de IA, conforme Privacy Policy da Anthropic); (ii) provedores de infraestrutura (AWS/Cloudflare, com contrato de proteção de dados); (iii) autoridades quando exigido por lei. Dados de conta: mantidos enquanto a conta estiver ativa + 5 anos após encerramento (obrigação legal). Imagens de análise: 2 anos ou até solicitação de exclusão. Logs de acesso: 6 meses (Marco Civil da Internet). Você tem direito a: confirmar a existência de tratamento · acessar seus dados · corrigir dados incompletos · anonimizar ou bloquear dados desnecessários · portabilidade · excluir dados tratados com consentimento · revogar consentimento · ser informado sobre compartilhamentos.

Para exercer seus direitos: privacidade@hematologia.app ou pelo menu Perfil → Privacidade LGPD no app. Adotamos medidas técnicas e organizacionais para proteger seus dados: criptografia em trânsito (TLS 1.3) e em repouso (AES-256), controle de acesso por função, backups criptografados, logs de auditoria e política de senhas fortes. Em caso de incidente, notificaremos a ANPD e os titulares afetados no prazo legal. Utilizamos apenas cookies estritamente necessários para autenticação e segurança. Não utilizamos cookies de rastreamento, publicidade ou analytics de terceiros. O processamento de imagens pelo modelo de IA (Anthropic) pode envolver transferência internacional de dados anonimizados para os EUA. A Anthropic adota cláusulas contratuais padrão compatíveis com a LGPD. DPO/Encarregado: dpo@hematologia.app
Você pode também registrar reclamações na ANPD (anpd.gov.br).

Este documento foi elaborado em conformidade com a Lei 13.709/2018 (LGPD), o Marco Civil da Internet (Lei 12.965/2014) e as diretrizes da ANPD.

); } // ────────────────────────────────────────────────── // LOGIN SCREEN // ────────────────────────────────────────────────── function LoginScreen({ onLogin, onCriarConta, onRecuperarSenha }) { const [crbio, setCrbio] = React.useState(''); const [email, setEmail] = React.useState(''); const [password, setPassword] = React.useState(''); const [focus, setFocus] = React.useState(null); const [loading, setLoading] = React.useState(false); const [error, setError] = React.useState(null); const [termos, setTermos] = React.useState(false); const [modalDoc, setModalDoc] = React.useState(null); // null | 'termos' | 'lgpd' const field = (label, val, setter, key, type = 'text', placeholder = '') => (

{label}

{ setter(e.target.value); setError(null); }} onFocus={() => setFocus(key)} onBlur={() => setFocus(null)} style={{ width: '100%', boxSizing: 'border-box', background: 'rgba(240,244,248,0.04)', border: `1px solid ${focus === key ? COLORS.redBorder : error ? 'rgba(192,57,43,0.4)' : COLORS.line2}`, borderRadius: 10, padding: '13px 14px', fontFamily: FONT_MONO, fontSize: 13, color: COLORS.white, outline: 'none', transition: 'all 180ms', boxShadow: focus === key ? `0 0 0 3px ${COLORS.redDim}` : 'none', }} />

); const handleLogin = async () => { if (!email.trim() || !password.trim()) { setError('Preencha todos os campos.'); return; } if (!termos) { setError('Aceite os Termos de Uso e a Política de Privacidade para continuar.'); return; } setLoading(true); setError(null); try { const data = await window.HemaAPI.login(crbio, email, password); onLogin(data.user, data.access_token); } catch (e) { setError(e.message || 'Não foi possível conectar ao servidor.'); } finally { setLoading(false); } }; return (

{/* Top half: microscope imagery + app icon */}

{/* App icon centralizado no topo */}

{/* Login form */}

{/* Só o wordmark — sem o ícone H na frente */}

HEMATOLOG.IA

A IA que enxerga o que o olho treina para ver.

{field('Registro profissional', crbio, setCrbio, 'crbio', 'text', 'Ex: CRBM6 1698 · CRM6 12345 · CF-RS 1234')} {field('E-mail', email, setEmail, 'email', 'email', 'seu@email.com')} {field('Senha', password, setPassword, 'pass', 'password', '••••••••')}

{/* Checkbox LGPD */}

setTermos(!termos)} style={{ display: 'flex', alignItems: 'flex-start', gap: 10, cursor: 'pointer', padding: '10px 12px', borderRadius: 10, background: termos ? 'rgba(76,175,124,0.06)' : 'rgba(240,244,248,0.03)', border: `0.5px solid ${termos ? 'rgba(76,175,124,0.3)' : COLORS.line2}`, transition: 'all 200ms', }}>

{termos && ( )}

Li e aceito os{' '} { e.stopPropagation(); setModalDoc('termos'); }} style={{ color: COLORS.white, textDecoration: 'underline', cursor: 'pointer' }} >Termos de Uso {' '}e a{' '} { e.stopPropagation(); setModalDoc('lgpd'); }} style={{ color: COLORS.white, textDecoration: 'underline', cursor: 'pointer' }} >Política de Privacidade (LGPD)

{/* Error message */} {error && (

⚠ {error}

)}

Criar conta Esqueci minha senha

Dados clínicos protegidos · criptografia end-to-end · LGPD

{/* Modal Termos / LGPD */} {modalDoc && ( setModalDoc(null)} /> )}

); } // ══════════════════════════════════════════════════ // SCREEN 2 — HOME / DASHBOARD // ══════════════════════════════════════════════════ const COMMUNITY_PREVIEW = [ { id: 1, seed: 13, author: 'Dra. Marina L.', spec: 'Biomédica · SP', q: 'Possível blasto linfoide? 26a, leucocitose de 42.000...' }, { id: 2, seed: 17, author: 'Carlos M.', spec: 'Analista Clínico · MG', q: 'Corpúsculos de Auer visíveis. Concordam com LMA M3?' }, ]; // ══════════════════════════════════════════════════ // PAINEL DE NOTIFICAÇÕES // ══════════════════════════════════════════════════ function NotificationPanel({ onClose, userId, token }) { const [notifs, setNotifs] = React.useState([]); const [avisos, setAvisos] = React.useState([]); const [loading, setLoading] = React.useState(true); const [aba, setAba] = React.useState('notifs'); // 'notifs' | 'avisos' React.useEffect(() => { const carregar = async () => { setLoading(true); try { // Notificações pessoais if (userId) { const r = await fetch( `${window.HemaAPI.base}/community/notificacoes?usuario_id=${userId}`, token ? { headers: { Authorization: `Bearer ${token}` } } : {} ); if (r.ok) { const d = await r.json(); setNotifs(d.notificacoes || []); } } // Avisos globais const r2 = await fetch(`${window.HemaAPI.base}/community/avisos`); if (r2.ok) { const d2 = await r2.json(); setAvisos(d2); } } catch {} setLoading(false); }; carregar(); }, [userId]); const marcarLidas = async () => { if (!userId) return; try { await fetch( `${window.HemaAPI.base}/community/notificacoes/lidas?usuario_id=${userId}`, { method: 'PATCH', headers: token ? { Authorization: `Bearer ${token}` } : {} } ); setNotifs(prev => prev.map(n => ({ ...n, lida: true }))); } catch {} }; const iconeTipo = (tipo) => { if (tipo === 'comentario_no_post') return '💬'; if (tipo === 'resposta_comentario') return '↩️'; if (tipo === 'reacao_post') return '🔬'; if (tipo === 'analise_pronta') return '✅'; return '🔔'; }; const corAviso = (tipo) => { if (tipo === 'alerta') return { bg: 'rgba(217,146,46,0.1)', border: 'rgba(217,146,46,0.35)', cor: COLORS.amber }; if (tipo === 'novidade') return { bg: 'rgba(76,175,124,0.1)', border: 'rgba(76,175,124,0.35)', cor: COLORS.green }; return { bg: 'rgba(59,126,168,0.1)', border: 'rgba(59,126,168,0.35)', cor: '#5B9ED1' }; }; const tempoRelativo = (iso) => { if (!iso) return ''; const diff = Date.now() - new Date(iso).getTime(); const m = Math.floor(diff / 60000); if (m < 1) return 'agora'; if (m < 60) return `${m}min`; const h = Math.floor(m / 60); if (h < 24) return `${h}h`; return `${Math.floor(h / 24)}d`; }; const naoLidas = notifs.filter(n => !n.lida).length; return (

{/* Header */}

Notificações

{naoLidas > 0 && (

Marcar todas como lidas

)}

{/* Abas */}

{[['notifs', `Atividades${naoLidas > 0 ? ` (${naoLidas})` : ''}`], ['avisos', `Avisos${avisos.length > 0 ? ` (${avisos.length})` : ''}`]].map(([id, label]) => ( ))}

{/* Conteúdo */}

{loading ? (

) : aba === 'notifs' ? ( notifs.length === 0 ? (

🔔

Tudo em dia

Nenhuma notificação por enquanto

) : notifs.map(n => (

{/* Ícone */}

{iconeTipo(n.tipo)}

{/* Texto */}

{n.titulo || 'Nova notificação'}

{tempoRelativo(n.criado_em)}

{n.mensagem && (

{n.mensagem}

)}

{/* Bolinha não lida */} {!n.lida && (

)}

)) ) : ( avisos.length === 0 ? (

📢

Nenhum aviso

A equipe ainda não publicou avisos

) : avisos.map(a => { const { bg, border, cor } = corAviso(a.tipo); return (

{a.tipo === 'alerta' ? '⚠ Alerta' : a.tipo === 'novidade' ? '✨ Novidade' : 'ℹ Info'}

{tempoRelativo(a.criado_em)}

{a.titulo}

{a.mensagem}

Equipe Hematolog.IA

); }) )}

); } function StatusBadge({ status, label }) { const map = { alert: { bg: 'rgba(192,57,43,0.12)', border: COLORS.redBorder, color: COLORS.red, icon: '⚠' }, normal: { bg: 'rgba(76,175,124,0.12)', border: 'rgba(76,175,124,0.35)', color: COLORS.green, icon: '✓' }, review: { bg: 'rgba(59,126,168,0.14)', border: 'rgba(59,126,168,0.4)', color: '#5B9ED1', icon: '◎' }, }; const s = map[status] || map.review; return (

{s.icon} {label}

); } function HomeScreen({ onNavigate, onStartAnalysis, user }) { const [painelAberto, setPainelAberto] = React.useState(false); const [naoLidas, setNaoLidas] = React.useState(0); const [temAviso, setTemAviso] = React.useState(false); const [analises, setAnalises] = React.useState([]); const [communityPosts, setCommunityPosts] = React.useState([]); const userId = user?.id || user?.email || null; const totalBadge = naoLidas + (temAviso ? 1 : 0); React.useEffect(() => { const token = localStorage.getItem('hema_token'); const checarNotifs = async () => { try { if (userId) { const r = await fetch(`${window.HemaAPI.base}/community/notificacoes?usuario_id=${userId}`); if (r.ok) { const d = await r.json(); setNaoLidas(d.total_nao_lidas || 0); } } const r2 = await fetch(`${window.HemaAPI.base}/community/avisos`); if (r2.ok) { const d2 = await r2.json(); setTemAviso(d2.length > 0); } } catch {} }; const carregarAnalises = async () => { if (!token) return; try { const r = await fetch(`${window.HemaAPI.base}/analysis/historico?limit=4`, { headers: { 'Authorization': `Bearer ${token}` } }); if (r.ok) { const d = await r.json(); setAnalises(d.analises || []); } } catch {} }; const carregarComunidade = async () => { try { const r = await fetch(`${window.HemaAPI.base}/community/posts?limit=2&secao=recente`); if (r.ok) { const d = await r.json(); const posts = (d.posts || d).slice(0, 2).map((p, i) => ({ id: p.id, seed: (i * 7 + 13) % 30 + 1, author: p.autor_nome || 'Usuário', spec: p.autor_crbio || 'Biomédico', q: p.caption, })); setCommunityPosts(posts); } } catch {} }; checarNotifs(); carregarAnalises(); carregarComunidade(); const interval = setInterval(checarNotifs, 30000); return () => clearInterval(interval); }, [userId]); // Formata análise do banco para o card const formatarAnalise = (a, i) => { const status = a.celulas_atipicas ? 'alert' : a.blastos_pct > 0 ? 'review' : 'normal'; const label = a.celulas_atipicas ? 'Células atípicas' : a.blastos_pct > 0 ? `Blastos ${a.blastos_pct}%` : 'Normal'; const data = a.criado_em ? new Date(a.criado_em).toLocaleDateString('pt-BR', { day:'2-digit', month:'short' }) + ' · ' + new Date(a.criado_em).toLocaleTimeString('pt-BR', { hour:'2-digit', minute:'2-digit' }) : '—'; return { id: a.id, seed: (i * 7 + 3) % 30 + 1, date: data, status, label, count: `${a.total_celulas || 0} células · ${a.blastos_pct || 0}%` }; }; const [analiseAberta, setAnaliseAberta] = React.useState(null); const [loadingAnalise, setLoadingAnalise] = React.useState(false); const [fotoExpandida, setFotoExpandida] = React.useState(false); const abrirAnalise = async (id) => { setLoadingAnalise(true); const token = localStorage.getItem('hema_token'); try { const r = await fetch(`${window.HemaAPI.base}/analysis/${id}`, { headers: { 'Authorization': `Bearer ${token}` } }); if (r.ok) setAnaliseAberta(await r.json()); } catch {} setLoadingAnalise(false); }; const initials = user?.name ? user.name.split(' ').filter(Boolean).map(w => w[0]).slice(0, 2).join('') : 'RS'; const displayName = user?.name || user?.nome || 'Profissional'; const crbio = user?.crbio || ''; const fotoLocal = localStorage.getItem('hema_foto'); return ( <>

{/* Header */}

{fotoLocal ?

: initials }

{displayName}

{user?.specialty?.toUpperCase() || 'BIOMÉDICO'} · {crbio}

setPainelAberto(true)} style={{ position: 'relative', cursor: 'pointer', padding: 4 }}> {totalBadge > 0 && (

{totalBadge > 9 ? '9+' : totalBadge}

)}

{/* Painel de notificações (sobrepõe a home) */} {painelAberto && ( { setPainelAberto(false); setNaoLidas(0); }} userId={userId} token={null} /> )} {/* Hero analysis card */}

IA pronta · 0.8s

Analisar nova amostra

Envie uma foto do esfregaço e receba análise de blastos em segundos.

{['Câmera', 'Galeria', 'DICOM'].map(opt => (

{opt}

))}

{/* Recent analyses */}

· Últimas análises

onNavigate('analyze')} style={{ fontFamily: FONT_MONO, fontSize: 10, color: COLORS.red, letterSpacing: 0.6, cursor: 'pointer' }}>Ver histórico →

{analises.length === 0 ? (

Nenhuma análise realizada ainda

onNavigate('analyze')} style={{ fontFamily: FONT_MONO, fontSize: 10, color: COLORS.red, marginTop: 8, cursor: 'pointer' }}>Fazer primeira análise →

) : (

{analises.map((a, i) => { const fmt = formatarAnalise(a, i); return (

abrirAnalise(a.id)} style={{ flexShrink: 0, width: 168, background: COLORS.bg2, border: `0.5px solid ${COLORS.line2}`, borderRadius: 14, overflow: 'hidden', cursor: 'pointer' }}>

{a.celulas_atipicas && (

⚠ ATÍPICO

)}

{fmt.count}

{fmt.date}

); })}

)}

{/* Community preview */}

· Comunidade

onNavigate('community')} style={{ fontFamily: FONT_MONO, fontSize: 10, color: COLORS.red, letterSpacing: 0.6, cursor: 'pointer', }}>Ver comunidade →

{(communityPosts.length > 0 ? communityPosts : []).map(p => (

onNavigate('community')} style={{ display: 'flex', gap: 12, alignItems: 'center', background: COLORS.bg2, border: `0.5px solid ${COLORS.line2}`, borderRadius: 12, padding: 10, cursor: 'pointer', }}>

{p.author}

{p.spec}

{p.q}

))} {communityPosts.length === 0 && (

onNavigate('community')} style={{ background: COLORS.bg2, border: `0.5px solid ${COLORS.line2}`, borderRadius: 12, padding: 14, textAlign: 'center', cursor: 'pointer', }}>

Seja o primeiro a postar!

Abrir comunidade →

)}

{/* AI tip */}

Sabia que · dica da IA

Blastos linfoides × mieloides: a relação núcleo/citoplasma e a presença de bastonetes de Auer são os critérios visuais decisivos.

{/* Modal análise completa */} {(analiseAberta || loadingAnalise) && (

· Análise completa

Laudo Hematológico

{loadingAnalise && (

)} {analiseAberta && !loadingAnalise && (

{analiseAberta.imagem_url && (

setFotoExpandida(true)}>

EXPANDIR

)} {fotoExpandida && analiseAberta?.imagem_url && (

setFotoExpandida(false)} style={{ position: 'fixed', inset: 0, zIndex: 500, background: 'rgba(0,0,0,0.95)', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>

✕ Fechar

)}

{analiseAberta.celulas_atipicas_detectadas ? '⚠ Atenção clínica' : '✓ Dentro do esperado'}

{analiseAberta.suspeita_diagnostica}

{analiseAberta.recomendacao &&

{analiseAberta.recomendacao}

}

{[{ n: analiseAberta.total_celulas_analisadas, l: 'Células' }, { n: `${analiseAberta.confianca_percent}%`, l: 'Confiança' }, { n: `${analiseAberta.blastos_pct}%`, l: 'Blastos' }].map((s, i) => (

{s.n}

{s.l}

))}

{analiseAberta.laudo_resumido && (

Laudo completo

{analiseAberta.laudo_resumido}

)}

{analiseAberta.criado_em ? new Date(analiseAberta.criado_em).toLocaleString('pt-BR') : ''}

)}

); } window.HemaScreens = { LoginScreen, HomeScreen, StatusBadge };