Give the component what the app shell was providing

The component built and typechecked in the previous commit, but only because
nothing had rendered it. Everything Element Call needs that `src/main.tsx`
side-loads was missing from it.

Its stylesheet: only main.tsx imported index.css, so the library build emitted
CSS-module styles with every `--cpd-*` and `--font-size-*` unresolved. Split
into base.css, which both the app and the component import, and the rules that
are about owning a page, which only the app does. The split is a straight move
— comment-stripped and sorted, the old file and the two new ones differ by
exactly one line — and that line is the deliberate part: `.no-scroll-body`
becomes `body.no-scroll-body`. Element Call adds that class to whatever it
treats as its root, and since the root can now be a container, `position:
fixed` would have taken that container out of the host's layout. Pinning the
page is what it always meant.

Its translations: `initializeElementCall` called `i18n.init` with neither
resources nor a backend, so every key would have rendered as itself. English is
bundled in. The app fetches locale files from URLs its own build emits, which a
host serving the library from somewhere else could not resolve, so how a host
picks a language is left open.

And the types a host needs: `HostBridge` alone is not enough to implement
`HostBridge` — `HostRequest`, `DeviceMuteState`, `DeviceMuteRequest` and
`JoinCallData` all appear in its signatures, and `ConfigOptions` in
`initializeElementCall`'s.

component/ElementCall.module.css

@@ -22,3 +22,11 @@ using an iframe. */
   -moz-osx-font-smoothing: grayscale;
   -webkit-tap-highlight-color: transparent;
 }
+
+/* Compound's overlay container, which holds tooltips and popovers, has to fill
+the container for the elements inside it to be positioned against it. The
+standalone page does the same for the container under `#root`. */
+.root > [data-overlay-container] {
+  position: relative;
+  block-size: 100%;
+}

component/index.tsx

@@ -17,6 +17,18 @@ Please see LICENSE in the repository root for full details.
  * host instead, or is confined to the container it is mounted in.
  */
 
+// The design tokens, fonts and element defaults every Element Call stylesheet
+// builds on.
+//
+// Where these land relative to the component stylesheets is the bundler's
+// choice — the standalone app puts them first, this build puts them in the
+// middle — so nothing in base.css may depend on winning or losing against a
+// component's own rules at equal specificity. It currently does not: what it
+// declares unlayered is custom properties on Element Call's root, which
+// components inherit rather than compete with, and everything from Compound
+// sits in a `@layer`, which loses to unlayered rules either way.
+import "../src/base.css";
+
 import { type FC, type JSX, type ReactNode, useMemo, useState } from "react";
 import { type MatrixClient } from "matrix-js-sdk";
 import { logger } from "matrix-js-sdk/lib/logger";
@@ -26,6 +38,7 @@ import { TooltipProvider } from "@vector-im/compound-web";
 import { shouldPolyfill as shouldPolyfillSegmenter } from "@formatjs/intl-segmenter/should-polyfill";
 import { shouldPolyfill as shouldPolyfillDurationFormat } from "@formatjs/intl-durationformat/should-polyfill.js";
 
+import EN from "../locales/en/app.json";
 import { ElementCallView } from "../src/ElementCallView";
 import { ClientProvider } from "../src/ClientContext";
 import {
@@ -50,7 +63,17 @@ import { useTheme } from "../src/useTheme";
 import { useInitial } from "../src/useInitial";
 import styles from "./ElementCall.module.css";
 
-export { type HostBridge } from "../src/HostBridge";
+// Everything needed to implement a HostBridge, not just the interface itself
+export {
+  type DeviceMuteRequest,
+  type DeviceMuteState,
+  type HostBridge,
+  type HostRequest,
+} from "../src/HostBridge";
+export { type JoinCallData } from "../src/widget";
+// The deployment-wide configuration, as distinct from ElementCallConfiguration
+// above, which is per call
+export { type ConfigOptions } from "../src/config/ConfigOptions";
 
 /**
  * How Element Call should behave. Everything is optional; anything left out
@@ -102,6 +125,12 @@ export async function initializeElementCall(
     contextSeparator: "|",
     lng: "en",
     interpolation: { escapeValue: false },
+    // English only, bundled in. The standalone app fetches its locale files at
+    // runtime from URLs its own build emits, which a host serving the library
+    // from elsewhere could not resolve; bundling one language at least keeps
+    // the component self-contained. Letting a host supply the rest, or its own
+    // translations, is still to do.
+    resources: { en: { app: EN } },
   });
 }