perf(web): read the font stack from one variable to halve the token cost

The 103-character app font stack was copied into every Material typography
token: 47 component tokens, the 30 new --mat-sys-* typescale tokens and the
typography hierarchy, 91 copies in all. Declare it once as
--app-font-family on html and pass var(--app-font-family) to the theme and
the hierarchy instead: -6,941 bytes of initial CSS (1,611,987 ->
1,605,046), so the system tokens now cost 5,671 bytes net instead of 12,526.
The rendered font is unchanged.

Lower the raised baseline to the new measurement. theme-tokens.e2e.ts
applies var(--mat-sys-label-small) and checks its family, size and weight,
because a dangling var() would void the whole font shorthand while body text
still inherited the same family.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/electron-backend-e2e/src/theme-tokens.e2e.ts

@@ -126,6 +126,31 @@ test.describe('Theme tokens', () => {
                     }),
                     `floated label size in ${theme} theme`
                 ).toBeGreaterThanOrEqual(11);
+
+                // The typography tokens carry the font stack through
+                // --app-font-family. A dangling var() voids the whole `font`
+                // shorthand; body text would still inherit the same family,
+                // so check the token's own size and weight.
+                expect(
+                    await page.evaluate(() => {
+                        const probe = document.createElement('span');
+                        probe.style.font = 'var(--mat-sys-label-small)';
+                        document.body.appendChild(probe);
+                        const style = getComputedStyle(probe);
+                        const font = {
+                            family: style.fontFamily,
+                            size: Math.round(parseFloat(style.fontSize)),
+                            weight: style.fontWeight,
+                        };
+                        probe.remove();
+                        return font;
+                    }),
+                    `label-small typography in ${theme} theme`
+                ).toEqual({
+                    family: expect.stringMatching(/^"?DM Sans"?,/),
+                    size: 11,
+                    weight: '500',
+                });
             }
             expect(surfaces['light']).not.toBe(surfaces['dark']);
         } finally {