Unicode char has odd gap when rendered in view

Question

I am using the following code to show a playing card. Not sure why there is a large gap at the top.

This is on iOS 15.4

var body: some View {
    Text(String(Character(unicodeScalarLiteral: "\u{1F0A1}")))
        .font(.system(size: size))
        .foregroundColor(.red)
}

Compare to how this smiley is displayed:

Answer 1

This is how this symbol layout within glyph box (pay attention on its position relative to base line):

and here is for comparison of Latin A:

and really if both in one Text

Probably you just need different symbol/image, or try to use some manual workaround like

    Text("\u{1F0A1}")
            .baselineOffset(20)