shape-05-text-selection — Sélection de texte à poignées
============================================================

Accentuer UN mot dans une phrase en imitant la sélection de texte d'un téléphone — bandeau translucide, barre verticale à chaque bout, pastille en haut à gauche et en bas à droite — pour que l'accent se lise comme un geste du lecteur et non comme un surligneur de bureau.

EMPLOYER QUAND
  Un seul mot ou groupe court à faire ressortir dans une chute de post social ou de page. L'accent est plus vivant qu'un `<mark>` et plus sobre qu'un aplat : il suggère que quelqu'un vient de poser le doigt sur ce mot.

ÉVITER QUAND
  La sélection porterait sur plus d'une ligne (le bandeau perd sa lecture de sélection et écrase la hiérarchie), le mot est en fin de phrase avec sa ponctuation (le point doit rester HORS du span, sinon la poignée le mange), ou la même carte porte déjà un aplat d'accent — deux accents dans une zone se neutralisent.

COMMENT S'EN SERVIR
  1. Collez le contenu de tokens.css dans votre page. Il porte deux choses : la règle
     box-sizing que le fragment SUPPOSE (sans elle la composition grossit et déborde),
     et les jetons --vl-* de la charte, à fusionner avec les vôtres.
  2. Collez fragment.html là où la composition doit apparaître. Son CSS voyage avec
     lui, dans son <style> : rien à importer, rien à installer.
  3. Remplacez les textes. Les emplacements prévus : phrase, mot-selectionne.

POLICES
  Le rendu de référence utilise les polices du dépôt (OFL) : https://github.com/lbachelotcapitalb/visual-lab/tree/main/fonts

Cadre de référence : 860 × 283 px. Charte : ref-24-finengy-paper-selection.
Licence MIT — https://visual.capitalb.fr/p/shape-05-text-selection.html
