Event Loop - Task and microtask queues

Question

const promise = new Promise(function(resolve, reject) {
    console.log("Promise callback");
    resolve();`enter code here`
}).then(function(result) {
    console.log("Promise callback (.then)");
});

setTimeout(function() {
    console.log("event-loop cycle: Promise (fulfilled)", promise)
}, 0);

console.log("Promise (pending)", promise);

Console is as follows - Promise callback Promise (pending) Promise {} Promise callback (.then) event-loop cycle: Promise (fulfilled) Promise {}

Why does "Promise (pending) Promise {}" is logged after "Promise callback"