/* 🎤 « Parler à la boutique » (#972) — un GROS bouton en bas à gauche (en bas à droite vivent la radio et les
   annonces). Pensé pour un papi : 64 px de cible, contraste fort, l'état écrit en toutes lettres à côté. */
.voix-boite {
  position: fixed; left: 16px; bottom: 16px; z-index: 8000;
  display: flex; flex-direction: column-reverse; align-items: flex-start; gap: 8px;
  max-width: min(22rem, calc(100vw - 32px));
  pointer-events: none;
}
.voix-boite > * { pointer-events: auto; }
.voix-bouton {
  display: inline-flex; align-items: center; gap: .5rem;
  min-height: 64px; padding: 0 1.25rem 0 1rem;
  border: 3px solid var(--creme, #FFF8F0); border-radius: 999px;
  background: var(--cafe, #3E2723); color: var(--creme, #FFF8F0);
  font: 700 1.15rem/1 var(--font-body, system-ui, sans-serif);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .35);
  cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none;
}
.voix-bouton svg { width: 30px; height: 30px; }
.voix-bouton:focus-visible { outline: 4px solid var(--accent, #B8860B); outline-offset: 3px; }
.voix-bouton:disabled { opacity: .7; cursor: progress; }
.voix-bouton.voix-ecoute { background: var(--erreur, #C62828); }
.voix-bouton.voix-appel { animation: voix-appel 1.4s ease-in-out infinite; }
@keyframes voix-appel { 50% { box-shadow: 0 0 0 10px rgba(184, 134, 11, .35); } }
@media (prefers-reduced-motion: reduce) { .voix-bouton.voix-appel { animation: none; outline: 4px solid var(--accent, #B8860B); } }
.voix-bulle:empty { display: none; }
.voix-bulle {
  margin: 0; padding: .6rem .85rem; border-radius: 10px;
  background: var(--creme, #FFF8F0); color: var(--texte, #2C1810);
  border: 2px solid var(--cafe, #3E2723);
  font: 600 1.05rem/1.35 var(--font-body, system-ui, sans-serif);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
}
.voix-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media print { .voix-boite { display: none; } }