refactor(typography): lazy getTypographySettingsStore + fix effect leak

Convert the eager typographySettingsStore singleton to getTypographySettingsStore()
(+ __resetTypographySettingsStore for tests) and update barrels and consumers
(TypographyMenu, FontSampler, SampleList, ComparisonView Line/SliderArea,
comparisonStore + its mock).

Fix a latent leak while here: the store ran $effect.root and discarded the
returned cleanup, so its storage-sync effects outlived every instance. Capture
the disposer and expose destroy(), which __reset now calls.

src/widgets/ComparisonView/model/stores/comparisonStore.svelte.ts

@@ -24,7 +24,10 @@ import {
     fontLifecycleManager,
     getFontCatalog,
 } from '$entities/Font/model';
-import { typographySettingsStore } from '$features/AdjustTypography/model';
+import {
+    type TypographySettingsStore,
+    getTypographySettingsStore,
+} from '$features/AdjustTypography/model';
 import { createPersistentStore } from '$shared/lib';
 import { untrack } from 'svelte';
 import { getPretextFontString } from '../../lib';
@@ -101,11 +104,14 @@ export class ComparisonStore {
 
     #fontCatalog: FontCatalogStore;
 
+    #typography: TypographySettingsStore;
+
     constructor() {
         // Synchronously seed the batch store with any IDs already in storage
         const { fontAId, fontBId } = storage.value;
         this.#fontsByIdsStore = new FontsByIdsStore(fontAId && fontBId ? [fontAId, fontBId] : []);
         this.#fontCatalog = getFontCatalog();
+        this.#typography = getTypographySettingsStore();
 
         $effect.root(() => {
             // Sync batch results → fontA / fontB
@@ -134,7 +140,7 @@ export class ComparisonStore {
             $effect(() => {
                 const fa = this.#fontA;
                 const fb = this.#fontB;
-                const weight = typographySettingsStore.weight;
+                const weight = this.#typography.weight;
 
                 if (!fa || !fb) {
                     return;
@@ -195,7 +201,7 @@ export class ComparisonStore {
             $effect(() => {
                 const fa = this.#fontA;
                 const fb = this.#fontB;
-                const w = typographySettingsStore.weight;
+                const w = this.#typography.weight;
                 if (fa) {
                     fontLifecycleManager.pin(fa.id, w, fa.features?.isVariable);
                 }
@@ -226,8 +232,8 @@ export class ComparisonStore {
             return;
         }
 
-        const weight = typographySettingsStore.weight;
-        const size = typographySettingsStore.renderedSize;
+        const weight = this.#typography.weight;
+        const size = this.#typography.renderedSize;
         const fontAName = this.#fontA?.name;
         const fontBName = this.#fontB?.name;
 
@@ -356,7 +362,7 @@ export class ComparisonStore {
         this.#fontB = undefined;
         this.#fontsByIdsStore.setIds([]);
         storage.clear();
-        typographySettingsStore.reset();
+        this.#typography.reset();
     }
 }