.character-filter {
    .filter__menu {
        position: absolute;
        inset: unset;
        left: 7%;
        top: 47rem;
        padding: 0.5rem;

        .character-filter--form {
            display: grid;
            grid-template-columns: 1fr 2rem 1fr;
            grid-template-rows: auto auto;
            gap: 1rem;

            .filter__delimiter {
                display: grid;
                place-items: center;
                color: var(--versus-sign, purple);

                > svg {
                    position: absolute;
                    width: 4rem;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -100%);
                }
            }

            .button {
                grid-column: 1 / span 3;
                justify-self: center;
                width: 8rem;
            }
        }
    }
}