feat(glossaire): refine portal pages and contextual asides

Reviewed-on: #281

src/components/GlossaryAside.astro

@@ -26,7 +26,7 @@ const fondamentaux = fondamentauxWanted
 
 function resolveList(slugs = []) {
   return slugs
-    .map((slug) => bySlug.get(slug))
+    .map((slug) => bySlug.get(String(slug || "").trim()))
     .filter(Boolean);
 }
 
@@ -42,43 +42,138 @@ function uniqueBySlug(entries) {
   return out;
 }
 
-const relatedEntries = uniqueBySlug(resolveList(currentEntry.data.related ?? []))
+function sortByTerm(entries = []) {
-  .sort((a, b) => collator.compare(a.data.term, b.data.term));
+  return [...entries].sort((a, b) => collator.compare(a.data.term, b.data.term));
+}
 
-const opposedEntries = uniqueBySlug(resolveList(currentEntry.data.opposedTo ?? []))
+function familyOf(entry) {
-  .sort((a, b) => collator.compare(a.data.term, b.data.term));
+  return entry?.data?.family ?? "";
+}
 
-const seeAlsoEntries = uniqueBySlug(resolveList(currentEntry.data.seeAlso ?? []))
+function kindOf(entry) {
-  .sort((a, b) => collator.compare(a.data.term, b.data.term));
+  return entry?.data?.kind ?? "";
+}
 
-const paradigmes = [...allEntries]
+const relatedEntries = sortByTerm(
-  .filter((e) => e.data.kind === "paradigme" && slugOf(e) !== currentSlug)
+  uniqueBySlug(resolveList(currentEntry.data.related ?? []))
-  .sort((a, b) => collator.compare(a.data.term, b.data.term));
+);
 
