diff --git a/.changeset/ids-report-grouped-by-requirement.md b/.changeset/ids-report-grouped-by-requirement.md
new file mode 100644
index 000000000..46e4505ef
--- /dev/null
+++ b/.changeset/ids-report-grouped-by-requirement.md
@@ -0,0 +1,13 @@
+---
+"@ifc-lite/viewer": patch
+---
+
+Restructure the IDS HTML report around requirements, and stop emitting an unopenable document for a large model.
+
+The report grouped results only by entity: each specification rendered one flat table whose rows were entities, and a requirement appeared only inside a per-entity `<details>` in the last column, and only when it had failed. Answering the question a reader actually brings to the report — *which requirement is failing, and on what?* — meant expanding every row and tallying by hand. Each specification now leads with one block per requirement carrying the facet type, the checked description, the pass/fail check counts, and the failing elements beneath it with type, name, GlobalId, express id and the written failure reason. The per-entity table is still there, moved into a collapsed `<details>` below.
+
+Grouping happens before `not_applicable` is filtered out, keyed on `requirement.id` rather than on array position, so an entity whose requirement was not applicable does not shift every later requirement's results onto the wrong requirement.
+
+Three pass rates are now reported side by side instead of two, with an explanation of why they legitimately disagree. The check-level rate — one element measured against one requirement — was not computed anywhere before; it is aggregated here from `requirementResults`. The entity-level rate (an entity passes only if all its requirements pass) is `summary.overallPassRate`, read rather than recomputed, and is the figure the report showed before, previously labelled ambiguously as "entity checks". The specification-level rate is the one a compliance deliverable should quote, and the report now says so. Every rate is floored, matching the validator and the in-app panel; the export used to round, so 99.6% could read as 100% while elements were still failing.
+
+Nothing is truncated silently. Failing elements are grouped by IFC type, capped at 5 examples per type and 100 elements per requirement, and every cap states its exact hidden count ("Showing 5 of 312 IfcWall failures"). The per-entity table is capped at 100 rows and emits failing entities first, so the cap can never hide every failure behind a wall of passes. Individual text fields are truncated at a 160-character budget — a count of code points, so a surrogate pair is never split in half — with a visible ellipsis and the untruncated text preserved in a `title` attribute, so a shortened field stays readable rather than being destroyed. The summary card states plainly that the HTML is a summary and that the JSON export holds the complete results.
diff --git a/apps/viewer/src/hooks/ids/idsExportService.test.ts b/apps/viewer/src/hooks/ids/idsExportService.test.ts
new file mode 100644
index 000000000..27cc8d0b3
--- /dev/null
+++ b/apps/viewer/src/hooks/ids/idsExportService.test.ts
@@ -0,0 +1,557 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/. */
+
+/**
+ * Tests for the requirement-level HTML report restructuring.
+ *
+ * The IDS report has three nested levels: specification -> requirement ->
+ * check (one entity measured against one requirement). These tests build
+ * minimal, fully-typed `IDSValidationReport` fixtures — not run through the
+ * real validator — and assert on the rendered HTML string, because the
+ * report is a presentation layer over already-computed validation results
+ * and the thing that ships to a reader IS the markup.
+ */
+
+import { describe, it } from 'node:test';
+import assert from 'node:assert/strict';
+import { Window } from 'happy-dom';
+import type {
+  IDSEntityFacet,
+  IDSEntityResult,
+  IDSRequirement,
+  IDSRequirementResult,
+  IDSSpecification,
+  IDSSpecificationResult,
+  IDSValidationReport,
+} from '@ifc-lite/ids';
+import { buildReportHTML } from './idsExportService.js';
+
+// ----------------------------------------------------------------------------
+// Fixture builders — minimal, fully-typed, no validator involved.
+// ----------------------------------------------------------------------------
+
+function makeFacet(name = 'IFCWALL'): IDSEntityFacet {
+  return { type: 'entity', name: { type: 'simpleValue', value: name } };
+}
+
+function makeRequirement(id: string, description = 'Entity check'): IDSRequirement {
+  return { id, facet: makeFacet(), optionality: 'required', description };
+}
+
+function makeReqResult(
+  requirement: IDSRequirement,
+  status: 'pass' | 'fail' | 'not_applicable',
+  overrides: Partial<IDSRequirementResult> = {},
+): IDSRequirementResult {
+  return {
+    requirement,
+    status,
+    facetType: 'entity',
+    checkedDescription: overrides.checkedDescription ?? requirement.description ?? 'check',
+    failureReason: overrides.failureReason,
+    actualValue: overrides.actualValue,
+    expectedValue: overrides.expectedValue,
+  };
+}
+
+function makeEntity(
+  expressId: number,
+  requirementResults: IDSRequirementResult[],
+  overrides: Partial<IDSEntityResult> = {},
+): IDSEntityResult {
+  return {
+    expressId,
+    modelId: overrides.modelId ?? 'model-1',
+    entityType: overrides.entityType ?? 'IfcWall',
+    entityName: overrides.entityName,
+    globalId: overrides.globalId,
+    passed: requirementResults.every(r => r.status !== 'fail'),
+    requirementResults,
+  };
+}
+
+function makeSpecification(id: string, name: string, requirements: IDSRequirement[]): IDSSpecification {
+  return {
+    id,
+    name,
+    ifcVersions: ['IFC4'],
+    applicability: { facets: [makeFacet()] },
+    requirements,
+  };
+}
+
+function makeSpecResult(specification: IDSSpecification, entityResults: IDSEntityResult[]): IDSSpecificationResult {
+  const applicableCount = entityResults.length;
+  const passedCount = entityResults.filter(e => e.passed).length;
+  const failedCount = applicableCount - passedCount;
+  const passRate = applicableCount > 0 ? Math.floor((passedCount / applicableCount) * 100) : 100;
+  const status: IDSSpecificationResult['status'] =
+    applicableCount === 0 ? 'not_applicable' : failedCount > 0 ? 'fail' : 'pass';
+  return { specification, status, applicableCount, passedCount, failedCount, passRate, entityResults };
+}
+
+function makeReport(specResults: IDSSpecificationResult[]): IDSValidationReport {
+  const totalSpecifications = specResults.length;
+  const passedSpecifications = specResults.filter(s => s.status === 'pass').length;
+  const failedSpecifications = specResults.filter(s => s.status === 'fail').length;
+  const totalEntitiesChecked = specResults.reduce((s, sp) => s + sp.applicableCount, 0);
+  const totalEntitiesPassed = specResults.reduce((s, sp) => s + sp.passedCount, 0);
+  const totalEntitiesFailed = specResults.reduce((s, sp) => s + sp.failedCount, 0);
+  return {
+    document: { info: { title: 'Test IDS' }, specifications: specResults.map(s => s.specification) },
+    modelInfo: { modelId: 'model-1', schemaVersion: 'IFC4', entityCount: 1000 },
+    timestamp: new Date('2026-01-01T00:00:00Z'),
+    summary: {
+      totalSpecifications,
+      passedSpecifications,
+      failedSpecifications,
+      totalEntitiesChecked,
+      totalEntitiesPassed,
+      totalEntitiesFailed,
+      // Mirrors validator.ts calculateSummary, which floors. Rounding here
+      // would make the fixture disagree with the thing it stands in for.
+      overallPassRate: totalEntitiesChecked > 0 ? Math.floor((totalEntitiesPassed / totalEntitiesChecked) * 100) : 100,
+    },
+    specificationResults: specResults,
+  };
+}
+
+function extractRate(html: string, label: string): number {
+  const re = new RegExp(`rate-value">(\\d+)%</span>\\s*<span class="rate-label">${label}`);
+  const m = html.match(re);
+  if (!m) throw new Error(`rate not found for label: ${label}`);
+  return Number(m[1]);
+}
+
+// ----------------------------------------------------------------------------
+
+describe('buildReportHTML — requirement-level grouping', () => {
+  it('computes check-level, entity-level, and specification-level pass rates independently, and they legitimately diverge', () => {
+    const reqA = makeRequirement('req-a', 'Requirement A');
+    const reqB = makeRequirement('req-b', 'Requirement B');
+    // 100 entities, 2 requirements each. Entities 0 and 1 fail requirement A
+    // only (requirement B always passes) — so 2 of 100 entities fail the
+    // specification, but only 2 of 200 individual checks fail.
+    const spec0Entities = Array.from({ length: 100 }, (_, i) =>
+      makeEntity(
+        i,
+        [
+          makeReqResult(reqA, i < 2 ? 'fail' : 'pass', i < 2 ? { failureReason: 'bad wall' } : {}),
+          makeReqResult(reqB, 'pass'),
+        ],
+        { entityName: `Wall ${i}`, globalId: `GID-${i}` },
+      ),
+    );
+    const spec0 = makeSpecResult(makeSpecification('spec-0', 'Mostly Passing Spec', [reqA, reqB]), spec0Entities);
+
+    const otherSpecs = [1, 2, 3].map(n => {
+      const req = makeRequirement(`req-${n}`);
+      const entities = Array.from({ length: 10 }, (_, i) =>
+        makeEntity(i, [makeReqResult(req, 'pass')], { entityName: `E${n}-${i}`, globalId: `G${n}-${i}` }),
+      );
+      return makeSpecResult(makeSpecification(`spec-${n}`, `Passing Spec ${n}`, [req]), entities);
+    });
+
+    const report = makeReport([spec0, ...otherSpecs]);
+    const html = buildReportHTML(report, 'en');
+
+    // Check level (finest): 198 of 200 element-requirement checks in spec-0,
+    // plus 30 of 30 in the other specs = 228 of 230 = 99%.
+    const checkRate = extractRate(html, 'Check pass rate');
+    assert.equal(checkRate, 99);
+
+    // Entity level: an entity passes only if ALL its requirements pass, so
+    // the 2 entities failing requirement A fail entirely — 128 of 130 = 98%.
+    const entityRate = extractRate(html, 'Entity pass rate');
+    assert.equal(entityRate, 98);
+
+    // Specification level (coarsest): spec-0 has 2 failing entities and so
+    // fails outright — only 3 of 4 specifications fully passed = 75%.
+    const specRate = extractRate(html, 'Specification pass rate');
+    assert.equal(specRate, 75);
+
+    assert.notEqual(checkRate, entityRate, 'check and entity rates must be shown independently, not conflated');
+    assert.notEqual(entityRate, specRate, 'entity and specification rates must be shown independently, not conflated');
+    assert.notEqual(checkRate, specRate, 'check and specification rates must be shown independently, not conflated');
+  });
+
+  it('floors every published rate, so a partly-failing model never reads as 100%', () => {
+    // 2 of 3 entities pass one requirement: 66.66..%. Math.round publishes 67.
+    // Every rate the validator publishes is floored (validator.ts
+    // calculateSummary), the in-app panel floors, and this export used to
+    // round -- a real divergence that shipped because no test here ever
+    // exercised a fractional rate; every other case is a clean 0% or 100%.
+    const req = makeRequirement('req-0', 'Wall must carry a Name');
+    const spec = makeSpecification('spec-0', 'Named walls', [req]);
+    const entities = [
+      makeEntity(1, [makeReqResult(req, 'pass')]),
+      makeEntity(2, [makeReqResult(req, 'pass')]),
+      makeEntity(3, [makeReqResult(req, 'fail', { failureReason: 'Name is not set' })]),
+    ];
+    const html = buildReportHTML(makeReport([makeSpecResult(spec, entities)]), 'en');
+
+    assert.equal(extractRate(html, 'Check pass rate'), 66, 'check rate rounded up');
+    assert.equal(extractRate(html, 'Entity pass rate'), 66, 'entity rate rounded up');
+  });
+
+  it('does not count a not_applicable requirement result as a pass', () => {
+    const req = makeRequirement('req-na');
+    const naEntity = makeEntity(1, [makeReqResult(req, 'not_applicable')], {
+      entityName: 'NA Wall',
+      globalId: 'GID-NA',
+    });
+    const passEntity = makeEntity(2, [makeReqResult(req, 'pass')], {
+      entityName: 'Pass Wall',
+      globalId: 'GID-PASS',
+    });
+    const spec = makeSpecResult(makeSpecification('spec-na', 'NA Spec', [req]), [naEntity, passEntity]);
+    const report = makeReport([spec]);
+    const html = buildReportHTML(report, 'en');
+
+    // Exactly one real check (the pass); the not_applicable result must not
+    // inflate either the passed count or the denominator.
+    assert.match(
+      html,
+      /<span class="pass-count">1<\/span>\/<span class="total-count">1<\/span> checks passed \(100%\)/,
+    );
+    assert.match(html, /1 not applicable/);
+    assert.ok(
+      !/<span class="total-count">2<\/span>/.test(html),
+      'not_applicable must not be counted toward the checked total',
+    );
+  });
+
+  it('truncates a requirement failing across many entities, grouping by type and stating the hidden count', () => {
+    const req = makeRequirement('req-bulk');
+    const entities = Array.from({ length: 300 }, (_, i) =>
+      makeEntity(i, [makeReqResult(req, 'fail', { failureReason: `Missing FireRating on wall ${i}` })], {
+        entityType: 'IfcWall',
+        entityName: `Wall ${i}`,
+        globalId: `GID-fail-${i}`,
+      }),
+    );
+    const spec = makeSpecResult(makeSpecification('spec-bulk', 'Bulk Fail Spec', [req]), entities);
+    const report = makeReport([spec]);
+    const html = buildReportHTML(report, 'en');
+
+    assert.match(html, /Showing 5 of 300 IfcWall failures/);
+    assert.match(html, /Showing 5 of 300 failing elements for this requirement \(295 hidden\)/);
+
+    const failuresBlock = html.match(/<div class="req-group-failures">([\s\S]*?)<\/table>/);
+    assert.ok(failuresBlock, 'requirement failures block must be present');
+    const rowCount = (failuresBlock![1].match(/<tr class="entity-row"/g) ?? []).length;
+    assert.equal(rowCount, 5, 'only ~5 example rows are rendered per type, not all 300');
+
+    // The examples shown are the first 5 encountered, not an arbitrary slice.
+    assert.ok(failuresBlock![1].includes('GID-fail-0'));
+    assert.ok(failuresBlock![1].includes('GID-fail-4'));
+    assert.ok(!failuresBlock![1].includes('GID-fail-5'), 'the 6th example must be hidden, not shown');
+  });
+
+  it('HTML-escapes every interpolated value used in a requirement failure', () => {
+    const req = makeRequirement('req-esc', 'Name must not contain <script>');
+    const evilName = `<script>alert(1)</script>"'`;
+    const entity = makeEntity(
+      1,
+      [makeReqResult(req, 'fail', { failureReason: `Bad name: ${evilName}` })],
+      { entityName: evilName, globalId: `GID"'<script>` },
+    );
+    const spec = makeSpecResult(makeSpecification('spec-esc', 'Spec <b>bold</b>', [req]), [entity]);
+    const report = makeReport([spec]);
+    const html = buildReportHTML(report, 'en');
+
+    assert.ok(!html.includes('<script>alert(1)</script>'), 'a raw <script> tag must never appear unescaped');
+    assert.ok(!html.includes('<b>bold</b>'), 'the specification name must be escaped, not raw HTML');
+
+    assert.ok(html.includes('&lt;script&gt;alert(1)&lt;/script&gt;'), 'entity name is escaped');
+    assert.ok(html.includes('Spec &lt;b&gt;bold&lt;/b&gt;'), 'specification name is escaped');
+    assert.ok(html.includes('Bad name: &lt;script&gt;alert(1)&lt;/script&gt;'), 'failure reason is escaped');
+    assert.ok(html.includes('Name must not contain &lt;script&gt;'), 'checkedDescription is escaped');
+  });
+});
+
+describe('buildReportHTML — long field truncation', () => {
+  it('truncates a long failure reason with a visible ellipsis and keeps the full text recoverable', () => {
+    // 500 characters: comfortably past the 160-character budget, and a
+    // repeating marker lets us prove exactly where the cut landed.
+    const longReason = 'A'.repeat(400) + 'TAIL-MARKER';
+    const req = makeRequirement('req-long', 'Short description');
+    const entity = makeEntity(1, [makeReqResult(req, 'fail', { failureReason: longReason })], {
+      entityName: 'Wall 1',
+      globalId: 'GID-1',
+    });
+    const html = buildReportHTML(
+      makeReport([makeSpecResult(makeSpecification('spec-long', 'Long Spec', [req]), [entity])]),
+      'en',
+    );
+
+    // Truncated: the tail is NOT in the rendered cell text...
+    assert.ok(
+      !html.includes(`>${longReason}<`),
+      'the full reason must not be rendered as visible cell text',
+    );
+    // ...the cut is announced with an ellipsis, not a silent stop...
+    assert.match(html, /A{160}&hellip;<\/span>/, 'exactly 160 characters then an ellipsis entity');
+    assert.ok(!/A{161}&hellip;/.test(html), 'must not exceed the 160-character budget');
+
+    // ...and the full value stays reachable via the title attribute.
+    assert.ok(
+      html.includes(`title="${longReason}"`),
+      'the untruncated reason must survive in the title attribute',
+    );
+  });
+
+  it('leaves a field at or under the budget completely untouched — no ellipsis, no wrapper', () => {
+    const shortReason = 'B'.repeat(160);
+    const req = makeRequirement('req-edge');
+    const entity = makeEntity(1, [makeReqResult(req, 'fail', { failureReason: shortReason })]);
+    const html = buildReportHTML(
+      makeReport([makeSpecResult(makeSpecification('spec-edge', 'Edge Spec', [req]), [entity])]),
+      'en',
+    );
+
+    assert.ok(html.includes(shortReason), 'a 160-character field is rendered whole');
+    assert.ok(
+      !html.includes(`title="${shortReason}"`),
+      'a field within budget gets no title attribute and no truncation wrapper',
+    );
+  });
+
+  it('escapes a hostile string inside the title attribute of a truncated field', () => {
+    // Long enough to be truncated, and built so the DANGEROUS characters land
+    // in the tail — i.e. only in the title attribute, never in visible text.
+    // An unescaped quote here would close the attribute and let the rest of
+    // the string become markup.
+    const hostileTail = `" onmouseover="alert(1)" x="<script>alert(2)</script>`;
+    const longHostile = 'C'.repeat(200) + hostileTail;
+    const req = makeRequirement('req-hostile');
+    const entity = makeEntity(1, [makeReqResult(req, 'fail', { failureReason: longHostile })], {
+      entityName: 'D'.repeat(200) + hostileTail,
+    });
+    const html = buildReportHTML(
+      makeReport([makeSpecResult(makeSpecification('spec-hostile', 'Hostile Spec', [req]), [entity])]),
+      'en',
+    );
+
+    // The literal text `onmouseover=` survives escaping (only the quotes and
+    // angle brackets change), so assert on the form that would actually be a
+    // live attribute: the name followed by an UNESCAPED quote.
+    assert.ok(
+      !html.includes('onmouseover="'),
+      'the injected attribute must never appear followed by a raw quote, i.e. as live markup',
+    );
+    assert.ok(!/"\s+onmouseover/.test(html), 'no raw quote may close the title attribute early');
+    assert.ok(!html.includes('<script>alert(2)</script>'), 'no raw script tag anywhere');
+    assert.ok(
+      html.includes('&quot; onmouseover=&quot;alert(1)&quot;'),
+      'quotes inside the title attribute are escaped',
+    );
+    assert.ok(
+      html.includes('&lt;script&gt;alert(2)&lt;/script&gt;'),
+      'angle brackets inside the title attribute are escaped',
+    );
+  });
+
+  it('truncates on code points, never splitting a surrogate pair', () => {
+    // 200 astral-plane characters, each a surrogate PAIR in UTF-16. A
+    // UTF-16-based slice(0, 160) would cut at 80 emoji plus half of the 81st,
+    // emitting a lone surrogate. A code-point slice yields 160 whole emoji.
+    const emoji = '\u{1F9F1}'; // brick
+    const req = makeRequirement('req-emoji');
+    const entity = makeEntity(1, [makeReqResult(req, 'fail', { failureReason: emoji.repeat(200) })]);
+    const html = buildReportHTML(
+      makeReport([makeSpecResult(makeSpecification('spec-emoji', 'Emoji Spec', [req]), [entity])]),
+      'en',
+    );
+
+    const cell = html.match(/<td class="col-failure">([\s\S]*?)<\/td>/);
+    assert.ok(cell, 'failure cell must be present');
+    const visible = cell![1].replace(/<[^>]*>/g, '').replace('&hellip;', '');
+    assert.equal(Array.from(visible).length, 160, '160 whole code points are shown');
+    assert.ok(
+      !/[\uD800-\uDBFF](?![\uDC00-\uDFFF])/.test(visible),
+      'no unpaired high surrogate may be emitted',
+    );
+  });
+});
+
+describe('buildReportHTML — per-entity table truncation', () => {
+  it('caps the per-entity table, lists failing entities first, and states the hidden count', () => {
+    const req = makeRequirement('req-cap');
+    // 250 entities where the ONLY failures sit at the very end of the array.
+    // A naive slice(0, 100) would render 100 passes and hide every failure.
+    const entities = Array.from({ length: 250 }, (_, i) =>
+      makeEntity(
+        i,
+        [makeReqResult(req, i >= 245 ? 'fail' : 'pass', i >= 245 ? { failureReason: `late failure ${i}` } : {})],
+        { entityName: `Wall ${i}`, globalId: `GID-${i}` },
+      ),
+    );
+    const html = buildReportHTML(
+      makeReport([makeSpecResult(makeSpecification('spec-cap', 'Capped Spec', [req]), entities)]),
+      'en',
+    );
+
+    const tbody = html.match(/<tbody id="tbody-0">([\s\S]*?)<\/tbody>/);
+    assert.ok(tbody, 'per-entity tbody must be present');
+    const rows = tbody![1].match(/<tr class="entity-row"/g) ?? [];
+    assert.equal(rows.length, 100, 'the per-entity table is capped, not emitted in full');
+
+    assert.match(
+      html,
+      /Showing 100 of 250 entities \(150 hidden, failing entities listed first\)/,
+      'the hidden count must be stated exactly',
+    );
+
+    // Every late failure survives the cap because failures are ordered first.
+    for (let i = 245; i < 250; i++) {
+      assert.ok(tbody![1].includes(`GID-${i}`), `failing entity ${i} must survive the cap`);
+    }
+    // And the first passing entity is still present, just after the failures.
+    assert.ok(tbody![1].includes('GID-0'), 'passing entities fill the remaining budget');
+  });
+
+  it('adds no truncation note when every entity fits under the cap', () => {
+    const req = makeRequirement('req-small');
+    const entities = Array.from({ length: 3 }, (_, i) => makeEntity(i, [makeReqResult(req, 'pass')]));
+    const html = buildReportHTML(
+      makeReport([makeSpecResult(makeSpecification('spec-small', 'Small Spec', [req]), entities)]),
+      'en',
+    );
+
+    assert.ok(!/\d+ hidden/.test(html), 'no hidden-count note when nothing was hidden');
+  });
+});
+
+// ----------------------------------------------------------------------------
+// Search behaviour — the report's inline `filterAll()` driven for real.
+//
+// The other suites in this file assert on the markup string. Search cannot be
+// asserted that way: it is behaviour of the inline `<script>`, and the defect
+// this suite pins (a `[title]` sweep that swallowed the static "Click to copy"
+// hint on every GlobalId cell) is invisible in the markup — both the hint and
+// the untruncated values are just `title` attributes.
+//
+// The harness parses the whole generated document into happy-dom, then takes
+// the report's own inline `<script>` source verbatim out of the same HTML and
+// evaluates it against that document, handing back the page's real
+// `filterAll`. (happy-dom needs `enableJavaScriptEvaluation` to run page
+// scripts, and even then a top-level `function` declaration does not surface on
+// the window object — so the script is driven explicitly rather than implicitly.
+// The source under test is byte-for-byte what ships.)
+//
+// What this does NOT cover: the browser's event wiring (nothing here fires the
+// search box's `oninput`, so only `filterAll` itself is exercised), CSS —
+// `.hidden` is asserted as a class, not as computed visibility — and the
+// click-to-copy clipboard handler.
+// ----------------------------------------------------------------------------
+
+interface ReportPage {
+  filterAll: () => void;
+  document: Document;
+  close: () => void;
+}
+
+function renderReport(html: string): ReportPage {
+  const window = new Window({ url: 'http://localhost/' });
+  window.document.write(html);
+
+  const script = /<script>([\s\S]*?)<\/script>/.exec(html);
+  assert.ok(script, 'the report must carry exactly one inline script — the harness depends on it');
+  const evaluate = new Function('window', 'document', 'navigator', `${script![1]}\nreturn filterAll;`) as (
+    w: unknown,
+    d: unknown,
+    n: unknown,
+  ) => () => void;
+
+  return {
+    filterAll: evaluate(window, window.document, window.navigator),
+    document: window.document as unknown as Document,
+    close: () => {
+      window.close();
+    },
+  };
+}
+
+function searchRows(page: ReportPage, term: string): { visible: string[]; total: number; count: string } {
+  const input = page.document.getElementById('search') as HTMLInputElement | null;
+  assert.ok(input, 'the report must have a search box');
+  input!.value = term;
+  page.filterAll();
+  const rows = Array.from(page.document.querySelectorAll('.entity-row')) as HTMLElement[];
+  return {
+    visible: rows.filter(r => !r.classList.contains('hidden')).map(r => r.dataset.name ?? ''),
+    total: rows.length,
+    count: page.document.getElementById('result-count')?.textContent ?? '',
+  };
+}
+
+describe('buildReportHTML — search matches content, not chrome', () => {
+  // A failing entity whose failure reason overruns the character budget, so the
+  // full reason exists ONLY in a `title` attribute. Deliberately not the entity
+  // *name*: the name is also copied verbatim into `data-name`, which search has
+  // always read, so a name-based fixture could not tell "search reads titles"
+  // from "search reads data-name".
+  const TAIL = 'zztailmarker';
+  const LONG_REASON = `${'R'.repeat(200)} ${TAIL}`;
+
+  function buildTwoRowReport(): string {
+    const req = makeRequirement('req-search');
+    const failing = makeEntity(1, [makeReqResult(req, 'fail', { failureReason: LONG_REASON })], {
+      entityName: 'Failing Wall',
+      globalId: 'GID-FAIL',
+    });
+    const passing = makeEntity(2, [makeReqResult(req, 'pass')], {
+      entityName: 'Passing Wall',
+      globalId: 'GID-PASS',
+    });
+    return buildReportHTML(
+      makeReport([makeSpecResult(makeSpecification('spec-search', 'Search Spec', [req]), [failing, passing])]),
+      'en',
+    );
+  }
+
+  it('does not match rows on the static "Click to copy" GlobalId hint', () => {
+    const page = renderReport(buildTwoRowReport());
+    try {
+      assert.ok(
+        page.document.querySelector('.globalid[title="Click to copy"]'),
+        'fixture check: the GlobalId cells must still carry the copy hint',
+      );
+
+      const hit = searchRows(page, 'ick to cop');
+      assert.equal(
+        hit.visible.length,
+        0,
+        'a substring of the "Click to copy" affordance is chrome, not content — it must match no row',
+      );
+      assert.equal(hit.count, `0 of ${hit.total} rows shown`, 'the count must report the empty result honestly');
+    } finally {
+      page.close();
+    }
+  });
+
+  it('still matches untruncated text that exists only in a title attribute', () => {
+    const page = renderReport(buildTwoRowReport());
+    try {
+      assert.ok(
+        !page.document.body.textContent?.includes(TAIL),
+        `fixture check: "${TAIL}" must be truncated away from visible text, reachable only via title`,
+      );
+
+      // The failing entity is rendered twice — once in the per-entity table and
+      // once in the requirement's failing-elements table — and both rows carry
+      // the reason, so match on the set of names rather than a row count.
+      const hit = searchRows(page, TAIL);
+      assert.ok(hit.visible.length > 0, 'the search must match something');
+      assert.deepEqual(
+        [...new Set(hit.visible)],
+        ['Failing Wall'],
+        'the untruncated value carried in a title must still be searchable — that is the feature',
+      );
+    } finally {
+      page.close();
+    }
+  });
+});
diff --git a/apps/viewer/src/hooks/ids/idsExportService.ts b/apps/viewer/src/hooks/ids/idsExportService.ts
index bafb45aac..f4c5edb70 100644
--- a/apps/viewer/src/hooks/ids/idsExportService.ts
+++ b/apps/viewer/src/hooks/ids/idsExportService.ts
@@ -79,12 +79,257 @@ function escapeHtml(str: string | undefined | null): string {
     .replace(/'/g, '&#39;');
 }
 
-/** Build entity rows HTML for a specification table */
+// ============================================================================
+// Requirement-level grouping
+//
+// An IDS report has three nested levels: specification -> requirement ->
+// check (one entity measured against one requirement). The validator's
+// `IDSEntityResult.requirementResults` array carries one entry per
+// requirement per entity, in the same order as `spec.requirements` for
+// every entity (see `validateEntityRequirements` in
+// packages/ids/src/validation/validator.ts, which loops
+// `for (const requirement of spec.requirements)` for every entity). Each
+// `IDSRequirementResult.requirement.id` is assigned once per specification
+// by the XML parser (`req-${reqIndex++}`, reset per spec — see
+// packages/ids/src/parser/xml-parser.ts) and is the SAME object reference
+// reused across every entity's result, so grouping by `requirement.id` is a
+// stable, order-preserving key even if a future producer of
+// `IDSEntityResult` reorders or omits entries.
+// ============================================================================
+
+interface FailingElement {
+  entityType: string;
+  entityName?: string;
+  globalId?: string;
+  expressId: number;
+  failureReason?: string;
+}
+
+interface RequirementGroup {
+  id: string;
+  facetType: string;
+  checkedDescription: string;
+  /** Checks that passed for this requirement, across all entities. */
+  passed: number;
+  /** Checks that failed for this requirement, across all entities. */
+  failed: number;
+  /**
+   * Checks that were not_applicable for this requirement. Excluded from
+   * both the passed and failed counts, and from the pass-rate denominator
+   * — consistent with how the validator's own applicableCount/passedCount
+   * treat entities that don't match applicability at all.
+   */
+  notApplicable: number;
+  failingElements: FailingElement[];
+}
+
+/**
+ * Group a specification's per-entity requirement results by requirement,
+ * across ALL entities. This groups first and classifies status second —
+ * grouping after filtering out `not_applicable` would break the index/id
+ * alignment between an entity's `requirementResults` and the
+ * specification's `requirements`.
+ */
+function buildRequirementGroups(
+  spec: IDSValidationReport['specificationResults'][0],
+): RequirementGroup[] {
+  const groups = new Map<string, RequirementGroup>();
+
+  for (const entity of spec.entityResults) {
+    for (const rr of entity.requirementResults) {
+      const key = rr.requirement.id;
+      let group = groups.get(key);
+      if (!group) {
+        group = {
+          id: key,
+          facetType: rr.facetType,
+          checkedDescription: rr.checkedDescription,
+          passed: 0,
+          failed: 0,
+          notApplicable: 0,
+          failingElements: [],
+        };
+        groups.set(key, group);
+      }
+
+      if (rr.status === 'pass') {
+        group.passed++;
+      } else if (rr.status === 'fail') {
+        group.failed++;
+        group.failingElements.push({
+          entityType: entity.entityType,
+          entityName: entity.entityName,
+          globalId: entity.globalId,
+          expressId: entity.expressId,
+          failureReason: rr.failureReason,
+        });
+      } else {
+        group.notApplicable++;
+      }
+    }
+  }
+
+  return Array.from(groups.values());
+}
+
+/** Reference truncation caps for failing-element lists in the HTML report. */
+const FAILING_ELEMENTS_TOTAL_CAP = 100;
+const FAILING_ELEMENTS_PER_TYPE_CAP = 5;
+
+/**
+ * Row cap for the secondary per-entity table. Without it a specification
+ * applicable to thousands of entities emits thousands of `<tr>` into the
+ * single self-contained HTML string, which is the file-size problem the
+ * requirement grouping alone does not solve — the rows merely moved inside
+ * a `<details>`, they were still all emitted.
+ */
+const ENTITY_ROWS_CAP = 100;
+
+/**
+ * Character budget for a single rendered text field.
+ *
+ * IFC-supplied strings have no length limit: a `Description`, a property
+ * value echoed into `failureReason`, or an element name generated by an
+ * authoring tool can run to thousands of characters and blow out the table
+ * layout. Budgeting in CHARACTERS rather than guessing at pixels keeps the
+ * cut deterministic and testable.
+ */
+const FIELD_CHAR_BUDGET = 160;
+
+/**
+ * Render one text field for display, truncated to a character budget.
+ *
+ * Truncation must never destroy the value: when the field is cut, the full
+ * text is preserved verbatim in a `title` attribute (hover / assistive
+ * tooltip), and the cut itself is made visible with an ellipsis rather than
+ * ending mid-word with no signal. Both the visible text and the `title`
+ * attribute go through `escapeHtml`, which escapes `"` and `'` as well as
+ * `<`, `>` and `&` — an unescaped quote inside `title` would otherwise let
+ * an IFC-supplied string break out of the attribute.
+ *
+ * The slice is taken over code points (`Array.from`), not UTF-16 code
+ * units, so truncating never splits a surrogate pair into a lone half.
+ */
+function truncateField(
+  value: string | undefined | null,
+  esc: typeof escapeHtml,
+  budget: number = FIELD_CHAR_BUDGET,
+): string {
+  if (value == null) return '';
+  const text = String(value);
+  const chars = Array.from(text);
+  if (chars.length <= budget) return esc(text);
+  return `<span class="truncated" title="${esc(text)}">${esc(chars.slice(0, budget).join(''))}&hellip;</span>`;
+}
+
+/**
+ * Render a requirement's failing elements, truncated so a requirement that
+ * fails on thousands of entities doesn't produce an unopenable document.
+ * Elements are grouped by IFC type first (a systemic problem on one type is
+ * one problem, not N), capped at ~5 examples per type, and capped overall
+ * at ~100 elements. Every truncation is stated with an exact hidden count —
+ * nothing is dropped silently.
+ */
+function buildFailingElementsHTML(elements: FailingElement[], esc: typeof escapeHtml): string {
+  if (elements.length === 0) return '';
+
+  const byType = new Map<string, FailingElement[]>();
+  for (const el of elements) {
+    const list = byType.get(el.entityType);
+    if (list) {
+      list.push(el);
+    } else {
+      byType.set(el.entityType, [el]);
+    }
+  }
+
+  const rows: string[] = [];
+  const typeNotes: string[] = [];
+  let shown = 0;
+
+  for (const [type, elems] of byType) {
+    if (shown >= FAILING_ELEMENTS_TOTAL_CAP) break;
+    const budget = FAILING_ELEMENTS_TOTAL_CAP - shown;
+    const take = Math.min(FAILING_ELEMENTS_PER_TYPE_CAP, elems.length, budget);
+
+    for (let i = 0; i < take; i++) {
+      const el = elems[i];
+      rows.push(`<tr class="entity-row" data-status="fail" data-type="${esc(el.entityType)}" data-name="${esc(el.entityName ?? '')}">
+            <td class="col-type">${esc(el.entityType)}</td>
+            <td class="col-name">${truncateField(el.entityName, esc) || '<em>unnamed</em>'}</td>
+            <td class="col-globalid"><code class="globalid" title="Click to copy">${esc(el.globalId) || '—'}</code></td>
+            <td class="col-expressid">${el.expressId}</td>
+            <td class="col-failure">${truncateField(el.failureReason, esc) || '—'}</td>
+          </tr>`);
+    }
+    shown += take;
+
+    if (elems.length > take) {
+      typeNotes.push(`Showing ${take} of ${elems.length} ${esc(type)} failures`);
+    }
+  }
+
+  const hidden = elements.length - shown;
+
+  return `<table class="req-fail-table">
+        <thead>
+          <tr>
+            <th class="col-type">IFC Class</th>
+            <th class="col-name">Name</th>
+            <th class="col-globalid">GlobalId</th>
+            <th class="col-expressid">ID</th>
+            <th class="col-failure">Reason</th>
+          </tr>
+        </thead>
+        <tbody>${rows.join('')}</tbody>
+      </table>
+      ${typeNotes.length > 0 ? `<div class="truncation-note">${typeNotes.map(n => `<div>${n}</div>`).join('')}</div>` : ''}
+      ${hidden > 0 ? `<div class="truncation-note truncation-total">Showing ${shown} of ${elements.length} failing elements for this requirement (${hidden} hidden). See the JSON export for complete results.</div>` : ''}`;
+}
+
+/** Render one requirement block: facet, description, pass/fail counts, and failing elements. */
+function buildRequirementGroupHTML(group: RequirementGroup, esc: typeof escapeHtml): string {
+  const totalChecked = group.passed + group.failed;
+  // Floor, not round, and deliberately: the validator floors every rate it
+  // publishes (validator.ts calculateSummary), and the in-app panel matches.
+  // Rounding here would also let 99.6% render as "100%" while elements are
+  // still failing, which is the one thing a compliance report must not do.
+  const passRate = totalChecked > 0 ? Math.floor((group.passed / totalChecked) * 100) : 100;
+  const status = group.failed > 0 ? 'fail' : 'pass';
+
+  return `<div class="req-group req-group-${status}">
+        <div class="req-group-header">
+          <span class="badge ${status === 'pass' ? 'badge-pass' : 'badge-fail'}">${status === 'pass' ? 'PASS' : 'FAIL'}</span>
+          <span class="req-facet">${esc(group.facetType)}</span>
+          <span class="req-desc">${truncateField(group.checkedDescription, esc)}</span>
+        </div>
+        <div class="req-group-stats">
+          <span class="pass-count">${group.passed}</span>/<span class="total-count">${totalChecked}</span> checks passed (${passRate}%)
+          ${group.notApplicable > 0 ? `<span class="req-na">&middot; ${group.notApplicable} not applicable</span>` : ''}
+        </div>
+        ${group.failed > 0 ? `<div class="req-group-failures">${buildFailingElementsHTML(group.failingElements, esc)}</div>` : ''}
+      </div>`;
+}
+
+/**
+ * Build entity rows HTML for a specification table, capped at
+ * `ENTITY_ROWS_CAP`.
+ *
+ * Failing entities are emitted first so that the cap can never hide every
+ * failure behind a wall of passes — the table is sortable in the browser
+ * anyway, so the emitted order is a truncation-safety choice, not a
+ * presentation preference. The caller renders the hidden count; nothing
+ * disappears without being stated.
+ */
 function buildEntityRows(
   spec: IDSValidationReport['specificationResults'][0],
   esc: typeof escapeHtml,
 ): string {
-  return spec.entityResults.map(entity => {
+  const ordered = [
+    ...spec.entityResults.filter(e => !e.passed),
+    ...spec.entityResults.filter(e => e.passed),
+  ];
+  return ordered.slice(0, ENTITY_ROWS_CAP).map(entity => {
     const failedReqs = entity.requirementResults.filter(r => r.status === 'fail');
     const passedReqs = entity.requirementResults.filter(r => r.status === 'pass');
     const allReqs = entity.requirementResults.filter(r => r.status !== 'not_applicable');
@@ -92,16 +337,16 @@ function buildEntityRows(
     const reqDetails = failedReqs.length > 0
       ? failedReqs.map(req => `<div class="req-detail">
             <span class="req-facet">${esc(req.facetType)}</span>
-            <span class="req-desc">${esc(req.checkedDescription)}</span>
-            ${req.failureReason ? `<div class="req-failure">${esc(req.failureReason)}</div>` : ''}
-            ${req.expectedValue || req.actualValue ? `<div class="req-values">${req.expectedValue ? `<span>Expected: <code>${esc(req.expectedValue)}</code></span>` : ''}${req.actualValue ? `<span>Actual: <code>${esc(req.actualValue)}</code></span>` : ''}</div>` : ''}
+            <span class="req-desc">${truncateField(req.checkedDescription, esc)}</span>
+            ${req.failureReason ? `<div class="req-failure">${truncateField(req.failureReason, esc)}</div>` : ''}
+            ${req.expectedValue || req.actualValue ? `<div class="req-values">${req.expectedValue ? `<span>Expected: <code>${truncateField(req.expectedValue, esc)}</code></span>` : ''}${req.actualValue ? `<span>Actual: <code>${truncateField(req.actualValue, esc)}</code></span>` : ''}</div>` : ''}
           </div>`).join('')
       : '<span class="all-pass">All requirements passed</span>';
 
     return `<tr class="entity-row" data-status="${entity.passed ? 'pass' : 'fail'}" data-type="${esc(entity.entityType)}" data-name="${esc(entity.entityName ?? '')}">
         <td class="col-status"><span class="badge ${entity.passed ? 'badge-pass' : 'badge-fail'}">${entity.passed ? 'PASS' : 'FAIL'}</span></td>
         <td class="col-type">${esc(entity.entityType)}</td>
-        <td class="col-name">${esc(entity.entityName) || '<em>unnamed</em>'}</td>
+        <td class="col-name">${truncateField(entity.entityName, esc) || '<em>unnamed</em>'}</td>
         <td class="col-globalid"><code class="globalid" title="Click to copy">${esc(entity.globalId) || '\u2014'}</code></td>
         <td class="col-expressid">${entity.expressId}</td>
         <td class="col-reqs"><span class="pass-count">${passedReqs.length}</span>/<span class="total-count">${allReqs.length}</span></td>
@@ -119,7 +364,46 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
   const totalChecks = report.summary.totalEntitiesChecked;
   const totalPassed = report.specificationResults.reduce((s, sp) => s + sp.passedCount, 0);
   const totalFailed = report.specificationResults.reduce((s, sp) => s + sp.failedCount, 0);
-  const overallPassRate = totalChecks > 0 ? Math.round((totalPassed / totalChecks) * 100) : 0;
+
+  // Requirement groups per specification, built once and reused for both
+  // the requirement blocks and the check-level tally below.
+  const requirementGroupsBySpec = report.specificationResults.map(spec => buildRequirementGroups(spec));
+
+  // Three levels, three DIFFERENT and DELIBERATELY DISTINCT rates. None of
+  // them repurposes an existing field's meaning — `report.summary` is
+  // consumed by the CLI/BCF/JSON exports too, so its fields keep exactly
+  // the meaning the validator gives them.
+  //
+  // - Check (finest): one element measured against one requirement. Not
+  //   computed anywhere upstream — aggregated here from
+  //   `requirementResults` via `buildRequirementGroups`.
+  // - Entity: an entity passes only if ALL its requirements pass
+  //   (`validateEntityRequirements` in packages/ids/src/validation/validator.ts
+  //   ANDs across `spec.requirements`). This is `report.summary.overallPassRate`,
+  //   read directly rather than recomputed, and is the rate the report showed
+  //   before this change.
+  // - Specification (coarsest): a specification passes only if every one of
+  //   its entities passes, so a handful of scattered failures can fail many
+  //   specifications while the entity- and check-level rates stay high.
+  //   This is the number that matters for a compliance deliverable.
+  let checkPassed = 0;
+  let checkFailed = 0;
+  for (const groups of requirementGroupsBySpec) {
+    for (const group of groups) {
+      checkPassed += group.passed;
+      checkFailed += group.failed;
+    }
+  }
+  const totalChecksAtCheckLevel = checkPassed + checkFailed;
+  const checkLevelPassRate =
+    totalChecksAtCheckLevel > 0 ? Math.floor((checkPassed / totalChecksAtCheckLevel) * 100) : 100;
+
+  const entityLevelPassRate = report.summary.overallPassRate;
+
+  const specLevelPassRate =
+    report.summary.totalSpecifications > 0
+      ? Math.floor((report.summary.passedSpecifications / report.summary.totalSpecifications) * 100)
+      : 100;
 
   return `<!DOCTYPE html>
 <html lang="${esc(locale)}">
@@ -223,6 +507,41 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
     .pass-count { color: var(--pass); font-weight: 600; }
     .total-count { color: var(--muted); }
 
+    /* Two-rates (check level vs specification level) */
+    .two-rates { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 16px; }
+    .rate-block { padding: 12px; background: var(--bg); border-radius: 8px; border: 1px solid var(--border); }
+    .rate-block-header { display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px; }
+    .rate-value { font-size: 1.5rem; font-weight: 700; }
+    .rate-label { color: var(--muted); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em; }
+    .rate-detail { color: var(--muted); font-size: 0.8rem; margin-top: 4px; }
+    .rate-explainer { font-size: 0.8rem; color: var(--muted); margin-top: 12px; line-height: 1.6; }
+    .export-note { font-size: 0.8rem; color: var(--muted); margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); }
+
+    /* Requirement groups */
+    .req-groups { padding: 16px; }
+    .req-groups h4 { margin-bottom: 10px; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); }
+    .req-group { border: 1px solid var(--border); border-radius: 6px; padding: 10px 12px; margin-bottom: 8px; }
+    .req-group-pass { background: var(--pass-bg); border-color: var(--pass-border); }
+    .req-group-fail { background: #fffbeb; border-color: var(--warn); }
+    .req-group-header { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
+    .req-group-stats { font-size: 0.8rem; color: var(--muted); margin-top: 4px; }
+    .req-na { color: var(--muted); }
+    .req-group-failures { margin-top: 10px; }
+    .req-fail-table { width: 100%; border-collapse: collapse; font-size: 0.8rem; background: var(--card); }
+    .req-fail-table th { padding: 6px 10px; text-align: left; background: var(--bg); font-weight: 600; font-size: 0.7rem; text-transform: uppercase; color: var(--muted); border-bottom: 2px solid var(--border); }
+    .req-fail-table td { padding: 6px 10px; border-bottom: 1px solid #f1f5f9; vertical-align: top; }
+    .col-failure { min-width: 200px; color: var(--fail); }
+    .truncation-note { font-size: 0.75rem; color: var(--muted); font-style: italic; margin-top: 6px; padding: 0 10px; }
+    /* A truncated field keeps its full text in a title attribute; cue that it is hoverable. */
+    .truncated { border-bottom: 1px dotted var(--muted); cursor: help; }
+    .truncation-total { font-weight: 600; }
+
+    /* Secondary per-entity table */
+    .entity-table-details { padding: 0 16px 16px; }
+    .entity-table-details summary { cursor: pointer; font-size: 0.85rem; color: var(--muted); padding: 8px 0; }
+    .entity-table-details summary:hover { color: #1e293b; }
+    .entity-table-details table { border-top: 1px solid var(--border); }
+
     /* Responsive */
     @media (max-width: 768px) {
       .col-globalid, .col-expressid { display: none; }
@@ -258,10 +577,6 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
   <!-- Summary -->
   <div class="card">
     <h2>Summary</h2>
-    <div class="progress">
-      <div class="progress-fill" style="width: ${overallPassRate}%;"></div>
-    </div>
-    <div style="text-align: center; font-size: 0.875rem; color: var(--muted);">${overallPassRate}% of entity checks passed</div>
     <div class="summary">
       <div class="stat">
         <div class="value">${report.summary.totalSpecifications}</div>
@@ -288,6 +603,52 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
         <div class="label">Failed</div>
       </div>
     </div>
+
+    <!-- The three rates below measure different things and are EXPECTED to
+         disagree; see the explanation text. -->
+    <div class="two-rates">
+      <div class="rate-block">
+        <div class="rate-block-header">
+          <span class="rate-value">${checkLevelPassRate}%</span>
+          <span class="rate-label">Check pass rate</span>
+        </div>
+        <div class="progress"><div class="progress-fill" style="width: ${checkLevelPassRate}%;"></div></div>
+        <div class="rate-detail">${checkPassed} of ${totalChecksAtCheckLevel} element&ndash;requirement checks passed</div>
+      </div>
+      <div class="rate-block">
+        <div class="rate-block-header">
+          <span class="rate-value">${entityLevelPassRate}%</span>
+          <span class="rate-label">Entity pass rate</span>
+        </div>
+        <div class="progress"><div class="progress-fill" style="width: ${entityLevelPassRate}%;"></div></div>
+        <div class="rate-detail">${totalPassed} of ${totalChecks} applicable entities passed every requirement</div>
+      </div>
+      <div class="rate-block">
+        <div class="rate-block-header">
+          <span class="rate-value">${specLevelPassRate}%</span>
+          <span class="rate-label">Specification pass rate</span>
+        </div>
+        <div class="progress"><div class="progress-fill" style="width: ${specLevelPassRate}%;"></div></div>
+        <div class="rate-detail">${report.summary.passedSpecifications} of ${report.summary.totalSpecifications} specifications fully passed</div>
+      </div>
+    </div>
+    <p class="rate-explainer">
+      These three numbers can legitimately differ &mdash; each answers a different question. <strong>Check
+      pass rate</strong> is how much of the model is compliant, check by check (one element measured against
+      one requirement). <strong>Entity pass rate</strong> requires an entity to pass every requirement of its
+      specification to count as passing at all. <strong>Specification pass rate</strong> goes one step further:
+      a specification passes only if every applicable entity passes it &mdash; one failing element fails the
+      whole specification, the way one missing handrail fails a safety inspection. For a compliance
+      deliverable, the specification pass rate is the number that matters: &ldquo;we passed
+      ${report.summary.passedSpecifications} of ${report.summary.totalSpecifications} specifications&rdquo; is
+      the honest statement, not the higher check-level or entity-level percentage.
+    </p>
+    <p class="export-note">
+      This HTML report is a <strong>summary</strong>, not a data source: long failing-element lists are
+      truncated below (always with the hidden count stated), and individual long text fields are shortened
+      to ${FIELD_CHAR_BUDGET} characters with an ellipsis &mdash; hover such a field to read it in full.
+      For complete, untruncated results, use the JSON export.
+    </p>
   </div>
 
   <!-- Filter toolbar -->
@@ -302,7 +663,12 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
 
     <h2>Specifications</h2>
 
-    ${report.specificationResults.map((spec, i) => `
+    ${report.specificationResults.map((spec, i) => {
+      const reqGroups = requirementGroupsBySpec[i];
+      const specCheckPassed = reqGroups.reduce((s, g) => s + g.passed, 0);
+      const specCheckTotal = reqGroups.reduce((s, g) => s + g.passed + g.failed, 0);
+      const specCheckRate = specCheckTotal > 0 ? Math.floor((specCheckPassed / specCheckTotal) * 100) : 100;
+      return `
     <div class="spec ${spec.status === 'fail' ? 'open' : ''}" id="spec-${i}">
       <div class="spec-header" onclick="toggleSpec(${i})">
         <span class="spec-indicator">&#9654;</span>
@@ -314,9 +680,10 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
           ${spec.specification.description ? `<div class="spec-desc">${esc(spec.specification.description)}</div>` : ''}
           <div class="spec-stats">
             <span>${spec.applicableCount} applicable</span>
-            <span style="color: var(--pass);">${spec.passedCount} passed</span>
-            <span style="color: var(--fail);">${spec.failedCount} failed</span>
-            <span>${spec.passRate}% pass rate</span>
+            <span style="color: var(--pass);">${spec.passedCount} entities passed</span>
+            <span style="color: var(--fail);">${spec.failedCount} entities failed</span>
+            <span>${spec.passRate}% of entities passed</span>
+            <span>${specCheckPassed}/${specCheckTotal} checks passed (${specCheckRate}%)</span>
           </div>
           <div class="progress" style="margin-top: 6px;">
             <div class="progress-fill" style="width: ${spec.passRate}%;"></div>
@@ -324,25 +691,34 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
         </div>
       </div>
       <div class="spec-body">
-        <table>
-          <thead>
-            <tr>
-              <th class="col-status" onclick="sortTable(${i}, 0)">Status <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
-              <th class="col-type" onclick="sortTable(${i}, 1)">IFC Class <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
-              <th class="col-name" onclick="sortTable(${i}, 2)">Name <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
-              <th class="col-globalid" onclick="sortTable(${i}, 3)">GlobalId <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
-              <th class="col-expressid" onclick="sortTable(${i}, 4)">ID <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
-              <th class="col-reqs">Reqs</th>
-              <th class="col-details">Details</th>
-            </tr>
-          </thead>
-          <tbody id="tbody-${i}">
-            ${buildEntityRows(spec, esc)}
-          </tbody>
-        </table>
+        <div class="req-groups">
+          <h4>Requirements</h4>
+          ${reqGroups.map(g => buildRequirementGroupHTML(g, esc)).join('')}
+        </div>
+        <details class="entity-table-details">
+          <summary>Per-entity results (${spec.entityResults.length} ${spec.entityResults.length === 1 ? 'entity' : 'entities'})</summary>
+          <table>
+            <thead>
+              <tr>
+                <th class="col-status" onclick="sortTable(${i}, 0)">Status <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
+                <th class="col-type" onclick="sortTable(${i}, 1)">IFC Class <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
+                <th class="col-name" onclick="sortTable(${i}, 2)">Name <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
+                <th class="col-globalid" onclick="sortTable(${i}, 3)">GlobalId <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
+                <th class="col-expressid" onclick="sortTable(${i}, 4)">ID <span class="sort-icon">&#x25B4;&#x25BE;</span></th>
+                <th class="col-reqs">Reqs</th>
+                <th class="col-details">Details</th>
+              </tr>
+            </thead>
+            <tbody id="tbody-${i}">
+              ${buildEntityRows(spec, esc)}
+            </tbody>
+          </table>
+          ${spec.entityResults.length > ENTITY_ROWS_CAP ? `<div class="truncation-note truncation-total">Showing ${ENTITY_ROWS_CAP} of ${spec.entityResults.length} entities (${spec.entityResults.length - ENTITY_ROWS_CAP} hidden, failing entities listed first). See the JSON export for complete results.</div>` : ''}
+        </details>
       </div>
     </div>
-    `).join('')}
+    `;
+    }).join('')}
   </div>
 
   <footer style="text-align: center; color: var(--muted); padding: 20px; font-size: 0.8rem;">
@@ -371,7 +747,16 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
       document.querySelectorAll('.entity-row').forEach(row => {
         total++;
         const status = row.dataset.status;
-        const text = row.textContent.toLowerCase();
+        // Visible cell text is truncated to a character budget, so also match
+        // against the full values kept in data-* attributes and in the title
+        // attributes that carry the untruncated text. Only the spans emitted by
+        // truncateField do — a bare [title] sweep would also pick up the
+        // GlobalId cell's static "Click to copy" hint, and every row would then
+        // match a search for "to".
+        const titles = Array.from(row.querySelectorAll('.truncated[title]'))
+          .map(el => el.getAttribute('title'))
+          .join(' ');
+        const text = (row.textContent + ' ' + (row.dataset.name || '') + ' ' + (row.dataset.type || '') + ' ' + titles).toLowerCase();
         const matchesFilter = currentFilter === 'all' || status === currentFilter;
         const matchesSearch = !search || text.includes(search);
         const show = matchesFilter && matchesSearch;
@@ -381,8 +766,8 @@ export function buildReportHTML(report: IDSValidationReport, locale: SupportedLo
 
       document.getElementById('result-count').textContent =
         search || currentFilter !== 'all'
-          ? visible + ' of ' + total + ' entities shown'
-          : total + ' entities';
+          ? visible + ' of ' + total + ' rows shown'
+          : total + ' rows';
     }
 
     function sortTable(specIndex, colIndex) {