/* A single textarea expands downward; its top edge and typing position stay put. */
.composer-inline .composer-form { padding: 14px 16px; }
.composer-inline .composer-entry {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
}
.composer-inline .composer-entry > .avatar { margin-top: 7px; }
.composer-inline .composer-editor { min-width: 0; }
.composer-inline .composer-entry textarea {
  display: block;
  width: 100%;
  height: 160px;
  min-height: 0;
  margin: 0;
  padding: 11px 14px;
  border: 1px solid #d9e4f3;
  border-radius: 12px;
  background: #f5f8fd;
  color: var(--ink);
  font-size: 16px;
  line-height: 24px;
  resize: none;
  transition: height 260ms cubic-bezier(.22, 1, .36, 1), background-color 180ms, border-color 180ms, box-shadow 180ms;
}
.composer-inline .composer-entry textarea::placeholder { color: #5f6e86; opacity: 1; }
.composer-inline .composer-entry textarea:focus {
  outline: 0;
  border-color: #82a9f9;
  background: #fff;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 8%, transparent);
}
.composer-inline.is-enhanced:not(.is-expanded) .composer-entry textarea { height: 48px; overflow: hidden; }
.composer-inline .composer-toggle { display: none; min-height: 48px; min-width: 44px; width: 44px; padding: 0; justify-content: center; }
.composer-inline.is-enhanced .composer-toggle { display: inline-flex; }
.composer-toggle-open, .composer-toggle-close { align-items: center; justify-content: center; gap: 7px; }
.composer-toggle-open { display: inline-flex; }
.composer-toggle-close { display: none; }
.composer-toggle-open > span, .composer-toggle-close > span { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.is-expanded .composer-toggle-open { display: none; }
.is-expanded .composer-toggle-close { display: inline-flex; }
.composer-toggle-close .icon { transform: rotate(-90deg); }
.composer-inline.is-expanded .composer-toggle { background: #eef4ff; color: #2856a5; }
.composer-inline.is-expanded .composer-toggle:hover { background: #e1ecff; }
.composer-inline .composer-extras {
  display: grid;
  grid-template-rows: 1fr;
  opacity: 1;
  visibility: visible;
  transition: grid-template-rows 260ms cubic-bezier(.22, 1, .36, 1), opacity 180ms, visibility 0s;
}
.composer-inline.is-enhanced:not(.is-expanded) .composer-extras {
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  transition: grid-template-rows 260ms cubic-bezier(.22, 1, .36, 1), opacity 140ms, visibility 0s 260ms;
}
.composer-extras-clip { min-height: 0; overflow: hidden; }
.composer-inline .composer-controls { padding: 14px 0 2px 46px; }
.composer-inline .composer-tools .rich-bar { margin-bottom: 12px; }
.composer-inline .composer-title { margin-bottom: 0; font-size: 16px; font-weight: 500; }
.composer-inline .composer-title::placeholder { color: #5f6e86; opacity: 1; }
.composer-inline .composer-row { flex-wrap: wrap; }
.composer-inline .composer-board { flex: 1 1 150px; min-width: 0; }
.composer-inline .composer-board select { width: 100%; min-height: 42px; font-size: 14px; }
.composer-inline .composer-photo, .composer-inline .composer-post { min-height: 42px; font-size: 14px; }
.composer-inline .composer-hint { color: #5f6e86; font-size: 13px; }
.composer-inline .composer-photo:focus-within { outline: 2px solid #427bf6; outline-offset: 3px; }
@media (max-width: 620px) {
  .composer-inline .composer-form { padding: 12px; }
  .composer-inline .composer-entry { grid-template-columns: 28px minmax(0, 1fr) 40px; gap: 8px; }
  .composer-inline .composer-entry > .avatar { width: 28px; height: 28px; margin-top: 10px; }
  .composer-inline .composer-toggle { min-width: 0; width: 40px; padding: 0; }
  .composer-inline .composer-entry textarea { padding-inline: 10px; height: 184px; }
  .composer-inline .composer-controls { padding-left: 0; }
  .composer-inline .composer-board { flex-basis: 100%; }
  .composer-inline .composer-board select { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .composer-inline .composer-entry textarea,
  .composer-inline .composer-extras,
  .composer-inline.is-enhanced:not(.is-expanded) .composer-extras { transition: none; }
}