/* Fluvo — densite d'affichage. Charge apres style.css, ne remplace rien. */
:root { --fs-msg: 13.5px; }

/* --- bulles compactes ---
   🔴 Cette feuille regle la TAILLE et l'ESPACEMENT, jamais la FORME.
   Elle imposait autrefois `border-radius` et `box-shadow` en !important, avec un
   selecteur `#vue .msg` (specificite 1,1,0) : aucune couche de design ne pouvait
   plus toucher aux bulles, meme en !important. Le rayon des bulles etait alors
   declare a QUATRE endroits concurrents (style.css:264 et :797, sobre.css:145,
   ici). Retire le 11/09/2026 — la forme appartient a la couche de design, qui
   est chargee en dernier et gagne donc naturellement. */
#vue .msg, .msg {
  font-size: var(--fs-msg);
  line-height: 1.38;
  padding: 5px 10px 4px;
  max-width: min(620px, 74%);
}

/* --- espacement du fil : de l'air sur les cotes, du rythme entre messages --- */
.fil {
  padding: 14px 22px 10px !important;
  gap: 3px !important;
}
.msg + .msg { margin-top: 0; }
/* un vrai blanc quand l'interlocuteur change */
.msg + .msg.moi, .msg.moi + .msg:not(.moi) { margin-top: 9px; }

.msg .exp { font-size: .8em; margin-bottom: 1px; line-height: 1.2; }
.msg .h   { font-size: .72em; margin-top: 1px; line-height: 1.1; gap: 4px; }
.msg .react { font-size: .82em; padding: 1px 6px; }
.msg .reacts { gap: 3px; margin-top: 3px; }
.msg .cite { padding: 3px 7px; margin-bottom: 3px; border-radius: 6px; }
.msg .cite .qui { font-size: .82em; }
.msg .cite .txt { font-size: .85em; }
.msg .fil3 { font-size: .85em; padding: 2px 8px; margin-top: 4px; }
.msg img { margin-top: 3px; border-radius: 9px; }

/* --- liste de gauche, un peu plus dense --- */
.liste .chat { padding-top: 7px; padding-bottom: 7px; }

/* --- ascenseurs aux couleurs du theme --- */
* { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--accent) 55%, transparent) transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--accent) 45%, transparent);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: content-box;
}
*::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--accent) 75%, transparent); background-clip: content-box; }
*::-webkit-scrollbar-corner { background: transparent; }
#rail::-webkit-scrollbar { display: none; }

/* messages venus de l'archive Messenger : legerement en retrait */
.fa-arch{opacity:.93}
.fa-arch .exp{color:var(--txt3)}
/* séparateur discret entre l'historique Beeper et les messages de la passerelle */
#vue .fil .jour.hist-beeper{display:flex;align-items:center;gap:10px;background:none;box-shadow:none;color:var(--txt3);font-size:11px;letter-spacing:.04em}
#vue .fil .jour.hist-beeper::before,#vue .fil .jour.hist-beeper::after{content:"";flex:1;height:1px;background:var(--bg4)}

/* filtre par réseau, dans la barre au-dessus de la liste */
.filtre-res {
  background: var(--bg3); border: 1px solid var(--bord); color: var(--txt2);
  border-radius: 999px; padding: 3px 8px; font: inherit; font-size: 11.5px; outline: none; cursor: pointer;
}
.filtre-res:hover { color: var(--txt); border-color: var(--accent); }

/* logos de réseau : tout sur UNE ligne, l'aperçu ne doit pas être repoussé */
.puces { flex-wrap: nowrap; overflow: hidden; }
.puces .puce { white-space: nowrap; }
/* archive rattachée : même pastille ronde que les passerelles */
.logo-res.archive { background: color-mix(in srgb, var(--c) 45%, var(--bg4)); font-size: 9.5px; cursor: default; }
.logo-res.archive:hover { transform: none; opacity: .95; }

/* menus déroulants : les options sont dessinées par le navigateur, il faut leur
   donner explicitement nos couleurs — sinon c'est blanc sur blanc en thème sombre */
/* on n'utilise plus de <select> pour les filtres (illisible sur certains
   systèmes) : le menu est maison. Reste pour les rares selects natifs. */
select { color: var(--txt); background: var(--bg3); }
select option, select optgroup { background: var(--bg2); color: var(--txt); }
input[type="date"] { color: var(--txt); }
/* bouton de filtre + son menu */
.filtre-res.on { border-color: var(--accent); color: var(--txt); }
.menu button.choisi { background: color-mix(in srgb, var(--accent) 18%, transparent); font-weight: 600; }