main character

textarea · 3 states
source: static/css/components.css

Textarea

Where entries are written: the input's well, many lines tall, in the 17px body serif at 1.6. Write's box grows with what you type, up to most of the window, then scrolls; the life summary editor fills the space it has. Never resizable by hand.

States

Shown at write's resting height, 6.6rem. Focus is the input's: the border turns --border-accent, no ring. The chat bar's textarea is the same element with the well taken away: see chat bar.

Anatomy
textarea               rows=3, autosized by write.js
  #entry-text          write: min 6.6rem, max 85vh, then scrolls
  #seed-editor-text    life summary editor: fills the column
well
--bg-muted, --border-default hairline, --radius-lg, padding .7rem .9rem. resize: none.
text
Inherited body serif, --text-default, line-height 1.6; the placeholder in --text-muted at 70%.
focus
The border turns --border-accent.
Tokens

Fill --bg-muted; rule --border-default, focus --border-accent; text --text-default, placeholder --text-muted; radius --radius-lg. In Figma: Textarea, state, with a value text property; resize the instance for a taller box.