/* Outils secondaires : correctifs de mise en page du 21/09/2026.
   Lie uniquement depuis les 13 pages d'outils x 17 langues, APRES les autres
   feuilles. Aucune balise deplacee : tout passe par order et align-self.
   Navigateurs sans :has() : mise en page actuelle conservee. */

/* 1. Telephone : l'outil (zone de depot, bouton) dans le premier ecran.
   Le badge de mise a jour et l'encart de definition passent SOUS la carte
   d'envoi ; l'enveloppe de pub garde order:0 et reste donc juste apres la carte.
   Le fil d'Ariane interne en double (16 langues) est masque seulement si le
   bandeau en porte deja un. Reprend la proposition UI_MOBILE-01/02 : ne pas lier
   premier_ecran_mobile.css en plus. */
@media (max-width: 640px) {
  #uploadState > .meta-badge,
  #uploadState > .definition-block,
  #uploadState > div:not([class]):not([id]),
  #uploadState > div[class=""] { order: 1; }
  body:has(nav.breadcrumbs) main > nav.breadcrumb { display: none; }
  /* /recorder : pas de #uploadState, les blocs sont enfants directs de main. */
  main.page:has(> #idleSection) > div:not([class]):not([id]) { order: 1; }
  main.page:has(> #idleSection) > #idleSection ~ *:not(.rv-pub) { order: 2; }
}

/* 2. Ordinateur : cartes de travail retrecies a la largeur de leur contenu
   (egaliseur 330 px, reducteur de bruit 278 px) par .page>div{align-items:center}.
   Portee limitee a quatre outils ; vocal-remover et stem-splitter non touches. */
.page > .workspace:has(#eqGrid) > .card,
.page > .workspace:has(#keyDisplay) > .card,
.page > .workspace:has(#processedWaveform) > .waveform-container,
.page > .workspace:has(.controls-container) > .card { align-self: stretch; }

/* 3. Bouton rond de lecture (40 px) : le mot traduit sortait du cercle.
   Icone seule sur ordinateur ; le libelle accessible (aria-label) de la page
   reste. Sur telephone, enhance.css en fait deja des boutons larges : inchange. */
@media (min-width: 641px) {
  .btn-play:has(> svg) { font-size: 0; }
  .btn-play > svg { flex: none; }
}