/* INSTALLER POINT ZÉRO — `/installer` (Boris, 30 octobre 2026). Composants du site (`.duo-card`, `.button`) ;
   cette feuille n'ajoute que ce qu'ils n'ont pas : les étapes numérotées, le QR, la note, la petite FAQ.
   Banc `verifier_installation_pwa`. */

/* ⚠️ `hidden` DOIT GAGNER. La règle du navigateur (`display:none`) perd contre toute déclaration d'auteur, et
   `.button` déclare son `display` : sans cette ligne, le bouton d'Android serait visible avant que le navigateur
   l'autorise, et les panneaux des autres appareils s'empileraient. Même piège que l'invitation du Festival. */
.installer [hidden] { display: none !important; }

.installer-panneaux { display: grid; gap: 20px; margin-bottom: 36px; }

.installer-etapes { list-style: none; counter-reset: etape; padding: 0; margin: 0 0 22px; display: grid; gap: 14px; }
.installer-etapes li { counter-increment: etape; display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; }
.installer-etapes li::before {
  content: counter(etape); width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center; background: var(--ink); color: var(--white); font-weight: 750;
}
.installer-etapes li > span { padding-top: 5px; }
.installer-icone-partager { width: 1.25em; height: 1.25em; vertical-align: -0.25em; }

.installer-note { color: var(--muted); font-size: 15px; }

.installer-lien code { overflow-wrap: anywhere; font-size: 15px; }
.installer-etat:empty { display: none; }
.installer-etat { margin: 0 0 12px; color: var(--muted); font-size: 15px; }
.installer-copie { display: inline-block; margin-left: 10px; color: var(--muted); font-size: 15px; }

/* Un QR se lit sur fond blanc pur, avec sa marge : ni le crème de la carte, ni une bordure collée aux modules. */
.installer-qr { display: inline-block; margin: 0 0 18px; padding: 16px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); text-align: center; }
.installer-qr svg { display: block; width: 200px; height: 200px; margin: 0 auto 10px; }
.installer-qr figcaption { color: var(--muted); font-size: 13px; overflow-wrap: anywhere; max-width: 200px; }

.installer-faq { margin: 0; }
.installer-faq dt { font-weight: 750; margin-top: 20px; }
.installer-faq dd { margin: 6px 0 0; }