/* Fransou · la Voix (19/10/2026). Le bouton « Parler » dans la barre Fransou et la scène de conversation au-dessus d'elle.
   Encre et blanc, clair et sombre comme l'application ouverte ; une orbe qui dit l'état d'un coup d'œil (écoute : elle respire avec
   votre voix ; réfléchit : elle tourne ; parle : elle bat). La page reste visible et utilisable dessous. */
.vx2{--vx-fond:#ffffff;--vx-fond-2:#f4f5f5;--vx-texte:#0f1a1d;--vx-doux:#566265;--vx-filet:#e1e4e5;--vx-plein:#0f1a1d;--vx-sur-plein:#ffffff;--vx-alerte:#ad3a23;--vx-ombre:0 18px 48px rgba(15,26,29,.18);
  --vx-ease:cubic-bezier(.2,.8,.2,1);font-family:'Fransou Texte',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--vx-texte);-webkit-font-smoothing:antialiased;box-sizing:border-box}
.vx2 *,.vx2 *::before,.vx2 *::after{box-sizing:border-box}
.vx2[data-nv2-theme="sombre"]{--vx-fond:#0d1417;--vx-fond-2:#141d21;--vx-texte:#eef2f3;--vx-doux:#9eabaf;--vx-filet:#24323a;--vx-plein:#eef2f3;--vx-sur-plein:#0d1417;--vx-alerte:#ec8a73;--vx-ombre:0 18px 48px rgba(0,0,0,.5)}

/* -------- le bouton dans la barre -------- */
.vx2-parler{width:auto!important;padding:0 14px 0 12px;gap:6px;display:inline-flex!important;align-items:center;font:500 14px/1 inherit;font-family:inherit;border-radius:13px}
.vx2-parler.vx2-actif{background:var(--nv-alerte,#ad3a23)!important;color:var(--nv-sur-plein,#fff)!important}
.vx2-parler.vx2-actif svg line{animation:vx2-barres 1s ease-in-out infinite}
.vx2-parler.vx2-actif svg line:nth-child(2){animation-delay:.15s}
.vx2-parler.vx2-actif svg line:nth-child(3){animation-delay:.3s}
.vx2-parler.vx2-actif svg line:nth-child(4){animation-delay:.45s}
@keyframes vx2-barres{50%{transform:scaleY(.55)}}
.vx2-parler svg line{transform-origin:center;transform-box:fill-box}

/* -------- la scène -------- */
.vx2-scene{position:fixed;z-index:1012;left:calc(var(--nv2-g,0px) + (100vw - var(--nv2-g,0px) - var(--nv2-d,0px)) / 2);bottom:88px;transform:translateX(-50%);width:min(580px,calc(100vw - var(--nv2-g,0px) - var(--nv2-d,0px) - 48px));max-height:min(64vh,620px);display:flex;flex-direction:column;
  background:var(--vx-fond);border:1px solid var(--vx-filet);border-radius:22px;box-shadow:var(--vx-ombre);overflow:hidden;animation:vx2-entre .22s var(--vx-ease)}
@keyframes vx2-entre{from{opacity:0;transform:translateX(-50%) translateY(10px)}}
.vx2-tete{display:flex;align-items:center;gap:12px;padding:14px 14px 12px 16px;border-bottom:1px solid var(--vx-filet)}
.vx2-etat{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.vx2-etat b{font-weight:600;font-size:16px;letter-spacing:-.01em}
.vx2-etat small{color:var(--vx-doux);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* l'orbe : trois anneaux, l'état se lit à la forme du mouvement, pas seulement à la couleur */
.vx2-orbe{--vx2-niveau:0;position:relative;width:40px;height:40px;flex:none;display:grid;place-items:center}
.vx2-orbe i{position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--vx-texte);opacity:.18}
.vx2-orbe i:nth-child(1){inset:12px;background:var(--vx-texte);opacity:1;transition:transform .08s linear}
.vx2-orbe i:nth-child(2){inset:6px;opacity:.35}
[data-vx2-etat="ecoute"] .vx2-orbe i:nth-child(1){transform:scale(calc(1 + var(--vx2-niveau) * .9))}
[data-vx2-etat="ecoute"] .vx2-orbe i:nth-child(3){animation:vx2-respire 2.4s ease-in-out infinite}
[data-vx2-etat="reflechit"] .vx2-orbe i:nth-child(2),[data-vx2-etat="prepare"] .vx2-orbe i:nth-child(2){border-style:dashed;opacity:.7;animation:vx2-tourne 1.4s linear infinite}
[data-vx2-etat="reflechit"] .vx2-orbe i:nth-child(1){transform:scale(.7)}
[data-vx2-etat="parle"] .vx2-orbe i:nth-child(1){animation:vx2-bat .7s ease-in-out infinite}
[data-vx2-etat="parle"] .vx2-orbe i:nth-child(3){opacity:.5;animation:vx2-onde 1.1s ease-out infinite}
[data-vx2-etat="pause"] .vx2-orbe i:nth-child(1),[data-vx2-etat="eteint"] .vx2-orbe i:nth-child(1){opacity:.35}
@keyframes vx2-respire{50%{transform:scale(1.12);opacity:.3}}
@keyframes vx2-tourne{to{transform:rotate(360deg)}}
@keyframes vx2-bat{50%{transform:scale(1.18)}}
@keyframes vx2-onde{from{transform:scale(.7);opacity:.6}to{transform:scale(1.25);opacity:0}}

/* les boutons */
.vx2-b{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 14px;border:1px solid var(--vx-filet);border-radius:11px;background:var(--vx-fond);color:var(--vx-texte);font:500 14px/1 inherit;font-family:inherit;text-decoration:none;cursor:pointer;transition:background .15s,transform .12s}
.vx2-b:hover{background:var(--vx-fond-2)}
.vx2-b:active{transform:scale(.97)}
.vx2-b:focus-visible,.vx2-puce:focus-visible{outline:2px solid var(--vx-texte);outline-offset:2px}
.vx2-b.vx2-plein{background:var(--vx-plein);border-color:var(--vx-plein);color:var(--vx-sur-plein)}
.vx2-b.vx2-icone{padding:0 10px;color:var(--vx-doux)}
.vx2-b.vx2-arreter{background:var(--vx-alerte);border-color:var(--vx-alerte);color:var(--vx-sur-plein);font-weight:600;padding:0 16px}

/* le fil de la conversation */
.vx2-fil{flex:1;min-height:0;overflow:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain}
.vx2-msg{max-width:88%;padding:10px 13px;border-radius:16px;font-size:14.5px;line-height:1.45;white-space:pre-wrap}
.vx2-msg small{display:block;margin-top:4px;font-size:11.5px;color:var(--vx-doux)}
.vx2-moi{align-self:flex-end;background:var(--vx-plein);color:var(--vx-sur-plein);border-bottom-right-radius:6px}
.vx2-moi small{color:color-mix(in srgb,var(--vx-sur-plein) 70%,transparent)}
.vx2-lui{align-self:flex-start;background:var(--vx-fond-2);border-bottom-left-radius:6px}
.vx2-dit{margin:0;font-size:13px;color:var(--vx-doux);text-align:center}
.vx2-petit{margin:0;font-size:12.5px;color:var(--vx-doux);line-height:1.4}
.vx2-carte,.vx2-avis{border:1px solid var(--vx-filet);border-radius:16px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;background:var(--vx-fond)}
.vx2-carte p,.vx2-avis p{margin:0;font-size:14px;line-height:1.45}
.vx2-carte.vx2-faite{opacity:.7}
.vx2-carte[data-vx2-carte="ecran"]{border-color:var(--vx-texte);box-shadow:0 0 0 3px color-mix(in srgb,var(--vx-texte) 10%,transparent)}
.vx2-carte-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.vx2-idees{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.vx2-idees small{color:var(--vx-doux);font-size:12.5px}
.vx2-puce{border:1px solid var(--vx-filet);background:var(--vx-fond);color:var(--vx-texte);border-radius:999px;padding:7px 12px;font:400 13.5px/1.2 inherit;font-family:inherit;cursor:pointer;text-align:left}
.vx2-puce:hover{background:var(--vx-fond-2)}
.vx2-puce[aria-checked="true"]{background:var(--vx-plein);border-color:var(--vx-plein);color:var(--vx-sur-plein)}
.vx2-entendu{margin:0;padding:0 16px;min-height:0;font-size:15px;color:var(--vx-texte);font-style:italic}
.vx2-entendu:not(:empty){padding:8px 16px 4px}
.vx2-dit-en-cours{margin:0;padding:0 16px;font-size:13px;color:var(--vx-doux)}
.vx2-dit-en-cours:not(:empty){padding:4px 16px 12px}
.vx2-scene>.vx2-carte-actions{padding:0 16px 14px}

/* les réglages */
.vx2-reglages{padding:12px 16px;border-bottom:1px solid var(--vx-filet);display:flex;flex-direction:column;gap:10px;max-height:46vh;overflow:auto;background:var(--vx-fond-2)}
.vx2-reglages p{margin:0;font-size:13.5px}
.vx2-ligne{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.vx2-choix{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.vx2-choix-nom{min-width:120px;font-size:12.5px;color:var(--vx-doux)}
.vx2-nombre{width:84px;height:34px;border:1px solid var(--vx-filet);border-radius:10px;background:var(--vx-fond);color:var(--vx-texte);padding:0 10px;font:inherit}
.vx2-interrupteur{font-size:13.5px;cursor:pointer}
.vx2-interrupteur input{width:18px;height:18px;accent-color:var(--vx-plein)}
.vx2-voix{display:flex;flex-direction:column;gap:6px}
.vx2-voix-l{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--vx-filet);border-radius:12px;background:var(--vx-fond)}
.vx2-voix-l>div{flex:1;min-width:0}
.vx2-voix-l small{display:block;font-size:12px;color:var(--vx-doux)}
.vx2-voix-l.vx2-choisie{border-color:var(--vx-texte)}
.vx2-propose{margin-left:6px;font-size:11px;padding:2px 7px;border-radius:999px;background:var(--vx-plein);color:var(--vx-sur-plein)}

/* guider pas à pas : le bouton que je cite s'éclaire dans la page */
[data-vx2-montre]{outline:3px solid currentColor!important;outline-offset:3px!important;animation:vx2-montre 1.2s ease-in-out 3}
@keyframes vx2-montre{50%{outline-offset:7px}}

@media (max-width:767px){
  .vx2-scene{left:8px;right:8px;width:auto;transform:none;bottom:calc(var(--nv-bas,64px) + 76px + env(safe-area-inset-bottom));max-height:58vh;border-radius:18px}
  @keyframes vx2-entre{from{opacity:0;transform:translateY(10px)}}
  .vx2-parler{padding:0 10px!important}
  .vx2-parler .vx2-parler-t{display:none}
  .vx2-tete{gap:8px;padding:12px}
  .vx2-b.vx2-icone{padding:0 8px;font-size:13px;min-height:34px}
  .vx2-b.vx2-arreter{padding:0 12px}
  .vx2-orbe{width:32px;height:32px}
  .vx2-etat b{font-size:15px}
  .vx2-choix-nom{min-width:100%}
}
@media (prefers-reduced-motion:reduce){.vx2 *,.vx2,.vx2-parler svg line,[data-vx2-montre]{animation:none!important;transition:none!important}}
