.exercice{flex-direction:column;gap:12px;max-width:1200px;margin:0 auto;padding:12px 16px 24px;display:flex}.exercice--attente{min-height:60vh}.bande{border:2px solid var(--accent);background:#fff;border-radius:12px;flex-direction:column;gap:8px;padding:12px 16px;display:flex}.bande__consigne,.bande__message,.reussite__texte{flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0;display:flex}.bande__consigne{font-weight:600}.bande__message{min-height:1.5em;color:var(--accent)}.bande__actions{flex-wrap:wrap;gap:8px 12px;display:flex}.bouton-secondaire,.bouton-ecouter{border:2px solid var(--accent);color:var(--accent);font:inherit;cursor:pointer;background:#fff;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:0 1rem;display:inline-flex}.bouton-secondaire{min-height:56px;text-decoration:none}.bouton-ecouter{font-size:.85em}.bande--compacte{--lignes:5;border-width:0 0 3px;border-color:var(--texte);background:var(--fond);border-radius:0;gap:2px;padding:2px 12px;font-size:1rem;line-height:1.3}:root[data-texte-grand=oui] .bande--compacte{--lignes:8}.bande--compacte .bande__actions{flex-wrap:nowrap;gap:6px}.bande--compacte .bande__actions>*{overflow-wrap:normal;text-align:center;flex-direction:column;flex:auto;gap:0;min-width:min-content;min-height:44px;padding:2px 4px;font-size:20px;line-height:1.1}.bande--compacte .bande__actions svg{flex:none;width:20px;height:20px}.bande--compacte .bande__texte{height:calc(var(--lignes) * 1.25em);flex-direction:column;line-height:1.25;display:flex;overflow:hidden}.bande--compacte .bande__texte>p{margin:0}.bande--compacte .bande__texte>p[hidden]{display:none}.bande--compacte .bande__message{min-height:0;color:var(--accent);order:-1}.bande--compacte .bande__consigne{font-weight:600}.bande--compacte .bande__aide{align-items:center;gap:6px;height:44px;display:flex}.bande--compacte .bande__aide>*{white-space:nowrap;min-height:44px;padding:0 10px;font-size:20px}.bande--compacte .bande__continuer{margin-left:auto}.zone-exercice{isolation:isolate;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border-radius:12px;height:60vh;min-height:360px;position:relative;overflow:hidden}.formes,.vue-bureau,.vue-telephone{position:absolute;inset:0}.exercice--telephone:not(.exercice--plein-ecran){box-sizing:border-box;min-height:100vh;min-height:var(--hauteur-visible,100vh)}.exercice--telephone:not(.exercice--plein-ecran)>.zone-exercice{flex:auto;height:auto;min-height:260px}.exercice--plein-ecran{z-index:10;overflow-anchor:none;background:#000;gap:0;max-width:none;margin:0;padding:0;position:fixed;inset:0;overflow:hidden auto}.exercice--plein-ecran>.bande{border-width:0 0 3px;border-color:var(--texte);background:var(--fond);border-radius:0;flex:none}.exercice--plein-ecran>.reussite{border-radius:0;flex:none}.exercice--plein-ecran>.zone-exercice{border-radius:0;flex:auto;height:auto;min-height:320px}.formes{background:#fff;border:2px solid #d9d2c5;border-radius:12px}.forme{box-sizing:border-box;background:var(--cible);border:3px solid var(--texte);transition:width .3s,height .3s,left .3s,top .3s;position:absolute;transform:translate(-50%,-50%)}.forme[data-eclaire=oui]{box-shadow:0 0 0 6px #fff, 0 0 0 10px var(--accent);background:#ffd86b}.forme--rond{border-radius:50%}.forme--carre{border-radius:8px}.formes--defiler{touch-action:pan-y;overflow:hidden auto}.formes--defiler .colonne{background:repeating-linear-gradient(#fff 0 56px,#efe9dd 56px 60px);position:relative}.formes--defiler .forme{transition:none}.formes--glisser,.vue-bureau--glisser{touch-action:none}.formes--glisser .forme{cursor:grab;transition:width .3s,height .3s,left .3s,top .3s,transform .25s,box-shadow .2s}.formes--glisser .forme[data-saisi=oui],.vue-bureau--glisser [data-saisi=oui]{box-shadow:0 14px 28px #00000059, 0 0 0 4px var(--accent);z-index:3;cursor:grabbing;transition-property:width,height,left,top,box-shadow}.cadre-arrivee{aspect-ratio:1;box-sizing:border-box;border:4px dashed var(--texte);border-radius:12px;width:min(180px,30%);height:auto;transition:background-color .2s,box-shadow .2s;position:absolute;top:50%;left:min(78%,100% - 12px - min(90px,15%));transform:translate(-50%,-50%)}.cadre-arrivee[data-eclaire=oui],.vue-bureau--glisser [data-eclaire=oui]{box-shadow:0 0 0 4px #fff, 0 0 0 8px var(--accent);background:#ffd86b}[data-guide=actif]{outline:4px solid var(--accent);outline-offset:4px}.demonstration{z-index:20;pointer-events:none;position:absolute;bottom:16px;right:16px}.souris__bouton{fill:#fff}.souris__bouton--actif{fill:var(--cible);animation:1s ease-in-out 3 appui-souris}@keyframes appui-souris{0%,to{fill:#fff}40%,60%{fill:var(--cible)}}.souris__bouton--double{animation-name:appui-souris-double;animation-duration:1.4s}@keyframes appui-souris-double{0%,30%,60%,to{fill:#fff}10%,20%,40%,50%{fill:var(--cible)}}.souris__molette{fill:var(--cible);animation:1s ease-in-out 3 tourne-molette}@keyframes tourne-molette{0%,to{transform:translateY(0)}50%{transform:translateY(8px)}}.doigt__main{animation:1.2s ease-in-out 3 appui-doigt}.doigt__onde{opacity:0;transform-origin:30px 14px;animation:1.2s ease-out 3 onde-doigt}@keyframes appui-doigt{0%,to{transform:translateY(0)}35%,50%{transform:translateY(4px)}}@keyframes onde-doigt{0%,35%{opacity:0;transform:scale(.5)}45%{opacity:1}to{opacity:0;transform:scale(1.4)}}.doigt--double .doigt__main{animation-name:appui-doigt-double;animation-duration:1.4s}.doigt--double .doigt__onde{animation-name:onde-doigt-double;animation-duration:1.4s}@keyframes appui-doigt-double{0%,20%,40%,to{transform:translateY(0)}10%,30%{transform:translateY(4px)}}@keyframes onde-doigt-double{0%,8%,28%{opacity:0;transform:scale(.5)}12%,32%{opacity:1}20%,to{opacity:0;transform:scale(1.4)}}.doigt--glisse .doigt__main{animation-name:glisse-doigt;animation-duration:1.6s}.doigt--glisse .doigt__onde{animation-name:onde-glisse-doigt;animation-duration:1.6s}@keyframes glisse-doigt{0%,10%{transform:translateY(24px)}70%,to{transform:translateY(-16px)}}@keyframes onde-glisse-doigt{0%,8%{opacity:0;transform:translateY(24px)scale(.5)}14%{opacity:1;transform:translateY(24px)scale(1)}70%{opacity:1;transform:translateY(-16px)scale(1)}to{opacity:0;transform:translateY(-16px)scale(1.2)}}[data-animations=non] .doigt__onde{opacity:1}.lumiere{z-index:20;pointer-events:none;position:absolute;inset:0}.lumiere__trou{border-radius:12px;position:absolute;box-shadow:0 0 0 9999px #1f1a1459}.lumiere__bulle{max-width:320px;color:var(--texte);pointer-events:auto;background:#fff;border-radius:8px;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:8px 12px;display:flex;position:absolute;box-shadow:0 2px 8px #00000040}.lumiere__etape{font-weight:600}.chemin-guide{z-index:2;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.chemin-guide__trait,.chemin-guide__fleche{fill:none;stroke-linecap:round;stroke-linejoin:round}.chemin-guide__trait{stroke-dasharray:2 14}.chemin-guide[data-court=oui] .chemin-guide__trait{stroke-dasharray:none}.chemin-guide__contour>*{stroke:var(--texte);stroke-width:10px}.chemin-guide__clair>*{stroke:#fff;stroke-width:5px}.reussite{color:var(--texte);background:#e6efe3;border-radius:12px;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:12px 16px;display:flex}.reussite__coche{color:#2f6b2a}.reussite__trait{stroke-dasharray:40;stroke-dashoffset:40px;animation:.6s ease-out forwards dessiner-coche}@keyframes dessiner-coche{to{stroke-dashoffset:0}}.pas-adapte{flex-direction:column;align-items:flex-start;gap:16px;max-width:40rem;margin:0 auto;padding:32px 16px;display:flex}.pas-adapte__message{margin:0;font-size:1.2rem;font-weight:600}.aide-pave{z-index:20;border:2px solid var(--texte);max-width:90%;color:var(--texte);text-align:center;background:#fff;border-radius:8px;margin:0;padding:6px 12px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.formes--trace{touch-action:none;cursor:crosshair}.trace{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.trace__bord,.trace__couloir,.trace__axe,.trace__progres{fill:none;stroke-linecap:round;stroke-linejoin:round}.trace__bord{stroke:#8f8678}.trace__couloir{stroke:#f1ece1}.trace__axe{stroke:#c9c0ae;stroke-width:2px;stroke-dasharray:2 10}.trace__progres{stroke:var(--accent);stroke-width:14px}.trace__arrivee{fill:#fff;stroke:var(--texte);stroke-width:4px}.trace__depart{fill:#2e7d32;stroke:#fff;stroke-width:4px}.trace__anneau{fill:#fff;stroke:var(--accent);stroke-width:5px}
