Fix class name of the read marker on MessagePanel (#10745)

* Optimize mx_RoomView_myReadMarker

- Replace the compound selector with a type selector
- Nest the type selector in "mx_RoomView_myReadMarker_container"

* Conform the style rules to the naming policy

Including "container" in a class name is redundant as our naming policy tells that a string followed by an underscore (_) represents a container if it contains an element.

* Run prettier

* Replace `mx_RoomView_myReadMarker hr` with `mx_RoomView_myReadMarker`

- Remove a unit
- Hide hr's parent (mx_RoomView_myReadMarker) on Percy snapshots

* Change the class name from `mx_RoomView_myReadMarker` to `mx_MessagePanel_myReadMarker`

The read marker is specified on MessagePanel.tsx, and should be named so to avoid confusion.

- Create _MessagePanel.pcss for the style rules of MessagePanel

* Update permalinks.spec.ts

res/css/structures/_RoomView.pcss

@@ -197,26 +197,6 @@ limitations under the License.
     }
 }
 
-li.mx_RoomView_myReadMarker_container {
-    height: 0px;
-    margin: 0px;
-    padding: 0px;
-    border: 0px;
-}
-
-hr.mx_RoomView_myReadMarker {
-    border-top: solid 1px $accent;
-    border-bottom: solid 1px $accent;
-    margin-top: 0px;
-    position: relative;
-    top: -1px;
-    z-index: 1;
-    will-change: width;
-    transition: width 400ms easeinsine 1s, opacity 400ms easeinsine 1s;
-    width: 99%;
-    opacity: 1;
-}
-
 /* Rooms with immersive content */
 .mx_RoomView_immersive .mx_RoomHeader_wrapper {
     border: unset;