-function contextualParadigmsFor(entry) {
+const opposedEntries = sortByTerm(
-  const relatedParadigms = (entry.data.related ?? [])
+  uniqueBySlug(resolveList(currentEntry.data.opposedTo ?? []))
-    .map((slug) => bySlug.get(slug))
+);
-    .filter((e) => e && e.data.kind === "paradigme");
 
-  const seeAlsoParadigms = (entry.data.seeAlso ?? [])
+const seeAlsoEntries = sortByTerm(
-    .map((slug) => bySlug.get(slug))
+  uniqueBySlug(resolveList(currentEntry.data.seeAlso ?? []))
-    .filter((e) => e && e.data.kind === "paradigme");
+);
 
-  const opposedParadigms = (entry.data.opposedTo ?? [])
+const familyLabels = {
-    .map((slug) => bySlug.get(slug))
+  "concept-fondamental": "Concept fondamental",
-    .filter((e) => e && e.data.kind === "paradigme");
+  scene: "Scène",
+  dynamique: "Dynamique",
+  pathologie: "Pathologie",
+  topologie: "Topologie",
+  "meta-regime": "Méta-régime",
+  paradigme: "Paradigme",
+  doctrine: "Doctrine",
+  verbe: "Verbe",
+  "dispositif-ia": "Dispositif IA",
+  "tension-irreductible": "Tension irréductible",
+};
 
-  const merged = uniqueBySlug([
+const kindLabels = {
-    ...relatedParadigms,
+  concept: "Concept",
-    ...seeAlsoParadigms,
+  diagnostic: "Diagnostic",
-    ...opposedParadigms,
+  topologie: "Topologie",
-  ]);
+  verbe: "Verbe",
+  paradigme: "Paradigme",
+  doctrine: "Doctrine",
+};
 
-  if (merged.length > 0) {
+const domainLabels = {
-    return merged.slice(0, 5);
+  transversal: "Transversal",
+  theorie: "Théorie",
+  "cas-ia": "Cas IA",
+};
+
+const levelLabels = {
+  fondamental: "Fondamental",
+  intermediaire: "Intermédiaire",
+  avance: "Avancé",
+};
+
+const currentFamily = familyOf(currentEntry);
+const displayFamily =
+  familyLabels[currentFamily] ??
+  kindLabels[currentEntry.data.kind] ??
+  "Fiche";
+
+const displayDomain =
+  domainLabels[currentEntry.data.domain] ??
+  currentEntry.data.domain;
+
+const displayLevel =
+  levelLabels[currentEntry.data.level] ??
+  currentEntry.data.level;
+
+function entriesOfSameFamily(entry) {
+  const family = familyOf(entry);
+
+  if (!family) return [];
+
+  if (family === "concept-fondamental") {
+    return fondamentaux;
   }
 
-  if (entry.data.kind === "paradigme") {
+  return sortByTerm(
+    allEntries.filter((item) => familyOf(item) === family)
+  );
+}
+
+const sameFamilyEntries = entriesOfSameFamily(currentEntry);
+
+const familySectionTitles = {
+  "concept-fondamental": "Noyau archicratique",
+  scene: "Scènes archicratiques",
+  dynamique: "Dynamiques archicratiques",
+  pathologie: "Pathologies archicratiques",
+  topologie: "Topologies voisines",
+  "meta-regime": "Méta-régimes archicratiques",
+  paradigme: "Paradigmes voisins",
+  doctrine: "Doctrines fondatrices",
+  verbe: "Verbes de la scène",
+  "dispositif-ia": "Dispositifs IA",
+  "tension-irreductible": "Tensions irréductibles",
+};
+
+const sameFamilyTitle =
+  familySectionTitles[currentFamily] ?? "Même famille";
+
+function isTheoryEntry(entry) {
+  const family = familyOf(entry);
+  const kind = kindOf(entry);
+
+  return (
+    family === "paradigme" ||
+    family === "doctrine" ||
+    kind === "paradigme" ||
+    kind === "doctrine"
+  );
+}
+
+function contextualTheoryFor(entry) {
+  const fromRelations = uniqueBySlug([
+    ...resolveList(entry.data.related ?? []),
+    ...resolveList(entry.data.seeAlso ?? []),
+    ...resolveList(entry.data.opposedTo ?? []),
+  ])
+    .filter((item) => slugOf(item) !== currentSlug)
+    .filter((item) => isTheoryEntry(item));
+
+  if (fromRelations.length > 0) {
+    return sortByTerm(fromRelations).slice(0, 6);
+  }
+
+  if (familyOf(entry) === "paradigme") {
     const preferred = [
       "gouvernementalite",
       "gouvernementalite-algorithmique",
@@ -100,6 +195,22 @@ function contextualParadigmsFor(entry) {
       "grammatisation-et-proletarisation-cognitive",
     ];
 
+    return uniqueBySlug(
+      preferred
+        .filter((slug) => slug !== currentSlug)
+        .map((slug) => bySlug.get(slug))
+        .filter(Boolean)
+    ).slice(0, 8);
+  }
+
+  if (familyOf(entry) === "doctrine") {
+    const preferred = [
+      "contractualisme-hobbesien",
+      "droit-naturel-et-propriete",
+      "volonte-generale",
+      "decisionnisme-souverain",
+    ];
+
     return uniqueBySlug(
       preferred
         .filter((slug) => slug !== currentSlug)
@@ -108,55 +219,56 @@ function contextualParadigmsFor(entry) {
     ).slice(0, 6);
   }
 
-  return paradigmes.slice(0, 5);
+  return [];
 }
 
-const contextualParadigms = contextualParadigmsFor(currentEntry);
+const contextualTheory = contextualTheoryFor(currentEntry);
 
-const kindLabels = {
+const showNoyau = currentFamily !== "concept-fondamental" && fondamentaux.length > 0;
-  concept: "Concept",
-  diagnostic: "Diagnostic",
-  topologie: "Topologie",
-  verbe: "Verbe",
-  paradigme: "Paradigme",
-  doctrine: "Doctrine",
-};
 
-const domainLabels = {
+const showSameFamily =
-  transversal: "Transversal",
+  sameFamilyEntries.length > 0 && currentFamily !== "concept-fondamental";
-  theorie: "Théorie",
-  "cas-ia": "Cas IA",
-};
 
-const levelLabels = {
+const relationSections = [
-  fondamental: "Fondamental",
+  {
-  intermediaire: "Intermédiaire",
+    title: "Concepts liés",
-  avance: "Avancé",
+    items: relatedEntries,
-};
+  },
-
+  {
-const metaLabel = [
+    title: "En tension avec",
-  kindLabels[currentEntry.data.kind] ?? currentEntry.data.kind,
+    items: opposedEntries,
-  domainLabels[currentEntry.data.domain] ?? currentEntry.data.domain,
+  },
-  levelLabels[currentEntry.data.level] ?? currentEntry.data.level,
+  {
-].join(" · ");
+    title: "Voir aussi",
+    items: seeAlsoEntries,
+  },
+].filter((section) => section.items.length > 0);
 ---
 
 <nav class="glossary-aside" aria-label="Navigation du glossaire">
   <div class="glossary-aside__block glossary-aside__block--intro">
     <a class="glossary-aside__back" href="/glossaire/">← Retour au glossaire</a>
     <div class="glossary-aside__title">Glossaire archicratique</div>
-    <div class="glossary-aside__meta">{metaLabel}</div>
+
+    <div class="glossary-aside__pills" aria-label="Repères de lecture">
+      <span class="glossary-aside__pill glossary-aside__pill--family">
+        {displayFamily}
+      </span>
+      <span class="glossary-aside__pill">{displayDomain}</span>
+      <span class="glossary-aside__pill">{displayLevel}</span>
+    </div>
   </div>
 
   <section class="glossary-aside__block">
     <h2 class="glossary-aside__heading">Portails</h2>
     <ul class="glossary-aside__list">
       <li><a href="/glossaire/">Index général</a></li>
-      <li><a href="/glossaire/paradigmes/">Page paradigmes</a></li>
+      <li><a href="/glossaire/archicrations/">Archicrations</a></li>
+      <li><a href="/glossaire/paradigmes/">Paradigmes et doctrines</a></li>
     </ul>
   </section>
 
-  {fondamentaux.length > 0 && (
+  {showNoyau && (
     <section class="glossary-aside__block">
       <h2 class="glossary-aside__heading">Noyau archicratique</h2>
       <ul class="glossary-aside__list">
@@ -178,52 +290,50 @@ const metaLabel = [
     </section>
   )}
 
-  {(relatedEntries.length > 0 || opposedEntries.length > 0 || seeAlsoEntries.length > 0) && (
+  {showSameFamily && (
     <section class="glossary-aside__block">
-      <h2 class="glossary-aside__heading">Autour de cette fiche</h2>
+      <h2 class="glossary-aside__heading">{sameFamilyTitle}</h2>
-
+      <ul class="glossary-aside__list">
-      {relatedEntries.length > 0 && (
+        {sameFamilyEntries.map((entry) => {
-        <>
+          const active = slugOf(entry) === currentSlug;
-          <h3 class="glossary-aside__subheading">Liés</h3>
+          return (
-          <ul class="glossary-aside__list">
+            <li>
-            {relatedEntries.map((entry) => (
+              <a
-              <li><a href={hrefOf(entry)}>{entry.data.term}</a></li>
+                href={hrefOf(entry)}
-            ))}
+                aria-current={active ? "page" : undefined}
-          </ul>
+                class={active ? "is-active" : undefined}
-        </>
+              >
-      )}
+                {entry.data.term}
-
+              </a>
-      {opposedEntries.length > 0 && (
+            </li>
-        <>
+          );
-          <h3 class="glossary-aside__subheading">Opposés</h3>
+        })}
-          <ul class="glossary-aside__list">
+      </ul>
-            {opposedEntries.map((entry) => (
-              <li><a href={hrefOf(entry)}>{entry.data.term}</a></li>
-            ))}
-          </ul>
-        </>
-      )}
-
-      {seeAlsoEntries.length > 0 && (
-        <>
-          <h3 class="glossary-aside__subheading">Voir aussi</h3>
-          <ul class="glossary-aside__list">
-            {seeAlsoEntries.map((entry) => (
-              <li><a href={hrefOf(entry)}>{entry.data.term}</a></li>
-            ))}
-          </ul>
-        </>
-      )}
     </section>
   )}
 
-  {contextualParadigms.length > 0 && (
+  {relationSections.length > 0 && (
     <section class="glossary-aside__block">
-      <h2 class="glossary-aside__heading">
+      <h2 class="glossary-aside__heading">Autour de cette fiche</h2>
-        {currentEntry.data.kind === "paradigme" ? "Paradigmes voisins" : "Paradigmes mobilisés"}
+
-      </h2>
+      {relationSections.map((section) => (
+        <>
+          <h3 class="glossary-aside__subheading">{section.title}</h3>
+          <ul class="glossary-aside__list">
+            {section.items.map((entry) => (
+              <li><a href={hrefOf(entry)}>{entry.data.term}</a></li>
+            ))}
+          </ul>
+        </>
+      ))}
+    </section>
+  )}
+
+  {contextualTheory.length > 0 && (
+    <section class="glossary-aside__block">
+      <h2 class="glossary-aside__heading">Paysage théorique</h2>
       <ul class="glossary-aside__list">
-        {contextualParadigms.map((entry) => (
+        {contextualTheory.map((entry) => (
           <li><a href={hrefOf(entry)}>{entry.data.term}</a></li>
         ))}
       </ul>
@@ -265,11 +375,28 @@ const metaLabel = [
     line-height: 1.25;
   }
 
-  .glossary-aside__meta{
+  .glossary-aside__pills{
+    display: flex;
+    flex-wrap: wrap;
+    gap: 6px;
     margin-top: 8px;
+  }
+
+  .glossary-aside__pill{
+    display: inline-flex;
+    align-items: center;
+    padding: 4px 9px;
+    border: 1px solid rgba(127,127,127,0.24);
+    border-radius: 999px;
+    background: rgba(127,127,127,0.04);
     font-size: 12px;
-    line-height: 1.35;
+    line-height: 1.3;
-    opacity: .78;
+    opacity: .9;
+  }
+
+  .glossary-aside__pill--family{
+    border-color: rgba(127,127,127,0.38);
+    font-weight: 800;
   }
 
   .glossary-aside__heading{
@@ -309,7 +436,8 @@ const metaLabel = [
   }
 
   @media (prefers-color-scheme: dark){
-    .glossary-aside__block{
+    .glossary-aside__block,
+    .glossary-aside__pill{
       background: rgba(255,255,255,0.04);
     }
   }

src/components/GlossaryHomeAside.astro

@@ -0,0 +1,205 @@
+---
+const {
+  allEntries = [],
+} = Astro.props;
+
+const slugOf = (entry) => String(entry.id).replace(/\.(md|mdx)$/i, "");
+const hrefOf = (entry) => `/glossaire/${slugOf(entry)}/`;
+
+const collator = new Intl.Collator("fr", { sensitivity: "base", numeric: true });
+const bySlug = new Map(allEntries.map((entry) => [slugOf(entry), entry]));
+
+function sortByTerm(list = []) {
+  return [...list].sort((a, b) => collator.compare(a.data.term, b.data.term));
+}
+
+function familyOf(entry) {
+  const explicit = entry?.data?.family;
+  if (explicit) return explicit;
+
+  const slug = slugOf(entry);
+  const kind = entry?.data?.kind;
+
+  if (kind === "paradigme") return "paradigme";
+  if (kind === "doctrine") return "doctrine";
+  if (kind === "verbe") return "verbe";
+
+  if (slug === "scene-depreuve") return "scene";
+  if (slug === "autarchicratie") return "pathologie";
+  if (slug === "obliteration-archicratique") return "dynamique";
+
+  if (
+    [
+      "archicratie",
+      "arcalite",
+      "cratialite",
+      "archicration",
+      "co-viabilite",
+      "tension",
+    ].includes(slug)
+  ) {
+    return "concept-fondamental";
+  }
+
+  if (slug === "archicrations-differentielles-et-formes-hybrides") {
+    return "topologie";
+  }
+
+  if (kind === "topologie" && slug.startsWith("archicrations-")) {
+    return "meta-regime";
+  }
+
+  return "";
+}
+
+const fondamentauxWanted = [
+  "archicratie",
+  "arcalite",
+  "cratialite",
+  "archicration",
+  "co-viabilite",
+  "tension",
+];
+
+const fondamentaux = sortByTerm(
+  fondamentauxWanted
+    .map((slug) => bySlug.get(slug))
+    .filter(Boolean)
+);
+
+const totalEntries = allEntries.length;
+const paradigmesCount = allEntries.filter((entry) => entry.data.kind === "paradigme").length;
+const doctrinesCount = allEntries.filter((entry) => entry.data.kind === "doctrine").length;
+const metaRegimesCount = allEntries.filter((entry) => familyOf(entry) === "meta-regime").length;
+
+const portalLinks = [
+  { href: "/glossaire/concepts-fondamentaux/", label: "Concepts fondamentaux" },
+  { href: "/glossaire/scenes-archicratiques/", label: "Scènes archicratiques" },
+  { href: "/glossaire/dynamiques-archicratiques/", label: "Dynamiques archicratiques" },
+  { href: "/glossaire/tensions-irreductibles/", label: "Tensions irréductibles" },
+  { href: "/glossaire/archicrations/", label: "Méta-régimes archicratiques" },
+  { href: "/glossaire/paradigmes/", label: "Paradigmes et doctrines" },
+  { href: "/glossaire/index-complet/", label: "Index complet" },
+];
+---
+
+<nav class="glossary-home-aside" aria-label="Navigation du portail du glossaire">
+  <div class="glossary-home-aside__block glossary-home-aside__block--intro">
+    <div class="glossary-home-aside__title">Glossaire archicratique</div>
+    <div class="glossary-home-aside__meta">
+      portail de lecture · cartographie conceptuelle
+    </div>
+
+    <div class="glossary-home-aside__pills" aria-label="Repères de navigation">
+      <span class="glossary-home-aside__pill">{totalEntries} entrées</span>
+      <span class="glossary-home-aside__pill">{metaRegimesCount} méta-régimes</span>
+      <span class="glossary-home-aside__pill">
+        {doctrinesCount} doctrine{doctrinesCount > 1 ? "s" : ""} · {paradigmesCount} paradigme{paradigmesCount > 1 ? "s" : ""}
+      </span>
+    </div>
+  </div>
+
+
+  <section class="glossary-home-aside__block">
+    <h2 class="glossary-home-aside__heading">Parcours du glossaire</h2>
+    <ul class="glossary-home-aside__list">
+      {portalLinks.map((item) => (
+        <li><a href={item.href}>{item.label}</a></li>
+      ))}
+    </ul>
+  </section>
+
+  {fondamentaux.length > 0 && (
+    <section class="glossary-home-aside__block">
+      <h2 class="glossary-home-aside__heading">Noyau archicratique</h2>
+      <ul class="glossary-home-aside__list">
+        {fondamentaux.map((entry) => (
+          <li><a href={hrefOf(entry)}>{entry.data.term}</a></li>
+        ))}
+      </ul>
+    </section>
+  )}
+</nav>
+
+<style>
+  .glossary-home-aside{
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .glossary-home-aside__block{
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    padding: 12px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .glossary-home-aside__block--intro{
+    padding-top: 11px;
+    padding-bottom: 11px;
+  }
+
+  .glossary-home-aside__title{
+    font-size: 14px;
+    font-weight: 800;
+    letter-spacing: .2px;
+    line-height: 1.25;
+  }
+
+  .glossary-home-aside__meta{
+    margin-top: 8px;
+    font-size: 12px;
+    line-height: 1.35;
+    opacity: .78;
+  }
+
+  .glossary-home-aside__pills{
+    display: flex;
+    flex-wrap: wrap;
+    gap: 6px;
+    margin-top: 10px;
+  }
+
+  .glossary-home-aside__pill{
+    display: inline-flex;
+    align-items: center;
+    padding: 4px 9px;
+    border: 1px solid rgba(127,127,127,0.24);
+    border-radius: 999px;
+    background: rgba(127,127,127,0.04);
+    font-size: 12px;
+    line-height: 1.3;
+    opacity: .9;
+  }
+
+  .glossary-home-aside__heading{
+    margin: 0 0 10px;
+    font-size: 13px;
+    font-weight: 800;
+    opacity: .9;
+  }
+
+  .glossary-home-aside__list{
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .glossary-home-aside__list li{
+    margin: 6px 0;
+  }
+
+  .glossary-home-aside__list a{
+    text-decoration: none;
+    font-size: 13px;
+    line-height: 1.3;
+  }
+
+  @media (prefers-color-scheme: dark){
+    .glossary-home-aside__block,
+    .glossary-home-aside__pill{
+      background: rgba(255,255,255,0.04);
+    }
+  }
+</style>

src/content.config.ts

@@ -67,6 +67,19 @@ const glossaire = defineCollection({
     links: z.array(linkSchema).default([]),
 
     kind: z.enum(["concept", "topologie", "diagnostic", "verbe", "paradigme", "doctrine"]),
+    family: z.enum([
+      "concept-fondamental",
+      "scene",
+      "dynamique",
+      "pathologie",
+      "topologie",
+      "meta-regime",
+      "paradigme",
+      "doctrine",
+      "verbe",
+      "dispositif-ia",
+      "tension-irreductible",
+    ]).optional(),
     domain: z.enum(["transversal", "theorie", "cas-ia"]),
     level: z.enum(["fondamental", "intermediaire", "avance"]),
     related: z.array(z.string().min(1)).default([]),

src/content/glossaire/agencement-machinique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation fondé sur des agencements hétérog
 concepts: ["agencement-machinique", "agencement", "machine", "flux", "dispositif", "tension"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicratie", "cratialite", "archicration", "tension", "co-viabilite"]

src/content/glossaire/arcalite.md

@@ -9,6 +9,7 @@ definitionShort: "Vecteur fondationnel et structurant de la régulation : ensemb
 concepts: ["arcalite", "archicratie", "cratialite", "archicration", "co-viabilite"]
 links: []
 kind: "concept"
+family: "concept-fondamental"
 domain: "transversal"
 level: "fondamental"
 related: ["archicratie", "cratialite", "archicration", "co-viabilite", "tension"]

src/content/glossaire/archicratie.md

@@ -9,6 +9,7 @@ definitionShort: "Méta-régime de régulation par lequel les sociétés humaine
 concepts: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "tension"]
 links: []
 kind: "concept"
+family: "concept-fondamental"
 domain: "transversal"
 level: "fondamental"
 related: ["arcalite", "cratialite", "archicration", "co-viabilite", "tension"]

src/content/glossaire/archicration.md

@@ -9,6 +9,7 @@ definitionShort: "Vecteur régulateur par lequel les tensions entre arcalités e
 concepts: ["archicration", "archicratie", "arcalite", "cratialite", "co-viabilite", "tension", "scene-depreuve"]
 links: []
 kind: "concept"
+family: "concept-fondamental"
 domain: "transversal"
 level: "fondamental"
 related: ["archicratie", "arcalite", "cratialite", "co-viabilite", "tension", "scene-depreuve"]

src/content/glossaire/archicrations-differentielles-et-formes-hybrides.md

@@ -8,10 +8,11 @@ comparisonTraditions: ["anthropologie politique comparative", "sociologie proces
 edition: "glossaire"
 status: "referentiel"
 version: "0.1.0"
-definitionShort: "Configurations dans lesquelles un régime archicratique se module, se fragmente ou se combine à d’autres sans produire une forme unifiée."
+definitionShort: "Configurations dans lesquelles un méta-régime archicratique se module, se fragmente ou se combine à d’autres sans produire une forme unifiée."
 concepts: ["archicrations-differentielles-et-formes-hybrides", "archicration", "hybridation", "modulation", "plasticite", "composition", "co-viabilite"]
 links: []
 kind: "topologie"
+family: "topologie"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "scene-depreuve"]

src/content/glossaire/archicrations-epistemiques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité dans lequel la régulation coll
 concepts: ["archicrations-epistemiques", "archicration", "savoir", "episteme", "paradigme", "verite", "expertise"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "gouvernementalite"]

src/content/glossaire/archicrations-esthetico-symboliques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où la régulation collective p
 concepts: ["archicrations-esthetico-symboliques", "archicration", "forme-symbolique", "imaginaire", "representation", "esthetique"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite"]
@@ -41,7 +42,9 @@ L’archicration se joue dans les scènes de création et de réception des form
 
 Ces régimes montrent que la co-viabilité peut être stabilisée par des dispositifs sensibles et symboliques.
 
-La forme esthétique devient alors une infrastructure du lien social.
+Mais ces formes peuvent également reconfigurer la perception du commun, déplacer les frontières du visible et du dicible et ouvrir des scènes de dissensus.
+
+La forme esthétique devient ainsi une infrastructure du lien social, capable à la fois de stabiliser et de transformer l’ordre collectif.
 
 ## Renvois
 

src/content/glossaire/archicrations-guerrieres.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité dans lequel la stabilité colle
 concepts: ["archicrations-guerrieres", "archicration", "puissance", "violence", "strategie", "dissuasion"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite"]

src/content/glossaire/archicrations-historiographiques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où la régulation collective s
 concepts: ["archicrations-historiographiques", "archicration", "memoire", "recit", "temporalite", "historiographie"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite"]

src/content/glossaire/archicrations-marchandes.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité dans lequel la coordination col
 concepts: ["archicrations-marchandes", "archicration", "marche", "echange", "prix", "coordination"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite"]

src/content/glossaire/archicrations-normativo-politiques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité dans lequel la régulation coll
 concepts: ["archicrations-normativo-politiques", "archicration", "norme", "droit", "legalite", "souverainete"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "domination-legale-rationnelle"]

src/content/glossaire/archicrations-proto-symboliques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où la régulation passe priori
 concepts: ["archicrations-proto-symboliques", "archicration", "proto-symbolique", "rite", "tabou", "alliance", "co-viabilite"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "scene-depreuve"]

src/content/glossaire/archicrations-sacrales-non-etatiques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où des puissances sacrales, de
 concepts: ["archicrations-sacrales-non-etatiques", "archicration", "sacral", "rituel", "totemisme", "oracle", "co-viabilite"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "archicrations-proto-symboliques"]

src/content/glossaire/archicrations-scripturo-cosmologiques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où l’écriture ne prescrit p
 concepts: ["archicrations-scripturo-cosmologiques","archicration","cosmos","cosmographie","ecriture","alignement","correspondance"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "archicrations-techno-logistiques"]

src/content/glossaire/archicrations-scripturo-normatives.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où l’obligation découle d
 concepts: ["archicrations-scripturo-normatives", "archicration", "scripturalite", "norme", "ecriture", "code", "obligation"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "domination-legale-rationnelle"]

src/content/glossaire/archicrations-techno-logistiques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où la régulation s’incarne
 concepts: ["archicrations-techno-logistiques", "archicration", "techno-logistique", "megamachine", "infrastructure", "flux", "coordination"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "cybernetique"]

src/content/glossaire/archicrations-theologiques.md

@@ -12,6 +12,7 @@ definitionShort: "Méta-régime de co-viabilité où l’obligation procède d
 concepts: ["archicrations-theologiques", "archicration", "revelation", "verbe", "transcendance", "doctrine", "orthodoxie", "exegese"]
 links: []
 kind: "topologie"
+family: "meta-regime"
 domain: "transversal"
 level: "avance"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "co-viabilite", "decisionnisme-souverain"]

src/content/glossaire/autarchicratie.md

@@ -9,6 +9,7 @@ definitionShort: "Dérive d’un régime archicratique dans laquelle les archite
 concepts: ["autarchicratie", "archicratie", "archicration", "obliteration-archicratique", "scene-depreuve"]
 links: []
 kind: "diagnostic"
+family: "pathologie"
 domain: "transversal"
 level: "fondamental"
 related: ["archicratie", "archicration", "obliteration-archicratique", "scene-depreuve", "co-viabilite"]

src/content/glossaire/biopolitique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme d’analyse du pouvoir centré sur la prise en charg
 concepts: ["biopolitique", "population", "vie", "gouvernementalite"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "intermediaire"
 related: ["gouvernementalite", "archicratie", "co-viabilite"]

src/content/glossaire/co-viabilite.md

@@ -9,6 +9,7 @@ definitionShort: "Capacité d’un système social à maintenir la continuité d
 concepts: ["co-viabilite", "archicratie", "arcalite", "cratialite", "archicration", "tension"]
 links: []
 kind: "concept"
+family: "concept-fondamental"
 domain: "transversal"
 level: "fondamental"
 related: ["archicratie", "arcalite", "cratialite", "archicration", "tension"]

src/content/glossaire/conatus-et-multitude.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme immanent de régulation dans lequel la tenue du coll
 concepts: ["conatus-et-multitude", "conatus", "multitude", "affect", "puissance"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicratie", "tension", "co-viabilite", "theorie-de-la-resonance"]

src/content/glossaire/configuration-et-interdependance.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation dans lequel les formes sociales émer
 concepts: ["configuration-et-interdependance", "configuration", "interdependance", "autocontrainte", "processus"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicratie", "co-viabilite", "tension", "conatus-et-multitude"]

src/content/glossaire/contractualisme-hobbesien.md

@@ -12,6 +12,7 @@ definitionShort: "Doctrine fondatrice faisant de la sortie de la guerre de tous
 concepts: ["contractualisme-hobbesien", "souverainete", "ordre", "tension"]
 links: []
 kind: "doctrine"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["archicratie", "tension", "co-viabilite"]

src/content/glossaire/cosmopolitique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme politique selon lequel les collectifs humains doiven
 concepts: ["cosmopolitique", "pluralite-des-mondes", "composition"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["technodiversite-et-cosmotechnie", "gouvernance-des-communs", "configuration-et-interdependance"]

src/content/glossaire/cratialite.md

@@ -9,6 +9,7 @@ definitionShort: "Vecteur opératoire et transformateur de la régulation : ense
 concepts: ["cratialite", "archicratie", "arcalite", "archicration", "tension", "co-viabilite"]
 links: []
 kind: "concept"
+family: "concept-fondamental"
 domain: "transversal"
 level: "fondamental"
 related: ["archicratie", "arcalite", "archicration", "tension", "co-viabilite"]

src/content/glossaire/cybernetique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation centré sur les boucles de rétroacti
 concepts: ["cybernetique", "retroaction", "pilotage", "tension"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["archicratie", "tension", "cratialite", "gouvernementalite-algorithmique"]

src/content/glossaire/decisionnisme-souverain.md

@@ -12,6 +12,7 @@ definitionShort: "Doctrine fondatrice selon laquelle l’ordre politique se cons
 concepts: ["decisionnisme-souverain", "decision", "exception", "souverainete", "theologie-politique"]
 links: []
 kind: "doctrine"
+family: "doctrine"
 domain: "theorie"
 level: "fondamental"
 related: ["contractualisme-hobbesien", "archicratie", "archicration", "tension"]

src/content/glossaire/democratie-deliberative.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme politique fondant la légitimité de l’ordre colle
 concepts: ["democratie-deliberative", "deliberation", "discussion", "legitimite", "espace-public"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["volonte-generale", "archicration", "scene-depreuve", "archicratie"]

src/content/glossaire/dissensus-politique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme politique dans lequel le litige, le désaccord et l
 concepts: ["dissensus-politique", "dissensus", "litige", "scene", "conflit"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["archicration", "scene-depreuve", "tension", "archicratie"]

src/content/glossaire/domination-legale-rationnelle.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation fondé sur la légalité formelle, la
 concepts: ["domination-legale-rationnelle", "bureaucratie", "legalite", "administration", "regle", "procedure"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["archicratie", "arcalite", "cratialite", "archicration"]

src/content/glossaire/droit-naturel-et-propriete.md

@@ -12,6 +12,7 @@ definitionShort: "Doctrine fondatrice faisant de la loi naturelle, de la propri
 concepts: ["droit-naturel-et-propriete", "propriete", "droit-naturel", "consentement", "encadrement-liberal"]
 links: []
 kind: "doctrine"
+family: "doctrine"
 domain: "theorie"
 level: "fondamental"
 related: ["contractualisme-hobbesien", "volonte-generale", "archicratie", "co-viabilite"]

src/content/glossaire/exception-souveraine.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation dans lequel l’ordre se maintient pa
 concepts: ["exception-souveraine", "exception", "suspension", "souverainete", "urgence"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["decisionnisme-souverain", "archicratie", "tension", "autarchicratie"]

src/content/glossaire/fait-social-total.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation dans lequel les échanges, obligation
 concepts: ["fait-social-total", "echange", "obligation", "symbolisation", "cohesion"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "intermediaire"
 related: ["archicratie", "arcalite", "co-viabilite", "tension"]

src/content/glossaire/gouvernance-des-communs.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation fondé sur la coordination collective
 concepts: ["gouvernance-des-communs", "communs", "coordination", "polycentrisme", "ressources"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "intermediaire"
 related: ["co-viabilite", "archicratie", "democratie-deliberative", "tension"]

src/content/glossaire/gouvernementalite-algorithmique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation fondé sur le calcul automatisé, la
 concepts: ["gouvernementalite-algorithmique", "algorithme", "scoring", "autarchicratie"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "cas-ia"
 level: "intermediaire"
 related: ["gouvernementalite", "cybernetique", "autarchicratie", "obliteration-archicratique", "cratialite"]

src/content/glossaire/gouvernementalite.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme d’analyse du pouvoir centré sur la conduite des c
 concepts: ["gouvernementalite", "pouvoir", "population", "regulation"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["archicratie", "biopolitique", "gouvernementalite-algorithmique", "scene-depreuve"]

src/content/glossaire/grammatisation-et-proletarisation-cognitive.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation technique dans lequel la capture, la
 concepts: ["grammatisation-et-proletarisation-cognitive", "grammatisation", "proletarisation", "savoir", "automatisation", "technique"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicratie", "pharmacologie-technique", "preemption-algorithmique", "gouvernementalite-algorithmique"]

src/content/glossaire/habitus-et-violence-symbolique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation dans lequel l’ordre social se repro
 concepts: ["habitus-et-violence-symbolique", "habitus", "champ", "violence-symbolique", "reproduction"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "fondamental"
 related: ["archicratie", "arcalite", "autarchicratie", "obliteration-archicratique"]

src/content/glossaire/lieu-vide-du-pouvoir.md

@@ -20,6 +20,7 @@ concepts:
   - "conflit"
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related:

src/content/glossaire/obliteration-archicratique.md

@@ -9,6 +9,7 @@ definitionShort: "Processus par lequel les architectures régulatrices continuen
 concepts: ["obliteration-archicratique", "archicration", "autarchicratie", "scene-depreuve", "archicratie"]
 links: []
 kind: "diagnostic"
+family: "dynamique"
 domain: "transversal"
 level: "fondamental"
 related: ["archicration", "autarchicratie", "scene-depreuve", "archicratie"]

src/content/glossaire/pensee-complexe.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme épistémologique selon lequel les phénomènes soci
 concepts: ["complexite", "dialogique", "recursivite", "systeme"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["configuration-et-interdependance", "transduction-et-individuation", "co-viabilite"]

src/content/glossaire/pharmacologie-technique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation fondé sur l’ambivalence constituti
 concepts: ["pharmacologie-technique", "technique", "soin", "attention", "automatisation"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicratie", "co-viabilite", "tension", "preemption-algorithmique"]

src/content/glossaire/pluralite-natalite-action.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme politique dans lequel la régulation doit ménager l
 concepts: ["pluralite-natalite-action", "pluralite", "natalite", "action", "monde-commun"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicration", "scene-depreuve", "dissensus-politique", "archicratie"]

src/content/glossaire/preemption-algorithmique.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation dans lequel les comportements sont an
 concepts: ["preemption-algorithmique", "algorithme", "scoring", "nudging", "anticipation"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "cas-ia"
 level: "avance"
 related: ["gouvernementalite-algorithmique", "archicratie", "obliteration-archicratique", "autarchicratie"]

src/content/glossaire/scene-depreuve.md

@@ -9,6 +9,7 @@ definitionShort: "Espace de comparution, d’exposition et de révision dans leq
 concepts: ["scene-depreuve", "archicration", "archicratie", "tension", "co-viabilite"]
 links: []
 kind: "concept"
+family: "scene"
 domain: "transversal"
 level: "fondamental"
 related: ["archicration", "archicratie", "tension", "co-viabilite", "obliteration-archicratique"]

src/content/glossaire/technodiversite-et-cosmotechnie.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation technique selon lequel les formes de
 concepts: ["technodiversite-et-cosmotechnie", "technodiversite", "cosmotechnie", "technique", "pluralite", "monde"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicratie", "co-viabilite", "pharmacologie-technique", "agencement-machinique"]

src/content/glossaire/tension.md

@@ -9,6 +9,7 @@ definitionShort: "Phénomène systémique général par lequel des forces, dynam
 concepts: ["tension", "archicratie", "co-viabilite", "arcalite", "cratialite", "archicration"]
 links: []
 kind: "concept"
+family: "concept-fondamental"
 domain: "transversal"
 level: "fondamental"
 related: ["archicratie", "co-viabilite", "arcalite", "cratialite", "archicration"]

src/content/glossaire/theorie-de-la-justification.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme sociologique selon lequel les conflits sociaux s’o
 concepts: ["justification", "grandeur", "cites", "regimes-de-justification"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["dissensus-politique", "scene-depreuve", "democratie-deliberative"]

src/content/glossaire/theorie-de-la-resonance.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme relationnel dans lequel la qualité d’un ordre dé
 concepts: ["theorie-de-la-resonance", "resonance", "relation", "reponse", "monde"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "intermediaire"
 related: ["archicratie", "co-viabilite", "tension", "scene-depreuve"]

src/content/glossaire/theorie-de-lacteur-reseau.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme sociologique selon lequel l’action collective rés
 concepts: ["acteur-reseau", "traduction", "association", "hybridation"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["agencement-machinique", "configuration-et-interdependance", "cybernetique"]

src/content/glossaire/transduction-et-individuation.md

@@ -12,6 +12,7 @@ definitionShort: "Paradigme de régulation dans lequel les formes individuelles
 concepts: ["transduction-et-individuation", "transduction", "individuation", "milieu", "tension"]
 links: []
 kind: "paradigme"
+family: "paradigme"
 domain: "theorie"
 level: "avance"
 related: ["archicratie", "archicration", "tension", "co-viabilite"]

src/content/glossaire/volonte-generale.md

@@ -12,6 +12,7 @@ definitionShort: "Doctrine fondatrice faisant de la volonté générale, de l’
 concepts: ["volonte-generale", "legitimite", "collectif", "politique"]
 links: []
 kind: "doctrine"
+family: "doctrine"
 domain: "theorie"
 level: "fondamental"
 related: ["archicratie", "archicration", "scene-depreuve", "co-viabilite"]

src/pages/glossaire/[...slug].astro

@@ -55,6 +55,107 @@ const { Content } = await render(entry);
 
 const isAliasRoute = requestedSlug !== canonicalSlug;
 const canonicalHref = `/glossaire/${canonicalSlug}/`;
+
+const slugOf = (item) =>
+  String(item.id || "")
+    .trim()
+    .replace(/^\/+|\/+$/g, "")
+    .replace(/\.(md|mdx)$/i, "");
+
+const hrefOf = (item) => `/glossaire/${slugOf(item)}/`;
+
+const collator = new Intl.Collator("fr", { sensitivity: "base", numeric: true });
+const bySlug = new Map(allEntries.map((item) => [slugOf(item), item]));
+
+function resolveEntries(slugs = []) {
+  const seen = new Set();
+
+  return slugs
+    .map((slug) => bySlug.get(String(slug || "").trim()))
+    .filter(Boolean)
+    .filter((item) => {
+      const slug = slugOf(item);
+      if (seen.has(slug)) return false;
+      seen.add(slug);
+      return true;
+    })
+    .sort((a, b) => collator.compare(a.data.term, b.data.term));
+}
+
+const relatedEntries = resolveEntries(entry.data.related ?? []);
+const opposedEntries = resolveEntries(entry.data.opposedTo ?? []);
+const seeAlsoEntries = resolveEntries(entry.data.seeAlso ?? []);
+
+const relationBlocks = [
+  {
+    title: "Concepts liés",
+    items: relatedEntries,
+    className: "is-related",
+  },
+  {
+    title: "En tension avec",
+    items: opposedEntries,
+    className: "is-opposed",
+  },
+  {
+    title: "Voir aussi",
+    items: seeAlsoEntries,
+    className: "is-see-also",
+  },
+].filter((block) => block.items.length > 0);
+
+const familyLabels = {
+  "concept-fondamental": "Concept fondamental",
+  scene: "Scène",
+  dynamique: "Dynamique",
+  pathologie: "Pathologie",
+  topologie: "Topologie",
+  "meta-regime": "Méta-régime",
+  paradigme: "Paradigme",
+  doctrine: "Doctrine",
+  verbe: "Verbe",
+  "dispositif-ia": "Dispositif IA",
+  "tension-irreductible": "Tension irréductible",
+};
+
+const kindLabels = {
+  concept: "Concept",
+  diagnostic: "Diagnostic",
+  topologie: "Topologie",
+  verbe: "Verbe",
+  paradigme: "Paradigme",
+  doctrine: "Doctrine",
+};
+
+const domainLabels = {
+  transversal: "Transversal",
+  theorie: "Théorie",
+  "cas-ia": "Cas IA",
+};
+
+const levelLabels = {
+  fondamental: "Fondamental",
+  intermediaire: "Intermédiaire",
+  avance: "Avancé",
+};
+
+const familyKey = entry.data.family ?? "";
+const displayFamily =
+  familyLabels[familyKey] ??
+  kindLabels[entry.data.kind] ??
+  "Fiche";
+
+const displayDomain =
+  domainLabels[entry.data.domain] ??
+  entry.data.domain;
+
+const displayLevel =
+  levelLabels[entry.data.level] ??
+  entry.data.level;
+
+const hasScholarlyMeta =
+  (entry.data.mobilizedAuthors?.length ?? 0) > 0 ||
+  (entry.data.comparisonTraditions?.length ?? 0) > 0;
 ---
 
 <GlossaryLayout
@@ -72,23 +173,66 @@ const canonicalHref = `/glossaire/${canonicalSlug}/`;
     </p>
   )}
 
-  <h1>{entry.data.term}</h1>
+  <header class="glossary-entry-head">
-  <p><em>{entry.data.definitionShort}</em></p>
+    <h1>{entry.data.term}</h1>
-  {(entry.data.mobilizedAuthors?.length > 0 || entry.data.comparisonTraditions) && (
+    <p class="glossary-entry-dek">
+      <em>{entry.data.definitionShort}</em>
+    </p>
+
+    <div class="glossary-entry-signals" aria-label="Repères de lecture">
+      <span class="glossary-pill glossary-pill--family">
+        <strong>Famille :</strong> {displayFamily}
+      </span>
+      <span class="glossary-pill">
+        <strong>Domaine :</strong> {displayDomain}
+      </span>
+      <span class="glossary-pill">
+        <strong>Niveau :</strong> {displayLevel}
+      </span>
+    </div>
+  </header>
+
+  {hasScholarlyMeta && (
     <div class="glossary-entry-meta">
-      {entry.data.mobilizedAuthors?.length > 0 && (
+      {(entry.data.mobilizedAuthors?.length ?? 0) > 0 && (
         <p>
           <strong>Auteurs mobilisés :</strong> {entry.data.mobilizedAuthors.join(" / ")}
         </p>
       )}
-      {entry.data.comparisonTraditions && (
+
+      {(entry.data.comparisonTraditions?.length ?? 0) > 0 && (
         <p>
           <strong>Traditions de comparaison :</strong> {entry.data.comparisonTraditions.join(" / ")}
         </p>
       )}
     </div>
   )}
-  <Content />
+
+  <div class="glossary-entry-body">
+    <Content />
+  </div>
+
+  {relationBlocks.length > 0 && (
+    <section class="glossary-relations" aria-label="Relations conceptuelles">
+      <h2>Relations conceptuelles</h2>
+
+      <div class="glossary-relations-grid">
+        {relationBlocks.map((block) => (
+          <section class={`glossary-relations-card ${block.className}`}>
+            <h3>{block.title}</h3>
+            <ul>
+              {block.items.map((item) => (
+                <li>
+                  <a href={hrefOf(item)}>{item.data.term}</a>
+                  <span> — {item.data.definitionShort}</span>
+                </li>
+              ))}
+            </ul>
+          </section>
+        ))}
+      </div>
+    </section>
+  )}
 </GlossaryLayout>
 
 <style>
@@ -99,10 +243,50 @@ const canonicalHref = `/glossaire/${canonicalSlug}/`;
     background: rgba(127,127,127,0.05);
     font-size: 14px;
     line-height: 1.45;
+    margin-bottom: 18px;
   }
 
-    .glossary-entry-meta{
+  .glossary-entry-head{
-    margin: 0 0 16px;
+    margin-bottom: 18px;
+  }
+
+  .glossary-entry-head h1{
+    margin-bottom: 10px;
+  }
+
+  .glossary-entry-dek{
+    margin: 0 0 14px;
+    font-size: 1.02rem;
+    line-height: 1.6;
+    opacity: .95;
+  }
+
+  .glossary-entry-signals{
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    margin: 0 0 6px;
+  }
+
+  .glossary-pill{
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    padding: 5px 10px;
+    border: 1px solid rgba(127,127,127,0.24);
+    border-radius: 999px;
+    background: rgba(127,127,127,0.05);
+    font-size: 13px;
+    line-height: 1.35;
+  }
+
+  .glossary-pill--family{
+    border-color: rgba(127,127,127,0.36);
+    font-weight: 700;
+  }
+
+  .glossary-entry-meta{
+    margin: 0 0 18px;
     padding: 10px 12px;
     border: 1px solid rgba(127,127,127,0.18);
     border-radius: 12px;
@@ -119,14 +303,77 @@ const canonicalHref = `/glossaire/${canonicalSlug}/`;
     margin-top: 6px;
   }
 
-  @media (prefers-color-scheme: dark){
+  .glossary-entry-body{
-    .glossary-entry-meta{
+    margin-bottom: 28px;
-      background: rgba(255,255,255,0.03);
+  }
+
+  .glossary-relations{
+    margin-top: 26px;
+    padding-top: 18px;
+    border-top: 1px solid rgba(127,127,127,0.18);
+  }
+
+  .glossary-relations h2{
+    margin-bottom: 14px;
+  }
+
+  .glossary-relations-grid{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    gap: 12px;
+  }
+
+  .glossary-relations-card{
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    padding: 14px 16px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .glossary-relations-card h3{
+    margin-top: 0;
+    margin-bottom: 10px;
+    font-size: 15px;
+    line-height: 1.35;
+  }
+
+  .glossary-relations-card ul{
+    margin: 0;
+    padding-left: 18px;
+  }
+
+  .glossary-relations-card li{
+    margin-bottom: 8px;
+    font-size: 14px;
+    line-height: 1.45;
+  }
+
+  .glossary-relations-card li:last-child{
+    margin-bottom: 0;
+  }
+
+  .glossary-relations-card span{
+    opacity: .9;
+  }
+
+  @media (max-width: 720px){
+    .glossary-entry-signals{
+      gap: 6px;
+    }
+
+    .glossary-pill{
+      font-size: 12px;
     }
   }
 
   @media (prefers-color-scheme: dark){
-    .glossary-legacy-note{
+    .glossary-entry-meta{
+      background: rgba(255,255,255,0.03);
+    }
+
+    .glossary-legacy-note,
+    .glossary-pill,
+    .glossary-relations-card{
       background: rgba(255,255,255,0.04);
     }
   }

src/pages/glossaire/concepts-fondamentaux.astro

@@ -0,0 +1,676 @@
+---
+import GlossaryLayout from "../../layouts/GlossaryLayout.astro";
+import { getCollection } from "astro:content";
+
+const entries = await getCollection("glossaire");
+
+const slugOf = (entry) => String(entry.id).replace(/\.(md|mdx)$/i, "");
+const hrefOf = (entry) => `/glossaire/${slugOf(entry)}/`;
+
+const bySlug = new Map(entries.map((entry) => [slugOf(entry), entry]));
+
+const orderedSlugs = [
+  "arcalite",
+  "cratialite",
+  "tension",
+  "archicration",
+  "co-viabilite",
+  "archicratie",
+];
+
+const concepts = orderedSlugs
+  .map((slug) => bySlug.get(slug))
+  .filter(Boolean);
+
+const arcalite = bySlug.get("arcalite");
+const cratialite = bySlug.get("cratialite");
+const tension = bySlug.get("tension");
+const archicration = bySlug.get("archicration");
+const coViabilite = bySlug.get("co-viabilite");
+const archicratie = bySlug.get("archicratie");
+
+const comparisonCards = [
+  {
+    title: "Arcalité / Cratialité",
+    text:
+      "L’arcalité désigne le vecteur de fondation, de cadrage et de légitimation ; la cratialité désigne le vecteur opératoire, transformateur et effectif. L’archicratie ne se comprend qu’à partir de leur coprésence tensionnelle.",
+  },
+  {
+    title: "Archicration / Archicratie",
+    text:
+      "L’archicration est l’opérateur régulateur qui met en forme, distribue et rend révisables les tensions ; l’archicratie est le méta-régime d’ensemble qui résulte de la composition durable entre arcalité, cratialité et archicration.",
+  },
+  {
+    title: "Co-viabilité / simple stabilité",
+    text:
+      "La co-viabilité ne renvoie pas à une immobilité ni à un équilibre figé. Elle désigne la capacité d’un ordre collectif à tenir dans la durée en rendant compatibles des tensions qui ne disparaissent pas.",
+  },
+];
+
+const readingSteps = [
+  {
+    num: "01",
+    title: "Commencer par les deux vecteurs premiers",
+    text:
+      "Entrer par l’arcalité et la cratialité pour comprendre que toute régulation articule à la fois des forces de cadrage et des forces d’effectuation.",
+  },
+  {
+    num: "02",
+    title: "Comprendre la tension comme phénomène général",
+    text:
+      "La tension n’est pas un accident local mais la condition ordinaire de coexistence entre dynamiques hétérogènes.",
+  },
+  {
+    num: "03",
+    title: "Saisir le rôle de l’archicration",
+    text:
+      "L’archicration désigne l’opérateur par lequel les tensions sont exposées, distribuées, arbitrées ou rendues révisables.",
+  },
+  {
+    num: "04",
+    title: "Aboutir à la co-viabilité",
+    text:
+      "La co-viabilité permet de penser la tenue d’un collectif sans supprimer la pluralité des tensions qui le traversent.",
+  },
+  {
+    num: "05",
+    title: "Revenir à l’archicratie",
+    text:
+      "L’archicratie nomme alors le régime général dans lequel cette composition devient lisible comme structure de régulation.",
+  },
+];
+---
+
+<GlossaryLayout
+  title="Concepts fondamentaux"
+  version="1.0"
+>
+  <Fragment slot="aside">
+    <nav class="cf-aside" aria-label="Navigation des concepts fondamentaux">
+      <div class="cf-aside__block">
+        <a class="cf-aside__back" href="/glossaire/">← Retour au glossaire</a>
+        <div class="cf-aside__title">Concepts fondamentaux</div>
+        <div class="cf-aside__meta">
+          {concepts.length} notion{concepts.length > 1 ? "s" : ""} cardinale{concepts.length > 1 ? "s" : ""}
+        </div>
+      </div>
+
+      <div class="cf-aside__block">
+        <h2 class="cf-aside__heading">Dans cette page</h2>
+        <ul class="cf-aside__list">
+          <li><a href="#grammaire-minimale">Grammaire minimale du système</a></li>
+          <li><a href="#six-concepts">Les six concepts cardinaux</a></li>
+          <li><a href="#distinctions-decisives">Distinctions décisives</a></li>
+          <li><a href="#ordre-lecture">Ordre conseillé de lecture</a></li>
+          <li><a href="#prolonger-lecture">Prolonger la lecture</a></li>
+        </ul>
+      </div>
+
+      <div class="cf-aside__block">
+        <h2 class="cf-aside__heading">Renvois utiles</h2>
+        <ul class="cf-aside__list">
+          <li><a href="/glossaire/scenes-archicratiques/">Scènes archicratiques</a></li>
+          <li><a href="/glossaire/dynamiques-archicratiques/">Dynamiques archicratiques</a></li>
+          <li><a href="/glossaire/archicrations/">Méta-régimes archicratiques</a></li>
+          <li><a href="/glossaire/paradigmes/">Paradigmes et doctrines</a></li>
+          <li><a href="/glossaire/index-complet/">Index complet</a></li>
+        </ul>
+      </div>
+    </nav>
+  </Fragment>
+
+  <section class="cf-page">
+    <div class="cf-hero">
+      <p class="cf-kicker">Portail du glossaire</p>
+      <h1>Concepts fondamentaux</h1>
+      <p class="cf-intro">
+        Cette page rassemble la grammaire minimale de l’archicratie. Elle ne
+        remplace pas les fiches détaillées, mais elle en organise la lecture en
+        montrant comment les six notions cardinales se répondent, se distinguent
+        et composent ensemble un même système.
+      </p>
+      <p class="cf-intro">
+        Ces concepts ne valent pas comme unités isolées. Ils forment un noyau de
+        lecture à partir duquel peuvent ensuite se comprendre les scènes
+        archicratiques, les dynamiques, les tensions et les méta-régimes de
+        co-viabilité.
+      </p>
+    </div>
+
+    <section class="cf-section">
+      <div class="cf-section__head">
+        <h2 id="grammaire-minimale">Grammaire minimale du système</h2>
+      </div>
+
+      <p class="cf-section__intro">
+        La lecture la plus ramassée du paradigme archicratique peut se formuler
+        comme une chaîne de composition : deux vecteurs premiers entrent en
+        tension, cette tension appelle un opérateur régulateur, cet opérateur
+        vise une co-viabilité, et cette composition prend la forme générale
+        d’une archicratie.
+      </p>
+
+      <div class="cf-map" aria-label="Carte des concepts fondamentaux">
+        <div class="cf-map__stage">
+          <div class="cf-map__title">Vecteurs premiers</div>
+          <div class="cf-map__roots">
+            {arcalite ? (
+              <a class="cf-node" href={hrefOf(arcalite)}>ARCALITÉ</a>
+            ) : (
+              <span class="cf-node">ARCALITÉ</span>
+            )}
+
+            {cratialite ? (
+              <a class="cf-node" href={hrefOf(cratialite)}>CRATIALITÉ</a>
+            ) : (
+              <span class="cf-node">CRATIALITÉ</span>
+            )}
+          </div>
+        </div>
+
+        <div class="cf-map__arrow" aria-hidden="true">↓</div>
+
+        <div class="cf-map__stage">
+          <div class="cf-map__title">Phénomène transversal</div>
+          {tension ? (
+            <a class="cf-node cf-node--wide" href={hrefOf(tension)}>TENSION</a>
+          ) : (
+            <span class="cf-node cf-node--wide">TENSION</span>
+          )}
+        </div>
+
+        <div class="cf-map__arrow" aria-hidden="true">↓</div>
+
+        <div class="cf-map__stage">
+          <div class="cf-map__title">Opérateur régulateur</div>
+          {archicration ? (
+            <a class="cf-node cf-node--wide" href={hrefOf(archicration)}>
+              ARCHICRATION
+            </a>
+          ) : (
+            <span class="cf-node cf-node--wide">ARCHICRATION</span>
+          )}
+        </div>
+
+        <div class="cf-map__arrow" aria-hidden="true">↓</div>
+
+        <div class="cf-map__stage">
+          <div class="cf-map__title">Horizon de tenue</div>
+          {coViabilite ? (
+            <a class="cf-node cf-node--wide" href={hrefOf(coViabilite)}>
+              CO-VIABILITÉ
+            </a>
+          ) : (
+            <span class="cf-node cf-node--wide">CO-VIABILITÉ</span>
+          )}
+        </div>
+
+        <div class="cf-map__arrow" aria-hidden="true">↓</div>
+
+        <div class="cf-map__stage">
+          <div class="cf-map__title">Forme d’ensemble</div>
+          {archicratie ? (
+            <a class="cf-node cf-node--wide" href={hrefOf(archicratie)}>
+              ARCHICRATIE
+            </a>
+          ) : (
+            <span class="cf-node cf-node--wide">ARCHICRATIE</span>
+          )}
+        </div>
+      </div>
+    </section>
+
+    <section class="cf-section">
+      <div class="cf-section__head">
+        <h2 id="six-concepts">Les six concepts cardinaux</h2>
+        <span class="cf-section__count">
+          {concepts.length} fiche{concepts.length > 1 ? "s" : ""}
+        </span>
+      </div>
+
+      <p class="cf-section__intro">
+        Chaque fiche peut se lire séparément, mais leur intelligibilité augmente
+        lorsqu’on les aborde comme un ensemble structuré.
+      </p>
+
+      <div class="cf-cards">
+        {concepts.map((entry) => (
+          <a class="cf-card" href={hrefOf(entry)}>
+            <strong>{entry.data.term}</strong>
+            <span>{entry.data.definitionShort}</span>
+
+            {entry.data.comparisonTraditions && (
+              <small>
+                Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
+              </small>
+            )}
+          </a>
+        ))}
+      </div>
+    </section>
+
+    <section class="cf-section">
+      <div class="cf-section__head">
+        <h2 id="distinctions-decisives">Distinctions décisives</h2>
+        <span class="cf-section__count">
+          {comparisonCards.length} distinction{comparisonCards.length > 1 ? "s" : ""}
+        </span>
+      </div>
+
+      <p class="cf-section__intro">
+        Ce portail ne sert pas seulement à regrouper des définitions : il doit
+        aussi empêcher les confusions qui brouilleraient la lecture du système.
+      </p>
+
+      <div class="cf-comparisons">
+        {comparisonCards.map((item) => (
+          <section class="cf-card cf-card--text">
+            <strong>{item.title}</strong>
+            <span>{item.text}</span>
+          </section>
+        ))}
+      </div>
+    </section>
+
+    <section class="cf-section">
+      <div class="cf-section__head">
+        <h2 id="ordre-lecture">Ordre conseillé de lecture</h2>
+        <span class="cf-section__count">
+          {readingSteps.length} étape{readingSteps.length > 1 ? "s" : ""}
+        </span>
+      </div>
+
+      <p class="cf-section__intro">
+        Pour un lecteur qui découvre l’architecture conceptuelle, cet ordre
+        offre le chemin le plus clair.
+      </p>
+
+      <div class="cf-steps">
+        {readingSteps.map((step) => (
+          <section class="cf-step">
+            <div class="cf-step__num">{step.num}</div>
+            <div class="cf-step__body">
+              <h3>{step.title}</h3>
+              <p>{step.text}</p>
+            </div>
+          </section>
+        ))}
+      </div>
+    </section>
+
+    <section class="cf-section">
+      <div class="cf-section__head">
+        <h2 id="prolonger-lecture">Prolonger la lecture</h2>
+      </div>
+
+      <p class="cf-section__intro">
+        Une fois cette grammaire minimale stabilisée, la lecture peut s’élargir
+        vers les familles de méta-régimes, les paradigmes de comparaison, les
+        dynamiques archicratiques et l’index complet.
+      </p>
+
+      <div class="cf-cards">
+        <a class="cf-card" href="/glossaire/scenes-archicratiques/">
+          <strong>Scènes archicratiques</strong>
+          <span>
+            Comprendre où les tensions deviennent visibles, discutables et
+            révisables.
+          </span>
+        </a>
+
+        <a class="cf-card" href="/glossaire/dynamiques-archicratiques/">
+          <strong>Dynamiques archicratiques</strong>
+          <span>
+            Explorer les processus de déplacement, d’oblitération et de
+            pathologisation de la régulation.
+          </span>
+        </a>
+
+        <a class="cf-card" href="/glossaire/archicrations/">
+          <strong>Méta-régimes archicratiques</strong>
+          <span>
+            Parcourir les grandes formes de co-viabilité et leurs modulations
+            historiques.
+          </span>
+        </a>
+
+        <a class="cf-card" href="/glossaire/paradigmes/">
+          <strong>Paradigmes et doctrines</strong>
+          <span>
+            Situer l’archicratie dans le paysage théorique avec lequel elle
+            dialogue.
+          </span>
+        </a>
+
+        <a class="cf-card" href="/glossaire/index-complet/">
+          <strong>Index complet</strong>
+          <span>
+            Retrouver l’ensemble des entrées du glossaire dans une navigation
+            alphabétique intégrale.
+          </span>
+        </a>
+      </div>
+    </section>
+
+    <section class="cf-section cf-section--final">
+      <h2>Portée d’ensemble</h2>
+      <p>
+        Lire ces concepts ensemble permet de comprendre que l’
+        <a href="/glossaire/archicratie/">archicratie</a> n’est pas une notion
+        isolée, mais une intelligibilité d’ensemble de la régulation collective.
+        Les six concepts fondamentaux forment ainsi le noyau à partir duquel
+        deviennent lisibles la
+        <a href="/glossaire/scene-depreuve/">scène d’épreuve</a>, l’
+        <a href="/glossaire/archicration/">archicration</a>, la
+        <a href="/glossaire/co-viabilite/">co-viabilité</a> et, plus largement,
+        les différentes formes historiques de co-viabilité.
+      </p>
+    </section>
+  </section>
+</GlossaryLayout>
+
+<style>
+  .cf-page{
+    padding: 8px 0 24px;
+  }
+
+  .cf-hero{
+    margin-bottom: 24px;
+  }
+
+  .cf-kicker{
+    font-size: 12px;
+    letter-spacing: .08em;
+    text-transform: uppercase;
+    opacity: .72;
+    margin-bottom: 8px;
+  }
+
+  .cf-intro{
+    max-width: 76ch;
+    opacity: .92;
+  }
+
+  .cf-section{
+    margin-top: 34px;
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .cf-section h2{
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .cf-section__head{
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 12px;
+    flex-wrap: wrap;
+  }
+
+  .cf-section__count{
+    font-size: 13px;
+    opacity: .72;
+    white-space: nowrap;
+  }
+
+  .cf-section__intro{
+    max-width: 78ch;
+    opacity: .92;
+  }
+
+  .cf-map{
+    display: grid;
+    justify-items: center;
+    gap: 10px;
+    margin-top: 14px;
+    padding: 16px 18px 18px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 18px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .cf-map__stage{
+    width: min(580px, 100%);
+    display: grid;
+    justify-items: center;
+    gap: 10px;
+  }
+
+  .cf-map__title{
+    width: 100%;
+    text-align: center;
+    font-size: 1.02rem;
+    line-height: 1.25;
+    font-weight: 800;
+    letter-spacing: -.01em;
+    opacity: .96;
+  }
+
+  .cf-map__roots{
+    width: 100%;
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 8px;
+  }
+
+  .cf-node{
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 48px;
+    padding: 10px 14px;
+    border: 1px solid rgba(127,127,127,0.24);
+    border-radius: 999px;
+    background: rgba(127,127,127,0.05);
+    text-decoration: none;
+    text-align: center;
+    font-size: 13px;
+    font-weight: 800;
+    letter-spacing: .05em;
+    line-height: 1.2;
+    transition: transform 120ms ease, background 120ms ease;
+  }
+
+  .cf-node:hover{
+    transform: translateY(-1px);
+    background: rgba(127,127,127,0.08);
+    text-decoration: none;
+  }
+
+  .cf-node--wide{
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .cf-map__arrow{
+    font-size: 18px;
+    line-height: 1;
+    opacity: .65;
+  }
+
+  .cf-cards,
+  .cf-comparisons{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+    gap: 12px;
+    margin-top: 14px;
+  }
+
+  .cf-card{
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    padding: 14px 16px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    background: rgba(127,127,127,0.05);
+    text-decoration: none;
+    transition: transform 120ms ease, background 120ms ease;
+  }
+
+  .cf-card:hover{
+    transform: translateY(-1px);
+    background: rgba(127,127,127,0.08);
+    text-decoration: none;
+  }
+
+  .cf-card strong{
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .cf-card span{
+    font-size: 14px;
+    line-height: 1.45;
+    opacity: .92;
+  }
+
+  .cf-card small{
+    font-size: 12px;
+    line-height: 1.4;
+    opacity: .72;
+  }
+
+  .cf-card--text{
+    cursor: default;
+  }
+
+  .cf-card--text:hover{
+    transform: none;
+  }
+
+  .cf-steps{
+    display: grid;
+    gap: 12px;
+    margin-top: 14px;
+  }
+
+  .cf-step{
+    display: grid;
+    grid-template-columns: 64px minmax(0, 1fr);
+    gap: 14px;
+    align-items: start;
+    padding: 14px 16px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .cf-step__num{
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 44px;
+    border: 1px solid rgba(127,127,127,0.28);
+    border-radius: 999px;
+    font-size: 13px;
+    font-weight: 800;
+    letter-spacing: .08em;
+  }
+
+  .cf-step__body h3{
+    margin: 0;
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .cf-step__body p{
+    margin: 8px 0 0;
+    font-size: 14px;
+    line-height: 1.45;
+    opacity: .92;
+  }
+
+  .cf-section--final{
+    margin-top: 42px;
+  }
+
+  .cf-aside{
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .cf-aside__block{
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    padding: 12px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .cf-aside__back{
+    display: inline-block;
+    margin-bottom: 8px;
+    font-size: 13px;
+    font-weight: 700;
+    text-decoration: none;
+  }
+
+  .cf-aside__title{
+    font-size: 14px;
+    font-weight: 800;
+    letter-spacing: .2px;
+    line-height: 1.25;
+  }
+
+  .cf-aside__meta{
+    margin-top: 8px;
+    font-size: 12px;
+    line-height: 1.35;
+    opacity: .78;
+  }
+
+  .cf-aside__heading{
+    margin: 0 0 10px;
+    font-size: 13px;
+    font-weight: 800;
+    opacity: .9;
+  }
+
+  .cf-aside__list{
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .cf-aside__list li{
+    margin: 6px 0;
+  }
+
+  .cf-aside__list a{
+    text-decoration: none;
+    font-size: 13px;
+    line-height: 1.3;
+  }
+
+  @media (max-width: 720px){
+    .cf-map__roots{
+      grid-template-columns: 1fr;
+    }
+
+    .cf-step{
+      grid-template-columns: 1fr;
+    }
+
+    .cf-step__num{
+      width: fit-content;
+      min-width: 64px;
+    }
+  }
+
+  @media (prefers-color-scheme: dark){
+    .cf-map,
+    .cf-node,
+    .cf-card,
+    .cf-step,
+    .cf-aside__block{
+      background: rgba(255,255,255,0.04);
+    }
+
+    .cf-node:hover,
+    .cf-card:hover{
+      background: rgba(255,255,255,0.07);
+    }
+  }
+</style>

src/pages/glossaire/dynamiques-archicratiques.astro

@@ -0,0 +1,577 @@
+---
+import GlossaryLayout from "../../layouts/GlossaryLayout.astro";
+import { getCollection } from "astro:content";
+
+const entries = await getCollection("glossaire");
+
+const slugOf = (entry) => String(entry.id).replace(/\.(md|mdx)$/i, "");
+const hrefOf = (entry) => `/glossaire/${slugOf(entry)}/`;
+
+const collator = new Intl.Collator("fr", { sensitivity: "base", numeric: true });
+const bySlug = new Map(entries.map((entry) => [slugOf(entry), entry]));
+
+function sortByTerm(list = []) {
+  return [...list].sort((a, b) => collator.compare(a.data.term, b.data.term));
+}
+
+function resolveEntries(slugs = []) {
+  return slugs
+    .map((slug) => bySlug.get(slug))
+    .filter(Boolean);
+}
+
+function uniqueBySlug(list = []) {
+  const seen = new Set();
+  const out = [];
+  for (const entry of list) {
+    const slug = slugOf(entry);
+    if (seen.has(slug)) continue;
+    seen.add(slug);
+    out.push(entry);
+  }
+  return out;
+}
+
+const obliteration = bySlug.get("obliteration-archicratique");
+const autarchicratie = bySlug.get("autarchicratie");
+const tension = bySlug.get("tension");
+const sceneDepreuve = bySlug.get("scene-depreuve");
+const archicration = bySlug.get("archicration");
+const archicratie = bySlug.get("archicratie");
+
+const diagnosisEntries = sortByTerm(
+  [obliteration, autarchicratie].filter(Boolean)
+);
+
+const structuralEntries = sortByTerm(
+  [tension, sceneDepreuve, archicration, archicratie].filter(Boolean)
+);
+
+const relatedEntries = sortByTerm(
+  uniqueBySlug([
+    ...resolveEntries(obliteration?.data?.related ?? []),
+    ...resolveEntries(obliteration?.data?.seeAlso ?? []),
+    ...resolveEntries(obliteration?.data?.opposedTo ?? []),
+    ...resolveEntries(autarchicratie?.data?.related ?? []),
+    ...resolveEntries(autarchicratie?.data?.seeAlso ?? []),
+    ...resolveEntries(autarchicratie?.data?.opposedTo ?? []),
+  ]).filter((entry) => !["obliteration-archicratique", "autarchicratie"].includes(slugOf(entry)))
+);
+
+const paradigmEntries = sortByTerm(
+  relatedEntries.filter((entry) => entry.data.kind === "paradigme")
+);
+
+const otherEntries = sortByTerm(
+  relatedEntries.filter((entry) => entry.data.kind !== "paradigme")
+);
+
+const diagnosisCount = diagnosisEntries.length;
+const structuralCount = structuralEntries.length;
+const constellationCount = relatedEntries.length;
+---
+
+<GlossaryLayout
+  title="Dynamiques archicratiques"
+  version="1.0"
+>
+  <Fragment slot="aside">
+    <nav class="dyna-aside" aria-label="Navigation des dynamiques archicratiques">
+      <div class="dyna-aside__block">
+        <a class="dyna-aside__back" href="/glossaire/">← Retour au glossaire</a>
+        <div class="dyna-aside__title">Dynamiques archicratiques</div>
+        <div class="dyna-aside__meta">
+          {diagnosisCount > 0
+            ? `${diagnosisCount} diagnostic${diagnosisCount > 1 ? "s" : ""} central${diagnosisCount > 1 ? "ux" : ""}`
+            : "Portail en cours de constitution"}
+        </div>
+      </div>
+
+      <div class="dyna-aside__block">
+        <h2 class="dyna-aside__heading">Dans cette page</h2>
+        <ul class="dyna-aside__list">
+          <li><a href="#noyau-diagnostique">Noyau diagnostique</a></li>
+          {structuralEntries.length > 0 && (
+            <li><a href="#articulations-essentielles">Articulations essentielles</a></li>
+          )}
+          {relatedEntries.length > 0 && (
+            <li><a href="#constellation-theorique">Constellation théorique</a></li>
+          )}
+          <li><a href="#prolonger-la-lecture">Prolonger la lecture</a></li>
+        </ul>
+      </div>
+
+      <div class="dyna-aside__block">
+        <h2 class="dyna-aside__heading">Renvois utiles</h2>
+        <ul class="dyna-aside__list">
+          <li><a href="/glossaire/tension/">Tension</a></li>
+          <li><a href="/glossaire/scene-depreuve/">Scène d’épreuve</a></li>
+          <li><a href="/glossaire/archicration/">Archicration</a></li>
+          <li><a href="/glossaire/archicratie/">Archicratie</a></li>
+          <li><a href="/glossaire/tensions-irreductibles/">Tensions irréductibles</a></li>
+        </ul>
+      </div>
+    </nav>
+  </Fragment>
+
+  <section class="dyna-page">
+    <div class="dyna-hero">
+      <p class="dyna-kicker">Parcours du glossaire</p>
+      <h1>Dynamiques archicratiques</h1>
+      <p class="dyna-intro">
+        Les dynamiques archicratiques désignent les processus par lesquels une
+        régulation se déplace, se ferme, se rigidifie ou se soustrait à sa
+        propre révisabilité. Elles permettent de penser non seulement la tenue
+        d’un régime, mais aussi ses dérives, ses opacifications et ses
+        pathologies.
+      </p>
+      <p class="dyna-intro">
+        Elles décrivent ainsi le versant processuel de l’archicratie : non plus
+        seulement ce qui tient, mais la manière dont cela se transforme,
+        s’altère, s’autonomise ou devient de moins en moins exposable à
+        l’épreuve collective.
+      </p>
+    </div>
+
+    <section class="dyna-section">
+      <div class="dyna-section__head">
+        <h2 id="noyau-diagnostique">Noyau diagnostique</h2>
+        {diagnosisEntries.length > 0 && (
+          <span class="dyna-section__count">
+            {diagnosisEntries.length} entrée{diagnosisEntries.length > 1 ? "s" : ""}
+          </span>
+        )}
+      </div>
+
+      <p class="dyna-section__intro">
+        Cette page rassemble les diagnostics déjà stabilisés dans le glossaire
+        pour penser les dérives internes de la régulation archicratique :
+        l’<strong>oblitération archicratique</strong>, comme processus
+        d’effacement de la visibilité régulatrice, et l’<strong>autarchicratie</strong>,
+        comme forme de fermeture croissante des architectures sur elles-mêmes.
+      </p>
+
+      {diagnosisEntries.length > 0 ? (
+        <div class="dyna-focus-grid">
+          {diagnosisEntries.map((entry) => (
+            <article class="dyna-focus-card">
+              <div class="dyna-focus-card__eyebrow">Diagnostic central</div>
+              <h3>
+                <a href={hrefOf(entry)}>{entry.data.term}</a>
+              </h3>
+              <p class="dyna-focus-card__def">{entry.data.definitionShort}</p>
+
+              {(entry.data.comparisonTraditions?.length > 0 || entry.data.mobilizedAuthors?.length > 0) && (
+                <div class="dyna-focus-card__meta">
+                  {entry.data.comparisonTraditions?.length > 0 && (
+                    <p>
+                      <strong>Traditions de comparaison :</strong>{" "}
+                      {entry.data.comparisonTraditions.join(" / ")}
+                    </p>
+                  )}
+                  {entry.data.mobilizedAuthors?.length > 0 && (
+                    <p>
+                      <strong>Auteurs mobilisés :</strong>{" "}
+                      {entry.data.mobilizedAuthors.join(" / ")}
+                    </p>
+                  )}
+                </div>
+              )}
+            </article>
+          ))}
+        </div>
+      ) : (
+        <p class="dyna-empty">
+          Les fiches principales ne sont pas encore disponibles dans la collection.
+        </p>
+      )}
+    </section>
+
+    {structuralEntries.length > 0 && (
+      <section class="dyna-section">
+        <div class="dyna-section__head">
+          <h2 id="articulations-essentielles">Articulations essentielles</h2>
+          <span class="dyna-section__count">
+            {structuralCount} notion{structuralCount > 1 ? "s" : ""}
+          </span>
+        </div>
+
+        <p class="dyna-section__intro">
+          Les dynamiques archicratiques ne peuvent pas être pensées isolément :
+          elles prennent sens à partir des tensions, de la scène d’épreuve, de
+          l’archicration et du méta-régime d’archicratie lui-même.
+        </p>
+
+        <div class="dyna-cards">
+          {structuralEntries.map((entry) => (
+            <a class="dyna-card" href={hrefOf(entry)}>
+              <strong>{entry.data.term}</strong>
+              <span>{entry.data.definitionShort}</span>
+
+              {entry.data.comparisonTraditions?.length > 0 && (
+                <small>
+                  Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
+                </small>
+              )}
+            </a>
+          ))}
+        </div>
+      </section>
+    )}
+
+    {relatedEntries.length > 0 && (
+      <section class="dyna-section">
+        <div class="dyna-section__head">
+          <h2 id="constellation-theorique">Constellation théorique</h2>
+          <span class="dyna-section__count">
+            {constellationCount} entrée{constellationCount > 1 ? "s" : ""}
+          </span>
+        </div>
+
+        <p class="dyna-section__intro">
+          Ces diagnostics entrent en résonance avec d’autres notions et
+          paradigmes qui permettent de préciser les mécanismes de fermeture, de
+          capture, d’opacification ou de désajustement de la régulation.
+        </p>
+
+        {otherEntries.length > 0 && (
+          <div class="dyna-block">
+            <h3>Notions et diagnostics liés</h3>
+            <div class="dyna-cards">
+              {otherEntries.map((entry) => (
+                <a class="dyna-card" href={hrefOf(entry)}>
+                  <strong>{entry.data.term}</strong>
+                  <span>{entry.data.definitionShort}</span>
+
+                  {entry.data.comparisonTraditions?.length > 0 && (
+                    <small>
+                      Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
+                    </small>
+                  )}
+                </a>
+              ))}
+            </div>
+          </div>
+        )}
+
+        {paradigmEntries.length > 0 && (
+          <div class="dyna-block">
+            <h3>Paradigmes mobilisés</h3>
+            <div class="dyna-cards">
+              {paradigmEntries.map((entry) => (
+                <a class="dyna-card" href={hrefOf(entry)}>
+                  <strong>{entry.data.term}</strong>
+                  <span>{entry.data.definitionShort}</span>
+
+                  {entry.data.mobilizedAuthors?.length > 0 && (
+                    <small>
+                      Auteurs mobilisés : {entry.data.mobilizedAuthors.join(" / ")}
+                    </small>
+                  )}
+                </a>
+              ))}
+            </div>
+          </div>
+        )}
+      </section>
+    )}
+
+    <section class="dyna-section">
+      <div class="dyna-section__head">
+        <h2 id="prolonger-la-lecture">Prolonger la lecture</h2>
+      </div>
+
+      <p class="dyna-section__intro">
+        Cette page sert de portail thématique entre l’accueil général du
+        glossaire et les fiches détaillées. Elle sera amenée à s’étoffer à
+        mesure que le chantier des tensions et des dynamiques sera approfondi.
+      </p>
+
+      <div class="dyna-cards">
+        <a class="dyna-card" href="/glossaire/">
+          <strong>Accueil du glossaire</strong>
+          <span>
+            Revenir à la cartographie générale du système archicratique.
+          </span>
+        </a>
+
+        <a class="dyna-card" href="/glossaire/archicrations/">
+          <strong>Méta-régimes archicratiques</strong>
+          <span>
+            Parcourir les grandes formes de co-viabilité dans lesquelles les
+            tensions sont stabilisées.
+          </span>
+        </a>
+
+        <a class="dyna-card" href="/glossaire/tensions-irreductibles/">
+          <strong>Tensions irréductibles</strong>
+          <span>
+            Explorer les tensions fondatrices à partir desquelles les dynamiques
+            de régulation deviennent lisibles.
+          </span>
+        </a>
+
+        <a class="dyna-card" href="/glossaire/index-complet/">
+          <strong>Index complet</strong>
+          <span>
+            Retrouver l’ensemble des entrées du glossaire dans une navigation
+            alphabétique intégrale.
+          </span>
+        </a>
+      </div>
+    </section>
+
+    <section class="dyna-section dyna-section--final">
+      <h2>Portée d’ensemble</h2>
+      <p>
+        Les dynamiques archicratiques permettent de penser la régulation non
+        comme une forme immobile, mais comme un devenir. Elles montrent comment
+        une architecture peut continuer d’opérer tout en devenant de moins en
+        moins visible, de moins en moins discutable et de moins en moins
+        révisable. Elles éclairent ainsi le passage entre simple tenue du
+        collectif et dérive d’un régime vers l’opacité, la fermeture ou la
+        captation de sa propre scène d’épreuve.
+      </p>
+    </section>
+  </section>
+</GlossaryLayout>
+
+<style>
+  .dyna-page{
+    padding: 8px 0 24px;
+  }
+
+  .dyna-hero{
+    margin-bottom: 24px;
+  }
+
+  .dyna-kicker{
+    font-size: 12px;
+    letter-spacing: .08em;
+    text-transform: uppercase;
+    opacity: .72;
+    margin-bottom: 8px;
+  }
+
+  .dyna-intro{
+    max-width: 76ch;
+    opacity: .92;
+  }
+
+  .dyna-section{
+    margin-top: 34px;
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .dyna-section h2{
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .dyna-section__head{
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 12px;
+    flex-wrap: wrap;
+  }
+
+  .dyna-section__count{
+    font-size: 13px;
+    opacity: .72;
+    white-space: nowrap;
+  }
+
+  .dyna-section__intro{
+    max-width: 78ch;
+    opacity: .92;
+  }
+
+  .dyna-focus-grid{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+    gap: 12px;
+    margin-top: 14px;
+  }
+
+  .dyna-focus-card{
+    padding: 18px 20px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 18px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .dyna-focus-card__eyebrow{
+    margin-bottom: 10px;
+    font-size: 12px;
+    font-weight: 800;
+    letter-spacing: .08em;
+    text-transform: uppercase;
+    opacity: .72;
+  }
+
+  .dyna-focus-card h3{
+    margin: 0 0 10px;
+    font-size: clamp(1.35rem, 2vw, 1.7rem);
+    line-height: 1.15;
+  }
+
+  .dyna-focus-card h3 a{
+    text-decoration: none;
+  }
+
+  .dyna-focus-card__def{
+    margin: 0;
+    font-size: 1rem;
+    line-height: 1.55;
+    opacity: .95;
+  }
+
+  .dyna-focus-card__meta{
+    margin-top: 14px;
+    padding-top: 14px;
+    border-top: 1px solid rgba(127,127,127,0.18);
+  }
+
+  .dyna-focus-card__meta p{
+    margin: 0;
+    font-size: 13px;
+    line-height: 1.5;
+    opacity: .9;
+  }
+
+  .dyna-focus-card__meta p + p{
+    margin-top: 6px;
+  }
+
+  .dyna-block + .dyna-block{
+    margin-top: 22px;
+  }
+
+  .dyna-block h3{
+    margin: 0 0 12px;
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .dyna-cards{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+    gap: 12px;
+    margin-top: 14px;
+  }
+
+  .dyna-card{
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    padding: 14px 16px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    background: rgba(127,127,127,0.05);
+    text-decoration: none;
+    transition: transform 120ms ease, background 120ms ease;
+  }
+
+  .dyna-card:hover{
+    transform: translateY(-1px);
+    background: rgba(127,127,127,0.08);
+    text-decoration: none;
+  }
+
+  .dyna-card strong{
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .dyna-card span{
+    font-size: 14px;
+    line-height: 1.45;
+    opacity: .92;
+  }
+
+  .dyna-card small{
+    font-size: 12px;
+    line-height: 1.4;
+    opacity: .72;
+  }
+
+  .dyna-empty{
+    margin: 0;
+    font-style: italic;
+    opacity: .82;
+  }
+
+  .dyna-section--final{
+    margin-top: 42px;
+  }
+
+  .dyna-aside{
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .dyna-aside__block{
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    padding: 12px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .dyna-aside__back{
+    display: inline-block;
+    margin-bottom: 8px;
+    font-size: 13px;
+    font-weight: 700;
+    text-decoration: none;
+  }
+
+  .dyna-aside__title{
+    font-size: 14px;
+    font-weight: 800;
+    letter-spacing: .2px;
+    line-height: 1.25;
+  }
+
+  .dyna-aside__meta{
+    margin-top: 8px;
+    font-size: 12px;
+    line-height: 1.35;
+    opacity: .78;
+  }
+
+  .dyna-aside__heading{
+    margin: 0 0 10px;
+    font-size: 13px;
+    font-weight: 800;
+    opacity: .9;
+  }
+
+  .dyna-aside__list{
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .dyna-aside__list li{
+    margin: 6px 0;
+  }
+
+  .dyna-aside__list a{
+    text-decoration: none;
+    font-size: 13px;
+    line-height: 1.3;
+  }
+
+  @media (prefers-color-scheme: dark){
+    .dyna-focus-card,
+    .dyna-card,
+    .dyna-aside__block{
+      background: rgba(255,255,255,0.04);
+    }
+
+    .dyna-card:hover{
+      background: rgba(255,255,255,0.07);
+    }
+  }
+</style>

src/pages/glossaire/index-complet.astro

@@ -0,0 +1,223 @@
+---
+import SiteLayout from "../../layouts/SiteLayout.astro";
+import { getCollection } from "astro:content";
+
+const entries = await getCollection("glossaire");
+
+const slugOf = (entry) => String(entry.id).replace(/\.(md|mdx)$/i, "");
+const hrefOf = (entry) => `/glossaire/${slugOf(entry)}/`;
+
+const collator = new Intl.Collator("fr", { sensitivity: "base", numeric: true });
+
+const kindLabels = {
+  concept: "Concept",
+  diagnostic: "Diagnostic",
+  topologie: "Topologie",
+  verbe: "Verbe",
+  paradigme: "Paradigme",
+  doctrine: "Doctrine",
+};
+
+const domainLabels = {
+  transversal: "Transversal",
+  theorie: "Théorie",
+  "cas-ia": "Cas IA",
+};
+
+const levelLabels = {
+  fondamental: "Fondamental",
+  intermediaire: "Intermédiaire",
+  avance: "Avancé",
+};
+
+const sorted = [...entries].sort((a, b) => collator.compare(a.data.term, b.data.term));
+
+function groupByInitial(list) {
+  const map = new Map();
+
+  for (const entry of list) {
+    const letter = (entry.data.term || "").trim().charAt(0).toUpperCase() || "#";
+    if (!map.has(letter)) map.set(letter, []);
+    map.get(letter).push(entry);
+  }
+
+  return [...map.entries()].sort((a, b) => collator.compare(a[0], b[0]));
+}
+
+const groupedAlpha = groupByInitial(sorted);
+---
+
+<SiteLayout title="Index complet du glossaire">
+  <section class="glossary-index-page">
+    <header class="glossary-index-page__hero">
+      <p class="glossary-index-page__kicker">Référentiel terminologique</p>
+      <h1>Index complet du glossaire</h1>
+      <p class="glossary-index-page__intro">
+        Cette page rassemble l’ensemble des entrées du glossaire dans un ordre alphabétique intégral.
+        Elle complète l’accueil conceptuel du glossaire par une navigation plus encyclopédique.
+      </p>
+    </header>
+
+    <div class="glossary-index-page__topbar">
+      <a class="glossary-index-page__back" href="/glossaire/">← Retour à l’accueil du glossaire</a>
+
+      <nav class="glossary-index-page__letters" aria-label="Lettres de l’index">
+        {groupedAlpha.map(([letter]) => (
+          <a href={`#letter-${letter}`}>{letter}</a>
+        ))}
+      </nav>
+    </div>
+
+    <div class="glossary-index-page__groups">
+      {groupedAlpha.map(([letter, items]) => (
+        <section class="glossary-index-page__group" id={`letter-${letter}`}>
+          <h2>{letter}</h2>
+          <ul class="glossary-index-page__list">
+            {items.map((entry) => (
+              <li class="glossary-index-page__item">
+                <a class="glossary-index-page__term" href={hrefOf(entry)}>
+                  {entry.data.term}
+                </a>
+                <p class="glossary-index-page__def">{entry.data.definitionShort}</p>
+                <p class="glossary-index-page__meta">
+                  <span>{kindLabels[entry.data.kind] ?? entry.data.kind}</span>
+                  <span>{domainLabels[entry.data.domain] ?? entry.data.domain}</span>
+                  <span>{levelLabels[entry.data.level] ?? entry.data.level}</span>
+                </p>
+              </li>
+            ))}
+          </ul>
+        </section>
+      ))}
+    </div>
+  </section>
+</SiteLayout>
+
+<style>
+  .glossary-index-page{
+    padding: 8px 0 32px;
+  }
+
+  .glossary-index-page__hero{
+    margin-bottom: 22px;
+  }
+
+  .glossary-index-page__kicker{
+    margin: 0 0 8px;
+    font-size: 12px;
+    letter-spacing: .08em;
+    text-transform: uppercase;
+    opacity: .72;
+  }
+
+  .glossary-index-page__hero h1{
+    margin: 0 0 12px;
+    font-size: clamp(2.2rem, 4vw, 3rem);
+    line-height: 1.05;
+    letter-spacing: -.03em;
+  }
+
+  .glossary-index-page__intro{
+    max-width: 76ch;
+    margin: 0;
+    opacity: .92;
+  }
+
+  .glossary-index-page__topbar{
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+    margin: 22px 0 28px;
+  }
+
+  .glossary-index-page__back{
+    display: inline-flex;
+    width: fit-content;
+    align-items: center;
+    border: 1px solid rgba(127,127,127,0.28);
+    border-radius: 999px;
+    padding: 7px 14px;
+    text-decoration: none;
+  }
+
+  .glossary-index-page__letters{
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
+
+  .glossary-index-page__letters a{
+    min-width: 34px;
+    text-align: center;
+    border: 1px solid rgba(127,127,127,0.24);
+    border-radius: 10px;
+    padding: 5px 8px;
+    text-decoration: none;
+  }
+
+  .glossary-index-page__groups{
+    display: flex;
+    flex-direction: column;
+    gap: 28px;
+  }
+
+  .glossary-index-page__group{
+    scroll-margin-top: calc(var(--sticky-offset) + 20px);
+  }
+
+  .glossary-index-page__group h2{
+    margin: 0 0 14px;
+    font-size: clamp(1.6rem, 2vw, 2rem);
+    line-height: 1.1;
+  }
+
+  .glossary-index-page__list{
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: grid;
+    gap: 12px;
+  }
+
+  .glossary-index-page__item{
+    border: 1px solid rgba(127,127,127,0.20);
+    border-radius: 16px;
+    padding: 14px 16px;
+    background: rgba(127,127,127,0.04);
+  }
+
+  .glossary-index-page__term{
+    display: inline-block;
+    font-weight: 800;
+    font-size: 1.04rem;
+    text-decoration: none;
+    margin-bottom: 6px;
+  }
+
+  .glossary-index-page__def{
+    margin: 0 0 8px;
+    line-height: 1.5;
+    opacity: .94;
+  }
+
+  .glossary-index-page__meta{
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    margin: 0;
+    font-size: 12px;
+    opacity: .78;
+  }
+
+  .glossary-index-page__meta span{
+    border: 1px solid rgba(127,127,127,0.20);
+    border-radius: 999px;
+    padding: 2px 8px;
+  }
+
+  @media (prefers-color-scheme: dark){
+    .glossary-index-page__item{
+      background: rgba(255,255,255,0.04);
+    }
+  }
+</style>

src/pages/glossaire/scenes-archicratiques.astro

@@ -0,0 +1,545 @@
+---
+import GlossaryLayout from "../../layouts/GlossaryLayout.astro";
+import { getCollection } from "astro:content";
+
+const entries = await getCollection("glossaire");
+
+const slugOf = (entry) => String(entry.id).replace(/\.(md|mdx)$/i, "");
+const hrefOf = (entry) => `/glossaire/${slugOf(entry)}/`;
+
+const collator = new Intl.Collator("fr", { sensitivity: "base", numeric: true });
+const bySlug = new Map(entries.map((entry) => [slugOf(entry), entry]));
+
+function sortByTerm(list = []) {
+  return [...list].sort((a, b) => collator.compare(a.data.term, b.data.term));
+}
+
+function resolveEntries(slugs = []) {
+  return slugs
+    .map((slug) => bySlug.get(slug))
+    .filter(Boolean);
+}
+
+function uniqueBySlug(list = []) {
+  const seen = new Set();
+  const out = [];
+  for (const entry of list) {
+    const slug = slugOf(entry);
+    if (seen.has(slug)) continue;
+    seen.add(slug);
+    out.push(entry);
+  }
+  return out;
+}
+
+const sceneDepreuve = bySlug.get("scene-depreuve");
+const tension = bySlug.get("tension");
+const archicration = bySlug.get("archicration");
+const archicratie = bySlug.get("archicratie");
+
+const structuralEntries = sortByTerm(
+  [tension, archicration, archicratie].filter(Boolean)
+);
+
+const relatedEntries = sceneDepreuve
+  ? sortByTerm(
+      uniqueBySlug([
+        ...resolveEntries(sceneDepreuve.data.related ?? []),
+        ...resolveEntries(sceneDepreuve.data.seeAlso ?? []),
+        ...resolveEntries(sceneDepreuve.data.opposedTo ?? []),
+      ]).filter((entry) => slugOf(entry) !== "scene-depreuve")
+    )
+  : [];
+
+const paradigmEntries = sortByTerm(
+  relatedEntries.filter((entry) => entry.data.kind === "paradigme")
+);
+
+const otherEntries = sortByTerm(
+  relatedEntries.filter((entry) => entry.data.kind !== "paradigme")
+);
+
+const mobilizedAuthors = sceneDepreuve?.data?.mobilizedAuthors ?? [];
+const comparisonTraditions = sceneDepreuve?.data?.comparisonTraditions ?? [];
+const constellationCount = relatedEntries.length;
+---
+
+<GlossaryLayout
+  title="Scènes archicratiques"
+  version="1.0"
+>
+  <Fragment slot="aside">
+    <nav class="scene-aside" aria-label="Navigation des scènes archicratiques">
+      <div class="scene-aside__block">
+        <a class="scene-aside__back" href="/glossaire/">← Retour au glossaire</a>
+        <div class="scene-aside__title">Scènes archicratiques</div>
+        <div class="scene-aside__meta">
+          {sceneDepreuve ? "1 notion-pivot" : "Portail en cours de constitution"}
+        </div>
+      </div>
+
+      <div class="scene-aside__block">
+        <h2 class="scene-aside__heading">Dans cette page</h2>
+        <ul class="scene-aside__list">
+          <li><a href="#coeur-de-notion">Cœur de notion</a></li>
+          {structuralEntries.length > 0 && (
+            <li><a href="#articulations-essentielles">Articulations essentielles</a></li>
+          )}
+          {relatedEntries.length > 0 && (
+            <li><a href="#constellation-theorique">Constellation théorique</a></li>
+          )}
+          <li><a href="#prolonger-la-lecture">Prolonger la lecture</a></li>
+        </ul>
+      </div>
+
+      <div class="scene-aside__block">
+        <h2 class="scene-aside__heading">Renvois utiles</h2>
+        <ul class="scene-aside__list">
+          <li><a href="/glossaire/tension/">Tension</a></li>
+          <li><a href="/glossaire/archicration/">Archicration</a></li>
+          <li><a href="/glossaire/archicratie/">Archicratie</a></li>
+          <li><a href="/glossaire/concepts-fondamentaux/">Concepts fondamentaux</a></li>
+          <li><a href="/glossaire/paradigmes/">Paradigmes et doctrines</a></li>
+        </ul>
+      </div>
+    </nav>
+  </Fragment>
+
+  <section class="scene-page">
+    <div class="scene-hero">
+      <p class="scene-kicker">Parcours du glossaire</p>
+      <h1>Scènes archicratiques</h1>
+      <p class="scene-intro">
+        Les scènes archicratiques désignent les espaces de comparution,
+        d’exposition, de contestation et de révision par lesquels une
+        architecture régulatrice cesse d’être purement opaque pour devenir
+        visible, discutable et transformable.
+      </p>
+      <p class="scene-intro">
+        Dans l’économie générale du paradigme, elles sont ce qui empêche la
+        régulation de se refermer sur elle-même. Elles ouvrent un espace où les
+        tensions peuvent apparaître, être qualifiées, disputées et réorganisées.
+      </p>
+    </div>
+
+    <section class="scene-section">
+      <div class="scene-section__head">
+        <h2 id="coeur-de-notion">Cœur de notion</h2>
+      </div>
+
+      <p class="scene-section__intro">
+        Cette page prend pour pivot la <strong>scène d’épreuve</strong>, notion
+        centrale pour penser l’exposition publique, la mise en discussion et la
+        révisabilité des architectures de régulation.
+      </p>
+
+      {sceneDepreuve ? (
+        <article class="scene-focus-card">
+          <div class="scene-focus-card__eyebrow">Entrée principale</div>
+          <h3>
+            <a href={hrefOf(sceneDepreuve)}>{sceneDepreuve.data.term}</a>
+          </h3>
+          <p class="scene-focus-card__def">{sceneDepreuve.data.definitionShort}</p>
+
+          {(mobilizedAuthors.length > 0 || comparisonTraditions.length > 0) && (
+            <div class="scene-focus-card__meta">
+              {mobilizedAuthors.length > 0 && (
+                <p>
+                  <strong>Auteurs mobilisés :</strong> {mobilizedAuthors.join(" / ")}
+                </p>
+              )}
+              {comparisonTraditions.length > 0 && (
+                <p>
+                  <strong>Traditions de comparaison :</strong> {comparisonTraditions.join(" / ")}
+                </p>
+              )}
+            </div>
+          )}
+        </article>
+      ) : (
+        <p class="scene-empty">
+          La fiche principale n’est pas encore disponible dans la collection.
+        </p>
+      )}
+    </section>
+
+    {structuralEntries.length > 0 && (
+      <section class="scene-section">
+        <div class="scene-section__head">
+          <h2 id="articulations-essentielles">Articulations essentielles</h2>
+          <span class="scene-section__count">
+            {structuralEntries.length} notion{structuralEntries.length > 1 ? "s" : ""}
+          </span>
+        </div>
+
+        <p class="scene-section__intro">
+          La scène n’est pas une notion isolée. Elle s’articule au phénomène de
+          tension, à l’opérateur d’archicration et au méta-régime d’archicratie.
+        </p>
+
+        <div class="scene-cards">
+          {structuralEntries.map((entry) => (
+            <a class="scene-card" href={hrefOf(entry)}>
+              <strong>{entry.data.term}</strong>
+              <span>{entry.data.definitionShort}</span>
+
+              {entry.data.comparisonTraditions && (
+                <small>
+                  Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
+                </small>
+              )}
+            </a>
+          ))}
+        </div>
+      </section>
+    )}
+
+    {relatedEntries.length > 0 && (
+      <section class="scene-section">
+        <div class="scene-section__head">
+          <h2 id="constellation-theorique">Constellation théorique</h2>
+          <span class="scene-section__count">
+            {constellationCount} entrée{constellationCount > 1 ? "s" : ""}
+          </span>
+        </div>
+
+        <p class="scene-section__intro">
+          Cette notion dialogue avec plusieurs diagnostics et paradigmes qui
+          permettent d’en préciser la portée politique, symbolique et
+          régulatrice.
+        </p>
+
+        {otherEntries.length > 0 && (
+          <div class="scene-block">
+            <h3>Notions et diagnostics liés</h3>
+            <div class="scene-cards">
+              {otherEntries.map((entry) => (
+                <a class="scene-card" href={hrefOf(entry)}>
+                  <strong>{entry.data.term}</strong>
+                  <span>{entry.data.definitionShort}</span>
+
+                  {entry.data.comparisonTraditions && (
+                    <small>
+                      Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
+                    </small>
+                  )}
+                </a>
+              ))}
+            </div>
+          </div>
+        )}
+
+        {paradigmEntries.length > 0 && (
+          <div class="scene-block">
+            <h3>Paradigmes mobilisés</h3>
+            <div class="scene-cards">
+              {paradigmEntries.map((entry) => (
+                <a class="scene-card" href={hrefOf(entry)}>
+                  <strong>{entry.data.term}</strong>
+                  <span>{entry.data.definitionShort}</span>
+
+                  {entry.data.mobilizedAuthors?.length > 0 && (
+                    <small>
+                      Auteurs mobilisés : {entry.data.mobilizedAuthors.join(" / ")}
+                    </small>
+                  )}
+                </a>
+              ))}
+            </div>
+          </div>
+        )}
+      </section>
+    )}
+
+    <section class="scene-section">
+      <div class="scene-section__head">
+        <h2 id="prolonger-la-lecture">Prolonger la lecture</h2>
+      </div>
+
+      <p class="scene-section__intro">
+        Cette page a vocation à devenir un portail intermédiaire entre l’accueil
+        du glossaire et les fiches détaillées. Elle prolonge la lecture vers les
+        autres parcours déjà stabilisés du système archicratique.
+      </p>
+
+      <div class="scene-cards">
+        <a class="scene-card" href="/glossaire/">
+          <strong>Accueil du glossaire</strong>
+          <span>
+            Revenir à la cartographie générale du système archicratique.
+          </span>
+        </a>
+
+        <a class="scene-card" href="/glossaire/concepts-fondamentaux/">
+          <strong>Concepts fondamentaux</strong>
+          <span>
+            Repartir du noyau conceptuel minimal : arcalité, cratialité, tension,
+            archicration, co-viabilité, archicratie.
+          </span>
+        </a>
+
+        <a class="scene-card" href="/glossaire/paradigmes/">
+          <strong>Paradigmes et doctrines</strong>
+          <span>
+            Situer la scène archicratique dans son paysage de comparaison
+            théorique.
+          </span>
+        </a>
+
+        <a class="scene-card" href="/glossaire/index-complet/">
+          <strong>Index complet</strong>
+          <span>
+            Retrouver toutes les entrées du glossaire dans l’ordre alphabétique.
+          </span>
+        </a>
+      </div>
+    </section>
+
+    <section class="scene-section scene-section--final">
+      <h2>Portée d’ensemble</h2>
+      <p>
+        Les scènes archicratiques rappellent que la régulation ne vaut jamais
+        seulement par son efficacité interne. Elle doit aussi pouvoir paraître,
+        être soumise à l’épreuve, être discutée et éventuellement être révisée.
+        La <a href="/glossaire/scene-depreuve/">scène d’épreuve</a> marque ainsi
+        le point où l’<a href="/glossaire/archicration/">archicration</a> cesse
+        d’être pure opération pour devenir enjeu politique, symbolique et
+        collectif.
+      </p>
+    </section>
+  </section>
+</GlossaryLayout>
+
+<style>
+  .scene-page{
+    padding: 8px 0 24px;
+  }
+
+  .scene-hero{
+    margin-bottom: 24px;
+  }
+
+  .scene-kicker{
+    font-size: 12px;
+    letter-spacing: .08em;
+    text-transform: uppercase;
+    opacity: .72;
+    margin-bottom: 8px;
+  }
+
+  .scene-intro{
+    max-width: 76ch;
+    opacity: .92;
+  }
+
+  .scene-section{
+    margin-top: 34px;
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .scene-section h2{
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .scene-section__head{
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 12px;
+    flex-wrap: wrap;
+  }
+
+  .scene-section__count{
+    font-size: 13px;
+    opacity: .72;
+    white-space: nowrap;
+  }
+
+  .scene-section__intro{
+    max-width: 78ch;
+    opacity: .92;
+  }
+
+  .scene-focus-card{
+    margin-top: 14px;
+    padding: 18px 20px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 18px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .scene-focus-card__eyebrow{
+    margin-bottom: 10px;
+    font-size: 12px;
+    font-weight: 800;
+    letter-spacing: .08em;
+    text-transform: uppercase;
+    opacity: .72;
+  }
+
+  .scene-focus-card h3{
+    margin: 0 0 10px;
+    font-size: clamp(1.35rem, 2vw, 1.7rem);
+    line-height: 1.15;
+  }
+
+  .scene-focus-card h3 a{
+    text-decoration: none;
+  }
+
+  .scene-focus-card__def{
+    margin: 0;
+    font-size: 1rem;
+    line-height: 1.55;
+    opacity: .95;
+  }
+
+  .scene-focus-card__meta{
+    margin-top: 14px;
+    padding-top: 14px;
+    border-top: 1px solid rgba(127,127,127,0.18);
+  }
+
+  .scene-focus-card__meta p{
+    margin: 0;
+    font-size: 13px;
+    line-height: 1.5;
+    opacity: .9;
+  }
+
+  .scene-focus-card__meta p + p{
+    margin-top: 6px;
+  }
+
+  .scene-block + .scene-block{
+    margin-top: 22px;
+  }
+
+  .scene-block h3{
+    margin: 0 0 12px;
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .scene-cards{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+    gap: 12px;
+    margin-top: 14px;
+  }
+
+  .scene-card{
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    padding: 14px 16px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    background: rgba(127,127,127,0.05);
+    text-decoration: none;
+    transition: transform 120ms ease, background 120ms ease;
+  }
+
+  .scene-card:hover{
+    transform: translateY(-1px);
+    background: rgba(127,127,127,0.08);
+    text-decoration: none;
+  }
+
+  .scene-card strong{
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .scene-card span{
+    font-size: 14px;
+    line-height: 1.45;
+    opacity: .92;
+  }
+
+  .scene-card small{
+    font-size: 12px;
+    line-height: 1.4;
+    opacity: .72;
+  }
+
+  .scene-empty{
+    margin: 0;
+    font-style: italic;
+    opacity: .82;
+  }
+
+  .scene-section--final{
+    margin-top: 42px;
+  }
+
+  .scene-aside{
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .scene-aside__block{
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    padding: 12px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .scene-aside__back{
+    display: inline-block;
+    margin-bottom: 8px;
+    font-size: 13px;
+    font-weight: 700;
+    text-decoration: none;
+  }
+
+  .scene-aside__title{
+    font-size: 14px;
+    font-weight: 800;
+    letter-spacing: .2px;
+    line-height: 1.25;
+  }
+
+  .scene-aside__meta{
+    margin-top: 8px;
+    font-size: 12px;
+    line-height: 1.35;
+    opacity: .78;
+  }
+
+  .scene-aside__heading{
+    margin: 0 0 10px;
+    font-size: 13px;
+    font-weight: 800;
+    opacity: .9;
+  }
+
+  .scene-aside__list{
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .scene-aside__list li{
+    margin: 6px 0;
+  }
+
+  .scene-aside__list a{
+    text-decoration: none;
+    font-size: 13px;
+    line-height: 1.3;
+  }
+
+  @media (prefers-color-scheme: dark){
+    .scene-focus-card,
+    .scene-card,
+    .scene-aside__block{
+      background: rgba(255,255,255,0.04);
+    }
+
+    .scene-card:hover{
+      background: rgba(255,255,255,0.07);
+    }
+  }
+</style>

src/pages/glossaire/tensions-irreductibles.astro

@@ -0,0 +1,560 @@
+---
+import GlossaryLayout from "../../layouts/GlossaryLayout.astro";
+import { getCollection } from "astro:content";
+
+const entries = await getCollection("glossaire");
+
+const slugOf = (entry) => String(entry.id).replace(/\.(md|mdx)$/i, "");
+const hrefOf = (entry) => `/glossaire/${slugOf(entry)}/`;
+
+const collator = new Intl.Collator("fr", { sensitivity: "base", numeric: true });
+const bySlug = new Map(entries.map((entry) => [slugOf(entry), entry]));
+
+function sortByTerm(list = []) {
+  return [...list].sort((a, b) => collator.compare(a.data.term, b.data.term));
+}
+
+const tension = bySlug.get("tension");
+const coViabilite = bySlug.get("co-viabilite");
+const sceneDepreuve = bySlug.get("scene-depreuve");
+const archicration = bySlug.get("archicration");
+const archicratie = bySlug.get("archicratie");
+
+const foundationEntries = sortByTerm(
+  [tension, coViabilite, sceneDepreuve, archicration, archicratie].filter(Boolean)
+);
+
+const resonanceEntries = sortByTerm(
+  [
+    bySlug.get("gouvernementalite-algorithmique"),
+    bySlug.get("preemption-algorithmique"),
+    bySlug.get("democratie-deliberative"),
+    bySlug.get("cosmopolitique"),
+    bySlug.get("technodiversite-et-cosmotechnie"),
+    bySlug.get("pharmacologie-technique"),
+  ].filter(Boolean)
+);
+
+const irreducibleTensions = [
+  {
+    index: "01",
+    title: "Subsistance vivante / captation capitalistique",
+    text:
+      "Lorsque les conditions matérielles de la vie — eau, sol, temps, soin, énergie — sont traitées comme variables extractibles, la reproduction du vivant entre en conflit avec les logiques de rentabilité et d’accumulation.",
+  },
+  {
+    index: "02",
+    title: "Travail vivant / abstraction de la valeur",
+    text:
+      "Lorsque l’activité humaine concrète est fragmentée, désintermédiée ou précarisée tandis que la valeur se financiarise, se déterritorialise et se calcule à distance, la scène politique du travail tend à se dissoudre.",
+  },
+  {
+    index: "03",
+    title: "Égalisation normative / différenciation singulière",
+    text:
+      "Lorsque l’universalité égalitaire menace d’écraser les écarts situés, ou qu’à l’inverse la singularisation radicale produit des régimes d’exception, la régulation doit chercher une équité sans homogénéisation.",
+  },
+  {
+    index: "04",
+    title: "Liberté d’action / régimes de sécurité algorithmique",
+    text:
+      "Lorsque la protection, la surveillance, la notation ou la préemption encadrent les conduites au nom de la sécurité, la liberté devient incertaine comme capacité d’agir hors-script et hors-cadre prévu.",
+  },
+  {
+    index: "05",
+    title: "Visibilité médiatique / reconnaissance symbolique",
+    text:
+      "Lorsque l’exposition publique remplace la reconnaissance politique, la visibilité n’implique plus d’être entendu, considéré ni institué comme porteur d’un différend légitime.",
+  },
+  {
+    index: "06",
+    title: "Régulation technique / légitimation démocratique",
+    text:
+      "Lorsque des dispositifs techniques, algorithmiques ou automatisés prennent en charge des décisions normatives sans scène de validation collective, l’origine du pouvoir régulateur tend à s’oblitérer.",
+  },
+  {
+    index: "07",
+    title: "Souverainetés territoriales / interdépendances globales",
+    text:
+      "Lorsque les cadres politiques demeurent majoritairement étatiques alors que les crises sont réticulaires, planétaires et transversales, l’échelle de la décision se désaccorde de l’échelle des enjeux.",
+  },
+  {
+    index: "08",
+    title: "Formes de vie / cadres d’habitabilité",
+    text:
+      "Lorsque les normes d’urbanité, de mobilité et d’usage du territoire imposent une homogénéité fonctionnelle, elles entrent en tension avec la pluralité des manières d’habiter, humaines et non humaines.",
+  },
+  {
+    index: "09",
+    title: "Mémoire symbolique / instantanéité computationnelle",
+    text:
+      "Lorsque les régimes de calcul en temps réel dissolvent les temporalités longues de transmission, de récit et d’historicisation, la continuité symbolique du commun devient fragile.",
+  },
+  {
+    index: "10",
+    title: "Co-existence ontologique / nécessité régulatrice",
+    text:
+      "Lorsque l’altérité culturelle, cognitive, biologique ou machinique interdit tout socle substantiel univoque, il faut pourtant instituer une scène commune de régulation sans essence préalable partagée.",
+  },
+];
+
+const tensionsCount = irreducibleTensions.length;
+---
+
+<GlossaryLayout
+  title="Tensions irréductibles"
+  version="1.0"
+>
+  <Fragment slot="aside">
+    <nav class="tir-aside" aria-label="Navigation des tensions irréductibles">
+      <div class="tir-aside__block">
+        <a class="tir-aside__back" href="/glossaire/">← Retour au glossaire</a>
+        <div class="tir-aside__title">Tensions irréductibles</div>
+        <div class="tir-aside__meta">
+          {tensionsCount} tension{tensionsCount > 1 ? "s" : ""} structurales
+        </div>
+      </div>
+
+      <div class="tir-aside__block">
+        <h2 class="tir-aside__heading">Dans cette page</h2>
+        <ul class="tir-aside__list">
+          <li><a href="#orientation">Orientation</a></li>
+          <li><a href="#dix-tensions">Les dix tensions</a></li>
+          {foundationEntries.length > 0 && (
+            <li><a href="#articulations-fondamentales">Articulations fondamentales</a></li>
+          )}
+          {resonanceEntries.length > 0 && (
+            <li><a href="#resonances-theoriques">Résonances théoriques</a></li>
+          )}
+          <li><a href="#prolonger-la-lecture">Prolonger la lecture</a></li>
+        </ul>
+      </div>
+
+      <div class="tir-aside__block">
+        <h2 class="tir-aside__heading">Renvois utiles</h2>
+        <ul class="tir-aside__list">
+          <li><a href="/glossaire/tension/">Tension</a></li>
+          <li><a href="/glossaire/scene-depreuve/">Scène d’épreuve</a></li>
+          <li><a href="/glossaire/archicration/">Archicration</a></li>
+          <li><a href="/glossaire/co-viabilite/">Co-viabilité</a></li>
+          <li><a href="/glossaire/dynamiques-archicratiques/">Dynamiques archicratiques</a></li>
+        </ul>
+      </div>
+    </nav>
+  </Fragment>
+
+  <section class="tir-page">
+    <div class="tir-hero">
+      <p class="tir-kicker">Parcours du glossaire</p>
+      <h1>Tensions irréductibles</h1>
+      <p class="tir-intro">
+        Cette page rassemble les dix tensions que le chapitre 5 présente comme
+        <strong> ontologiquement irréductibles</strong> et politiquement fondatrices.
+        Elles ne se confondent pas avec des tensions simplement sectorielles :
+        elles désignent des lignes de conflictualité plus profondes, à partir
+        desquelles une scène archicratique doit organiser la co-viabilité.
+      </p>
+      <p class="tir-intro">
+        Le point décisif n’est donc pas de dresser un inventaire conjoncturel
+        des crises, mais d’identifier des foyers structuraux suffisamment
+        fondamentaux pour traverser durablement les régulations collectives.
+      </p>
+    </div>
+
+    <section class="tir-section">
+      <div class="tir-section__head">
+        <h2 id="orientation">Orientation</h2>
+      </div>
+
+      <p class="tir-section__intro">
+        Dans cette perspective, une archicration ne supprime pas les tensions :
+        elle les met en scène, les distribue, les hiérarchise, les arbitre ou
+        les rend révisables. Les tensions irréductibles désignent ainsi le plan
+        à partir duquel devient pensable l’exigence même de régulation.
+      </p>
+
+      <div class="tir-note-card">
+        <strong>Point de méthode</strong>
+        <p>
+          Les tensions irréductibles relèvent ici d’un <em>plan structural</em>.
+          Elles traversent ensuite des secteurs multiples — économiques,
+          écologiques, sociaux, médiatiques, technologiques, géopolitiques ou
+          culturels — sans se réduire à aucun d’entre eux pris isolément.
+        </p>
+      </div>
+    </section>
+
+    <section class="tir-section">
+      <div class="tir-section__head">
+        <h2 id="dix-tensions">Les dix tensions irréductibles</h2>
+        <span class="tir-section__count">
+          {tensionsCount} tension{tensionsCount > 1 ? "s" : ""}
+        </span>
+      </div>
+
+      <p class="tir-section__intro">
+        Le chapitre 5 les présente comme les foyers majeurs de conflictualité
+        auxquels une pensée archicratique doit se confronter.
+      </p>
+
+      <div class="tir-cards">
+        {irreducibleTensions.map((item) => (
+          <article class="tir-card">
+            <div class="tir-card__index">{item.index}</div>
+            <h3>{item.title}</h3>
+            <p>{item.text}</p>
+          </article>
+        ))}
+      </div>
+    </section>
+
+    {foundationEntries.length > 0 && (
+      <section class="tir-section">
+        <div class="tir-section__head">
+          <h2 id="articulations-fondamentales">Articulations fondamentales</h2>
+          <span class="tir-section__count">
+            {foundationEntries.length} notion{foundationEntries.length > 1 ? "s" : ""}
+          </span>
+        </div>
+
+        <p class="tir-section__intro">
+          Ces tensions ne prennent sens, dans le glossaire, qu’en relation avec
+          quelques notions cardinales : la tension elle-même, la scène
+          d’épreuve, l’archicration, la co-viabilité et l’archicratie.
+        </p>
+
+        <div class="tir-link-cards">
+          {foundationEntries.map((entry) => (
+            <a class="tir-link-card" href={hrefOf(entry)}>
+              <strong>{entry.data.term}</strong>
+              <span>{entry.data.definitionShort}</span>
+
+              {entry.data.comparisonTraditions?.length > 0 && (
+                <small>
+                  Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
+                </small>
+              )}
+            </a>
+          ))}
+        </div>
+      </section>
+    )}
+
+    {resonanceEntries.length > 0 && (
+      <section class="tir-section">
+        <div class="tir-section__head">
+          <h2 id="resonances-theoriques">Résonances théoriques</h2>
+          <span class="tir-section__count">
+            {resonanceEntries.length} entrée{resonanceEntries.length > 1 ? "s" : ""}
+          </span>
+        </div>
+
+        <p class="tir-section__intro">
+          Plusieurs paradigmes déjà présents dans le glossaire permettent
+          d’éclairer certains versants de ces tensions : gouvernementalité
+          algorithmique, préemption, cosmopolitique, technodiversité,
+          pharmacologie technique ou légitimation démocratique.
+        </p>
+
+        <div class="tir-link-cards">
+          {resonanceEntries.map((entry) => (
+            <a class="tir-link-card" href={hrefOf(entry)}>
+              <strong>{entry.data.term}</strong>
+              <span>{entry.data.definitionShort}</span>
+
+              {entry.data.mobilizedAuthors?.length > 0 && (
+                <small>
+                  Auteurs mobilisés : {entry.data.mobilizedAuthors.join(" / ")}
+                </small>
+              )}
+            </a>
+          ))}
+        </div>
+      </section>
+    )}
+
+    <section class="tir-section">
+      <div class="tir-section__head">
+        <h2 id="prolonger-la-lecture">Prolonger la lecture</h2>
+      </div>
+
+      <p class="tir-section__intro">
+        Cette page fixe le socle conceptuel des tensions irréductibles. Elle
+        pourra ensuite servir de base à un approfondissement plus détaillé, sans
+        alourdir l’accueil général du glossaire.
+      </p>
+
+      <div class="tir-link-cards">
+        <a class="tir-link-card" href="/glossaire/dynamiques-archicratiques/">
+          <strong>Dynamiques archicratiques</strong>
+          <span>
+            Revenir aux processus de fermeture, d’oblitération et de dérive de
+            la régulation.
+          </span>
+        </a>
+
+        <a class="tir-link-card" href="/glossaire/archicrations/">
+          <strong>Méta-régimes archicratiques</strong>
+          <span>
+            Parcourir les grandes formes de co-viabilité qui stabilisent les
+            tensions sans les abolir.
+          </span>
+        </a>
+
+        <a class="tir-link-card" href="/glossaire/paradigmes/">
+          <strong>Paradigmes et doctrines</strong>
+          <span>
+            Situer ces tensions dans un paysage théorique plus large.
+          </span>
+        </a>
+
+        <a class="tir-link-card" href="/glossaire/index-complet/">
+          <strong>Index complet</strong>
+          <span>
+            Retrouver l’ensemble des entrées du glossaire dans une navigation
+            alphabétique intégrale.
+          </span>
+        </a>
+      </div>
+    </section>
+
+    <section class="tir-section tir-section--final">
+      <h2>Portée d’ensemble</h2>
+      <p>
+        Les tensions irréductibles ne décrivent pas des accidents secondaires de
+        la vie collective, mais les lignes de fracture à partir desquelles toute
+        régulation devient nécessaire. Elles indiquent pourquoi aucune
+        co-viabilité ne peut être pensée comme simple équilibre, et pourquoi une
+        archicration digne de ce nom doit toujours affronter, mettre en forme et
+        rouvrir ce qui ne peut être définitivement résorbé.
+      </p>
+    </section>
+  </section>
+</GlossaryLayout>
+
+<style>
+  .tir-page{
+    padding: 8px 0 24px;
+  }
+
+  .tir-hero{
+    margin-bottom: 24px;
+  }
+
+  .tir-kicker{
+    font-size: 12px;
+    letter-spacing: .08em;
+    text-transform: uppercase;
+    opacity: .72;
+    margin-bottom: 8px;
+  }
+
+  .tir-intro{
+    max-width: 76ch;
+    opacity: .92;
+  }
+
+  .tir-section{
+    margin-top: 34px;
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .tir-section h2{
+    scroll-margin-top: calc(var(--sticky-offset) + 75px);
+  }
+
+  .tir-section__head{
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 12px;
+    flex-wrap: wrap;
+  }
+
+  .tir-section__count{
+    font-size: 13px;
+    opacity: .72;
+    white-space: nowrap;
+  }
+
+  .tir-section__intro{
+    max-width: 78ch;
+    opacity: .92;
+  }
+
+  .tir-note-card{
+    margin-top: 14px;
+    padding: 16px 18px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .tir-note-card strong{
+    display: block;
+    margin-bottom: 8px;
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .tir-note-card p{
+    margin: 0;
+    font-size: 14px;
+    line-height: 1.5;
+    opacity: .92;
+  }
+
+  .tir-cards{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+    gap: 12px;
+    margin-top: 14px;
+  }
+
+  .tir-card{
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    padding: 16px 18px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .tir-card__index{
+    font-size: 12px;
+    font-weight: 800;
+    letter-spacing: .12em;
+    opacity: .72;
+  }
+
+  .tir-card h3{
+    margin: 0;
+    font-size: 16px;
+    line-height: 1.32;
+  }
+
+  .tir-card p{
+    margin: 0;
+    font-size: 14px;
+    line-height: 1.5;
+    opacity: .92;
+  }
+
+  .tir-link-cards{
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+    gap: 12px;
+    margin-top: 14px;
+  }
+
+  .tir-link-card{
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    padding: 14px 16px;
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    background: rgba(127,127,127,0.05);
+    text-decoration: none;
+    transition: transform 120ms ease, background 120ms ease;
+  }
+
+  .tir-link-card:hover{
+    transform: translateY(-1px);
+    background: rgba(127,127,127,0.08);
+    text-decoration: none;
+  }
+
+  .tir-link-card strong{
+    font-size: 15px;
+    line-height: 1.3;
+  }
+
+  .tir-link-card span{
+    font-size: 14px;
+    line-height: 1.45;
+    opacity: .92;
+  }
+
+  .tir-link-card small{
+    font-size: 12px;
+    line-height: 1.4;
+    opacity: .72;
+  }
+
+  .tir-section--final{
+    margin-top: 42px;
+  }
+
+  .tir-aside{
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .tir-aside__block{
+    border: 1px solid rgba(127,127,127,0.22);
+    border-radius: 16px;
+    padding: 12px;
+    background: rgba(127,127,127,0.05);
+  }
+
+  .tir-aside__back{
+    display: inline-block;
+    margin-bottom: 8px;
+    font-size: 13px;
+    font-weight: 700;
+    text-decoration: none;
+  }
+
+  .tir-aside__title{
+    font-size: 14px;
+    font-weight: 800;
+    letter-spacing: .2px;
+    line-height: 1.25;
+  }
+
+  .tir-aside__meta{
+    margin-top: 8px;
+    font-size: 12px;
+    line-height: 1.35;
+    opacity: .78;
+  }
+
+  .tir-aside__heading{
+    margin: 0 0 10px;
+    font-size: 13px;
+    font-weight: 800;
+    opacity: .9;
+  }
+
+  .tir-aside__list{
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .tir-aside__list li{
+    margin: 6px 0;
+  }
+
+  .tir-aside__list a{
+    text-decoration: none;
+    font-size: 13px;
+    line-height: 1.3;
+  }
+
+  @media (prefers-color-scheme: dark){
+    .tir-note-card,
+    .tir-card,
+    .tir-link-card,
+    .tir-aside__block{
+      background: rgba(255,255,255,0.04);
+    }
+
+    .tir-link-card:hover{
+      background: rgba(255,255,255,0.07);
+    }
+  }
+</style>