diff --git a/plugins/ms-ai-architect/playground/ms-ai-architect-playground.html b/plugins/ms-ai-architect/playground/ms-ai-architect-playground.html
index 4e566ad..fd4ef2f 100644
--- a/plugins/ms-ai-architect/playground/ms-ai-architect-playground.html
+++ b/plugins/ms-ai-architect/playground/ms-ai-architect-playground.html
@@ -3103,10 +3103,30 @@
     }
 
     function renderTransparency(data, slot) {
+      const READ_MORE_THRESHOLD = 240;
       const sectionsHtml = (data.sections || []).map(function (s) {
-        return '<section><h2>' + escapeHtml(s.heading) + '</h2><p>' + escapeHtml(s.body).replace(/\n/g, '<br>') + '</p></section>';
+        const body = (s.body || '').trim();
+        if (body.length > READ_MORE_THRESHOLD) {
+          const head = body.slice(0, READ_MORE_THRESHOLD);
+          const rest = body.slice(READ_MORE_THRESHOLD);
+          return '<section><h2>' + escapeHtml(s.heading) + '</h2>' +
+                   '<p>' + escapeHtml(head).replace(/\n/g, '<br>') + '…</p>' +
+                   '<details class="read-more-block">' +
+                     '<summary>Les hele klausulen</summary>' +
+                     '<p>' + escapeHtml(rest).replace(/\n/g, '<br>') + '</p>' +
+                   '</details>' +
+                 '</section>';
+        }
+        return '<section><h2>' + escapeHtml(s.heading) + '</h2><p>' + escapeHtml(body).replace(/\n/g, '<br>') + '</p></section>';
       }).join('');
-      slot.innerHTML = '<article class="report-doc">' + sectionsHtml + '</article>';
+      const body = '<article class="report-doc">' + sectionsHtml + '</article>';
+      slot.innerHTML = renderPageShell({
+        eyebrow: 'ÅPENHET',
+        title: data.title || 'Transparensnotis',
+        lede: data.lede || 'Generert basert på EU AI Act Art. 13/50 og GDPR Art. 13/14.',
+        verdict: data.verdict || inferVerdict(data, 'text-document'),
+        keyStats: data.keyStats || inferKeyStats(data, 'text-document')
+      }, body);
     }
 
     function renderFria(data, slot) {