#composer { display:flex; align-items:center; gap:.55em; padding:.7em .65em; border-top:1px solid #e7ecf0; background:#f7f9fa; color:#74818b; font-size:1.08em; min-height:2.35em; flex:none; }
#composer-text { flex:1; color:#2d3b44; } #mic-button { border:0; border-radius:50%; width:1.8em; height:1.8em; color:#fff; background:#9aa7b0; font-size:.8em; }
#composer.recording #mic-button { background:#e15d70; box-shadow:0 0 0 .25em #e15d7030; } #voice-wave { display:none; align-items:center; gap:2px; height:1.5em; }
#voice-popup{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);z-index:5;width:84%;padding:.55em .7em;border:1px solid #ccd8df;border-radius:.5em;background:#fffffff7;color:#263640;font-size:.72em;letter-spacing:0;box-shadow:0 4px 14px #0006;pointer-events:none}
.voice-popup-head{display:flex;justify-content:space-between;font-size:.9em;border-bottom:1px solid #e8edf0;padding-bottom:.35em}.voice-popup-head span{font-size:1.3em}.voice-popup-body{min-height:3.2em;padding:.65em .2em;font-size:1.35em;color:#263640}.voice-popup-foot{border-top:1px solid #e8edf0;padding-top:.4em;color:#238bd0}.voice-popup-foot span{float:right;background:#9aa7b0;color:white;border-radius:1em;padding:.25em .7em}
#composer.recording #voice-wave { display:flex; } #voice-wave i { width:2px; height:.45em; background:#e15d70; animation:voice-wave .6s ease-in-out infinite alternate; }
#voice-wave i:nth-child(2){animation-delay:.1s} #voice-wave i:nth-child(3){animation-delay:.2s} #voice-wave i:nth-child(4){animation-delay:.3s}
@keyframes voice-wave { to { height:1.15em; } }