Why does Prettier keep double indent my code

Question

Sorry I understand Prettier is opinionated, but I was just hoping someone could explain to me the weird indenting it keeps adding to my CSS.

Here's my code block before formatting

    .scan-control-block>button {
        min-width: 100px;
        color: var(--purple);
        border-radius: 32px;
        padding-left: 16px;
        padding-right: 16px;
        border: 1px solid var(--purple);
        background: var(--white);
        appearance: none;
    }

Here's what it does after. No matter what I do it keeps adding extra indents. But I don't understand why?

.scan-control-block>button {
    min-width: 100px;
        color: var(--purple);
        border-radius: 32px;
    padding-left: 16px;
    padding-right: 16px;
    border: 1px solid var(--purple);
        background: var(--white);
    appearance: none;
}