Dashed outlines around contextual region should only appear upon hover/focus of the pencil icon or links [#1914976]

Problem/Motivation

In Drupal 7, the dashed outlines appear only when hovering the contextual gear or its links.

In the current D8 HEAD, the dashed outlines appear as soon as you hover anywhere in the region. This was introduced in #849926: links wrapped in .contextual-links-wrapper divs are not accessible at all via keyboard alone also problems with screen readers, which aimed to solve a11y, which it did, but at the same time introduced this regression without approval of the usability folks.

As of #1874664: Introduce toolbar level "Edit" mode that shows all contextual links, the dashed outlines will appear for all contextual regions at once as soon as you enable edit mode.

Bojhan felt this was too intrusive/overwhelming.

Proposed resolution

As a temporary measure, #1874664: Introduce toolbar level "Edit" mode that shows all contextual links removes those dashed outlines, because Bojhan felt that they were too intrusive. However, showing them only on hover (as he proposes), is also problematic, because 1) that does not work when tabbing, 2) it does not work on touch devices.
A potential work-around for that is to also show them on focus.

A related consideration is that, on mobile, the dashed outlines will likely often be at the edge of the screen, thus be less visible.

In this issue, we will try to come up with the best possible solution.