/* Parcours guidé, lot L (09/10, brief validé par Robin) : la main sur la boule. Trois pièces : le choix « Dans un disque » / « À la forme » sous le visuel
   (étape 2, guide-steps-choose.mjs), la barre de l'élément touché sous la boule (étapes 3 et 4, guide-toolbar.mjs), la phrase sous les points quand une
   étape n'est pas encore possible (guide.mjs). Charte inchangée : papier, encre, Inter, aucun cadre ajouté au repos, aucune ombre, cibles de 44 px ; le repère
   clavier est :focus-visible, rendu par le fond du survol. */
.guide-dots-note{position:absolute;left:50%;top:calc(100% - 2px);z-index:6;transform:translateX(-50%);box-sizing:border-box;width:max-content;max-width:min(calc(100% - 2*var(--atelier-space-3)),30em);margin:0;padding:var(--atelier-space-2) var(--atelier-space-3);
 border-radius:var(--atelier-radius-control);background:var(--atelier-ink);color:var(--atelier-paper);font-size:var(--atelier-text-sm);line-height:1.35;text-align:center;pointer-events:none}
.guide-dots-note:not(.is-on){display:none}

/* « Dans un disque » / « À la forme » : deux cartes côte à côte, chacune avec l'aperçu de la boule ; elles occupent toute la largeur de la galerie. */
.guide-fork{grid-column:1/-1;margin-top:var(--atelier-space-2)}
.guide-fork-title{margin:0;font-size:var(--atelier-text-lg);font-weight:650;line-height:1.25;color:var(--atelier-ink)}
.guide-fork .guide-help{margin:var(--atelier-space-1) 0 0}
.guide-fork .guide-cards{margin-top:var(--atelier-space-3)}
.guide-fork .guide-card[aria-disabled=true]{cursor:progress}
.guide-fork[aria-busy=true] .guide-pic{opacity:.55}
.guide-fork-svg{display:block}
.guide-fork .guide-msg{margin:var(--atelier-space-2) 0 0}

/* Ajouter un texte ou une image : deux boutons secondaires, la note en dessous. */
.guide-add-row{display:flex;flex-wrap:wrap;gap:var(--atelier-space-2)}
.guide-add-row>.guide-secondary{flex:1 1 11em;min-width:0}
.guide-add .guide-msg{margin-top:var(--atelier-space-2)}

/* La barre de l'élément touché : sous la boule, en papier translucide, sans cadre. Elle passe en haut de la scène quand l'élément désigné serait dessous. */
.guide-tools{position:absolute;left:var(--atelier-space-2);right:var(--atelier-space-2);bottom:var(--atelier-space-2);z-index:5;display:flex;flex-direction:column;align-items:center;gap:var(--atelier-space-1);pointer-events:none}
.guide-tools[hidden]{display:none}
.guide-tools.is-top{top:var(--atelier-space-2);bottom:auto}
.guide-stage.has-top .guide-tools.is-top{top:60px}
.guide-tools>*{pointer-events:auto;max-width:100%}
.guide-tools-row{display:flex;flex-wrap:wrap;justify-content:center;gap:0;padding:2px var(--atelier-space-1);border-radius:var(--atelier-radius-round);background:color-mix(in oklch,var(--atelier-paper) 92%,transparent)}
.guide-tools-row:empty,.guide-tools-edit:empty,.guide-tools-trays:empty{display:none}
.guide-tool{position:relative;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 var(--atelier-space-2);border-radius:var(--atelier-radius-round);font-size:var(--atelier-text-sm);font-weight:550;line-height:1;color:var(--atelier-ink);white-space:nowrap;cursor:pointer}
.guide-tool[aria-expanded=true]{background:var(--atelier-soft);font-weight:650}
.guide-tool[aria-disabled=true]{opacity:.55;cursor:progress}
.guide-tool-file{overflow:hidden}
.guide-tool-file input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
@media(hover:hover){.guide-tool:hover{background:var(--atelier-soft)}}
.guide-tool:focus-visible,.guide-tool-file:has(input:focus-visible){background:var(--atelier-soft)}
.guide-tools-input{box-sizing:border-box;width:min(100%,22em);min-height:44px;padding:0 var(--atelier-space-4);border:0;border-radius:var(--atelier-radius-round);background:var(--atelier-soft);font:inherit;font-size:var(--atelier-text-lg);color:var(--atelier-ink);text-align:center}
.guide-tools-input:focus-visible{background:color-mix(in oklch,var(--atelier-soft) 80%,var(--atelier-ink));outline:none}
/* Plateau des polices et des couleurs : une rangée sous la barre, qui défile de côté quand elle ne tient pas. */
.guide-tools-tray{display:flex;gap:2px;max-width:100%;overflow-x:auto;padding:2px var(--atelier-space-1);border-radius:var(--atelier-radius-round);background:color-mix(in oklch,var(--atelier-paper) 92%,transparent);scrollbar-width:none}
.guide-tools-tray::-webkit-scrollbar{display:none}
.guide-tools-tray .guide-opt{flex:none;min-width:64px;padding:var(--atelier-space-1) var(--atelier-space-2)}
.guide-tools-tray .guide-fontsample{font-size:var(--atelier-text-xl);max-width:6em}
.guide-tools-tray .guide-opt>span:last-child{font-size:var(--atelier-text-xs)}
.guide-tools-tray .guide-sw{flex:none}
.guide-tools-note,.guide-tools-undo{margin:0;padding:var(--atelier-space-1) var(--atelier-space-3);border-radius:var(--atelier-radius-round);background:color-mix(in oklch,var(--atelier-paper) 92%,transparent);font-size:var(--atelier-text-sm);line-height:1.35;color:var(--atelier-ink);text-align:center}
.guide-tools-note:empty{display:none}
.guide-tools-note.is-error{color:var(--atelier-danger)}
.guide-tools-undo{display:flex;align-items:center;justify-content:center;gap:var(--atelier-space-2);padding:0 var(--atelier-space-3)}
/* La ligne d'aide sous la boule s'efface, la barre prend sa place ; boule tournée : la barre se cache. (« Recentrer » monte au-dessus de la barre : 92-parcours-gestes.css.) */
.guide-stage:has(.guide-tools:not([hidden])) .guide-stage-help{visibility:hidden}
.guide-stage.is-turned .guide-tools{visibility:hidden}
@media(min-width:1024px),(min-width:640px) and (max-height:500px) and (orientation:landscape){.guide-tools{bottom:28px}.guide-tools.is-top{top:28px;bottom:auto}.guide-stage.has-top .guide-tools.is-top{top:80px}}
@media(prefers-reduced-motion:no-preference){.guide-tools:not([hidden]){animation:guide-tools-in var(--atelier-t) var(--atelier-ease)}}
@keyframes guide-tools-in{from{opacity:0}}
/* La barre sous la boule ne la recouvre jamais (retour du 09/10). Aux étapes 3 et 4, sa place est réservée sous la boule dès l'arrivée (la ligne
   d'aide l'occupe au repos) : toucher un élément ne fait pas bouger la boule sous le doigt. Seul un plateau ouvert par un bouton (polices, couleurs)
   réduit encore la boule (--tools-h : hauteur de la barre, posée par guide-toolbar.mjs). La place réservée elle-même est dans 90-parcours.css. */
.guide:is([data-step="3"],[data-step="4"]) .guide-stage:has(>.guide-tools:not([hidden]):not(.is-top)) .guide-ball-wrap{bottom:max(56px,calc(var(--tools-h,0px) + var(--atelier-space-2)))}