Discord

# Discord Design System

## Visual Theme & Atmosphere
Playful community hub. The signature blurple (#5865F2) makes Discord instantly recognizable. Dark gray surfaces (#313338) reduce eye strain during long sessions. Sidebar navigation with channel lists. Chat bubbles are optional — messages flow naturally.

## Color Palette & Roles
| Token | Hex | Role |
|-------|-----|------|
| Primary | #5865F2 | Blurple brand |
| Secondary | #4752C4 | Blurple hover |
| Accent | #EB459E | Nitro pink |
| Background | #313338 | Main chat bg |
| Surface | #2B2D31 | Sidebar, panels |
| Text | #DBDEE1 | Primary text |
| Muted | #949BA4 | Timestamps, metadata |
| Border | #3F4147 | Subtle dividers |

## Typography Rules
- **Font**: gg sans (custom), Noto Sans fallback
- **Base Size**: 16px
- **Line Height**: 1.375

## Component Stylings
- **Sidebar**: Icon + text list, collapsible categories
- **Chat**: Flat message list, no bubbles in server view
- **Buttons**: Blurple primary, gray secondary, pill-shaped

## Agent Prompt Guide
Dark gray background, blurple accent, sidebar navigation, flat chat interface, rounded avatars, hover reveal actions.