fix(elements): use --media-font-family so timecode font settings apply

[ephraimduncan]

Summary

AudioPlayer sets --media-font: var(--font-sans) on MediaController, but media-chrome's MediaTextDisplay uses --media-font as the complete value of the CSS font shorthand:

font: var(--media-font,
  var(--media-font-weight, normal)
  var(--media-font-size, 14px) / var(--media-text-content-height, ...)
  var(--media-font-family, ...));

var(--font-sans) resolves to a bare font-family list, which is not a valid font shorthand, so the declaration becomes invalid at computed-value time and is dropped. Two consequences:

• Time/duration displays silently inherit the surrounding ButtonGroupText typography (text-sm font-medium) instead of the configured compact font.
• Because --media-font is defined, the var() fallback never runs, so the sibling --media-font-size: 10px is dead configuration.

Fix

Swap the malformed shorthand for the constituent variable:

-        "--media-font": "var(--font-sans)",
+        "--media-font-family": "var(--font-sans)",

This makes the existing --media-font-size: 10px live and applies to every text display under the controller (time, duration, preview text). Consumer overrides still win via the trailing ...style spread, and a consumer-supplied valid --media-font shorthand still takes precedence per media-chrome's fallback ordering.

Verification

Reproduced media-chrome's exact :host font: declaration in a headless browser with a parent styled 14px/500/Georgia:

	before	after
font-size	14px (inherited)	10px
font-weight	500 (inherited)	400
font-family	Georgia, serif (inherited)	var(--font-sans)

[vercel]

@ephraimduncan is attempting to deploy a commit to the Vercel Team on Vercel.

A member of the Team first needs to authorize it.