Screen Layout

┌──────────────────────────────────────────────────────────┐
│  SIDEBAR (left)           │     MAIN CHAT AREA           │
│                           │                              │
│  [≡] Chats    [+] [←]    │  (messages appear here)      │
│                           │                              │
│  📊 Personal Database     │  User messages → right side  │
│  📁 Files and artifacts   │  AI responses  → left side   │
│                           │                              │
│  Search chats...          │                              │
│                           │                              │
│  Conversation 1           │                              │
│  Conversation 2           │                              │
│  Conversation 3           │                              │
│  ...                      │                              │
│                           │                              │
│                           ├──────────────────────────────│
│  [Avatar] Your Name       │  [📎] [🎤] Model ▾  [Toolkit] [↑] │
│  [Manage Account]         │  What would you like to do?  │
└──────────────────────────────────────────────────────────┘

Sidebar Buttons (Left Panel)

Top Row

Button	Icon	Action
Hamburger menu	≡ (three lines)	Opens menu: "New Conversation", "Delete Multiple Chats"
New Conversation	+ (plus sign)	Creates a new conversation
Collapse sidebar	← (left arrow)	Collapses the sidebar to icons only

Feature Buttons (below top row)

Button	Label	What it opens
📊 Personal Database	"Personal Database"	Opens a right-side panel showing all your database tables. You can browse tables, view rows, sort, and search data visually.
📁 Files and artifacts	"Files and artifacts"	Opens a right-side panel showing all your uploaded files and generated artifacts, organized by conversation.

Conversation List (middle)

• Search bar: Type to filter conversations by title or content
• Tag chips: Click tags to filter conversations by topic
• Conversation items: Click any conversation to switch to it. Right-click (or long-press on mobile) for options: Rename, Pin, Delete.

Bottom Section (user profile)

Element	Action
Your avatar + name	Shows your profile identity
"Manage Account" button	Opens a menu with these options:

Manage Account Menu Options

Menu Item	What it does
Manage Profile	Opens your profile editor (name, email, avatar)
Edit Fonts and Colors	Opens the Theme Editor panel on the right — change light/dark mode, accent color, font family, font size
AI Provider	Opens AI Provider selector — choose between Claude, OpenAI, or Gemini as your default model
Billing & Usage	Opens the billing page for subscription and usage details
Author Dashboard	Opens the Author Dashboard for publishing tools
Tesla Mode	Toggles input position to top of screen (instead of bottom)
Logout	Signs you out

Chat Input Area (Bottom)

Element	Icon/Label	Action
Attach files	📎 (paperclip icon)	Upload documents, images, or other files
Voice input	🎤 (microphone icon)	Start voice recording to speak your message
Model selector	Shows current model name (e.g., "Claude Sonnet 4.5")	Click to change AI model or switch to Auto mode
Toolkit button	"Toolkit" (with grid icon)	Opens the AI Toolkit — browse, search, and manage your imported tools/functions
Send button	↑ (up arrow)	Send your message

Right-Side Panels (Drawers)

When you click certain buttons, a panel slides in from the right side of the screen. These include:

Panel	Opened by	Contents
Personal Database	📊 button in sidebar	Table list, data viewer with sorting/filtering, row counts
Files and Artifacts	📁 button in sidebar	Uploaded files and generated documents, grouped by conversation
AI Toolkit / Marketplace	"Toolkit" button in chat input	Browse available tools, search by name, import new APIs, edit function settings
Theme Editor	"Edit Fonts and Colors" in Manage Account menu	Light/dark toggle, accent color picker, font family selector, font size
AI Provider	"AI Provider" in Manage Account menu	Choose Claude, OpenAI, or Gemini
Profile Editor	"Manage Profile" in Manage Account menu	Edit your display name, email, and avatar

Mobile Layout

On mobile devices (screen width < 768px):

• The sidebar is hidden by default — swipe right or tap the hamburger icon to show it
• Right-side panels open as full-screen overlays
• The chat input stays anchored at the bottom
• Long-press on conversations for context menu options

Collapsed Sidebar

When the sidebar is collapsed (click ← arrow):

• Only icons are shown: 📊 (database), 📁 (files)
• Hover over icons to see tooltips
• Click the → arrow to expand again

How to Access Common Features

"Where is my personal database?"

Click the 📊 Personal Database button in the left sidebar. A panel opens on the right showing all your tables. Click any table to browse its data.

"How do I change the theme / colors?"

Click Manage Account at the bottom of the sidebar, then select Edit Fonts and Colors. The Theme Editor panel opens on the right where you can switch between light and dark mode, pick an accent color, and change fonts.

"How do I switch AI models?"

Click the model name shown in the bottom input area (e.g., "Claude Sonnet 4.5"). A dropdown appears where you can choose a different model or select "Auto" to let the system choose.

"Where are my files?"

Click the 📁 Files and artifacts button in the left sidebar. A panel opens showing all files you've uploaded and documents the AI has generated, organized by conversation.

"How do I import a tool / API?"

Click the Toolkit button in the bottom input area. The AI Toolkit panel opens on the right. You can search for tools, browse by category, or type in chat: "Import the [service name] API".

"How do I manage my account / profile?"

Click Manage Account at the bottom of the sidebar. Choose Manage Profile to edit your name, email, or avatar.

"Where do I find my billing / subscription?"

Click Manage Account at the bottom of the sidebar, then select Billing & Usage.

"How do I create a new conversation?"

Click the + button at the top of the sidebar, or use the keyboard shortcut.

"How do I delete a conversation?"

Right-click (desktop) or long-press (mobile) on any conversation in the sidebar list, then select Delete.