[Lagouze]

Ce qui change

• Fond animé (trois halos flous) derrière tout, verre translucide (flou 24 px, bordure fine, ombres larges et diffuses), texte anthracite contrasté, plus de quadrillage.
• Lock screen : date et heure retirées, logo « clé de voûte », panneau de connexion agrandi en verre épais ; logique inchangée.
• Plus de pastilles : statuts et catégories en typographie (point + capitales espacées). Anneau remplacé par une barre de couverture linéaire.
• « Move rates » et dépôt/retrait fusionnés en un panneau « Controls » (un montant, bascule Deposit/Withdraw, un bouton). Colonne Activity alignée sur le bas de la colonne gauche, liste qui défile dans la carte (le modal « See all » disparaît). Compte à rebours sur la ligne du titre de l'alerte. Espaces resserrés.
• Squelettes de verre à reflet au chargement ; points pulsés à la place des spinners.
• Animations : titre en flou progressif, bouton magnétique, bascule animée, « Choose the collateral » qui grandit comme un nuage au scroll. Couches GPU et hauteurs minimales contre les sauts.

Revue

Sous-agent Claude neuf (standard) : aucun bloquant. Corrigés : lock screen rogné sur écran court et focus visible, fin de la transition « nuage » sur grands écrans, rayon du header sur mobile, liste d'activité atteignable au clavier, contraste du texte secondaire, id unique du logo, rôle du compte à rebours. Non traités (notes) : flou backdrop-filter sur de nombreux petits contrôles, code CSS inutilisé (--radius-control, --radius-tag).

Tests

Typecheck, tests (app 9, keeper 65, shared 16, scripts 13) et build OK. Rendu vérifié dans le navigateur sur les mocks : lock screen, landing et transition nuage, appel de marge, alignement des colonnes (bas à 976 px des deux côtés), défilement interne, mobile 390 px, console sans erreur. Non testé : contre le keeper réel, Freighter, les vidéos de référence (inaccessibles). La règle des preuves (On-chain seulement avec un vrai hash) est inchangée.

Interfaces

Aucun changement.

🤖 Generated with Claude Code

Mise à jour : les quatre vidéos de référence (React Bits Pro)

• Vapor Type : les mots Lock, Call, Settle se condensent en vapeur de particules puis s'évanouissent, sous le titre de la landing (app/src/ui/VaporText.tsx, canvas).
• Ghost Type : la phrase d'accroche s'écrit, une complétion grise est acceptée avec Tab puis la fin se tape (GhostType.tsx).
• 3D Text Reveal : les trois étapes de l'histoire tournent sur un cylindre 3D au scroll (CylinderText.tsx).
• Animated List : une nouvelle entrée d'activité tombe en ressort, les autres lui font place, le bas de la liste se fond (ActivityFeed.tsx).
  Reconstruits sans le code Pro, avec repli en texte simple si le mouvement réduit est demandé. Vérifiés dans le navigateur (mocks) : particules qui atteignent le mot lisible puis se dissipent, cylindre au scroll. Typecheck, tests (app 9, keeper 65, shared 16, scripts 13) et build OK. Non vérifié visuellement : la liste d'activité animée en pleine largeur (volet navigateur étroit).

Mise à jour : les photos de référence

• Timeline + cartes à coches (Lock, Call, Settle) et section How it works (titre, bouton, quatre étapes numérotées) sur la landing.
• Chocs de taux en tuiles d'icônes (flèches de tendance) ; P&L du fonds en carte de statistique avec courbe de tendance de la session.
  Typecheck, tests et build OK ; vérifié dans le navigateur (mocks).

Mise à jour : fluidité, landing en chapitres, lock screen, logo (30afbcb, 301303f)

Fluidité (même apparence).

• Aura dessinée par ses dégradés, sans filter: blur(90px), et mise en pause pendant le scroll.
• Plus de second flou pour un contrôle en verre posé dans un panneau en verre.
• Plus de blur(0px) résiduels.
• Les chiffres roulants ne créent plus 180 couches de compositing.
• Panneaux mémoïsés, actions stabilisées : une mise à jour SSE ne re-rend que ce qui change.
• Hauteurs animées (AutoHeight) au lieu de sauts.
• L'attente du ledger se place dans le coin du panneau hors appel de marge.
• Correction : la note « under the minimum transfer » ne s'affiche plus pendant qu'une publication est en route, seulement quand l'écart en euros est sous le MTA.

