.composer { transition: width 180ms ease, border-radius 180ms ease, padding 180ms ease; }
.composer #prompt { max-height:min(280px,35vh); overflow-y:hidden; resize:none; scrollbar-width:thin; }
.composer-compact,.composer-bottom { display:none; }
.image-mentions { max-height:min(220px,28vh); overflow-y:auto; padding:6px; margin:6px 0; border:1px solid #494052; border-radius:12px; background:#211e27; }
.image-mentions[hidden] { display:none; }
.mention-option { display:flex; align-items:center; gap:10px; width:100%; padding:7px 9px; text-align:left; border-radius:8px; }
.mention-option[aria-selected="true"],.mention-option:hover { background:#3b314b; }
.mention-option img { width:36px; height:36px; object-fit:cover; border-radius:6px; flex-shrink:0; }
.mention-option span { font-size:12px; white-space:nowrap; }
.mention-option small { color:#a69bb3; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mention-empty { color:#b7adbf; padding:12px; font-size:12px; }
.composer.is-compact { width:min(720px,calc(100vw - 270px)); padding:12px 16px; border-radius:26px; overflow:visible; }
.composer.is-compact > :not(.composer-compact):not(.composer-bottom) { display:none!important; }
.composer.is-compact .composer-compact { display:flex; align-items:center; gap:14px; width:100%; min-height:38px; padding:0; color:#b8b2c2; text-align:left; }
.composer-compact > span:first-child { font-size:24px; font-weight:300; }
.composer-compact-text { flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:13px; }
.composer-expand-icon { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#3b3547; color:#d7c5ef; font-size:20px; }
.composer.is-compact .composer-bottom { display:block; position:absolute; right:8px; bottom:calc(100% + 12px); padding:7px 12px; border-radius:18px; background:#29252f; color:#c5bdce; font-size:11px; }
@media(max-width:1000px) { .composer.is-compact { width:calc(100vw - 220px); } }
@media(max-width:760px) { .composer.is-compact { width:calc(100vw - 96px); padding:9px 12px; border-radius:22px; } }
@media(prefers-reduced-motion:reduce) { .composer { transition:none; } }
