{"id":"f0086215-4d3a-4e00-9148-4b0d38e916fd","shortId":"pzSQkd","kind":"skill","title":"dashboard","tagline":"Admin / analytics dashboard in a single HTML file. Fixed left sidebar,\ntop bar with user/search, main grid of KPI cards and one or two charts.\nUse when the brief asks for a \"dashboard\", \"admin\", \"analytics\", or\n\"control panel\" screen.","description":"# Dashboard Skill\n\nProduce a single-screen admin / analytics dashboard.\n\n## Workflow\n\n1. **Read the active DESIGN.md** (injected above). Colors, typography, spacing,\n component styling all come from it. Do not invent new tokens.\n2. **Classify** what the dashboard monitors (sales, traffic, usage, incidents,\n ops, etc.) from the brief. Generate specific, plausible metric names and\n values — no \"Metric A / Metric B\" placeholders.\n3. **Lay out** the required regions:\n - **Left sidebar** (220–260px): brand mark at top, 6–8 nav links with\n icons, active state uses the DS accent.\n - **Top bar**: page title on the left, search input + user avatar / status\n on the right.\n - **Main**:\n - Row 1: 3–4 KPI cards (label + big number + delta vs. prior period).\n - Row 2: one primary chart (full width or 2/3) — render as an inline SVG\n line / bar / area chart drawn from real-looking numbers.\n - Row 3: one secondary chart or table (recent events, top items, etc.).\n4. **Write** one self-contained HTML document:\n - `` through ``, CSS in one inline `