/* Le compagnon partage la largeur du plateau, sans superposition. */
#main > #guide-ouvrir, .visionneuse > #guide-ouvrir { display: block; flex: none; align-self: flex-end; min-height: var(--cible-min); margin: var(--espace-2) var(--espace-4); color: var(--text-primary); font-size: var(--t-aide); }
#guide-synex { flex: 0 0 324px; width: 324px; min-width: 0; max-height: 100%; padding: var(--espace-4); overflow: auto; scrollbar-width: thin; color: var(--text-primary); font-size: var(--t-texte); line-height: var(--i-texte); }
.guide-ouvert > #main { flex: 1; margin-inline: 0; container-type: inline-size; container-name: guide-plateau; }
.guide-ouvert > #activite-agent, .guide-ouvert .activite-bascule { display: none !important; }
#guide-compagnon { background: var(--bg-surface); border-radius: var(--rayon-case); padding: var(--espace-3); overflow-wrap: anywhere; }
#guide-compagnon > * + * { margin-top: var(--espace-2); }
#guide-compagnon :is(p, pre, li, label, summary) { font: inherit; font-size: var(--t-aide); overflow-wrap: anywhere; }
#guide-compagnon :is(p, pre):empty, #guide-choix:empty, #guide-actions:empty { display: none; }
#guide-reponse > :first-child { margin-top: 0; }
#guide-reponse > :last-child { margin-bottom: 0; }
.guide-tete, .guide-ici, .guide-actions { display: flex; align-items: center; gap: var(--espace-2); }
.guide-tete > div { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.guide-tete strong { font-size: var(--t-nom); }
.guide-tete .repere { color: var(--text-secondary); }
.guide-visage { display: flex; flex: none; margin-right: var(--espace-2); }
.guide-tete .buste { width: var(--espace-6); height: var(--espace-6); }
.guide-actions { flex-wrap: wrap; }
#guide-synex .lien, #guide-repere .lien, .guide-remplissage .lien { color: var(--text-primary); font-size: var(--t-aide); min-height: var(--cible-min); white-space: normal; text-decoration: underline; }
#guide-question { display: flex; flex-wrap: wrap; align-items: flex-end; border: 1px solid var(--border-controle); border-radius: var(--rayon-controle); background: var(--bg-hover); padding: var(--espace-2); }
#guide-question label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
#guide-question textarea { flex: 1 1 140px; min-width: 0; width: 100%; min-height: var(--controle-h); max-height: 120px; resize: none; padding: var(--espace-1); border: 0; background: transparent; color: var(--text-primary); font: inherit; font-size: var(--t-aide); }
#guide-question textarea::placeholder { color: var(--text-secondary); opacity: 1; }
#guide-compagnon select { width: 100%; max-width: 100%; min-height: var(--controle-h); background: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-controle); border-radius: var(--rayon-controle); font: inherit; }
#guide-compagnon summary, .guide-echap { color: var(--text-secondary); }
#guide-statut { color: var(--text-primary); font-size: var(--t-aide); }
#guide-statut p { margin-bottom: var(--espace-2); }
.guide-choix { display: flex; flex-wrap: wrap; gap: var(--espace-2); }
.guide-choix .btn { height: auto; min-height: var(--controle-h); max-width: 100%; white-space: normal; }
.guide-choix p { flex-basis: 100%; color: var(--text-secondary); }
.guide-remplissage { padding: var(--espace-2) var(--espace-3); font-size: var(--t-aide); background: var(--bg-hover); border-radius: var(--rayon-controle); overflow-wrap: anywhere; }
.guide-remplissage p { margin-block: var(--espace-1); }
.guide-remplissage pre { white-space: pre-wrap; }
.guide-remplissage ul:empty { display: none; }
.guide-remplissage--applique { border: 2px dashed var(--text-secondary); border-bottom: 0; border-radius: var(--rayon-case) var(--rayon-case) 0 0; }
#main form.guide-saisie-remplie { border: 2px dashed var(--text-secondary); border-top: 0; border-radius: 0 0 var(--rayon-case) var(--rayon-case); box-shadow: none; }
#main .creation:has(.guide-remplissage) .creation__entretien { overflow-y: auto; scrollbar-width: thin; }
#main .creation:has(.guide-remplissage) .creation__fil, #main .creation:has(.guide-remplissage) .creation__pile { flex: none; max-height: none; overflow: visible; }
#main .creation .saisie:has(.guide-remplissage), .guide-ouvert #main .creation .saisie { position: static; }
#composer > .guide-envoi-travail { width: auto; max-width: 180px; height: auto; min-height: var(--controle-h); padding: var(--espace-2) var(--espace-3); border-radius: var(--rayon-controle); font-size: var(--t-aide); background: var(--accent); color: var(--texte-sur-accent); }
.guide-cible { outline: 2px dashed var(--text-primary); outline-offset: 3px; }
#guide-repere { position: fixed; z-index: 30; width: 272px; max-width: calc(100vw - 24px); padding: var(--espace-2) var(--espace-3); border: 2px solid var(--text-primary); border-radius: var(--rayon-case); background: var(--verre-fumee); box-shadow: var(--ombre-case); color: var(--text-primary); font-size: var(--t-aide); }
#guide-repere.guide-repere--range { position: static; width: auto; max-width: 100%; }
.guide-ici .buste, .guide-barre-basse .buste { width: var(--espace-5); height: var(--espace-5); }
.guide-ici .buste__sigle, .guide-barre-basse .buste__sigle { display: none; }
#guide-repere p { margin-block: var(--espace-2); }
#guide-repere .guide-actions { font-size: var(--t-aide); }
.guide-montre :is(.af-decision,.carte--decision,.job-decision):not(.guide-cible):not(:has(.guide-cible)) { border-color: var(--border-controle); }
.guide-montre :is(.af-decision,.carte--decision,.job-decision):not(.guide-cible):not(:has(.guide-cible)) .repere { color: var(--text-secondary); }
.guide-montre #vue-artefacts .af-decision:not(.guide-cible):not(:has(.guide-cible)) [data-plein] { background: transparent; color: var(--text-primary); border-color: var(--border-controle); }
#guide-synex :focus-visible, #guide-repere :focus-visible, .guide-remplissage :focus-visible { outline: 2px solid var(--text-primary); outline-offset: 2px; }
.visionneuse-dialogue[open]:has(> #guide-synex:not([hidden])) { display: flex; align-items: flex-start; gap: var(--espace-3); }
.visionneuse-dialogue:has(> #guide-synex) > .visionneuse { flex: 1; min-width: 0; }
.visionneuse-dialogue > #guide-synex { order: 1; }
@container guide-plateau (max-width: 1000px) {
  .af-nav { display: none; }
  .af-select-rubrique { display: flex; align-items: center; gap: var(--espace-2); }
  .af-corps { grid-template-columns: minmax(0,1fr); }
  .af-corps.af-avec-lecture { grid-template-columns: minmax(190px,.75fr) minmax(0,1.25fr); }
}
@container guide-plateau (max-width: 650px) {
  .af-mobile { display: block; }
  .af-corps.af-avec-lecture { grid-template-columns: minmax(0,1fr); }
  [data-panneau=lecture] .af-avec-lecture .af-resultats, [data-panneau=liste] #artefact-lecture { display: none; }
  .af-avec-lecture .af-resultats { border: 0; }
  .creation--large { flex-direction: column; overflow-y: auto; }
  .creation--large .creation__entretien { width: 100%; flex: none; }
}
@media (max-width: 900px) {
  #main > #guide-synex, .visionneuse > #guide-synex { display: block; flex: none; order: 99; width: auto; max-height: 50%; padding: 0; margin: var(--espace-2); overflow: auto; }
  #guide-compagnon { padding: var(--espace-3); }
  .guide-barre-basse { display: flex; align-items: center; gap: var(--espace-2); padding: var(--espace-2); border-radius: var(--rayon-case); background: var(--bg-surface); }
  .guide-barre-basse > div { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: var(--t-aide); }
  .guide-barre-basse span[id] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #guide-bref-etat { color: var(--text-secondary); }
  #guide-repere { display: none; }
}

.app:not(.guide-ouvert) .guide-choix-fil { display: none; }

.guide-remplissage--applique + form.guide-saisie-remplie { margin-top: 0; }
#guide-compagnon:has(#guide-question[hidden]) #guide-choix { display: none; }

.saisie:has(> .guide-remplissage--applique) { gap: 0; }

.guide-ouvert #session-entete .session-puce { display: block; }
.guide-ouvert:has(#guide-question[hidden]) #composer > button[type=submit]:not(.guide-envoi-travail) { background: transparent; color: var(--text-primary); border: 1px solid var(--border-controle); }
#composer.guide-saisie-remplie { display: flex; flex-wrap: wrap; gap: var(--espace-2); }
#composer.guide-saisie-remplie #input { flex: 1 0 100%; width: 100%; order: -1; }
#composer.guide-saisie-remplie > .guide-envoi-travail { margin-left: auto; }

.guide-montre :is(.af-decision,.carte--decision,.job-decision):not(.guide-cible):not(:has(.guide-cible)) .point { background: var(--text-secondary); }
#guide-ouvrir { background: var(--bg-hover); border-radius: var(--rayon-controle); padding-inline: var(--espace-2); }