/* Partage de la tribune sur l'accueil (serveur/pages/partage.mjs, partageDeLaTribune) : un titre court puis des
   pastilles, l'icône du réseau suivie de son nom, de 44 pixels de haut au moins. Les icônes (Tabler Icons, licence MIT,
   public/icones/) se posent en masque : elles prennent la couleur du texte de leur bouton. */
.partage-tribune { margin: var(--e-6) 0 0; }
.volet .partage-tribune { margin-top: var(--e-5); }
.partage-tribune-titre { margin: 0 0 var(--e-2); font-weight: 600; font-size: 1rem; color: var(--encre); }
.partage-tribune-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--e-2); }
.partage-tribune .partage { gap: 0.5rem; min-height: 2.75rem; padding: 0.4rem 0.95rem 0.4rem 0.8rem; font-size: 0.98rem; line-height: 1.2; }
.partage-tribune .partage:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
/* « Signer la tribune » reste le seul bouton plein du volet : le partage du système prend ici le trait des autres. */
.partage-tribune .partage-natif { background: var(--surface); border-color: var(--filet); color: var(--accent); }
.partage-tribune .partage-natif:hover { background: var(--surface); border-color: var(--accent); color: var(--accent-survol); }
.partage-icone { flex: none; width: 1.25rem; height: 1.25rem; background-color: currentColor; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }
.partage-icone-natif { -webkit-mask-image: url("icones/share.svg"); mask-image: url("icones/share.svg"); }
.partage-icone-whatsapp { -webkit-mask-image: url("icones/brand-whatsapp.svg"); mask-image: url("icones/brand-whatsapp.svg"); }
.partage-icone-facebook { -webkit-mask-image: url("icones/brand-facebook.svg"); mask-image: url("icones/brand-facebook.svg"); }
.partage-icone-linkedin { -webkit-mask-image: url("icones/brand-linkedin.svg"); mask-image: url("icones/brand-linkedin.svg"); }
.partage-icone-x { -webkit-mask-image: url("icones/brand-x.svg"); mask-image: url("icones/brand-x.svg"); }
.partage-icone-bluesky { -webkit-mask-image: url("icones/brand-bluesky.svg"); mask-image: url("icones/brand-bluesky.svg"); }
.partage-icone-telegram { -webkit-mask-image: url("icones/brand-telegram.svg"); mask-image: url("icones/brand-telegram.svg"); }
.partage-icone-instagram { -webkit-mask-image: url("icones/brand-instagram.svg"); mask-image: url("icones/brand-instagram.svg"); }
.partage-icone-courriel { -webkit-mask-image: url("icones/mail.svg"); mask-image: url("icones/mail.svg"); }
.partage-icone-lien { -webkit-mask-image: url("icones/link.svg"); mask-image: url("icones/link.svg"); }
/* Le message d'Instagram ou de la copie : vide, la ligne ne prend aucune place ; le lecteur d'écran l'annonce. */
.partage-tribune-etat { margin: 0; max-width: 40rem; font-size: 0.98rem; color: var(--gris); }
.partage-tribune-etat:not(:empty) { margin-top: var(--e-2); }
/* En fin de tribune, le partage reste dans la colonne du texte, sous lui ; le geste de la signature garde la sienne. */
@media (min-width: 64rem) { .lecture-grille > .partage-tribune { grid-column: 1 / span 7; margin-top: 0; } }
/* Invitation d'un proche, sur le remerciement d'une contribution (pages/partage.mjs, invitationDUnProche) : un cadre comme
   celui du lien de suivi, le message prêt dans un champ en lecture seule, le partage du téléphone en bouton plein. */
.bloc-invitation { margin: var(--e-6) 0; padding: var(--e-5); border: 2px solid var(--filet); border-radius: var(--rayon-grand); background: var(--surface); }
.bloc-invitation h2 { margin-top: 0; }
.invitation-message { margin: 0 0 var(--e-4); }
.invitation-message figcaption { margin-bottom: var(--e-2); font-weight: 600; }
.invitation-message blockquote { margin: 0; padding: var(--e-3) var(--e-4); border-left: 4px solid var(--accent); border-radius: var(--rayon-petit); background: var(--fond); }
.invitation-message blockquote p { margin: 0; }
/* L'adresse, d'un seul tenant, se replie où il faut : à 320 pixels, elle ferait sinon déborder la page. */
.invitation-lien { overflow-wrap: anywhere; color: var(--accent); }
.bloc-invitation .partage-natif { background: var(--accent); border-color: var(--accent); color: #fff; }
.bloc-invitation .partage-natif:hover { background: var(--accent-survol); border-color: var(--accent-survol); color: #fff; }