/* ------------------------------------------------------------------
   SIMONE — Barra superior: el selector de idiomas es intocable.
   21 de septiembre de 2026. Se carga después de skin.css.

   EL FALLO
   La barra alinea su contenido a la rejilla de 1440, así que su hueco
   útil es SIEMPRE 1344px, por ancha que sea la pantalla. Medido en la
   web, con el mensaje y el enlace de la app de cada idioma:

     EN  1146px  sobran 198     FR  1434px  FALTAN 90   <-- se rompía
     DE  1207px  sobran 137     IT  1379px  FALTAN 35   <-- se rompía
     ES  1305px  sobran  39     PT  1331px  sobran  13

   Como .msg se encogía pero no recortaba lo que le sobraba, en francés
   e italiano el texto se pintaba ENCIMA del selector de idiomas. No es
   un problema del francés: español y portugués iban con 39 y 13px de
   margen, a una palabra de romperse igual.

   LAS REGLAS, por orden de prioridad
   1. El selector no se encoge ni se tapa nunca. Es navegación.
   2. Lo que no quepa del mensaje se recorta con un fundido, no se
      desborda. El fundido cae sobre el hueco vacío cuando el texto sí
      cabe, así que no se nota salvo cuando hace falta. Esto es la red:
      ninguna traducción futura, por larga que sea, puede volver a
      tapar los idiomas.
   3. Se recupera espacio apretando los interlineados. El .24em es el
      valor que este mismo tema ya usa en la barra por debajo de 820px.

   Comprobado en 6 idiomas x 12 anchos, de 2560 a 390px: cero solapes.
   ------------------------------------------------------------------ */

@media (min-width:821px){
	.lx-topbar{gap:18px;letter-spacing:.24em}
	.lx-topbar .lang{flex:0 0 auto;gap:14px}
	.lx-topbar .msg{flex:1 1 auto;min-width:0;gap:22px;overflow:hidden;
		-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent 100%);
		        mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent 100%)}
	.lx-topbar .msg>*{flex:0 0 auto}
}

/* Entre 821 y 1279px no cabe el mensaje largo en NINGÚN idioma, ni en
   inglés. Ahí se queda solo el enlace de la app, que es el que lleva a
   alguna parte. Por debajo de 820px la barra ya deja solo los idiomas
   (regla de skin.css). */
@media (min-width:821px) and (max-width:1279px){
	.lx-topbar .msg>span{display:none}
}
