Soften chat panel shadows

[DexterStorey]

Motivation

• Remove the dark inner rectangle and harsh shadows around the chat transcript and input panels for a cleaner UI.
• Align panel background opacity and shadow tones with the Lilac surface treatment for better visual consistency.
• Improve bubble spacing and radii to make the transcript feel lighter and more modern.
• Keep changes small, deterministic, and purely visual to avoid adding technical debt.

Description

• Softened transcript container and input panel shadows and adjusted their background opacities in src/app/(app)/ToggleRealtime.tsx.
• Updated rounded radii, padding, and spacing for transcript bubbles and input textarea to improve layout and readability.
• Replaced heavy shadow utilities with subtler shadow-[...] values and added overscroll-contain / scrollbarGutter for scroll stability.
• Kept all behavioral logic intact and limited changes to styling and classNames to minimize risk.

Testing

• Ran bun run format and fixed formatting via biome (succeeded).
• Ran bun run check (biome) and it completed with no remaining fixes (succeeded).
• Ran bun x tsc --noEmit to verify TypeScript types (succeeded).
• Ran bun run build (Next.js production build) and the app compiled successfully with non-blocking metadata warnings (succeeded).

---

Codex Task

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
lilac	Ready	Preview, Comment	Dec 26, 2025 5:15am