AI Chat Interface Kit

---
name: AI Chat Interface
colors:
  background: '#0d1117'
  surface: '#161b22'
  bubble-user: '#1f6feb'
  bubble-assistant: '#21262d'
  text-primary: '#e6edf3'
  text-secondary: '#8b949e'
  border: '#30363d'
  code-bg: '#0d1117'
  streaming-cursor: '#58a6ff'
typography:
  body:
    fontFamily: Inter
    fontSize: 15px
    lineHeight: '1.6'
  code:
    fontFamily: JetBrains Mono
    fontSize: 13px
rounded:
  DEFAULT: 12px
  bubble: 18px
spacing:
  base: 4px
---

## Overview

Dark, developer-oriented chat UI. Message bubbles have distinct
user/assistant colors, code blocks use a monospace well, and a
pulsing cursor indicates streaming responses. Tool-call results
render as expandable cards.

## Colors

- Background: GitHub-dark (#0d1117)
- User bubble: GitHub blue (#1f6feb)
- Assistant bubble: elevated surface (#21262d)
- Streaming cursor: bright blue (#58a6ff)
- Code blocks: darkest well (#0d1117) with border

## Typography

Inter for chat text at 15px/1.6. JetBrains Mono for code blocks
and inline code at 13px. Timestamps use mono at 11px.

## Components

- Message Bubble: rounded-2xl, max-width 70%, variant-based bg
- Code Block: header bar (language label + copy), monospace well
- Streaming Indicator: pulsing blue cursor ▍at end of text
- Tool Call Card: collapsible, icon + name header, JSON body
- Input Bar: sticky bottom, textarea with send button