:root{--nuit:#0b0910;--nuit-clair:#141020;--rose:#ffa8d4;--violet:#8b6cff;--texte:#efe9f2;--gris:#8b8397;--gris-fonce:#3a3348}
*{box-sizing:border-box}html,body{height:100%;margin:0}[hidden]{display:none!important}
body{background:var(--nuit);color:var(--texte);font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:flex;flex-direction:column}
header{display:flex;gap:12px;align-items:center;padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top));border-bottom:1px solid var(--gris-fonce);background:var(--nuit-clair)}
.visage{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--rose),var(--violet));flex:none}
.nom{font-weight:600}.etat{font-size:12.5px;color:var(--gris)}.etat.vivant{color:#8fe3a8}
main{flex:1;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px}
.m{max-width:86%;padding:9px 13px;border-radius:16px;white-space:pre-wrap;overflow-wrap:anywhere}
.lui{align-self:flex-end;background:linear-gradient(135deg,rgba(255,168,212,.22),rgba(139,108,255,.22));border-bottom-right-radius:5px}
.elle{align-self:flex-start;background:var(--nuit-clair);border:1px solid var(--gris-fonce);border-bottom-left-radius:5px}
.alerte{align-self:center;max-width:94%;font-size:13px;border:1px solid rgba(255,190,90,.5);background:rgba(255,190,90,.08)}
.statut{font-size:11.5px;color:var(--gris);margin-top:3px;text-align:right}
.pense{align-self:flex-start;color:var(--gris);font-size:13px;font-style:italic}
footer{display:flex;gap:8px;padding:10px 12px;padding-bottom:max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--gris-fonce);background:var(--nuit-clair)}
textarea{flex:1;resize:none;border:1px solid var(--gris-fonce);border-radius:14px;background:var(--nuit);color:var(--texte);font:inherit;padding:9px 12px;max-height:140px}
button{border:none;border-radius:14px;padding:0 16px;font:inherit;font-weight:600;background:linear-gradient(135deg,var(--rose),var(--violet));color:#20122a;cursor:pointer;min-height:42px}
button:disabled{opacity:.4}
#appairer{padding:24px 20px;display:flex;flex-direction:column;gap:12px;max-width:420px;margin:0 auto;width:100%}
#appairer h1{font-size:20px;margin:0}#appairer p{color:var(--gris);margin:0}
#appairer input{border:1px solid var(--gris-fonce);border-radius:12px;background:var(--nuit-clair);color:var(--texte);font:inherit;padding:12px;font-size:18px;letter-spacing:.12em;text-transform:uppercase}
#nomtel{letter-spacing:normal!important;text-transform:none!important;font-size:15px!important}
.erreur{color:#ff9b9b!important}
.doc{display:block;overflow:auto}.doc main{display:block;max-width:680px;margin:0 auto;padding:24px 18px}.doc a{color:var(--rose)}.doc h2{font-size:17px;margin-top:22px}