@glossarist/concept-browser 0.7.110 → 0.7.112

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@glossarist/concept-browser",
-  "version": "0.7.110",
+  "version": "0.7.112",
   "description": "Vue SPA for browsing Glossarist terminology datasets with cross-reference resolution, graph visualization, and multi-language support",
   "type": "module",
   "bin": {
@@ -38,7 +38,7 @@
     "astro": "^7.0.7",
     "d3": "^7.9.0",
     "favicons": "^7.2.0",
-    "glossarist": "^0.4.51",
+    "glossarist": "^0.4.52",
     "js-yaml": "^4.1.0",
     "jszip": "^3.10.1",
     "pinia": "^2.3.1",

package/src/__tests__/utils/external-detection.test.ts

@@ -1,79 +1,155 @@
 import { describe, it, expect } from 'vitest';
 import {
   isExternalConcept,
+  isExternalMember,
+  isExternalComprehensive,
+  getExternalMembers,
   hasProvidedBy,
-  isDanglingExternal,
+  hasDanglingExternal,
   formatExternalLabel,
-  type ConceptStoreLike,
+  type ConceptStore,
+  type ExternalConceptLike,
 } from '../../utils/external-detection';
+import { checkExtensionalCompleteness } from 'glossarist';
 
-const mockStore: ConceptStoreLike = {
+/**
+ * External-detection + extensional-completeness contract tests.
+ *
+ * glossarist@0.4.52 promoted these utilities from concept-browser's
+ * local src/utils/external-detection.ts into the upstream library.
+ * This spec pins:
+ *   1. The local module re-exports the upstream functions (no drift).
+ *   2. The upstream signatures work as documented.
+ *   3. `formatExternalLabel` (the UI-only helper) stays local.
+ *   4. `checkExtensionalCompleteness` flags ISO 704:2022 §6.4.5.1
+ *      open-ended patterns in extensional definitions.
+ */
+
+const extResolved: ExternalConceptLike = { status: 'external', related: [{ type: 'provided_by' }] };
+const extDangling: ExternalConceptLike = { status: 'external', related: [] };
+const internal: ExternalConceptLike = { status: 'valid', related: [] };
+
+const store: ConceptStore = {
   lookup(ref) {
-    if (ref?.id === 'ext-1') {
-      return { status: 'external', relatedConcepts: [{ type: 'provided_by' }] };
-    }
-    if (ref?.id === 'ext-2') {
-      return { status: 'external', relatedConcepts: [] };
-    }
-    if (ref?.id === 'int-1') {
-      return { status: 'valid', relatedConcepts: [] };
-    }
+    if (ref?.id === 'ext-resolved') return extResolved;
+    if (ref?.id === 'ext-dangling') return extDangling;
+    if (ref?.id === 'int-1') return internal;
     return null;
   },
 };
 
-describe('external-detection', () => {
+describe('external-detection (re-exports from glossarist@0.4.52)', () => {
   describe('isExternalConcept', () => {
-    it('returns true when the concept status is external', () => {
-      expect(isExternalConcept({ source: 's', id: 'ext-1' }, mockStore)).toBe(true);
+    it('returns true when concept.status === "external"', () => {
+      expect(isExternalConcept(extResolved)).toBe(true);
+      expect(isExternalConcept(extDangling)).toBe(true);
     });
 
-    it('returns false when the concept status is valid', () => {
-      expect(isExternalConcept({ source: 's', id: 'int-1' }, mockStore)).toBe(false);
+    it('returns false for internal concepts', () => {
+      expect(isExternalConcept(internal)).toBe(false);
     });
 
-    it('returns false when the concept is not found', () => {
-      expect(isExternalConcept({ source: 's', id: 'unknown' }, mockStore)).toBe(false);
+    it('returns false for null/undefined', () => {
+      expect(isExternalConcept(null)).toBe(false);
+      expect(isExternalConcept(undefined)).toBe(false);
     });
+  });
 
-    it('returns false when ref is null', () => {
-      expect(isExternalConcept(null, mockStore)).toBe(false);
+  describe('isExternalMember', () => {
+    it('returns true when the member ref resolves to an external concept', () => {
+      expect(isExternalMember({ ref: { source: 's', id: 'ext-resolved' } }, store)).toBe(true);
+    });
+
+    it('returns false when the member ref resolves to an internal concept', () => {
+      expect(isExternalMember({ ref: { source: 's', id: 'int-1' } }, store)).toBe(false);
     });
 
     it('returns false when store is null', () => {
-      expect(isExternalConcept({ source: 's', id: 'ext-1' }, null)).toBe(false);
+      expect(isExternalMember({ ref: { source: 's', id: 'ext-resolved' } }, null)).toBe(false);
+    });
+
+    it('returns false when ref is missing', () => {
+      expect(isExternalMember({}, store)).toBe(false);
+      expect(isExternalMember(null, store)).toBe(false);
+    });
+  });
+
+  describe('isExternalComprehensive', () => {
+    it('returns true when the comprehensive ref resolves to external', () => {
+      const hyperedge = {
+        comprehensive: { source: 's', id: 'ext-resolved' },
+        members: [],
+      };
+      expect(isExternalComprehensive(hyperedge, store)).toBe(true);
+    });
+
+    it('returns false when the comprehensive ref resolves to internal', () => {
+      const hyperedge = {
+        comprehensive: { source: 's', id: 'int-1' },
+        members: [],
+      };
+      expect(isExternalComprehensive(hyperedge, store)).toBe(false);
+    });
+  });
+
+  describe('getExternalMembers', () => {
+    it('returns only the members whose refs resolve to external', () => {
+      const hyperedge = {
+        comprehensive: { source: 's', id: 'int-1' },
+        members: [
+          { ref: { source: 's', id: 'ext-resolved' } },
+          { ref: { source: 's', id: 'int-1' } },
+          { ref: { source: 's', id: 'ext-dangling' } },
+        ],
+      };
+      const external = getExternalMembers(hyperedge, store);
+      expect(external).toHaveLength(2);
+      expect(external.map(m => (m.ref as { id?: string } | undefined)?.id)).toEqual(['ext-resolved', 'ext-dangling']);
     });
   });
 
   describe('hasProvidedBy', () => {
-    it('returns true when the external concept has a provided_by edge', () => {
-      expect(hasProvidedBy({ source: 's', id: 'ext-1' }, mockStore)).toBe(true);
+    it('returns true when the concept has a provided_by edge', () => {
+      expect(hasProvidedBy(extResolved)).toBe(true);
     });
 
-    it('returns false when the external concept has no provided_by edge', () => {
-      expect(hasProvidedBy({ source: 's', id: 'ext-2' }, mockStore)).toBe(false);
+    it('returns false when the concept has no provided_by edge', () => {
+      expect(hasProvidedBy(extDangling)).toBe(false);
     });
 
-    it('returns false when the concept is not found', () => {
-      expect(hasProvidedBy({ source: 's', id: 'unknown' }, mockStore)).toBe(false);
+    it('returns false for null/undefined', () => {
+      expect(hasProvidedBy(null)).toBe(false);
+      expect(hasProvidedBy(undefined)).toBe(false);
     });
   });
 
-  describe('isDanglingExternal', () => {
-    it('returns false when the external concept has provided_by (resolved)', () => {
-      expect(isDanglingExternal({ source: 's', id: 'ext-1' }, mockStore)).toBe(false);
+  describe('hasDanglingExternal (hyperedge-level)', () => {
+    it('returns true when any external ref lacks a provided_by edge', () => {
+      const hyperedge = {
+        comprehensive: { source: 's', id: 'ext-dangling' },
+        members: [],
+      };
+      expect(hasDanglingExternal(hyperedge, store)).toBe(true);
     });
 
-    it('returns true when the external concept has no provided_by (dangling)', () => {
-      expect(isDanglingExternal({ source: 's', id: 'ext-2' }, mockStore)).toBe(true);
+    it('returns false when every external ref is resolved', () => {
+      const hyperedge = {
+        comprehensive: { source: 's', id: 'ext-resolved' },
+        members: [{ ref: { source: 's', id: 'ext-resolved' } }],
+      };
+      expect(hasDanglingExternal(hyperedge, store)).toBe(false);
     });
 
-    it('returns false for internal concepts', () => {
-      expect(isDanglingExternal({ source: 's', id: 'int-1' }, mockStore)).toBe(false);
+    it('returns false when no refs are external', () => {
+      const hyperedge = {
+        comprehensive: { source: 's', id: 'int-1' },
+        members: [{ ref: { source: 's', id: 'int-1' } }],
+      };
+      expect(hasDanglingExternal(hyperedge, store)).toBe(false);
     });
   });
 
-  describe('formatExternalLabel', () => {
+  describe('formatExternalLabel (local UI helper, not in upstream)', () => {
     it('wraps the label in parentheses for external concepts', () => {
       expect(formatExternalLabel('precision condition', true)).toBe('(precision condition)');
     });
@@ -83,3 +159,30 @@ describe('external-detection', () => {
     });
   });
 });
+
+describe('checkExtensionalCompleteness (ISO 704:2022 §6.4.5.1)', () => {
+  it('returns null for non-extensional definitions', () => {
+    expect(checkExtensionalCompleteness({ type: 'intensional', content: '...' })).toBeNull();
+    expect(checkExtensionalCompleteness({ type: null, content: '...' })).toBeNull();
+    expect(checkExtensionalCompleteness(null)).toBeNull();
+  });
+
+  it('returns null for an extensional definition that lists every member', () => {
+    expect(checkExtensionalCompleteness({
+      type: 'extensional',
+      content: '1, 2, 3',
+    })).toBeNull();
+  });
+
+  it('returns a warning when an extensional definition uses an open-ended pattern', () => {
+    // Open-ended patterns: "etc.", "...", "and so on", "includes but is not limited to"
+    const issue = checkExtensionalCompleteness({
+      type: 'extensional',
+      content: 'length, mass, time, etc.',
+    });
+    expect(issue).not.toBeNull();
+    expect(issue?.severity).toBe('warning');
+    expect(issue?.rule).toBe('ISO-704-6.4.5.1');
+    expect(issue?.message).toMatch(/completeness|extensional/i);
+  });
+});

package/src/__tests__/utils/font-variables.test.ts

@@ -0,0 +1,202 @@
+import { describe, it, expect } from 'vitest';
+import { existsSync, readdirSync, readFileSync } from 'fs';
+import { resolve } from 'path';
+import {
+  buildFontVariables,
+  renderFontVariablesInline,
+  FONT_SLOTS,
+  type BrandingFontsLike,
+} from '../../utils/font-variables';
+
+/**
+ * Single-source-of-truth contract for branding-driven CSS font variables.
+ *
+ * Bug history (2026-08-01):
+ *   - 0.7.106–0.7.110: brand fonts were silently clobbered for
+ *     `--font-serif`/`--font-sans`/`--font-mono` because the tailwind.css
+ *     `@theme` block emitted `:root, :host { ... }` declarations into the
+ *     CSS bundle, which loaded AFTER Default.astro's inline `<style>` and
+ *     overrode the brand values per CSS cascade (equal specificity, later
+ *     source order wins).
+ *   - 0.7.111 contributor patch fixed `:root` block but missed `@theme`.
+ *
+ * Post-refactor: `buildFontVariables()` is the only emitter. Both
+ * `Default.astro` (build-time inline) and `use-site-config.ts` (runtime
+ * overrides) call it. The output is the canonical slot-named shape —
+ * no `--font-serif`/`--font-sans` category-named variables that bake in
+ * serif↔heading / sans↔body assumptions.
+ */
+
+describe('buildFontVariables — shape contract', () => {
+  it('returns exactly the four slot-named variables', () => {
+    const vars = buildFontVariables(null);
+    expect(Object.keys(vars).sort()).toEqual(
+      ['--font-body', '--font-heading', '--font-mono', '--font-title'],
+    );
+  });
+
+  it('FONT_SLOTS constant is the canonical slot list', () => {
+    expect(FONT_SLOTS).toEqual(['title', 'heading', 'body', 'mono']);
+  });
+
+  it('never emits --font-serif or --font-sans (category-named variables are forbidden)', () => {
+    const vars = buildFontVariables({
+      title: { family: 'Raleway', category: 'sans-serif' },
+    });
+    expect(vars).not.toHaveProperty('--font-serif');
+    expect(vars).not.toHaveProperty('--font-sans');
+  });
+
+  it('never emits --font-header as a separate variable (legacy alias handled by CSS, not JS)', () => {
+    const vars = buildFontVariables({ header: { family: 'Raleway' } });
+    expect(vars).not.toHaveProperty('--font-header');
+  });
+});
+
+describe('buildFontVariables — defaults preserve Glossarist visual identity', () => {
+  it('falls back to DM Serif Display + DM Sans + JetBrains Mono when no branding', () => {
+    const vars = buildFontVariables(null);
+    expect(vars['--font-title']).toContain('DM Serif Display');
+    expect(vars['--font-heading']).toContain('DM Serif Display');
+    expect(vars['--font-body']).toContain('DM Sans');
+    expect(vars['--font-mono']).toContain('JetBrains Mono');
+  });
+
+  it('keeps working when individual slots are missing', () => {
+    const vars = buildFontVariables({ title: { family: 'Raleway' } });
+    expect(vars['--font-title']).toContain('Raleway');
+    expect(vars['--font-heading']).toContain('DM Serif Display');
+    expect(vars['--font-body']).toContain('DM Sans');
+  });
+});
+
+describe('buildFontVariables — brand overrides', () => {
+  const raleway: BrandingFontsLike = {
+    title:   { family: 'Raleway', category: 'sans-serif' },
+    heading: { family: 'Raleway', category: 'sans-serif' },
+    body:    { family: 'Raleway', category: 'sans-serif' },
+    mono:    { family: 'Fira Code', category: 'monospace' },
+  };
+
+  it('produces Raleway stacks for every text slot when consumer sets all four', () => {
+    const vars = buildFontVariables(raleway);
+    expect(vars['--font-title']).toBe("'Raleway', system-ui, sans-serif");
+    expect(vars['--font-heading']).toBe("'Raleway', system-ui, sans-serif");
+    expect(vars['--font-body']).toBe("'Raleway', system-ui, sans-serif");
+    expect(vars['--font-mono']).toBe("'Fira Code', ui-monospace, \"JetBrains Mono\", Menlo, Monaco, monospace");
+  });
+
+  it('honors `header` legacy alias as input for the heading slot', () => {
+    const vars = buildFontVariables({ header: { family: 'Inter', category: 'sans-serif' } });
+    expect(vars['--font-heading']).toBe("'Inter', system-ui, sans-serif");
+  });
+
+  it('`heading` slot wins over legacy `header` alias when both are set', () => {
+    const vars = buildFontVariables({
+      heading: { family: 'Heading', category: 'sans-serif' },
+      header:  { family: 'Header',  category: 'sans-serif' },
+    });
+    expect(vars['--font-heading']).toContain('Heading');
+    expect(vars['--font-heading']).not.toContain('Header');
+  });
+});
+
+describe('renderFontVariablesInline — serialization', () => {
+  it('produces a `:root { ... }` block with every slot variable', () => {
+    const css = renderFontVariablesInline({ title: { family: 'Raleway', category: 'sans-serif' } });
+    expect(css.startsWith(':root{')).toBe(true);
+    expect(css.endsWith('}')).toBe(true);
+    expect(css).toContain('--font-title:');
+    expect(css).toContain('--font-heading:');
+    expect(css).toContain('--font-body:');
+    expect(css).toContain('--font-mono:');
+    expect(css).toContain("'Raleway'");
+  });
+
+  it('separates declarations with semicolons (no trailing junk)', () => {
+    const css = renderFontVariablesInline(null);
+    // Each declaration is `--font-X: value`, separated by `;`.
+    const declCount = css.match(/--font-[a-z]+:/g)!.length;
+    const sepCount = css.match(/;/g)!.length;
+    expect(declCount).toBe(4);
+    expect(sepCount).toBe(3); // 4 declarations = 3 separators (no trailing)
+    expect(css).not.toMatch(/;;/);
+  });
+
+  it('emits only slot-named variables — never --font-serif / --font-sans', () => {
+    const css = renderFontVariablesInline(null);
+    expect(css).not.toMatch(/--font-serif/);
+    expect(css).not.toMatch(/--font-sans/);
+    expect(css).not.toMatch(/--font-header/);
+  });
+});
+
+/**
+ * THE LOAD-BEARING REGRESSION TEST.
+ *
+ * The bundled CSS must NOT contain `:root, :host { --font-... }` declarations
+ * for any slot variable. If it does, the bundle loads after the inline
+ * `<style>` and clobbers the brand values per CSS cascade.
+ *
+ * This test scans the built Default.*.css artifact (produced by
+ * `npm run build:astro`) and asserts no font variable appears in a
+ * `:root` selector. Skipped when dist/ doesn't exist (fresh clone,
+ * before first build).
+ */
+function findBundleDefaultCss(): string | null {
+  const astroDir = resolve(process.cwd(), 'dist/_astro');
+  if (!existsSync(astroDir)) return null;
+  for (const f of readdirSync(astroDir)) {
+    if (f.startsWith('Default.') && f.endsWith('.css')) {
+      return readFileSync(resolve(astroDir, f), 'utf-8');
+    }
+  }
+  return null;
+}
+
+describe('bundle drift regression — Default.*.css must not clobber brand font vars', () => {
+  it('bundle has no `:root,:host{...--font-X: <literal>}` declarations', () => {
+    // The bundle's `:root, :host { ... }` block (from @theme) is allowed
+    // to define font variables as `var()` references to the slot variables
+    // — that's an alias, not a literal. A literal value (e.g.,
+    // `--font-serif: "DM Serif Display"`) would clobber the inline <style>.
+    const css = findBundleDefaultCss();
+    if (css == null) {
+      console.warn('Skipping bundle drift test — dist/_astro/Default.*.css not found.');
+      return;
+    }
+    // Find any `--font-X: <value>` declaration in a `:root,:host{...}` block.
+    // Reject if the value is a literal (not a var() reference).
+    // NOTE: --font-weight-* is a Tailwind font-WEIGHT scale, not a
+    // font-family variable — excluded from this drift check.
+    const rootBlocks = css.match(/:root[^{]*\{([^}]*)\}/g) ?? [];
+    const offenders: string[] = [];
+    for (const block of rootBlocks) {
+      const fontDecls = block.matchAll(/--font-(title|heading|header|body|mono|serif|sans)\s*:\s*([^;}]+)/g);
+      for (const m of fontDecls) {
+        const name = m[1];
+        const value = m[2].trim();
+        if (value.startsWith('var(')) continue; // alias — OK
+        if (value === 'initial') continue; // explicit disable — OK
+        offenders.push(`--font-${name}: ${value}`);
+      }
+    }
+    expect(
+      offenders,
+      'bundle must not emit literal font-family values at :root (they clobber inline style)',
+    ).toEqual([]);
+  });
+
+  it('bundle aliases map to slot variables (no category-named sources)', () => {
+    const css = findBundleDefaultCss();
+    if (css == null) {
+      console.warn('Skipping bundle drift test — dist/_astro/Default.*.css not found.');
+      return;
+    }
+    // Verify the alias wiring is in place: --font-serif → --font-heading,
+    // --font-sans → --font-body. These ensure Tailwind's default utility
+    // names still work in templates that haven't migrated to slot names.
+    expect(css).toMatch(/--font-serif:\s*var\(--font-heading\)/);
+    expect(css).toMatch(/--font-sans:\s*var\(--font-body\)/);
+  });
+});

package/src/components/LanguageDetail.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import type { Concept, LocalizedConcept, Designation, Expression, Abbreviation as AbbreviationType } from 'glossarist';
+import { checkExtensionalCompleteness, type ExtensionalCompletenessIssue } from 'glossarist';
 import { computed } from 'vue';
 import { langName, langLabel } from '../utils/lang';
 import { renderContent } from '../utils/content-renderer';
@@ -33,6 +34,33 @@ const definition = computed(() => {
   const content = lc.value.definitions.map(d => d.content).filter(Boolean).join('\n\n');
   return content;
 });
+
+/**
+ * ISO 704:2022 §6.4.5.1 extensional-completeness warnings.
+ *
+ * An extensional definition enumerates every member of the concept's
+ * extension. Open-ended phrasing ("etc.", "...", "and so on") signals
+ * that the enumeration is incomplete — the definition is invalid per
+ * ISO 704. Surface each warning inline so editors can fix the source.
+ *
+ * The validator gates on `definition.type === 'extensional'`. Today
+ * concept-browser's DetailedDefinition model doesn't carry that field,
+ * so this returns [] — the wiring is in place for the moment glossarist
+ * exposes definition-type tracking (or for consumers that annotate
+ * definitions themselves).
+ */
+const extensionalIssues = computed<ExtensionalCompletenessIssue[]>(() => {
+  if (!lc.value) return [];
+  const issues: ExtensionalCompletenessIssue[] = [];
+  for (const d of lc.value.definitions) {
+    const issue = checkExtensionalCompleteness(
+      d as unknown as { type?: string | null; content?: string | null },
+    );
+    if (issue) issues.push(issue);
+  }
+  return issues;
+});
+
 const notes = computed(() => lc.value?.notes.map(n => n.content).filter(Boolean) ?? []);
 const examples = computed(() => lc.value?.examples.map(e => e.content).filter(Boolean) ?? []);
 const sources = computed(() => lc.value?.sources ?? []);
@@ -140,6 +168,16 @@ function handleContentClick(e: MouseEvent) {
       <div v-if="definition" class="card p-5">
         <div class="section-label">{{ t('concept.definition') }}</div>
         <div class="text-ink-800 leading-relaxed mt-3" v-html="renderContent(definition, renderOpts)"></div>
+        <!-- ISO 704:2022 §6.4.5.1 extensional-completeness warnings -->
+        <div
+          v-for="(issue, i) in extensionalIssues"
+          :key="'ext'+i"
+          class="mt-3 p-2 rounded border border-amber-200 dark:border-amber-800 bg-amber-50 dark:bg-amber-900/20 text-xs text-amber-900 dark:text-amber-100"
+          :title="`Rule: ${issue.rule}`"
+        >
+          <span class="font-semibold">⚠ {{ t('concept.extensionalWarning') || 'Extensional completeness' }}:</span>
+          {{ issue.message }}
+        </div>
       </div>
 
       <!-- Notes -->

package/src/components/PartitiveRelationList.vue

@@ -9,6 +9,10 @@
  *     drop's line style encodes its multiplicity + is_delimiting per
  *     ISO 704:2022 (5 multiplicity values × 2 delimiting states).
  *
+ * External concepts (status: 'external') are wrapped in parentheses per
+ * ISO 704:2022 §5.5.4.3.1, using the upstream `isExternalMember` /
+ * `isExternalComprehensive` detection from glossarist@0.4.52.
+ *
  * Header badges communicate metadata that the diagram's line styles
  * also encode — for users who can't perceive the visual difference
  * (screen readers, low vision, monochrome displays).
@@ -21,6 +25,7 @@ import { useI18n, locale } from '../i18n';
 import { completenessLabel } from '../utils/partitive-relation-styling';
 import { presenceLabel, countLabel } from '../utils/partitive-multiplicity';
 import { resolveDesignation } from '../utils/resolve-designation';
+import { isExternalMember, isExternalComprehensive, formatExternalLabel } from '../utils/external-detection';
 import PartitiveRelationDiagram, {
   type PartitiveMemberLabeled,
 } from './PartitiveRelationDiagram.vue';
@@ -36,8 +41,51 @@ const store = useVocabularyStore();
 const factory = getFactory();
 const { t } = useI18n();
 
-function designationFor(uri: string): string {
-  return resolveDesignation(uri, store, factory, locale.value);
+/** Per-URI cache of external-status lookups, so the rake doesn't re-resolve
+ *  the same concept on every render pass. */
+const externalCache = new Map<string, boolean>();
+
+/**
+ * Bridge the concept-browser ref shape to glossarist@0.4.52's ConceptStore
+ * interface. The store exposes concepts via `lookup({ source, id })` and
+ * returns an object with `.status` + `.related[]` — exactly what the
+ * upstream external-detection utilities need.
+ */
+const externalStore = {
+  lookup(ref: { source?: string | null; id?: string | null }) {
+    if (!ref?.source && !ref?.id) return null;
+    // Find the matching concept by traversing the loaded datasets.
+    for (const adapter of store.datasets.values()) {
+      for (const entry of adapter.getConcepts() ?? []) {
+        if (entry && entry.id === ref.id) {
+          return {
+            status: entry.status,
+            related: (entry as any).relatedConcepts ?? (entry as any).related ?? [],
+          };
+        }
+      }
+    }
+    return null;
+  },
+};
+
+function isExternalUri(uri: string, kind: 'member' | 'comprehensive'): boolean {
+  if (externalCache.has(uri)) return externalCache.get(uri)!;
+  // Build a member/hyperedge shape the upstream utilities expect.
+  const ref = { source: uri, id: uri.split('/').pop() ?? uri };
+  let isExt: boolean;
+  if (kind === 'comprehensive') {
+    isExt = isExternalComprehensive({ comprehensive: ref, members: [] }, externalStore);
+  } else {
+    isExt = isExternalMember({ ref }, externalStore);
+  }
+  externalCache.set(uri, isExt);
+  return isExt;
+}
+
+function designationFor(uri: string, kind: 'member' | 'comprehensive' = 'member'): string {
+  const label = resolveDesignation(uri, store, factory, locale.value);
+  return formatExternalLabel(label, isExternalUri(uri, kind));
 }
 
 function navigate(uri: string) {
@@ -67,7 +115,7 @@ function criterionText(criterion?: Record<string, string>): string | null {
 function labeledMembers(rel: PartitiveRelationWire): PartitiveMemberLabeled[] {
   return rel.partitives.map(m => ({
     uri: m.uri,
-    label: designationFor(m.uri),
+    label: designationFor(m.uri, 'member'),
     presence: m.presence,
     count: m.count,
     isDelimiting: m.isDelimiting,

package/src/config/use-site-config.ts

@@ -3,7 +3,7 @@ import type { PageConfig, SiteColors } from './types';
 import type { DatasetGroup } from './types';
 import { synthesizePages } from './page-types';
 import { locale } from '../i18n';
-import { fontStack, DEFAULT_FONTS, DEFAULT_CATEGORY } from '../utils/font-stack';
+import { buildFontVariables, type BrandingFontsLike } from '../utils/font-variables';
 
 export interface RuntimeSiteConfig {
   id: string;
@@ -99,25 +99,20 @@ function applyBranding(config: RuntimeSiteConfig) {
     root.style.setProperty('--brand-dark', b.darkColor);
   }
 
-  if (b.fonts?.title) {
-    loadFont(b.fonts.title);
-    root.style.setProperty('--font-title', fontStack(b.fonts.title, DEFAULT_CATEGORY.title) ?? DEFAULT_FONTS.title);
-  }
-  // heading is the new slot name; header is the backward-compat alias.
-  const headingFont = b.fonts?.heading ?? b.fonts?.header;
-  if (headingFont) {
-    loadFont(headingFont);
-    const stack = fontStack(headingFont, DEFAULT_CATEGORY.heading) ?? DEFAULT_FONTS.heading;
-    root.style.setProperty('--font-heading', stack);
-    root.style.setProperty('--font-header', stack);
-  }
-  if (b.fonts?.body) {
-    loadFont(b.fonts.body);
-    root.style.setProperty('--font-body', fontStack(b.fonts.body, DEFAULT_CATEGORY.body) ?? DEFAULT_FONTS.body);
-  }
-  if (b.fonts?.mono) {
-    loadFont(b.fonts.mono);
-    root.style.setProperty('--font-mono', fontStack(b.fonts.mono, DEFAULT_CATEGORY.mono) ?? DEFAULT_FONTS.mono);
+  if (b.fonts && (b.fonts.title || b.fonts.heading || b.fonts.header || b.fonts.body || b.fonts.mono)) {
+    // Load declared Google Fonts first so the brand stack resolves
+    // without flashing the fallback.
+    if (b.fonts.title) loadFont(b.fonts.title);
+    const headingFont = b.fonts.heading ?? b.fonts.header;
+    if (headingFont) loadFont(headingFont);
+    if (b.fonts.body) loadFont(b.fonts.body);
+    if (b.fonts.mono) loadFont(b.fonts.mono);
+
+    // Single SSOT — same shape as Default.astro's inline <style>.
+    const vars = buildFontVariables(b.fonts as BrandingFontsLike);
+    for (const [k, v] of Object.entries(vars)) {
+      root.style.setProperty(k, v);
+    }
   }
 }
 

package/src/layouts/Default.astro

@@ -2,12 +2,8 @@
 import '@/styles/tailwind.css';
 import AppIsland from '../islands/AppIsland.vue';
 import { getSiteConfig } from '../lib/site-config';
-import {
-  fontStack,
-  DEFAULT_FONTS,
-  DEFAULT_CATEGORY,
-  type FontConfigLike,
-} from '../utils/font-stack';
+import { type FontConfigLike } from '../utils/font-stack';
+import { renderFontVariablesInline } from '../utils/font-variables';
 import { resolveFaviconBase } from '../utils/favicon-base';
 import { buildFaviconLinks, renderFaviconLinkTag } from '../utils/favicon-links';
 
@@ -44,13 +40,11 @@ const fontsUrl = fontParts.length > 0
   ? `https://fonts.googleapis.com/css2?${fontParts.join('&')}&display=swap`
   : 'https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=DM+Serif+Display:ital@0;1&family=JetBrains+Mono:wght@400;500&display=swap';
 
-// Build CSS font-family stacks via the shared SSOT. Consumers can pick
-// any category for any slot — e.g. sans-serif title + serif heading —
-// and the fallback chain follows the declared category.
-const fontTitle = fontStack(brandingFonts?.title, DEFAULT_CATEGORY.title) ?? DEFAULT_FONTS.title;
-const fontHeading = fontStack(headingFont, DEFAULT_CATEGORY.heading) ?? DEFAULT_FONTS.heading;
-const fontBody = fontStack(brandingFonts?.body, DEFAULT_CATEGORY.body) ?? DEFAULT_FONTS.body;
-const fontMono = fontStack(brandingFonts?.mono, DEFAULT_CATEGORY.mono) ?? DEFAULT_FONTS.mono;
+// Single source of truth for the inline font-variable block.
+// renderFontVariablesInline() is shared with use-site-config.ts so the
+// build-time SSG and runtime override paths can never drift.
+// See src/utils/font-variables.ts for the contract + regression tests.
+const fontVarsCss = renderFontVariablesInline(brandingFonts);
 
 // Favicon configuration (issues #173, #177, and the data-driven refactor).
 //
@@ -137,7 +131,7 @@ const faviconLinks = buildFaviconLinks({
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link rel="preload" as="style" href={fontsUrl} onload="this.rel='stylesheet'">
     <noscript><link href={fontsUrl} rel="stylesheet"></noscript>
-    <Fragment set:html={`<style>:root{--font-title:${fontTitle};--font-heading:${fontHeading};--font-header:${fontHeading};--font-body:${fontBody};--font-mono:${fontMono}}</style>`} />
+    <Fragment set:html={`<style>${fontVarsCss}</style>`} />
     <script is:inline>
       (function() {
         const c = document.cookie.split(';').map(s => s.trim()).find(s => s.startsWith('theme='));

package/src/styles/tailwind.css

@@ -38,9 +38,19 @@
   --color-group-family: #6366f1;
   --color-group-collection: #0891b2;
 
-  --font-serif: "DM Serif Display", Georgia, serif;
-  --font-sans: "DM Sans", system-ui, sans-serif;
-  --font-mono: "JetBrains Mono", monospace;
+  /* Tailwind font utilities. Defined as `var()` references to the slot
+     variables so the utilities exist (templates still reference
+     `.font-serif`, `.font-sans`, `.font-mono`) but the bundle's
+     `:root, :host { ... }` block emits ALIASES, not literal values —
+     meaning it cannot clobber whatever the inline `<style>` sets.
+
+     The inline style (Default.astro) emits ONLY slot-named variables
+     (--font-title, --font-heading, --font-body, --font-mono) via
+     buildFontVariables() in src/utils/font-variables.ts. The aliases
+     here resolve to those slot variables through the cascade. */
+  --font-serif: var(--font-heading);
+  --font-sans: var(--font-body);
+  --font-mono: var(--font-mono);
 }
 
 :root {
@@ -60,10 +70,6 @@
   --brand-primary: #2563eb;
   --brand-primary-rgb: 37, 99, 235;
   --brand-dark: #1e293b;
-  --font-title: "DM Serif Display", Georgia, serif;
-  --font-heading: "DM Serif Display", Georgia, serif;
-  --font-header: "DM Serif Display", Georgia, serif;
-  --font-body: "DM Sans", system-ui, sans-serif;
   --gold-accent: #B8935A;
   --gold-accent-deep: #8C6A3A;
 }
@@ -75,11 +81,23 @@
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
   }
-  .font-title {
-    font-family: var(--font-title);
-  }
-  h1, h2, h3, .font-serif {
-    font-family: var(--font-header);
+  /* Slot-named utilities — the canonical API. Each maps to a CSS variable
+     emitted by buildFontVariables() in src/utils/font-variables.ts. */
+  .font-title   { font-family: var(--font-title); }
+  .font-heading { font-family: var(--font-heading); }
+  .font-body    { font-family: var(--font-body); }
+  /* Backward-compat aliases. Existing templates use `.font-serif` and
+     `.font-sans`; map them to slot variables so brand fonts propagate
+     without forcing every consumer to rewrite markup. These do NOT
+     bake in serif↔heading / sans↔body — the slot variable holds
+     whatever category the consumer declared. */
+  .font-serif   { font-family: var(--font-heading); }
+  .font-sans    { font-family: var(--font-body); }
+  /* Legacy alias for `.font-header` (renamed to `.font-heading`). */
+  .font-header  { font-family: var(--font-heading); }
+  /* Default heading typography — applies unless overridden by a slot class. */
+  h1, h2, h3, h4, h5, h6 {
+    font-family: var(--font-heading);
   }
   code, pre, .font-mono {
     font-family: var(--font-mono);

package/src/utils/external-detection.ts

@@ -1,70 +1,97 @@
 /**
  * External concept detection — ISO 704:2022 external concepts.
  *
- * An "external concept" is one referenced from this dataset but defined
- * elsewhere (status: 'external'). In diagrams, external concepts are
- * shown in parentheses with a dashed border per ISO 704:2022 §5.5.4.3.1.
+ * The detection logic now lives upstream in glossarist@0.4.52 — this
+ * file is a thin re-export so consumers don't have to know which package
+ * the functions live in. The signature is also richer upstream: it
+ * understands `MemberLike` (with nested `.ref`) and `HyperedgeLike`
+ * shapes, matching the actual glossarist-js model.
  *
- * Detection requires concept resolution (looking up the referenced
- * concept's status), which is a consumer concern — the model itself
- * stays pure. These utility functions take a conceptStore/lookup
- * callback provided by the caller.
+ * The only thing kept locally is `formatExternalLabel` — it's a pure
+ * UI concern (parentheses per ISO 704 §5.5.4.3.1) and doesn't belong
+ * in the model library.
+ *
+ * ISO 704:2022 §5.5.4.3.1: external concepts are shown in parentheses
+ * with a dashed border in diagrams.
  */
 
-export interface ConceptLike {
-  status?: string | null;
-  relatedConcepts?: ReadonlyArray<{ type?: string | null }>;
-}
+import {
+  isExternalConcept,
+  isExternalMember as glsIsExternalMember,
+  isExternalComprehensive as glsIsExternalComprehensive,
+  getExternalMembers as glsGetExternalMembers,
+  hasProvidedBy,
+  hasDanglingExternal as glsHasDanglingExternal,
+} from 'glossarist';
+import type {
+  ExternalConceptLike,
+  ConceptStore,
+} from 'glossarist';
 
-export interface ConceptStoreLike {
-  lookup(ref: { source?: string | null; id?: string | null }): ConceptLike | null;
-}
+export type {
+  ExternalConceptLike,
+  ConceptStore,
+};
 
-export interface RefLike {
-  source?: string | null;
-  id?: string | null;
-}
+export {
+  isExternalConcept,
+  hasProvidedBy,
+};
 
 /**
- * Check if a member's concept resolves to status: external.
+ * Defensive wrappers around the upstream hyperedge-aware queries.
+ * glossarist@0.4.52 throws on null `store` (it indexes into it
+ * unconditionally). UI consumers may have no store available (e.g.,
+ * during initial render before the vocabulary store is loaded) —
+ * return false / [] instead of propagating the throw.
  */
-export function isExternalConcept(
-  ref: RefLike | null | undefined,
-  store: ConceptStoreLike | null | undefined,
+export function isExternalMember(
+  member: { ref?: unknown } | null | undefined,
+  store: ConceptStore | null | undefined,
 ): boolean {
-  if (!ref || !store) return false;
-  const concept = store.lookup(ref);
-  return concept?.status === 'external';
+  if (!member || !store) return false;
+  return glsIsExternalMember(member as Parameters<typeof glsIsExternalMember>[0], store);
 }
 
-/**
- * Check if an external concept has a provided_by edge for resolution.
- * Without provided_by, the reference dangles — the decomposition is
- * incomplete.
- */
-export function hasProvidedBy(
-  ref: RefLike | null | undefined,
-  store: ConceptStoreLike | null | undefined,
+export function isExternalComprehensive(
+  hyperedge: { comprehensive?: unknown; members?: readonly unknown[] },
+  store: ConceptStore | null | undefined,
 ): boolean {
-  if (!ref || !store) return false;
-  const concept = store.lookup(ref);
-  if (!concept?.relatedConcepts) return false;
-  return concept.relatedConcepts.some(rc => rc.type === 'provided_by');
+  if (!hyperedge || !store) return false;
+  return glsIsExternalComprehensive(
+    hyperedge as Parameters<typeof glsIsExternalComprehensive>[0],
+    store,
+  );
 }
 
-/**
- * Check if an external concept's reference dangles (no provided_by edge).
- */
-export function isDanglingExternal(
-  ref: RefLike | null | undefined,
-  store: ConceptStoreLike | null | undefined,
+export function getExternalMembers(
+  hyperedge: { comprehensive?: unknown; members?: readonly unknown[] },
+  store: ConceptStore | null | undefined,
+): { ref?: unknown }[] {
+  if (!hyperedge || !store) return [];
+  return glsGetExternalMembers(
+    hyperedge as Parameters<typeof glsGetExternalMembers>[0],
+    store,
+  );
+}
+
+export function hasDanglingExternal(
+  hyperedge: { comprehensive?: unknown; members?: readonly unknown[] },
+  store: ConceptStore | null | undefined,
 ): boolean {
-  return isExternalConcept(ref, store) && !hasProvidedBy(ref, store);
+  if (!hyperedge || !store) return false;
+  return glsHasDanglingExternal(
+    hyperedge as Parameters<typeof glsHasDanglingExternal>[0],
+    store,
+  );
 }
 
 /**
  * Format a label for an external concept — parenthetical per ISO 704.
  * Returns `"(label)"` for external concepts, `label` for internal.
+ *
+ * Kept locally because it's a pure UI concern (rendering decision), not
+ * a model-layer classification.
  */
 export function formatExternalLabel(
   label: string,

package/src/utils/font-variables.ts

@@ -0,0 +1,97 @@
+/**
+ * Single source of truth for branding-driven CSS font variables.
+ *
+ * WHY THIS EXISTS
+ *
+ * Pre-refactor (0.7.106–0.7.111), font variables came from FOUR places:
+ *   1. `src/utils/font-stack.ts` (DEFAULT_FONTS)
+ *   2. `src/styles/tailwind.css` `:root { ... }` block
+ *   3. `src/styles/tailwind.css` `@theme { ... }` block (generated
+ *      `:root, :host { ... }` in the CSS bundle)
+ *   4. `tailwind.config.js` `fontFamily.*` utility fallback strings
+ *
+ * The @theme block was the load-bearing bug. Its `:root, :host { ... }`
+ * declaration in the CSS bundle loaded AFTER `Default.astro`'s inline
+ * `<style>`, so by CSS cascade (equal specificity, later source order
+ * wins) the brand values were silently clobbered for `--font-serif`,
+ * `--font-sans`, `--font-mono`.
+ *
+ * Post-refactor: this module is the ONLY place that decides which CSS
+ * font variables exist and what their values are. Both
+ * `Default.astro` (build-time SSG inline `<style>`) and
+ * `use-site-config.ts` (runtime `root.style.setProperty` overrides)
+ * call `buildFontVariables()` and emit the same shape.
+ *
+ * DESIGN
+ *
+ * Slot-named variables only. No category-named variables
+ * (`--font-serif`, `--font-sans`) — those bake in "serif↔heading,
+ * sans↔body" assumptions that break when a consumer picks a different
+ * category for a slot. The Tailwind utilities `.font-serif` and
+ * `.font-sans` are kept as backward-compat aliases defined in
+ * `@layer base`, mapped to slot variables.
+ *
+ * Output keys:
+ *   --font-title   — most prominent display text
+ *   --font-heading — h2–h6 section headings
+ *   --font-body    — paragraph text
+ *   --font-mono    — code, pre, kbd
+ */
+
+import { fontStack, DEFAULT_FONTS, DEFAULT_CATEGORY, type FontConfigLike } from './font-stack';
+
+/** Canonical slot names. Any CSS variable not in this list is a bug. */
+export const FONT_SLOTS = ['title', 'heading', 'body', 'mono'] as const;
+export type FontSlot = (typeof FONT_SLOTS)[number];
+
+/** Branding fonts shape — accepts both `header` (legacy alias) and `heading`. */
+export interface BrandingFontsLike {
+  title?: FontConfigLike;
+  heading?: FontConfigLike;
+  /** @deprecated Legacy alias for `heading`. */
+  header?: FontConfigLike;
+  body?: FontConfigLike;
+  mono?: FontConfigLike;
+}
+
+/**
+ * Build the canonical `:root` CSS font-variable map from a branding
+ * config. Every variable the system relies on is present in the output
+ * — no need for fallback definitions elsewhere.
+ *
+ * Values are pre-formed CSS font-family stacks (e.g.
+ * `'Raleway', system-ui, sans-serif`). The caller is responsible for
+ * serializing into a CSS `:root { ... }` block.
+ *
+ * `header` (legacy alias) is read but not emitted as a separate
+ * variable. Its value flows into `--font-heading`. Consumers that
+ * still reference `--font-header` in their CSS get the heading value
+ * via the alias declaration in `@layer base` of tailwind.css.
+ */
+export function buildFontVariables(
+  fonts: BrandingFontsLike | null | undefined,
+): Record<`--font-${FontSlot}`, string> {
+  const f = fonts ?? {};
+  const heading = f.heading ?? f.header;
+  return {
+    '--font-title': fontStack(f.title, DEFAULT_CATEGORY.title) ?? DEFAULT_FONTS.title,
+    '--font-heading': fontStack(heading, DEFAULT_CATEGORY.heading) ?? DEFAULT_FONTS.heading,
+    '--font-body': fontStack(f.body, DEFAULT_CATEGORY.body) ?? DEFAULT_FONTS.body,
+    '--font-mono': fontStack(f.mono, DEFAULT_CATEGORY.mono) ?? DEFAULT_FONTS.mono,
+  };
+}
+
+/**
+ * Serialize the variable map to an inline `:root { ... }` CSS string,
+ * safe to drop into a `<style>` tag.
+ *
+ * Escapes nothing (font stacks come from a controlled source) but
+ * joins with proper CSS syntax. Use this from Default.astro.
+ */
+export function renderFontVariablesInline(
+  fonts: BrandingFontsLike | null | undefined,
+): string {
+  const vars = buildFontVariables(fonts);
+  const body = FONT_SLOTS.map(slot => `--font-${slot}:${vars[`--font-${slot}`]}`).join(';');
+  return `:root{${body}}`;
+}

package/tailwind.config.js

@@ -12,13 +12,11 @@ export default {
   ],
   theme: {
     extend: {
-      fontFamily: {
-        title: ['var(--font-title, "DM Serif Display")', 'Georgia', 'serif'],
-        heading: ['var(--font-heading, "DM Serif Display")', 'Georgia', 'serif'],
-        serif: ['var(--font-header, "DM Serif Display")', 'Georgia', 'serif'],
-        sans: ['var(--font-body, "DM Sans")', 'system-ui', 'sans-serif'],
-        mono: ['var(--font-mono, "JetBrains Mono")', 'ui-monospace', 'monospace'],
-      },
+      // Font utilities are defined in src/styles/tailwind.css @layer base.
+      // They reference slot CSS variables (--font-title, --font-heading,
+      // --font-body, --font-mono) emitted by buildFontVariables() in
+      // src/utils/font-variables.ts. Configuring them here would create
+      // a second source of truth that can drift.
       colors: {
         ink: {
           DEFAULT: '#1a1b2e',
@@ -39,11 +37,6 @@ export default {
           raised: '#ffffff',
         },
       },
-      typography: {
-        serif: {
-          'font-family': 'var(--font-header, "DM Serif Display"), Georgia, serif',
-        },
-      },
     },
   },
   plugins: [],