Single-canvas juggling (#15)

This PR adds a `CanvasProviderElement` to `@storyteller/studio-web` to manage
the complexity of maintaining a single concrete `HTMLCanvasElement` for
`@storyteller/studio`, while still being able to treat components like the
`ViewerElement` as self-contained "views" that behave as expected with regards
to CSS styling, DOM placement, etc.

Consuming applications should wrap the new `<sts-canvas-provider />` element
around some common ancestor of all views into the `@storyteller/studio` app,
similar to a React context provider.

The `react-frontend` application has been updated to take advantage of the new
`CanvasProviderElement` by demonstrating a more realistic use case for the
`ViewerElement`. The new demo presents a grid of "thumbnails," one for each
object in our hard-coded "object library." Clicking on one of these thumbnails
will render a `ViewerElement` for that object in a modal dialog.

studio-frontend/src/app/app.element.scss

@@ -32,13 +32,14 @@
 	font-size: 16px;
 	padding: 10px 12px;
 	pointer-events: auto;
+	outline: 0 solid transparent;
 
 	// TODO: Copypasta
 	background: #0006;
 	color: #FFFC;
 	backdrop-filter: blur(16px);
 	transition: {
-		property: background, color;
+		property: background, color, outline-width, outline-color;
 		duration: 0.1s;
 		timing-function: linear;
 	}
@@ -62,6 +63,11 @@
 		color: #FFF;
 	}
 
+	&:has(:focus-visible) {
+		z-index: 1;
+		outline: 4px solid #2F83FFBF;
+	}
+
 	&:has(:checked) {
 		background: #7A2C34E3;
 		color: #FFF;