refactor(viz-platform): extract skills and slim commands

Extract shared knowledge from 10 commands into 7 reusable skills:
- mcp-tools-reference.md: All viz-platform MCP tool signatures
- theming-system.md: Theme tokens, CSS variables, color palettes
- accessibility-rules.md: WCAG contrast, color-blind safe palettes
- dmc-components.md: DMC categories, validation, common props
- responsive-design.md: Breakpoints, mobile-first, grid config
- chart-types.md: Plotly chart types, export formats, resolution
- layout-templates.md: Dashboard templates, filter types

All commands now reference skills via "Skills to Load" section.
Commands reduced from 1396 lines total to 427 lines (69% reduction).

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

plugins/viz-platform/skills/dmc-components.md

@@ -0,0 +1,97 @@
+# Dash Mantine Components Reference
+
+## Component Categories
+
+| Category | Components |
+|----------|------------|
+| `inputs` | Button, TextInput, Select, Checkbox, Radio, Switch, Slider, etc. |
+| `navigation` | NavLink, Tabs, Breadcrumbs, Pagination, Stepper |
+| `feedback` | Alert, Notification, Progress, Loader, Skeleton |
+| `overlays` | Modal, Drawer, Tooltip, Popover, Menu |
+| `typography` | Text, Title, Code, Blockquote, List |
+| `layout` | Container, Grid, Stack, Group, Space, Divider |
+| `data` | Table, Badge, Card, Paper, Timeline |
+
+## Common Props
+
+Most components share these props:
+
+| Prop | Type | Description |
+|------|------|-------------|
+| `size` | xs, sm, md, lg, xl | Component size |
+| `radius` | xs, sm, md, lg, xl | Border radius |
+| `color` | string | Theme color name |
+| `variant` | string | Style variant |
+| `disabled` | boolean | Disable interaction |
+
+## Component Validation
+
+Why validation matters:
+- Prevents hallucinated prop names
+- Validates enum values
+- Catches typos before runtime
+- Documents available options
+
+### Validation Response
+
+```json
+{
+  "valid": true,
+  "errors": [],
+  "warnings": []
+}
+```
+
+With errors:
+```json
+{
+  "valid": false,
+  "errors": [
+    "Invalid prop 'colour' for Button. Did you mean 'color'?",
+    "Prop 'size' expects one of ['xs', 'sm', 'md', 'lg', 'xl'], got 'huge'"
+  ],
+  "warnings": [
+    "Prop 'fullwidth' should be 'fullWidth' (camelCase)"
+  ]
+}
+```
+
+## Grid System
+
+DMC Grid with responsive spans:
+
+```python
+dmc.Grid(
+    children=[
+        dmc.GridCol(
+            children=[chart],
+            span={"base": 12, "sm": 6, "lg": 4}
+        )
+    ],
+    gutter="md"
+)
+```
+
+## Button Example
+
+```json
+{
+  "component": "Button",
+  "props": {
+    "variant": {
+      "type": "string",
+      "enum": ["filled", "outline", "light", "subtle", "default", "gradient"],
+      "default": "filled"
+    },
+    "color": {
+      "type": "string",
+      "default": "blue"
+    },
+    "size": {
+      "type": "string",
+      "enum": ["xs", "sm", "md", "lg", "xl"],
+      "default": "sm"
+    }
+  }
+}
+```