Mesures en Chrome headless, CPU ralenti 4×, build de production en mocks, avant → après :

• composition GPU : 254 → 108 ms sur le défilement du dashboard, 209 → 135 ms sur celui de la landing ;
• main thread pendant un choc de taux : 1 135 → 784 ms ;
• en mode dev, JS d'un choc de taux : environ 1 000 → 500 ms, frame la plus longue : 200 → 100 ms ;
• 60 fps partout.

Landing, un écran par chapitre.

• Échelle typographique fluide : title-hero, title-section, text-lead.
• Chapitres épinglés à partir de 768 × 720 : chacun s'efface avant que le suivant apparaisse, on ne voit plus Journey et How it works ensemble.
• L'anneau de l'histoire est remplacé par trois points qui se relient au scroll.
• Le choix du collatéral, centré, grandit d'une carte jusqu'au plein écran.
• Sur mobile, en écran court et en mouvement réduit, les chapitres s'enchaînent simplement.
• Plus de débordement horizontal sur mobile.

Lock screen et logo.

• Lock screen sans panneau : logo, nom et champs flottent en grand sur l'aura.
• Nouveau logo : une arche d'un seul trait fermée par une clé de voûte pleine. Il sert aussi de favicon.

Revue. Deux sous-agents Claude neufs (niveau standard).

• Premier passage (fluidité) : un bloquant, l'attente du ledger qui chevauchait les boutons d'appel de marge. Il est corrigé (coin seulement hors appel). Mineurs corrigés : clignotement et rognage d'AutoHeight, sélecteur .glass imbriqué placé dans @layer utilities, commentaire MTA.
• Second passage (landing) : aucun bloquant. Mineurs corrigés :
  • focus clavier sur un chapitre invisible (défilement jusqu'à lui) ;
  • couche invisible qui captait les clics (pointer-events) ;
  • seuil de hauteur à 720 px ;
  • scène non épinglée sur écran court ;
  • entrées whileInView désactivées dans un chapitre épinglé ;
  • squelette du héros aligné ;
  • README précisé.
• Grille : une entrée chain n'affiche ni hash ni lien avant confirmation (logique inchangée).

Tests. npm run typecheck OK, npm test OK (app 9, keeper 65, shared 16, scripts 13), npm run build -w @keystone/app OK. Captures vérifiées en mocks à 1440×900, 1280×720, 1920×1080, 390×844 et 844×390. Non testé : Safari, keeper réel, Freighter.

Mise à jour : logo de l'équipe et lancement en une commande

• Logo. Le logo fourni par l'équipe (arche à deux traits, clé de voûte à facettes pointe en bas) est redessiné en SVG d'après des mesures sur l'image, puis vérifié par superposition (app/src/ui/Logo.tsx). Le nom suit en capitales espacées (Wordmark), en Helvetica Neue, la police unique du site.
• Où. Lock screen (en grand), en-tête et favicon (version simplifiée, lisible en 16 px).
• Démo.
  • npm run demo -w @keystone/app construit le site de production sur les mocks (mode Vite demo, sans keeper, wallet, réseau ni .env) dans app/dist-demo/, le sert sur http://localhost:4173 et ouvre le navigateur.
  • npm run dev:demo -w @keystone/app fait de même sur le serveur de développement.
  • Les deux fonctionnent aussi sous Windows.
• Revue par un sous-agent Claude neuf : aucun bloquant. Mineurs corrigés :
  • pointe de la clé rognée par la viewBox ;
  • intitulé « Create an account » qui n'était pas lu par les lecteurs d'écran (BlurReveal expose maintenant le texte en sr-only) ;
  • build de démo sorti de app/dist/, vers app/dist-demo/, ignoré par app/.gitignore.
• Tests.
  • npm run typecheck, npm test et npm run build -w @keystone/app OK.
  • npm run demo -w @keystone/app exécuté (macOS) : le site répond sur 4173 avec la mention « Demo data ».
  • Captures du lock screen et de l'en-tête vérifiées.
  • Non testé sous Windows ni avec un vrai lecteur d'écran.

[Lagouze]

[agent:front] Contours supprimés : plus de bordure sur les panneaux en verre, ni anneau rouge sur l'appel de marge, ni lumière tournante, ni séparateurs ou anneaux de champs. Typecheck et tests verts ; 0 élément bordé mesuré dans le navigateur.