.dock{position:fixed;left:1.1rem;bottom:1.1rem;z-index:1050;
  display:flex;align-items:flex-end;gap:.7rem}

.dock-onglet{display:inline-flex;align-items:center;gap:.55rem;
  background:#fff;color:var(--ink);border:1px solid var(--line);
  border-radius:50rem;padding:.65rem 1.05rem;font-weight:700;font-size:.9rem;
  cursor:pointer;box-shadow:var(--sh);
  transition:box-shadow .16s ease, transform .16s ease}
.dock-onglet:hover{box-shadow:var(--sh-lg);transform:translateY(-1px)}
.dock-onglet:focus,.dock-onglet:focus-visible,.dock-onglet:active{outline:none;-webkit-tap-highlight-color:transparent}
.dock-barre input,.fil-pied input{-webkit-tap-highlight-color:transparent}
.dock-onglet i{color:var(--amber-2);font-size:1rem}

.dock-onglet .presents{display:inline-flex;align-items:center;gap:.22rem;
  background:var(--soft);color:#5A6580;border-radius:50rem;
  font-family:var(--mono);font-size:.66rem;font-weight:700;
  padding:.12rem .45rem;line-height:1.4}
.dock-onglet .presents i{font-size:.62rem}
.dock-onglet .presents.actif{background:#E9F7F1;color:#186A4C}
html[data-theme="sombre"] .dock-onglet .presents{color:var(--muted)}
html[data-theme="sombre"] .dock-onglet .presents.actif{background:rgba(95,217,168,.14);color:#5FD9A8}
.dock-onglet .compte{background:var(--amber);color:#3A1A10;border-radius:50rem;
  font-family:var(--mono);font-size:.66rem;font-weight:700;
  padding:.12rem .45rem;line-height:1.4}
html[data-theme="sombre"] .dock-onglet{background:var(--surface);color:var(--ink)}

.dock-panneau{width:310px;max-width:calc(100vw - 2.2rem);background:#fff;
  border:1px solid var(--line);border-radius:1.25rem;box-shadow:var(--sh-lg);
  overflow:hidden;display:flex;flex-direction:column;max-height:min(72vh,560px)}
html[data-theme="sombre"] .dock-panneau{background:var(--surface)}

.dock-tete{display:flex;align-items:flex-start;justify-content:space-between;
  gap:.6rem;padding:.95rem 1rem .8rem;border-bottom:1px solid var(--line)}
.dock-titre{font-weight:800;font-size:.98rem;letter-spacing:-.01em}
.dock-sous{color:var(--muted);font-size:.8rem;margin-top:.15rem}
.dock-fermer{background:none;border:0;color:var(--muted);cursor:pointer;
  font-size:.9rem;padding:.2rem .3rem;line-height:1}
.dock-fermer:hover{color:var(--ink)}

.dock-barre{padding:.7rem 1rem;border-bottom:1px solid var(--line);
  display:flex;gap:.5rem}
.dock-barre input{flex:1;min-width:0;min-height:38px;font-size:.86rem;
  border:1px solid var(--line);border-radius:50rem;padding:.4rem .85rem;
  background:var(--soft);color:var(--ink)}
.dock-barre input:focus{outline:none;border-color:var(--line);background:#fff;box-shadow:none}
html[data-theme="sombre"] .dock-barre input:focus{background:var(--soft)}
.dock-ajout{flex:none;width:38px;height:38px;border-radius:50%;border:0;
  background:linear-gradient(310deg,var(--amber-2),var(--amber));color:#fff;
  cursor:pointer;font-size:.9rem}

.dock-liste{overflow-y:auto;padding:.4rem}
.dock-groupe{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);padding:.7rem .75rem .35rem}
.ligne-ami{display:flex;align-items:center;gap:.65rem;width:100%;
  background:none;border:0;text-align:left;padding:.55rem .75rem;
  border-radius:.85rem;cursor:pointer;color:var(--ink)}
.ligne-ami:hover{background:var(--soft)}
.ami-pastille{position:relative;width:34px;height:34px;border-radius:50%;
  flex:none;display:grid;place-items:center;color:#fff;font-family:var(--mono);
  font-size:.72rem;font-weight:700;
  background:linear-gradient(310deg,var(--amber-2),var(--amber))}
.ami-pastille::after{content:"";position:absolute;right:-1px;bottom:-1px;
  width:11px;height:11px;border-radius:50%;background:var(--muted);
  box-shadow:0 0 0 2px #fff}
html[data-theme="sombre"] .ami-pastille::after{box-shadow:0 0 0 2px var(--surface)}
.ligne-ami.enligne .ami-pastille::after{background:var(--ok)}
.ami-nom{font-weight:700;font-size:.88rem;line-height:1.2;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ami-etat{color:var(--muted);font-size:.76rem;margin-top:.1rem;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ami-non-lu{margin-left:auto;flex:none;background:var(--amber);color:#3A1A10;
  border-radius:50rem;font-family:var(--mono);font-size:.64rem;font-weight:700;
  padding:.08rem .4rem}

.dock-pied{padding:.7rem 1rem .9rem;border-top:1px solid var(--line)}
.dock-salon{display:flex;align-items:center;justify-content:center;gap:.5rem;
  width:100%;border:1px dashed var(--line);border-radius:.9rem;
  background:var(--soft);color:var(--ink);font-weight:700;font-size:.86rem;
  padding:.6rem;cursor:pointer}
.dock-salon:hover{border-color:var(--amber);color:var(--amber-2)}

.dock-verrou{padding:1.1rem 1rem 1.2rem;text-align:center}
.dock-verrou i{font-size:1.4rem;color:var(--amber-2)}
.dock-verrou p{font-size:.86rem;color:var(--muted);margin:.6rem 0 .9rem;
  line-height:1.5}

.fils{position:fixed;left:1.1rem;bottom:1.1rem;z-index:1049;
  display:flex;align-items:flex-end;gap:.7rem;pointer-events:none}

.fil{width:300px;height:400px;background:#fff;border:1px solid var(--line);
  border-radius:1.25rem;box-shadow:var(--sh-lg);overflow:hidden;
  display:flex;flex-direction:column;pointer-events:auto;
  transition:width .18s ease, height .18s ease}
.fil.grand{width:min(520px, calc(100vw - 24rem));
  height:min(680px, calc(100dvh - 4rem))}
html[data-theme="sombre"] .fil{background:var(--surface)}
.fil-tete{display:flex;align-items:center;gap:.6rem;padding:.7rem .85rem;
  border-bottom:1px solid var(--line)}
.fil-tete .ami-pastille{width:30px;height:30px;font-size:.66rem}
.fil-corps{flex:1;overflow-y:auto;padding:.9rem .85rem;display:flex;
  flex-direction:column;gap:.55rem}

.bulle{flex:0 0 auto;max-width:80%;padding:.5rem .8rem;border-radius:1rem;
  font-size:.86rem;line-height:1.45;overflow-wrap:anywhere}
.bulle.eux{align-self:flex-start;background:var(--soft);
  border-bottom-left-radius:.35rem}
.bulle.moi{align-self:flex-end;background:var(--amber-soft);color:var(--ink);
  border-bottom-right-radius:.35rem}
.bulle .quand{display:block;font-family:var(--mono);font-size:.62rem;
  color:var(--muted);margin-top:.25rem}
.bulle-ctx{flex:0 0 auto;align-self:stretch;border:1px dashed var(--amber);
  border-radius:.9rem;padding:.55rem .7rem;font-size:.8rem;background:var(--amber-soft)}
.bulle-ctx b{font-family:var(--mono);font-size:.76rem}
.fil-pied{border-top:1px solid var(--line);padding:.6rem .7rem;
  display:flex;gap:.45rem;align-items:center}
.fil-pied input{flex:1;min-width:0;min-height:36px;font-size:.86rem;
  border:1px solid var(--line);border-radius:50rem;padding:.35rem .8rem;
  background:var(--soft);color:var(--ink)}
.fil-pied input:focus{outline:none;border-color:var(--line);box-shadow:none}
.fil-joindre,.fil-envoi{flex:none;width:36px;height:36px;border-radius:50%;
  border:1px solid var(--line);background:var(--soft);color:var(--muted);
  cursor:pointer;font-size:.85rem}
.fil-joindre:hover{color:var(--amber-2);border-color:var(--amber)}
.fil-envoi{border:0;background:linear-gradient(310deg,var(--amber-2),var(--amber));
  color:#fff}

.maquette-note{font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--amber-2);background:var(--amber-soft);
  text-align:center;padding:.3rem}

@media (max-width:575.98px){
  .dock{left:.8rem;bottom:.8rem}
  .dock-panneau{width:calc(100vw - 1.6rem)}

  .fils{position:fixed;inset:0;left:0 !important;right:0 !important;
    z-index:1060;display:none;align-items:stretch;gap:0}
  
  .dock-onglet span.mot{display:none}
  
  #filTaille{display:none}
  .fil.grand{width:100%;height:100dvh}
  .fils.ouvert{display:flex}
  .fil{width:100%;height:100%;border:0;border-radius:0;box-shadow:none;
    
    height:100dvh}
  .fil-corps{padding:1rem}
  
  .fil-pied{padding:.65rem .7rem calc(.65rem + env(safe-area-inset-bottom))}
  .fil-pied input{min-height:44px}
  .fil-joindre,.fil-envoi{width:44px;height:44px}
  .dock.masque{display:none !important}
}

.demande{display:flex;align-items:center;gap:.6rem;padding:.55rem .75rem}
.mini-ok,.mini-non{flex:none;width:30px;height:30px;border-radius:50%;
  border:1px solid var(--line);background:var(--soft);cursor:pointer;
  font-size:.8rem;color:var(--muted)}
.mini-ok:hover{color:#fff;background:var(--ok);border-color:var(--ok)}
.mini-non:hover{color:#fff;background:#B42318;border-color:#B42318}
.dock-info{font-size:.82rem;padding:.6rem 1rem;line-height:1.45}
.dock-info.ok{background:var(--amber-soft);color:var(--amber-2)}
.dock-info.ko{background:#FDECEC;color:#B42318}
html[data-theme="sombre"] .dock-info.ko{background:rgba(240,138,128,.14);color:#F08A80}
.fil-joindre.actif{color:#fff;background:var(--amber);border-color:var(--amber)}
.fil-joindre:disabled{cursor:default}
.dock-salon .ami-non-lu{margin-left:.4rem}

.dock-actions{display:flex;align-items:center;gap:.15rem;flex:none}
.dock-fermer.muet{color:var(--line)}
.dock-fermer.muet:hover{color:var(--muted)}

.pj-image{display:block;margin:-.2rem -.5rem .45rem;border-radius:.75rem;
  overflow:hidden;line-height:0;background:rgba(0,0,0,.18);position:relative}
.pj-image img{width:100%;max-height:280px;min-height:90px;object-fit:contain;
  display:block}
.pj-image::after{content:"\f00e";font-family:"Font Awesome 6 Free";font-weight:900;
  position:absolute;right:.5rem;bottom:.5rem;font-size:.8rem;color:#fff;
  background:rgba(0,0,0,.55);border-radius:50rem;padding:.25rem .45rem;
  opacity:0;transition:opacity .16s ease}
.pj-image:hover::after{opacity:1}

.bulle.media{max-width:96%;padding:.35rem .5rem .5rem}
.pj-doc{display:flex;align-items:center;gap:.7rem;text-decoration:none;
  color:inherit;background:rgba(0,0,0,.06);border-radius:.75rem;
  padding:.65rem .75rem;margin:-.2rem -.5rem .45rem;font-size:.82rem;
  line-height:1.35}
html[data-theme="sombre"] .pj-doc{background:rgba(255,255,255,.07)}
.pj-doc:hover{color:inherit;outline:1px solid var(--amber)}
.pj-doc i{font-size:1.4rem;color:var(--amber-2);flex:none}
.pj-doc b{word-break:break-all}

.coches{margin-left:.35rem;font-size:.68rem;opacity:.6}
.coches.lu{color:var(--amber-2);opacity:1}

.dock-note{font-size:.8rem;color:var(--muted);line-height:1.5}
.dock-note a{color:var(--amber-2)}

.visio{position:fixed;inset:0;z-index:1080;background:rgba(10,12,16,.92);
  display:none;flex-direction:column}
.visio.ouverte{display:flex}
.visio-tete{display:flex;align-items:center;gap:.8rem;padding:.8rem 1rem;
  color:#fff;flex:none}
.visio-nom{font-weight:700;font-size:.9rem;flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.visio-tete a,.visio-tete button{background:rgba(255,255,255,.12);border:0;
  color:#fff;border-radius:50rem;width:40px;height:40px;flex:none;cursor:pointer;
  display:grid;place-items:center;text-decoration:none;font-size:.95rem}
.visio-tete a:hover,.visio-tete button:hover{background:rgba(255,255,255,.25);
  color:#fff}

.visio-corps{flex:1;min-height:0;min-width:0;display:flex;
  align-items:center;justify-content:center;padding:0 1rem 1rem;
  overflow:auto}
.visio-corps img{max-width:100%;max-height:calc(100dvh - 6.5rem);
  width:auto;height:auto;object-fit:contain;border-radius:.5rem}
.visio-corps iframe{width:100%;height:calc(100dvh - 6.5rem);border:0;
  border-radius:.5rem;background:#fff}

.pj-image,.pj-doc{cursor:pointer}
.pj-image:focus-visible,.pj-doc:focus-visible{outline:2px solid var(--amber);
  outline-offset:2px}
.pj-ouvrir{color:var(--amber-2);font-weight:600}

.ligne-ami.enligne .ami-etat{color:var(--ok)}
.fil-tete .ami-etat.vert{color:var(--ok)}

.fil-tete.enligne .ami-pastille::after{background:var(--ok)}

.fil-tete.salon .ami-pastille::after{display:none}

.fil-chrono{font-family:var(--mono);font-size:.78rem;color:#B42318;
  font-weight:700;min-width:2.6rem;text-align:center}
html[data-theme="sombre"] .fil-chrono{color:#F08A80}
.fil-joindre.enregistre{background:#B42318;color:#fff;
  animation:vocal-pouls 1.4s ease-in-out infinite}
@keyframes vocal-pouls{0%,100%{box-shadow:0 0 0 0 rgba(180,35,24,.5)}
  50%{box-shadow:0 0 0 7px rgba(180,35,24,0)}}
@media (prefers-reduced-motion:reduce){.fil-joindre.enregistre{animation:none}}

.pj-audio{display:block}
.pj-audio audio{width:100%;min-width:210px;height:40px;display:block}
.bulle.vocal{max-width:96%;padding:.4rem .5rem .35rem}
.bulle.vocal .quand{padding:0 .3rem}

.fil{width:380px;height:520px}
.fil.grand{width:min(600px, calc(100vw - 24rem));height:min(760px, 82vh)}

.fil-pied{flex-wrap:wrap;gap:.45rem;padding:.6rem .7rem}
.fil-pied input{order:-1;flex:1 1 100%;min-height:40px}

.fil-corps{gap:.4rem;padding:1rem .9rem}

.bulle.suite{margin-top:-.15rem}
.bulle.suite .quand{display:none}

.jour-sep{align-self:center;font-family:var(--mono);font-size:.62rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  padding:.6rem 0 .35rem;display:flex;align-items:center;gap:.6rem;
  width:100%;justify-content:center}
.jour-sep::before,.jour-sep::after{content:"";flex:1;height:1px;
  background:var(--line);max-width:4.5rem}