/* ============================================================
   ANIMA — bouton « Installer ANIMA » natif Le Fil (js/installer/installer.js ; spec 2026-10-05-installer-pwa-design.md ; lot 3A)
   Deux endroits : l'entrée permanente (.inst-entree : menu du compte du Fil, « Sur ce téléphone » de Maintenant, section Compte du profil) et le bouton
   discret sous la connexion (.inst-connexion, kit public fpu-) ; le guide en deux étapes est une feuille du kit (.fb-voile / .fb-feuille, css/fil-budget.css).
   Jetons --f-* de css/fil.css (clair et sombre par html[data-theme]), actions à l'encre, filets, aucun verre ni ombre. Boutons : .fb-bouton (application) et
   .fpu-lien / .fpu-bouton (page publique). Remplace css/installer.css (supprimé : c-btn, serif, jetons classiques).
   ============================================================ */

/* Les hôtes restent vides et masqués tant qu'il n'y a rien à proposer (jamais de trou, jamais de faux bouton). */
.inst-hote[hidden], .inst-copie[hidden] { display: none !important; }
.profil-compte-inner > .inst-hote { justify-self: stretch; }

/* ---------- Entrée permanente ---------- */
.inst-entree { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; width: 100%; padding-top: 16px; border-top: 1px solid var(--f-filet); color: var(--f-encre); }
.inst-entree-texte { min-width: 0; flex: 1 1 16rem; }
.inst-entree-titre { margin: 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; }
.inst-entree-detail { margin: 4px 0 0; max-width: 46ch; font: 400 14px/1.45 Inter, system-ui, sans-serif; color: var(--f-encre-2); }

/* ---------- Navigateur intégré : texte + « Copier le lien » ---------- */
.inst-integre { display: grid; justify-items: start; gap: 10px; min-width: 0; }
.inst-entree .inst-integre { flex: 1 1 16rem; }
.inst-integre-txt { margin: 0; max-width: 46ch; font: 400 16px/1.5 Inter, system-ui, sans-serif; color: var(--f-encre); }
.inst-copie { margin: 0; font: 400 14px/1.45 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
.inst-lien { width: 100%; min-width: 0; }
.inst-hors-champ { position: fixed; left: -9999px; top: 0; width: 1px; height: 1px; opacity: 0; }

/* ---------- Bouton discret de la connexion ---------- */
.inst-connexion { display: grid; justify-items: center; }
.inst-connexion .inst-integre { justify-items: center; text-align: center; gap: 6px; }
.inst-connexion .inst-integre-txt { font-size: 14px; color: var(--f-encre-2); }
.inst-connexion .inst-copie { text-align: center; }
.inst-connexion .fpu-lien { font-weight: 400; color: var(--f-encre-2); }

/* ---------- Guide en deux étapes (dans la feuille du kit) ---------- */
.inst-etapes { list-style: none; margin: 4px 0 0; padding: 0; border-top: 1px solid var(--f-filet); }
.inst-etape { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 14px; align-items: start; padding: 16px 0; border-bottom: 1px solid var(--f-filet); }
.inst-num { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--f-encre); border-radius: 50%; font: 600 16px/1 Inter, system-ui, sans-serif; }
.inst-etape-corps { min-width: 0; }
.inst-etape-titre { display: flex; align-items: center; gap: 10px; margin: 0; font: 600 16px/1.3 Inter, system-ui, sans-serif; }
.inst-etape-detail { margin: 4px 0 0; font: 400 14px/1.5 Inter, system-ui, sans-serif; color: var(--f-encre-2); }
.inst-picto { display: inline-grid; place-items: center; flex: none; width: 24px; height: 24px; color: var(--f-encre); }
.inst-picto svg { width: 100%; height: 100%; }