Lot U : « Autres versions » repliées dans le vote ; contrôles corrigés après le premier passage (état partagé, nom du titre en anglais, attente du chargement) ; le panier dit « simulé » ; CLAUDE.md (composants, panneau, 38 contrôles)

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

web/src/lib/components/BallotPanel.svelte

@@ -205,7 +205,7 @@
     </button>
     {#if open}
       <p class="faint small note-send">
-        {#if access?.way === 'chain' && access.chain}{t('basket.note.chain', { amount: g1Amount(access.chain.amount) })}{:else}{t('basket.note.server')}{/if}
+        {#if access?.way === 'chain' && access.chain}{t('basket.note.chain', { amount: g1Amount(access.chain.amount) })}{:else if access?.simulated}{t('vote.simulated.note')}{:else}{t('basket.note.server')}{/if}
       </p>
     {/if}
     {#if error}<p class="warn" role="alert">{error}</p>{/if}

web/src/lib/components/VoteFold.svelte

@@ -58,6 +58,8 @@
   }
 
   let detail = $state<Detail | null>(null);
+  /** « Autres versions », folded until asked: the vote stays short. */
+  let othersOpen = $state(false);
   let busy = $state(false);
   let error = $state('');
   let root: HTMLElement | undefined = $state();
@@ -249,8 +251,12 @@
 
   <div class="more">
     {#if others.length}
-      <section class="others" aria-labelledby="others-{p.id}">
-        <h4 id="others-{p.id}">{t('vote.others')}</h4>
+      <button type="button" class="disclose" aria-expanded={othersOpen} aria-controls="others-{p.id}" onclick={() => (othersOpen = !othersOpen)}>
+        <span class="tri" aria-hidden="true"></span>{t('vote.others.count', { n: others.length })}
+      </button>
+    {/if}
+    {#if others.length && othersOpen}
+      <section class="others" id="others-{p.id}" aria-label={t('vote.others')}>
         <ul>
           {#each others as v (v.id)}
             <li>
@@ -331,10 +337,28 @@
     gap: 0.35rem;
     min-width: 0;
   }
-  .others h4 {
-    margin: 0;
+  .disclose {
+    justify-self: start;
+    display: inline-flex;
+    align-items: center;
+    gap: 0.45rem;
+    min-height: 2.25rem;
+    padding: 0;
+    border: 0;
+    background: none;
+    color: var(--water);
+    font-weight: 750;
     font-size: 0.92rem;
-    font-weight: 800;
+  }
+  .tri {
+    width: 0;
+    height: 0;
+    border-block: 0.3rem solid transparent;
+    border-left: 0.45rem solid currentColor;
+    transition: transform 0.15s var(--ease);
+  }
+  .disclose[aria-expanded='true'] .tri {
+    transform: rotate(90deg);
   }
   .others ul {
     list-style: none;
@@ -496,5 +520,8 @@
     .dot {
       animation: none;
     }
+    .tri {
+      transition: none;
+    }
   }
 </style>

web/src/lib/i18n/en.ts

@@ -241,6 +241,7 @@ export const en: Messages = {
   'vote.saved.simulated': 'Vote simulated.',
   'vote.simulated.mark': 'simulated vote',
   'vote.others': 'Other versions',
+  'vote.others.count': 'Other versions ({n})',
   'vote.need': '{yes} yes to pass · {no} no to block',
   'vote.need.quorum': '{yes} yes to pass · the quorum blocks it',
   'vote.need.first.one': '{yes} yes out of {quorum} voter to pass',

web/src/lib/i18n/es.ts

@@ -241,6 +241,7 @@ export const es: Messages = {
   'vote.saved.simulated': 'Voto simulado.',
   'vote.simulated.mark': 'voto simulado',
   'vote.others': 'Otras versiones',
+  'vote.others.count': 'Otras versiones ({n})',
   'vote.need': '{yes} sí para aprobar · {no} no para bloquear',
   'vote.need.quorum': '{yes} sí para aprobar · el quórum la bloquea',
   'vote.need.first.one': '{yes} sí de {quorum} votante para aprobar',

web/src/lib/i18n/fr.ts

@@ -245,6 +245,7 @@ export const fr = {
   'vote.saved.simulated': 'Vote simulé.',
   'vote.simulated.mark': 'vote simulé',
   'vote.others': 'Autres versions',
+  'vote.others.count': 'Autres versions ({n})',
   'vote.need': '{yes} oui pour passer · {no} non pour bloquer',
   'vote.need.quorum': '{yes} oui pour passer · le quorum la bloque',
   'vote.need.first.one': '{yes} oui sur {quorum} votant pour passer',