v3 : interface Svelte — accueil, groupes, lecteur du texte en vigueur, panneau contextuel, éditeur à assistant, trustinWallet

- Accueil sobre, menu complet à gauche (Décisions, Docs de référence, Mandats,
  Protocoles), intro demandée, quatre sections, connexion Ğ1.
- Lecteur : texte en vigueur en Literata, actions contextuelles par article
  (le vote, propositions, proposer), propositions en cours sous la « surface »
  avec leur niveau d'eau, aperçus « si les bien cotées passent » / « si tout
  passe », langue du texte fr/en/es (traductions éditoriales).
- Panneau : vote pour/contre, seuil et formule (MathML), inertie et son
  changement (voté en inertie +), coquille sans vote, traduction, signalement
  de contradiction, historique des corrections.
- trustinWallet (/acces) : groupes et membres, invitations à usage unique,
  administrateurs, retours d'usage.
- Contrôles : vitest (markdown, catalogues, anti-lexique), Playwright C1–C10 + M1.
- Sections du seed portées jusqu'à l'écran.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

web/src/lib/components/DeepList.svelte

@@ -0,0 +1,111 @@
+<script lang="ts">
+  import { plain } from '$lib/markdown';
+  import { relationOf, titleOf } from '$lib/labels';
+  import { t, type Key } from '$lib/i18n/index.svelte';
+  import type { Proposal, Unit } from '$lib/types';
+  import WaterLevel from './WaterLevel.svelte';
+
+  let {
+    items,
+    selected,
+    onopen,
+  }: { items: { unit: Unit; proposal: Proposal }[]; selected: string | null; onopen: (unit: Unit, p: Proposal) => void } = $props();
+
+  const SECTIONS = ['introduction', 'fondamental', 'technique', 'conclusion', 'annexe', 'formule', 'inertie', 'ordonnancement'];
+  const sectionLabel = (s: string | null) => (s && SECTIONS.includes(s) ? t(`section.${s}` as Key) : null);
+  const variants = (u: Unit) => u.proposals.filter((p) => p.status === 'open' && p.kind === 'text').length;
+</script>
+
+<ul class="deep">
+  {#each items as { unit, proposal: p }, i (p.id)}
+    {#if sectionLabel(unit.section) && unit.section !== items[i - 1]?.unit.section}
+      <li class="section eyebrow">{sectionLabel(unit.section)}</li>
+    {/if}
+    <li>
+      <button type="button" class="row" class:current={selected === p.id} onclick={() => onopen(unit, p)}>
+        <WaterLevel tally={p.tally} evaluation={p.evaluation} blocked={p.blocked} />
+        <span class="main">
+          <span class="title">{titleOf(p, unit)}</span>
+          {#if p.kind === 'text'}<span class="excerpt">{plain(p.body)}</span>{/if}
+          <span class="meta">
+            <span>{t('tally.short', { for: p.tally.for, against: p.tally.against })}</span>
+            {#if relationOf(p, unit)}<span class="faint">{relationOf(p, unit)}</span>{/if}
+            {#if variants(unit) > 1 && p.label}<span class="faint">{t('deep.variant', { label: p.label })}</span>{/if}
+            {#if unit.inertia !== 'standard'}<span class="faint">{t(`inertia.${unit.inertia}`)}</span>{/if}
+            {#if p.evaluation?.wellRated}<span class="tag water">{t('deep.wellrated')}</span>{/if}
+            {#if p.blocked}<span class="tag ochre">{t('deep.blocked')}</span>{/if}
+            {#if p.myVoteStale}<span class="tag ochre">{t('deep.stale')}</span>{/if}
+            {#if p.mine}<span class="tag">{t('deep.mine')}</span>{/if}
+          </span>
+        </span>
+      </button>
+    </li>
+  {:else}
+    <li class="faint none">{t('deep.none')}</li>
+  {/each}
+</ul>
+
+<style>
+  .deep {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: grid;
+    gap: 0.25rem;
+  }
+  .row {
+    display: flex;
+    gap: 1rem;
+    align-items: center;
+    width: 100%;
+    padding: 0.85rem 1rem;
+    margin: 0 -1rem;
+    width: calc(100% + 2rem);
+    border: 0;
+    border-radius: var(--r-card);
+    background: transparent;
+    text-align: left;
+    transition: background-color 0.15s ease, transform 0.12s ease;
+  }
+  .row:hover,
+  .row.current {
+    background: var(--surface);
+    box-shadow: var(--shadow);
+  }
+  .main {
+    display: grid;
+    gap: 0.2rem;
+    min-width: 0;
+  }
+  .title {
+    font-weight: 780;
+  }
+  .excerpt {
+    font-family: var(--font-text);
+    color: var(--ink-soft);
+    font-size: 0.95rem;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  .meta {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.3rem 0.8rem;
+    align-items: center;
+    font-size: 0.8rem;
+    font-weight: 700;
+    color: var(--ink-soft);
+    font-variant-numeric: tabular-nums;
+  }
+  .section {
+    margin: 1.6rem 0 0.3rem;
+    color: var(--ink-soft);
+  }
+  .section:first-child {
+    margin-top: 0.4rem;
+  }
+  .none {
+    padding: 0.8rem 0;
+  }
+</style>