/* Parcours guidé, lot I-G (09/10) : bouger le texte, la photo et le logo sur la boule de la scène (guide-handles.mjs), aux étapes 3 et 4.
   Rien au repos : chaque élément mobile est un bouton transparent posé sur son dessin (44 px de cible au moins). Désigné, il prend un
   contour pointillé d'encre de 1 px (bord de la boîte du dessin, jamais un anneau de focus) et une poignée ronde de taille (pastille papier cerclée d'encre, 44 px de zone de toucher). Survol et
   focus clavier : le même contour, en gris. Le doigt ne bloque le défilement que sur un texte, ou sur une photo déjà désignée.
   Tailles en unités du conteneur (cqw, cqh) : la boîte suit l'aperçu du moteur, quelle que soit la taille de la scène. */
.guide-handles{position:absolute;inset:0;z-index:1;container-type:size;pointer-events:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(1px)}
.guide-handle{position:absolute;width:max(44px,calc(var(--w)*1cqw));height:max(44px,calc(var(--h)*1cqh));transform:translate(-50%,-50%);margin:0;padding:0;border:0;border-radius:var(--atelier-radius-control);background:none;color:var(--atelier-ink);overflow:visible;cursor:grab;pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent}
.guide-handle[data-kind=image]:not(.is-on){touch-action:pan-y}
.guide-handle:active{cursor:grabbing}
.guide-handle-box{position:absolute;left:50%;top:50%;box-sizing:border-box;width:calc(var(--w)*1cqw + 8px);height:calc(var(--h)*1cqh + 8px);transform:translate(-50%,-50%);border:1px dashed transparent;pointer-events:none}
.guide-handle.is-on .guide-handle-box{border-color:var(--atelier-ink)}
@media(hover:hover){.guide-handle:not(.is-on):hover .guide-handle-box{border-color:var(--atelier-muted)}}
.guide-handle:focus-visible{outline:none}
.guide-handle:not(.is-on):focus-visible .guide-handle-box{border-color:var(--atelier-muted)}
.guide-handle-size{position:absolute;left:calc(50% + var(--kx)*1cqw);top:calc(50% + var(--ky)*1cqh);width:44px;height:44px;transform:translate(-50%,-50%);cursor:nwse-resize;touch-action:none}
.guide-handle-size::after{content:'';position:absolute;left:50%;top:50%;width:14px;height:14px;transform:translate(-50%,-50%);border:1px solid var(--atelier-ink);border-radius:var(--atelier-radius-round);background:var(--atelier-paper)}
/* « Recentrer » (élément désigné et déplacé) : sur téléphone, en bas à gauche, à côté de la boule (au centre, il cacherait le bas du
   dessin, souvent la date ; à droite, la poignée de taille) ; sur ordinateur, sous la boule. L'aide de découverte (une fois) : en haut de
   la scène, sous les pastilles. */
.guide-handles-bar{position:absolute;left:var(--atelier-space-3);right:var(--atelier-space-3);bottom:var(--atelier-space-2);z-index:3;display:flex;justify-content:flex-start;pointer-events:none}
.guide-handles-bar.is-hint{top:var(--atelier-space-2);bottom:auto;justify-content:center}
.guide-stage.has-top .guide-handles-bar.is-hint{top:60px}
.guide-handles-bar>*{pointer-events:auto}
.guide-handles-hint{max-width:30em;margin:0;padding:var(--atelier-space-2) var(--atelier-space-3);border-radius:var(--atelier-radius-round);background:color-mix(in oklch,var(--atelier-paper) 90%,transparent);font-size:var(--atelier-text-sm);line-height:1.35;color:var(--atelier-ink);text-align:center}
@media(min-width:1024px),(min-width:640px) and (max-height:500px) and (orientation:landscape){.guide-handles-bar{bottom:28px;justify-content:center}.guide-handles-bar.is-hint{top:28px}.guide-stage.has-top .guide-handles-bar.is-hint{top:80px}}
/* Lot J (09/10) : boule en 3D (guide-3d.mjs). Un élément désigné : le dessin plat reprend la main sous le geste (la 3D s'efface) ; boule tournée :
   les éléments mobiles se cachent (un toucher la remet d'abord de face) ; « Recentrer » prend la place de la ligne d'aide sous la boule. */
.guide-stage:has(.guide-handle.is-on) .guide-face{opacity:1!important}
.guide-stage:has(.guide-handle.is-on) .guide-3d{opacity:0;transition:none}
.guide-stage:has(.guide-handle.is-on) .guide-cord{visibility:visible}/* le dessin plat reprend la main : son cordon aussi */
.guide-stage.is-turned .guide-handles{visibility:hidden}
.guide-stage:has(.guide-handles-bar:not([hidden])) .guide-stage-help{visibility:hidden}
/* Lot L (09/10) : « Recentrer » monte au-dessus de la barre de l'élément (93-parcours-outils.css) ; --tools-h : sa hauteur, posée par guide-toolbar.mjs. */
.guide-stage:has(.guide-tools:not([hidden]):not(.is-top)) .guide-handles-bar{bottom:calc(var(--atelier-space-2) + var(--tools-h,0px) + var(--atelier-space-1))}
@media(min-width:1024px),(min-width:640px) and (max-height:500px) and (orientation:landscape){.guide-stage:has(.guide-tools:not([hidden]):not(.is-top)) .guide-handles-bar{bottom:calc(28px + var(--tools-h,0px) + var(--atelier-space-1))}}