/* Salle de réunion en direct (visioconférence) */
.salle-page { background: #05070d; }
.salle-accueil { min-height: 100vh; display: grid; place-items: center; padding: 20px; }
.salle-accueil .boite { position: static; text-align: left; width: min(560px, 100%); background: var(--surface); border: 1px solid var(--bord); border-radius: 22px; padding: 26px; display: flex; flex-direction: column; gap: 14px; }
.salle-accueil .logo { width: 52px; height: 52px; border-radius: 14px; }
.choix-participants { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.choix-participants label { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px !important; background: var(--surface-2); border: 1px solid var(--bord); border-radius: 12px; padding: 8px; cursor: pointer; font-size: .84rem; }
.choix-participants input { accent-color: var(--accent); }

.reunion { height: 100vh; display: flex; flex-direction: column; }
.reunion-barre { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 18px; border-bottom: 1px solid var(--bord); background: rgba(8, 12, 22, .9); }
.reunion-barre b { font-size: 1.02rem; margin-right: 10px; }
.reunion-barre [aria-pressed="false"] { opacity: .55; }
.reunion-corps { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 400px; }
.mosaique { padding: 18px; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; align-content: start; overflow-y: auto; }
.tuile-v { position: relative; aspect-ratio: 16 / 11; border-radius: 18px; background: radial-gradient(circle at 50% 40%, #1a2540, #0b1120); border: 2px solid transparent; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; transition: border-color .2s, transform .2s, box-shadow .2s; overflow: hidden; }
.tuile-v .avatar-emp { width: 74px; height: 74px; font-size: 1.5rem; }
.tuile-v .nom { position: absolute; left: 10px; bottom: 8px; font-size: .78rem; background: rgba(0,0,0,.55); padding: 3px 8px; border-radius: 8px; }
.tuile-v .poste { font-size: .7rem; color: var(--doux); }
.tuile-v.parle { border-color: var(--c, #22c55e); transform: scale(1.02); box-shadow: 0 0 30px -6px var(--c, #22c55e); }
.tuile-v.parle .avatar-emp { animation: pulse-voix .9s ease-in-out infinite alternate; }
@keyframes pulse-voix { to { box-shadow: 0 0 0 10px rgba(255,255,255,.08), 0 0 0 22px rgba(255,255,255,.03); } }
.tuile-v .etat { position: absolute; top: 8px; right: 10px; font-size: .72rem; color: var(--doux); }
.tuile-v .barres-voix { display: none; position: absolute; top: 10px; left: 12px; gap: 3px; align-items: flex-end; height: 16px; }
.tuile-v.parle .barres-voix { display: flex; }
.barres-voix i { width: 3px; background: var(--c, #22c55e); border-radius: 2px; animation: barre .5s ease-in-out infinite alternate; }
.barres-voix i:nth-child(2) { animation-delay: .15s; } .barres-voix i:nth-child(3) { animation-delay: .3s; }
@keyframes barre { from { height: 3px; } to { height: 15px; } }
.tuile-v.fondateur { background: radial-gradient(circle at 50% 40%, #13283a, #091018); }
.tuile-v.fondateur .avatar-emp { --c: #fbbf24; }
.discussion { border-left: 1px solid var(--bord); display: flex; flex-direction: column; min-height: 0; background: #070b14; }
.fil-direct { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.bulle-d { display: flex; gap: 8px; align-items: flex-start; animation: apparait .25s ease; }
.bulle-d .texte { background: var(--surface-2); border-radius: 4px 14px 14px 14px; padding: 8px 12px; font-size: .88rem; line-height: 1.5; }
.bulle-d .texte b { display: block; font-size: .74rem; color: var(--doux); margin-bottom: 2px; }
.bulle-d.moi { flex-direction: row-reverse; } .bulle-d.moi .texte { background: rgba(57,135,229,.25); border-radius: 14px 4px 14px 14px; }
.bulle-d.reflechit .texte { color: var(--doux); font-style: italic; }
.parler { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--bord); align-items: flex-end; }
.parler textarea { flex: 1; resize: none; background: var(--fond); border: 1px solid var(--axe); border-radius: 12px; padding: 9px 12px; font-size: .9rem; }
.micro { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--bord); background: var(--surface-2); font-size: 1.15rem; flex: none; }
.micro.ecoute { background: #ef4444; animation: pulse-voix .7s infinite alternate; }
@media (max-width: 900px) {
  .reunion-corps { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .mosaique { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); max-height: 34vh; padding: 10px; gap: 8px; }
  .tuile-v .avatar-emp { width: 44px; height: 44px; font-size: .95rem; } .tuile-v .poste { display: none; }
  .discussion { border-left: 0; border-top: 1px solid var(--bord); }
}