/* compose.css — every typing box is one box (owner ruling, 13 Sep 2026).
   Loaded by every world after tokens.css. static/js/grow.js does the growing; this
   file is the SHAPE, and it is the same shape everywhere: one line to start, a cap,
   scrolling past the cap, no drag handle, and 16px — the size under which iOS zooms
   the whole page the moment a box is focused. A world keeps only the LOOK of its
   boxes (surface, border, radius, padding, shadow); anything about size lives here.
   The caps are tokens: --compose-max for a message beside its send button,
   --textarea-max for anything longer-form. */
textarea{
  display:block; inline-size:100%; box-sizing:border-box;
  font:inherit; font-size:var(--text-body); line-height:var(--leading-normal); color:inherit;
  resize:none; overflow-x:hidden; overflow-y:hidden; overscroll-behavior:contain; scrollbar-width:thin;
  min-block-size:var(--compose-min); max-block-size:var(--textarea-max);
  text-align:start;
}
/* past the cap it scrolls, and only then does it show a scrollbar */
textarea.at-cap{overflow-y:auto}
/* a message composer sits beside its send button: one line, six at most; the button
   stays on the last line as the box grows upward */
.ncomposer textarea,.composerbar textarea,textarea[data-compose="message"]{flex:1 1 auto; max-block-size:var(--compose-max)}
.ncomposer,.composerbar{align-items:flex-end}
textarea::placeholder{color:var(--ink-3)}
@media (prefers-reduced-motion:no-preference){ textarea{transition:block-size var(--d-press) var(--ease)} }
/* THE KEYBOARD NEVER COVERS THE BOX. grow.js sets --vvh to the visual viewport's
   height while a field is focused and the keyboard is up; the frame is that tall. */
html.kb-up,html.kb-up body{block-size:var(--vvh)}