Create CSS and XPath selector guidance

[hawkeyexl]

We need to provide guidance to users on how to choose/define/specify selectors for various Doc Detective actions (including find and click among others).

We need two new pages for selector guidance: One page for CSS selectors (which most people should use) and one page for XPath selectors (which are available but more complicated).

Here's some guidance on finding CSS selectors from the Doc Detective Discord:

One of the most useful things I've come across is to key into unique attributes, not just IDs.

If there's only one of your element, you can just specify the element itself, like `input`.

If your target element has an `id` attribute of `:r3:`, you can use a selector of `#:r3:` because CSS selectors work with `id` attribute specifically.

If you have a class of `MuiInputBase-input`, you could do something like `.MuiInputBase-input`, but classes are designed to be shared, so they're generally bad for unique selectors. 

If you don't have a unique `id`, you can use custom attributes, which is what you're engineer teams probably use for testing. For example, if there's a `type` attribute set to `password`, you can use a selector of `[type="password"]`. As long as the attribute value is unique, you're good to go.

If you don't have a single unique attribute/ID/class but have a unique combination, you can string them together like `input[type="password"]` to specifically find an `input` element with a `type` of `password`. This is all based on the CSS selector standard, so nothing specific to Doc Detective.