/* Profil confirmé (dossier/29-RETOURS-BETA-08-10.md, B3 et B4 ; lot 22) : la carte « Voici ce que nous avons compris de
   {marque} » de l'écran Préparation (ecrans/preparation-profil.js) et le profil dans les Réglages (ecrans/reglages-
   profil.js). Jetons de la DA v3 « Noir » (assets/tokens.css) ; aucun mouvement de plus que ceux des cartes. */

.prep-confirmation:empty { display: none; }
.prep-confirmation { margin-bottom: 16px; scroll-margin-top: 96px; }

.profil-carte { padding: 24px 24px 20px; border-color: var(--trait-fort); }
.profil-carte .ecran-meta { margin: 0; }
.profil-titre { margin: 6px 0 10px; font-size: var(--taille-h2); line-height: 1.2; letter-spacing: var(--approche-h2); color: var(--encre); text-wrap: balance; }
.profil-pourquoi { max-width: 68ch; margin-bottom: 16px; font-size: var(--taille-petit); line-height: 1.55; color: var(--encre-2); }
.profil-carte > .note { margin-bottom: 16px; }

.profil-faits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 28px; margin: 0 0 20px; }
.profil-fait { display: grid; align-content: start; gap: 4px; min-width: 0; }
.profil-fait dt { font-size: var(--taille-etiquette); color: var(--encre-2); }
.profil-fait dd { margin: 0; line-height: 1.5; color: var(--encre); overflow-wrap: anywhere; }
.profil-fait dd > .aide { display: block; margin-top: 2px; font-size: var(--taille-etiquette); line-height: 1.5; color: var(--encre-2); }
.profil-champs { margin-bottom: 20px; }

/* 07/11 (« Où et pour qui mesurer », bloc-mesure.js) : comment les IA seront interrogées, pour toutes les marques. */
.mesure { display: grid; gap: 12px; padding-top: 16px; margin-bottom: 20px; border-top: 1px solid var(--trait); }
.mesure-marche { display: grid; gap: 4px; }
.mesure-marche > .lab { font-size: var(--taille-petit); font-weight: var(--graisse-moyenne); color: var(--encre-2); }
.mesure-marche .champ-lecture { color: var(--encre); }
.mesure-ville { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; min-width: 0; }
.mesure-ville > legend { padding: 0; margin-bottom: 4px; font-size: var(--taille-corps); font-weight: var(--graisse-moyenne); color: var(--encre); }
.mesure-ville .aide { max-width: 68ch; }
.mesure-choix { gap: 8px; }
.mesure-choix .case input { border-radius: 50%; }
.mesure-choix .case input:checked::after { width: 6px; height: 6px; border: 0; border-radius: 50%; background: var(--encre); transform: none; }
.mesure-ville-champ { max-width: 360px; margin: 0 0 4px 30px; }
.mesure-graphie-bouton { padding: 0; border: 0; background: none; font: inherit; color: var(--bleu-clair); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.mesure-graphie-bouton:hover { color: var(--encre); }
.mesure-graphie-bouton:focus-visible { outline: none; border-radius: var(--rayon-1); box-shadow: var(--anneau-focus); }
.mesure-indice { color: var(--attention); }
.mesure-erreur { font-size: var(--taille-etiquette); color: var(--moins); }
.mesure-phrase { max-width: 68ch; margin: 16px 0 0; font-size: var(--taille-petit); line-height: 1.55; color: var(--encre); }
.profil-changement { max-width: 68ch; }
.profil-concurrents { display: grid; gap: 8px; padding-top: 16px; border-top: 1px solid var(--trait); }
.profil-sous-titre { font-size: var(--taille-corps); font-weight: var(--graisse-moyenne); color: var(--encre); }
.profil-concurrents > .aide { max-width: 68ch; }
.profil-pastilles { margin: 4px 0; padding: 0; list-style: none; }
.profil-vide { padding: 4px 0; }
.profil-compte { margin: 0; }

.profil-actions { justify-content: flex-end; }
.profil-actions .btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; }

/* Lot 23 (dossier/30 I4, I7) : la phrase du site qui justifie le secteur, et « Chercher à nouveau ». */
.profil-preuve { max-width: 68ch; margin: 0 0 16px; padding: 2px 0 2px 14px; border-left: 2px solid var(--bleu); font-size: var(--taille-petit); line-height: 1.55; color: var(--encre-2); overflow-wrap: anywhere; }
.profil-rechercher-aide { max-width: 68ch; margin: 12px 0 0; }
.profil-rechercher { display: inline-block; margin-top: 12px; padding: 4px 0; border: 0; background: none; font: inherit; font-size: var(--taille-petit); color: var(--encre-2); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; transition: color var(--duree-rapide, 150ms) ease; }
.profil-rechercher:hover:not(:disabled) { color: var(--encre); }
.profil-rechercher:focus-visible { outline: none; border-radius: 4px; box-shadow: var(--anneau-focus); }
.profil-rechercher:disabled { cursor: progress; opacity: 0.7; }

/* L'analyse attend la personne : la barre et son glissement s'arrêtent. */
.ecran-preparation[data-attente="profil"] .prep-glissement,
.ecran-preparation[data-attente="profil"] .prep-reflet { animation-play-state: paused; opacity: 0.4; }

/* Réglages : la proposition de questions et le geste « Refaire l'analyse ». */
.profil-reglages { margin-bottom: 4px; }
.profil-dates { margin-top: 8px; }
.profil-refaire { margin-top: 12px; }
.profil-proposition { display: grid; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--trait); }
.profil-questions { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.profil-questions .case { display: flex; align-items: flex-start; gap: 10px; line-height: 1.45; }
.profil-remplacees summary { cursor: pointer; font-size: var(--taille-petit); color: var(--encre-2); }
.profil-remplacees ul { display: grid; gap: 4px; margin: 8px 0 0 18px; font-size: var(--taille-petit); }

@media (max-width: 720px) {
  .profil-carte { padding: 18px 16px 16px; }
  .profil-faits { grid-template-columns: 1fr; }
  .mesure-ville-champ { margin-left: 0; }
  .profil-actions { flex-direction: column-reverse; align-items: stretch; }
}
.profil-reglages [hidden], .profil-carte [hidden] { display: none; }
/* 07/11 (lot 2) : « Suivre aussi {marque} sur un autre marché » (Réglages, Préparation) et l'indice d'un hébergement. */
.autre-marche { display: grid; gap: 4px; max-width: 68ch; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--trait); }
.autre-marche-lien { justify-self: start; font-weight: var(--graisse-moyenne); color: var(--bleu-texte); text-underline-offset: 3px; }
.autre-marche-lien:focus-visible { outline: none; border-radius: var(--rayon-1); box-shadow: var(--anneau-focus); }
.autre-marche .lien-carte { justify-self: start; margin: 0; }
.autre-marche-ligne, .autre-marche-indice { max-width: 68ch; }
.autre-marche-indice { margin-top: 8px; }