design: Adopt Design OS Structure and Palette

- Created /product directory with Design OS definition files (overview, colors, etc)
- Updated tailwind.config.js to widespread Stone/Lime palette (Design OS default)
- Removed custom Linear-inspired colors in favor of standard Tailwind utilities

frontend/tailwind.config.js

@@ -1,3 +1,5 @@
+import colors from 'tailwindcss/colors';
+
 /** @type {import('tailwindcss').Config} */
 export default {
     content: [
@@ -27,72 +29,64 @@ export default {
                 "2xl": "1400px",
             },
         },
-        extend: {
-            // Linear-inspired color palette (Charcoal & Bone)
+        // Design OS Palette (Stone & Lime)
         colors: {
-                // Neutral scale (primary palette)
+            // Neutral scale (Stone = warmth + utility)
             neutral: {
-                    50: '#FAFAFA',
-                    100: '#F5F5F5',
-                    200: '#E5E5E5',
-                    300: '#D4D4D4',
-                    400: '#A3A3A3',
-                    500: '#737373',
-                    600: '#525252',
-                    700: '#404040',
-                    800: '#262626',
-                    850: '#1F1F1F',
-                    900: '#171717',
-                    950: '#0A0A0A',
+                ...colors.stone,
+                // Map legacy specifics if needed, but prefer stone-950 for blacks
+                850: '#1c1917', // stone-900ish
+                950: '#0c0a09', // stone-950
             },
-                // Accent (Linear's desaturated blue-purple)
+            // Primary Accent (Lime = fresh + technical)
             accent: {
-                    DEFAULT: '#5E6AD2',
-                    hover: '#6E7AE2',
-                    muted: 'rgba(94, 106, 210, 0.15)',
-                    foreground: '#FFFFFF',
+                ...colors.lime,
+                DEFAULT: colors.lime[500], // Was Linear Purple
+                hover: colors.lime[400],
+                muted: 'rgba(132, 204, 22, 0.15)', // Lime-500 alpha
+                foreground: colors.stone[950], // Dark text on lime
             },
             // Semantic colors
             success: {
-                    DEFAULT: '#22C55E',
-                    muted: 'rgba(34, 197, 94, 0.15)',
+                DEFAULT: colors.emerald[500],
+                muted: 'rgba(16, 185, 129, 0.15)',
                 foreground: '#FFFFFF',
             },
             warning: {
-                    DEFAULT: '#EAB308',
-                    muted: 'rgba(234, 179, 8, 0.15)',
+                DEFAULT: colors.amber[500],
+                muted: 'rgba(245, 158, 11, 0.15)',
                 foreground: '#171717',
             },
             destructive: {
-                    DEFAULT: '#EF4444',
+                DEFAULT: colors.red[500],
                 muted: 'rgba(239, 68, 68, 0.15)',
                 foreground: '#FFFFFF',
             },
-                // Legacy support (mapped to neutral)
-                border: "hsl(var(--border))",
-                input: "hsl(var(--input))",
-                ring: "hsl(var(--ring))",
-                background: "hsl(var(--background))",
-                foreground: "hsl(var(--foreground))",
+            // Mappings
+            border: colors.stone[200],
+            input: colors.stone[200],
+            ring: colors.lime[500],
+            background: colors.stone[50], // Slightly warm background
+            foreground: colors.stone[950],
             primary: {
-                    DEFAULT: "#5E6AD2", // Now accent color
-                    foreground: "#FFFFFF",
+                DEFAULT: colors.lime[500],
+                foreground: colors.stone[950],
             },
             secondary: {
-                    DEFAULT: "hsl(var(--secondary))",
-                    foreground: "hsl(var(--secondary-foreground))",
+                DEFAULT: colors.stone[100],
+                foreground: colors.stone[900],
             },
             muted: {
-                    DEFAULT: "hsl(var(--muted))",
-                    foreground: "hsl(var(--muted-foreground))",
+                DEFAULT: colors.stone[100],
+                foreground: colors.stone[500],
             },
             popover: {
-                    DEFAULT: "hsl(var(--popover))",
-                    foreground: "hsl(var(--popover-foreground))",
+                DEFAULT: "#FFFFFF",
+                foreground: colors.stone[950],
             },
             card: {
-                    DEFAULT: "hsl(var(--card))",
-                    foreground: "hsl(var(--card-foreground))",
+                DEFAULT: "#FFFFFF",
+                foreground: colors.stone[950],
             },
         },
         borderRadius: {
@@ -196,6 +190,6 @@ export default {
             'focus-destructive': '0 0 0 3px rgba(239, 68, 68, 0.25)',
         },
     },
-    },
-    plugins: [],
+},
+plugins: [],
 }

product/design-system/colors.json

@@ -0,0 +1,13 @@
+{
+    "colors": {
+        "primary": "lime",
+        "secondary": "stone",
+        "neutral": "stone",
+        "background": "white",
+        "foreground": "stone-950"
+    },
+    "typography": {
+        "sans": "Inter",
+        "mono": "JetBrains Mono"
+    }
+}

product/product-overview.md

@@ -0,0 +1,20 @@
+# CA Grow Ops Manager
+
+## Vision
+
+The CA Grow Ops Manager is a comprehensive facility management system for cannabis cultivation operations. It unifies environment tracking, plant lifecycle management, task delegation, compliance auditing, and visitor management into a single, intuitive interface.
+
+## Core Pillars
+
+1. **Facility Visualization**: 3D Digital Twin of the facility for intuitive navigation and monitoring.
+2. **Compliance & Audit**: Rigorous tracking of all actions (SOPs, logs, visitor access) to meet regulatory standards.
+3. **Operational Efficiency**: Task management, batch tracking, and automated schedules (IPM, feeding).
+4. **Data-Driven Insights**: Real-time environmental metrics and historical reporting.
+
+## Key Features
+
+- **3D Facility Viewer**: Interactive "Time Machine" to view plant states at any point in history.
+- **Batch Tracking**: From clone to harvest, integrated with METRC.
+- **Visitor Kiosk**: Self-service check-in with badge printing.
+- **SOP Library**: Document version control and acknowledgement tracking.
+- **Audit Log**: Immutable record of all system activities.

product/types.ts

@@ -0,0 +1,7 @@
+export interface DesignToken {
+    colors: {
+        primary: string;
+        secondary: string;
+        neutral: string;
+    }
+}