Build interactive team dashboards

Generate multi-tab team management dashboard with interactions

Team dashboards requiring real-time interactivity (tab switching, zoom, dark mode, export) while maintaining design consistency via CSS variables.

• · DESIGN.md color, typography, spacing, component tokens
• · assets/template.html seed file (never blank)
• · plausible team member data (names, IDs, roles, departments, dates, percentages)
• · team details with role distribution
• · activity log with entries

• · self-contained HTML dashboard (no external runtime)
• · three tabbed views: Team Members, Team Details, Activity Log
• · animated bar chart on Details tab with easing
• · click-to-zoom panels with Esc-to-restore
• · dark mode toggle with CSS variable re-derive
• · CSV export of team table with Workflow column
• · chart hover tooltips with precise label + value
• · hash sync for tab navigation (#members | #details | #activity)

• · assets/template.html available as starting seed
• · DESIGN.md injected with token mappings to CSS variables
• · references/checklist.md reviewed before output

• · Starting from blank instead of template.html (breaks CSS baseline)
• · Multiple tabs visible simultaneously (should be one at a time)
• · Placeholder data (Member A / Metric B instead of plausible names)
• · Chart doesn't animate on first Details tab reveal
• · Hover tooltips lack precision (missing label or value)
• · Dark mode toggle doesn't re-derive colors from CSS variables
• · CSV export missing Workflow column
• · Hash navigation doesn't sync (#members not working)

• · Explicit resource map (SKILL.md, template.html, checklist.md, example.html)
• · Six required interactions named: tab switching, animated chart, hover tooltips, zoom, dark mode, CSV export
• · Hash sync for navigation (reproducible state)
• · references/checklist.md P0/P1/P2 gates
• · Template-first workflow (never blank)
• · Plausible data requirement (no placeholder values)
• · Easing animation on bar chart first reveal