# VoiceButton

The oxblood microphone — the P2 `voice-pill` and the product's signature control. Three sizes for three homes: 36px in the chrome, 40px in the reply well, 56px full-width on the mobile bottom bar.

```html
<button class="postie-voice postie-voice--chrome" aria-label="Hold to speak"><svg class="postie-voice__icon" viewBox="0 0 24 24"><path d="M12 3v10"/><path d="M8 9a4 4 0 0 0 8 0"/><path d="M12 17v4"/></svg></button>
<button class="postie-voice postie-voice--mobile"><svg class="postie-voice__icon" …></svg>Hold to speak</button>
```

**When.** Exactly one per surface. On desktop it lives in the chrome-bar; a second, smaller one is allowed in the reply well because dictating a reply is a different act. On mobile it is the bottom bar's primary and the only full-width oxblood object on the screen.

**Listening.** The icon becomes a solid dot. That is the entire state change — no pulse, no waveform, no ring (brief: motion gentle, no bounce; "no spinner you ever notice").

**Never.**
- Never recolour it per theme or per ground; it is the accent fill with `#F6EDED` ink everywhere.
- Never a waveform, a glowing ring, or a pulsing halo (never soft-glow; never wellness-serene).
- Never beside a primary Button of the same size — two oxblood pills in one row is two primaries.
- Never a filled microphone glyph; the icon is a single-weight line (brief: line icons, one weight).
