## Design Context ### Users Developers and power users who manage multiple AI accounts (Google Gemini, Claude) through a desktop Electron app. They use IDEs like Cursor, OpenCode, and Windsurf. They need to monitor token usage across accounts in real-time to avoid quota exhaustion. ### Brand Personality - **Professional**: Clean, precise, no clutter - **Technical**: Data-dense but readable, developer-friendly - **Efficient**: Information at a glance, minimal clicks - 3 words: "precise", "technical", "focused" ### Aesthetic Direction - Dark mode primary (this is a developer tool used for long sessions) - Deep navy/slate backgrounds, not pure black - Sharp accent colors for data visualization (subtle blues, teals, amber for warnings) - High information density without visual noise - Monospace for numbers/data, clean sans-serif for UI chrome - No gradients on text, no glassmorphism, no rounded-everything ### Design Principles 1. Data first — charts and numbers are the heroes 2. Every pixel earns its place — no decorative elements 3. Density over whitespace — developers want to see everything 4. Motion only for state changes — no gratuitous animations 5. Consistent with shadcn/ui + Tailwind system already in place