feat: add React frontend with login, signup, dashboard pages and admin seeding support

PROJECT_MGMT/design_system.md

@@ -0,0 +1,74 @@
+# Design System Specification
+
+## Core Principles
+
+1. **Function over flash** — No decorative elements
+2. **Typography-first hierarchy** — Size, weight, spacing do the work
+3. **Semantic colors only** — Colors indicate meaning, not decoration
+4. **Selective interactivity** — Hover effects only on interactive elements
+
+---
+
+## Color System
+
+### Duo-Tone Base
+
+| Token | Light Mode | Dark Mode | Usage |
+|-------|------------|-----------|-------|
+| `--bg-primary` | `#ffffff` | `#0f0f10` | Page background |
+| `--bg-secondary` | `#f4f4f5` | `#18181b` | Cards, panels |
+| `--text-primary` | `#09090b` | `#fafafa` | Headings, body |
+| `--text-secondary` | `#71717a` | `#a1a1aa` | Labels, hints |
+| `--border` | `#e4e4e7` | `#27272a` | Dividers, inputs |
+| `--accent` | `#0d9488` | `#14b8a6` | Primary actions |
+
+### Semantic Indicators
+
+| Token | Value | Usage |
+|-------|-------|-------|
+| `--indicator-normal` | `#22c55e` | In range, healthy |
+| `--indicator-warning` | `#eab308` | Borderline, attention |
+| `--indicator-critical` | `#ef4444` | Out of range, urgent |
+| `--indicator-info` | `#3b82f6` | Neutral info |
+
+---
+
+## Typography
+
+- **Font**: System stack (`-apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif`)
+- **Scale**: 12 / 14 / 16 / 18 / 24 / 32px
+- **Weights**: 400 (regular), 500 (medium), 600 (semibold)
+
+---
+
+## Restrictions
+
+- ❌ No gradients
+- ❌ No shadows deeper than `0 1px 2px`
+- ❌ No decorative animations
+- ❌ No hover effects on non-interactive elements (table rows, cards)
+- ✅ Transitions only for state changes (expand/collapse, loading)
+
+---
+
+## Component Guidelines
+
+### Buttons
+- Primary: filled with `--accent`
+- Secondary: outlined
+- Hover: darken 10%, no scale/glow
+
+### Tables
+- No row hover
+- Alternating bg optional (use `--bg-secondary`)
+- Color indicators in dedicated status column
+
+### Cards
+- Flat, bordered
+- No shadow
+- Consistent padding (16px)
+
+### Forms
+- Label above input
+- Border on focus only
+- Error states use `--indicator-critical`