function Notices({ onBack }) {
  const items = [
    { t: 'Pintura da fachada começa segunda', d: 'O serviço deve durar 18 dias úteis. Pedimos atenção redobrada na chegada ao prédio.', tag: 'Obra', when: 'Hoje, 09:12' },
    { t: 'Nova catraca biométrica', d: 'A partir do dia 15, o acesso será exclusivamente por biometria. Faça o cadastro na portaria.', tag: 'Segurança', when: 'Ontem' },
    { t: 'Assembleia ordinária · 24/jun', d: 'Pauta: aprovação do balancete 2025 e eleição do conselho fiscal.', tag: 'Assembleia', when: '3 dias' }
  ];
  return (
    <div style={{ height: '100%', overflowY: 'auto', background: '#fff', paddingBottom: 80 }}>
      <div style={{ padding: '20px 24px', display: 'flex', alignItems: 'center', gap: 12 }}>
        <button onClick={onBack} style={{ background: 'transparent', border: 'none', cursor: 'pointer', color: '#1B2D70', fontFamily: 'Saira', fontSize: 22 }}>←</button>
        <div style={{ fontFamily: 'Inter', fontSize: 14, fontWeight: 600, color: '#1B2D70' }}>Comunicados</div>
      </div>
      <div style={{ padding: '0 24px' }}>
        <h1 style={{ fontFamily: 'Saira', fontWeight: 400, fontSize: 32, color: '#1B2D70', margin: '8px 0 4px', letterSpacing: '-0.02em' }}>Do síndico, para você.</h1>
        <div style={{ fontFamily: 'Inter', fontSize: 13, color: '#6C6C78', marginBottom: 24 }}>3 novos · 8 no total</div>
        {items.map((n, i) => (
          <div key={i} style={{ padding: '20px 0', borderTop: '1px solid #ECECEF' }}>
            <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
              <span style={{ background: '#EEF1FA', color: '#1B2D70', fontFamily: 'Inter', fontSize: 10, fontWeight: 600, padding: '4px 10px', borderRadius: 2, textTransform: 'uppercase', letterSpacing: '0.06em' }}>{n.tag}</span>
              <span style={{ fontFamily: 'Inter', fontSize: 11, color: '#8C8C99' }}>{n.when}</span>
            </div>
            <div style={{ fontFamily: 'Saira', fontSize: 18, fontWeight: 500, color: '#1B2D70', marginTop: 10 }}>{n.t}</div>
            <div style={{ fontFamily: 'Inter', fontSize: 14, color: '#4B4B55', lineHeight: 1.55, marginTop: 4 }}>{n.d}</div>
          </div>
        ))}
      </div>
    </div>
  );
}
window.SemogNotices = Notices;