Add a desktop override mixin

On level 1 sites we often need to style on top of some truly gnarly existing CSS. This mixin helps overcome extreme speficicity while otherwise allowing us to maintain our normal CSS standards. It also avoids the temptation to use !important for this purpose, keeping it in reserve for when it’s really necessary.

Status: **Ready to merge**

Reviewers: **@kpeatt @jeffkamo @tedtate **

## Changes
- Adds a new (re-written) version of the experimental desktop-override mixin, now called **style-override**. This version was developed after running into limitations with the old version on an actual client project.
- This version is simpler (relying on the ability to chain the same id selector to itself as many times as needed).
- It also works in more scenarios, being able to style any element within `<body>`, not just within `<div id="x-root">`.
- The only requirement is a consistent id attribute of `!` on the `<head>` tag across all pages: `<head id="!">`. This id was chosen to be short (since it’s prepended `n` times to every selector) and obscure (it’s a special character and must be escaped for use in CSS or JS).

## How to test-drive this PR
- Check out this branch and run grunt in the root dir, then open the test html file and review the test for this mixin.