From 46899ef7bedb418a2e3b9f685c11628d3b43ab70 Mon Sep 17 00:00:00 2001
From: Valentin Heiserer <valentin@heiserer.de>
Date: Sat, 30 Aug 2025 14:18:57 +0200
Subject: [PATCH] feat: integrate Tailwind CSS for improved styling and layout

- Added Tailwind CSS and its Vite plugin to the frontend project.
- Updated App.svelte to enhance UI with Tailwind classes, including a new layout for the serial monitor and command tester.
- Improved logging functionality by increasing log history and adding more detailed log messages.
- Refactored SendBox.svelte for consistent styling with Tailwind.
- Enhanced Pico firmware to support structured event logging and command parsing.
- Updated README_PICO_SERIAL.md to provide comprehensive documentation on serial communication and backend integration.
- Added .dockerignore to optimize Docker builds by excluding unnecessary files.
---
 .dockerignore                        |  12 +
 backend/src/main.ts                  |  27 +-
 backend/src/serial/serial.service.ts |  42 +-
 frontend/Dockerfile                  |  56 ++-
 frontend/docker-compose.yml          |  17 +-
 frontend/package-lock.json           | 697 ++++++++++++++++++++++++---
 frontend/package.json                |   4 +
 frontend/src/App.svelte              | 155 ++++--
 frontend/src/SendBox.svelte          |   8 +-
 frontend/src/app.css                 |  12 +
 frontend/vite.config.ts              |   6 +-
 pico/README_PICO_SERIAL.md           | 291 ++++++++++-
 pico/src/main.cpp                    | 115 +++--
 13 files changed, 1258 insertions(+), 184 deletions(-)
 create mode 100644 .dockerignore

diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 0000000..00f3b21
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,12 @@
+node_modules
+**/node_modules
+npm-debug.log
+yarn-error.log
+dist
+tmp
+temp
+.git
+.gitignore
+Dockerfile*
+frontend/dist
+backend/coverage
diff --git a/backend/src/main.ts b/backend/src/main.ts
index f76bc8d..2bce05e 100644
--- a/backend/src/main.ts
+++ b/backend/src/main.ts
@@ -1,8 +1,29 @@
 import { NestFactory } from '@nestjs/core';
 import { AppModule } from './app.module';
+import { NestExpressApplication } from '@nestjs/platform-express';
+import { join } from 'path';
 
 async function bootstrap() {
-  const app = await NestFactory.create(AppModule);
-  await app.listen(process.env.PORT ?? 3000);
+  const app = await NestFactory.create<NestExpressApplication>(AppModule, {
+    bufferLogs: true,
+  });
+
+  // Serve static frontend (built assets copied to /app/public in container)
+  const publicDir = join(process.cwd(), 'public');
+  app.useStaticAssets(publicDir);
+
+  // Basic health endpoint
+  app.getHttpAdapter().get('/healthz', (_req: any, res: any) => {
+    res.json({ ok: true, ts: Date.now() });
+  });
+
+  const port = Number(process.env.PORT || 3000);
+  await app.listen(port);
+  // eslint-disable-next-line no-console
+  console.log(`[bootstrap] Listening on :${port}`);
 }
-bootstrap();
+bootstrap().catch((e) => {
+  // eslint-disable-next-line no-console
+  console.error('Fatal bootstrap error', e);
+  process.exit(1);
+});
diff --git a/backend/src/serial/serial.service.ts b/backend/src/serial/serial.service.ts
index fc14fdc..8ab8884 100644
--- a/backend/src/serial/serial.service.ts
+++ b/backend/src/serial/serial.service.ts
@@ -139,16 +139,44 @@ export class SerialService implements OnModuleDestroy, OnModuleInit {
     this.close();
   }
 
-  onModuleInit() {
-    const port = process.env.SERIAL_PORT;
-    const baud = process.env.SERIAL_BAUD ? Number(process.env.SERIAL_BAUD) : undefined;
-    if (port) {
+  async onModuleInit() {
+    // Priority: explicit env vars > auto-detect
+    const explicit = process.env.SERIAL_PORT || process.env.PICO_SERIAL_PORT;
+    const baud = Number(process.env.SERIAL_BAUD || process.env.PICO_BAUD || 115200);
+    if (explicit) {
       try {
-        console.log('[SerialService] AUTO opening port from SERIAL_PORT=', port, 'baud=', baud ?? 115200);
-        this.open(port, baud ?? 115200);
+        console.log('[SerialService] AUTO opening explicit port', explicit, 'baud=', baud);
+        this.open(explicit, baud);
+        return;
       } catch (e: any) {
-        console.warn('[SerialService] AUTO open failed', e?.message ?? e);
+        console.warn('[SerialService] explicit open failed', e?.message ?? e);
       }
     }
+
+    // Attempt auto-detect of Pico (USB first, then common UART paths)
+    try {
+      const ports = await this.listPorts();
+      // Prefer vendorId 2e8a (Pico)
+      let candidate = ports.find(p => (p.vendorId || '').toLowerCase() === '2e8a');
+      if (!candidate) {
+        const common = ['/dev/serial0', '/dev/ttyACM0', '/dev/ttyAMA0'];
+        candidate = ports.find(p => p.path && common.includes(p.path));
+      }
+      // Windows fallback: highest numbered COM port
+      if (!candidate) {
+        const winCom = ports
+          .filter(p => /^COM\d+$/i.test(p.path))
+          .sort((a, b) => Number(b.path.replace(/\D/g, '')) - Number(a.path.replace(/\D/g, '')))[0];
+        if (winCom) candidate = winCom;
+      }
+      if (candidate && candidate.path) {
+        console.log('[SerialService] AUTO opening detected port', candidate.path);
+        this.open(candidate.path, baud);
+      } else {
+        console.log('[SerialService] No serial port auto-detected (will remain idle)');
+      }
+    } catch (e: any) {
+      console.warn('[SerialService] auto-detect failed', e?.message ?? e);
+    }
   }
 }
diff --git a/frontend/Dockerfile b/frontend/Dockerfile
index 9d32723..2accc41 100644
--- a/frontend/Dockerfile
+++ b/frontend/Dockerfile
@@ -1,20 +1,48 @@
-# Multi-stage build for SvelteKit (static client + node server fallback)
-FROM node:20-bookworm-slim AS builder
-WORKDIR /app
+######## Combined Frontend + Backend build (single Node runtime) ########
+# This Dockerfile now builds BOTH the Svelte frontend and the NestJS backend
+# and serves the compiled frontend through the backend (Express static).
 
-# Install deps (use package-lock if present)
-COPY package*.json ./
+########################
+# 1) Frontend build     #
+########################
+FROM node:20-bookworm-slim AS frontend-build
+WORKDIR /frontend
+COPY frontend/package*.json ./
 RUN npm install --no-audit --no-fund
-
-# Copy sources and build
-COPY . .
+COPY frontend/ .
 RUN npm run build
 
-# Use a lightweight nginx to serve the client build output
-FROM nginx:alpine AS runner
-COPY --from=builder /app/dist /usr/share/nginx/html
+########################
+# 2) Backend build      #
+########################
+FROM node:20-bookworm-slim AS backend-build
+WORKDIR /app
+COPY backend/package*.json ./
+RUN npm install --no-audit --no-fund
+COPY backend/ .
+# Copy compiled frontend into backend/public (served statically by Nest)
+COPY --from=frontend-build /frontend/dist ./public
+RUN npm run build
 
-# Default nginx port
-EXPOSE 80
+########################
+# 3) Production image   #
+########################
+FROM node:20-bookworm-slim AS runner
+ENV NODE_ENV=production
+WORKDIR /app
 
-CMD ["nginx", "-g", "daemon off;"]
+# Install only production deps (reuse original package.json)
+COPY backend/package*.json ./
+RUN npm install --omit=dev --no-audit --no-fund
+
+# Copy backend dist + public assets
+COPY --from=backend-build /app/dist ./dist
+COPY --from=backend-build /app/public ./public
+
+# Environment (override at runtime as needed)
+ENV PORT=3000 \
+	SERIAL_BAUD=115200
+
+EXPOSE 3000
+
+CMD ["node", "dist/main.js"]
diff --git a/frontend/docker-compose.yml b/frontend/docker-compose.yml
index 5b84759..aa1a928 100644
--- a/frontend/docker-compose.yml
+++ b/frontend/docker-compose.yml
@@ -1,8 +1,19 @@
 services:
-  frontend:
-    build: .
+  app:
+    build:
+      context: ..
+      dockerfile: frontend/Dockerfile
+    container_name: schafkop-app
     restart: unless-stopped
     environment:
       - NODE_ENV=production
+      - PORT=3000
+      # Optionally set SERIAL_PORT or PICO_SERIAL_PORT for auto-open
+      # - SERIAL_PORT=/dev/serial0
+      # - SERIAL_BAUD=115200
     ports:
-      - "80:80"
+      - "80:3000"
+    # Uncomment and adjust one of the following for hardware access on a Pi:
+    # devices:
+    #   - /dev/serial0:/dev/serial0
+    #   - /dev/ttyACM0:/dev/ttyACM0
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 32f589c..10b2e73 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -7,11 +7,15 @@
     "": {
       "name": "frontend",
       "version": "0.0.0",
+      "dependencies": {
+        "@tailwindcss/vite": "^4.1.12"
+      },
       "devDependencies": {
         "@sveltejs/vite-plugin-svelte": "^6.1.1",
         "@tsconfig/svelte": "^5.0.4",
         "svelte": "^5.38.1",
         "svelte-check": "^4.3.1",
+        "tailwindcss": "^4.1.12",
         "typescript": "~5.8.3",
         "vite": "^7.1.2"
       }
@@ -23,7 +27,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -40,7 +43,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -57,7 +59,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -74,7 +75,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -91,7 +91,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -108,7 +107,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -125,7 +123,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -142,7 +139,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -159,7 +155,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -176,7 +171,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -193,7 +187,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -210,7 +203,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -227,7 +219,6 @@
       "cpu": [
         "mips64el"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -244,7 +235,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -261,7 +251,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -278,7 +267,6 @@
       "cpu": [
         "s390x"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -295,7 +283,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -312,7 +299,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -329,7 +315,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -346,7 +331,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -363,7 +347,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -380,7 +363,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -397,7 +379,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -414,7 +395,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -431,7 +411,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -448,7 +427,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -458,11 +436,22 @@
         "node": ">=18"
       }
     },
+    "node_modules/@isaacs/fs-minipass": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/@isaacs/fs-minipass/-/fs-minipass-4.0.1.tgz",
+      "integrity": "sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w==",
+      "license": "ISC",
+      "dependencies": {
+        "minipass": "^7.0.4"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.3.13",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
       "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.5.0",
@@ -473,7 +462,6 @@
       "version": "2.3.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
       "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/gen-mapping": "^0.3.5",
@@ -484,7 +472,6 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
       "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=6.0.0"
@@ -494,14 +481,12 @@
       "version": "1.5.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
       "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/@jridgewell/trace-mapping": {
       "version": "0.3.30",
       "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.30.tgz",
       "integrity": "sha512-GQ7Nw5G2lTu/BtHTKfXhKHok2WGetd4XYcVKGx00SjAk8GMwgJM3zr6zORiPGuOE+/vkc90KtTosSSvaCjKb2Q==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
@@ -515,7 +500,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -529,7 +513,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -543,7 +526,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -557,7 +539,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -571,7 +552,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -585,7 +565,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -599,7 +578,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -613,7 +591,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -627,7 +604,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -641,7 +617,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -655,7 +630,6 @@
       "cpu": [
         "loong64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -669,7 +643,6 @@
       "cpu": [
         "ppc64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -683,7 +656,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -697,7 +669,6 @@
       "cpu": [
         "riscv64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -711,7 +682,6 @@
       "cpu": [
         "s390x"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -725,7 +695,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -739,7 +708,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -753,7 +721,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -767,7 +734,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -781,7 +747,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -838,6 +803,268 @@
         "vite": "^6.3.0 || ^7.0.0"
       }
     },
+    "node_modules/@tailwindcss/node": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.1.12.tgz",
+      "integrity": "sha512-3hm9brwvQkZFe++SBt+oLjo4OLDtkvlE8q2WalaD/7QWaeM7KEJbAiY/LJZUaCs7Xa8aUu4xy3uoyX4q54UVdQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/remapping": "^2.3.4",
+        "enhanced-resolve": "^5.18.3",
+        "jiti": "^2.5.1",
+        "lightningcss": "1.30.1",
+        "magic-string": "^0.30.17",
+        "source-map-js": "^1.2.1",
+        "tailwindcss": "4.1.12"
+      }
+    },
+    "node_modules/@tailwindcss/oxide": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.1.12.tgz",
+      "integrity": "sha512-gM5EoKHW/ukmlEtphNwaGx45fGoEmP10v51t9unv55voWh6WrOL19hfuIdo2FjxIaZzw776/BUQg7Pck++cIVw==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "dependencies": {
+        "detect-libc": "^2.0.4",
+        "tar": "^7.4.3"
+      },
+      "engines": {
+        "node": ">= 10"
+      },
+      "optionalDependencies": {
+        "@tailwindcss/oxide-android-arm64": "4.1.12",
+        "@tailwindcss/oxide-darwin-arm64": "4.1.12",
+        "@tailwindcss/oxide-darwin-x64": "4.1.12",
+        "@tailwindcss/oxide-freebsd-x64": "4.1.12",
+        "@tailwindcss/oxide-linux-arm-gnueabihf": "4.1.12",
+        "@tailwindcss/oxide-linux-arm64-gnu": "4.1.12",
+        "@tailwindcss/oxide-linux-arm64-musl": "4.1.12",
+        "@tailwindcss/oxide-linux-x64-gnu": "4.1.12",
+        "@tailwindcss/oxide-linux-x64-musl": "4.1.12",
+        "@tailwindcss/oxide-wasm32-wasi": "4.1.12",
+        "@tailwindcss/oxide-win32-arm64-msvc": "4.1.12",
+        "@tailwindcss/oxide-win32-x64-msvc": "4.1.12"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-android-arm64": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.1.12.tgz",
+      "integrity": "sha512-oNY5pq+1gc4T6QVTsZKwZaGpBb2N1H1fsc1GD4o7yinFySqIuRZ2E4NvGasWc6PhYJwGK2+5YT1f9Tp80zUQZQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-darwin-arm64": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.1.12.tgz",
+      "integrity": "sha512-cq1qmq2HEtDV9HvZlTtrj671mCdGB93bVY6J29mwCyaMYCP/JaUBXxrQQQm7Qn33AXXASPUb2HFZlWiiHWFytw==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-darwin-x64": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.1.12.tgz",
+      "integrity": "sha512-6UCsIeFUcBfpangqlXay9Ffty9XhFH1QuUFn0WV83W8lGdX8cD5/+2ONLluALJD5+yJ7k8mVtwy3zMZmzEfbLg==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-freebsd-x64": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.1.12.tgz",
+      "integrity": "sha512-JOH/f7j6+nYXIrHobRYCtoArJdMJh5zy5lr0FV0Qu47MID/vqJAY3r/OElPzx1C/wdT1uS7cPq+xdYYelny1ww==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm-gnueabihf": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.1.12.tgz",
+      "integrity": "sha512-v4Ghvi9AU1SYgGr3/j38PD8PEe6bRfTnNSUE3YCMIRrrNigCFtHZ2TCm8142X8fcSqHBZBceDx+JlFJEfNg5zQ==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm64-gnu": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.1.12.tgz",
+      "integrity": "sha512-YP5s1LmetL9UsvVAKusHSyPlzSRqYyRB0f+Kl/xcYQSPLEw/BvGfxzbH+ihUciePDjiXwHh+p+qbSP3SlJw+6g==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm64-musl": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.1.12.tgz",
+      "integrity": "sha512-V8pAM3s8gsrXcCv6kCHSuwyb/gPsd863iT+v1PGXC4fSL/OJqsKhfK//v8P+w9ThKIoqNbEnsZqNy+WDnwQqCA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-x64-gnu": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.1.12.tgz",
+      "integrity": "sha512-xYfqYLjvm2UQ3TZggTGrwxjYaLB62b1Wiysw/YE3Yqbh86sOMoTn0feF98PonP7LtjsWOWcXEbGqDL7zv0uW8Q==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-x64-musl": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.1.12.tgz",
+      "integrity": "sha512-ha0pHPamN+fWZY7GCzz5rKunlv9L5R8kdh+YNvP5awe3LtuXb5nRi/H27GeL2U+TdhDOptU7T6Is7mdwh5Ar3A==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.1.12.tgz",
+      "integrity": "sha512-4tSyu3dW+ktzdEpuk6g49KdEangu3eCYoqPhWNsZgUhyegEda3M9rG0/j1GV/JjVVsj+lG7jWAyrTlLzd/WEBg==",
+      "bundleDependencies": [
+        "@napi-rs/wasm-runtime",
+        "@emnapi/core",
+        "@emnapi/runtime",
+        "@tybys/wasm-util",
+        "@emnapi/wasi-threads",
+        "tslib"
+      ],
+      "cpu": [
+        "wasm32"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/core": "^1.4.5",
+        "@emnapi/runtime": "^1.4.5",
+        "@emnapi/wasi-threads": "^1.0.4",
+        "@napi-rs/wasm-runtime": "^0.2.12",
+        "@tybys/wasm-util": "^0.10.0",
+        "tslib": "^2.8.0"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-win32-arm64-msvc": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.1.12.tgz",
+      "integrity": "sha512-iGLyD/cVP724+FGtMWslhcFyg4xyYyM+5F4hGvKA7eifPkXHRAUDFaimu53fpNg9X8dfP75pXx/zFt/jlNF+lg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-win32-x64-msvc": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.1.12.tgz",
+      "integrity": "sha512-NKIh5rzw6CpEodv/++r0hGLlfgT/gFN+5WNdZtvh6wpU2BpGNgdjvj6H2oFc8nCM839QM1YOhjpgbAONUb4IxA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@tailwindcss/vite": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.1.12.tgz",
+      "integrity": "sha512-4pt0AMFDx7gzIrAOIYgYP0KCBuKWqyW8ayrdiLEjoJTT4pKTjrzG/e4uzWtTLDziC+66R9wbUqZBccJalSE5vQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tailwindcss/node": "4.1.12",
+        "@tailwindcss/oxide": "4.1.12",
+        "tailwindcss": "4.1.12"
+      },
+      "peerDependencies": {
+        "vite": "^5.2.0 || ^6 || ^7"
+      }
+    },
     "node_modules/@tsconfig/svelte": {
       "version": "5.0.5",
       "resolved": "https://registry.npmjs.org/@tsconfig/svelte/-/svelte-5.0.5.tgz",
@@ -849,7 +1076,6 @@
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
       "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/acorn": {
@@ -901,6 +1127,15 @@
         "url": "https://paulmillr.com/funding/"
       }
     },
+    "node_modules/chownr": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/chownr/-/chownr-3.0.0.tgz",
+      "integrity": "sha512-+IxzY9BZOQd/XuYPRmrvEVjF/nqj5kgT4kEq7VofrDoM1MxoRjEWkrCC3EtLi59TVawxTAn+orJwFQcrqEN1+g==",
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/clsx": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
@@ -939,11 +1174,32 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/detect-libc": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/enhanced-resolve": {
+      "version": "5.18.3",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.18.3.tgz",
+      "integrity": "sha512-d4lC8xfavMeBjzGr2vECC3fsGXziXZQyJxD868h2M/mBI3PwAuODxAkLkq5HYuvrPYcUtiLzsTo8U3PgX3Ocww==",
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.4",
+        "tapable": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
     "node_modules/esbuild": {
       "version": "0.25.9",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.9.tgz",
       "integrity": "sha512-CRbODhYyQx3qp7ZEwzxOk4JBqmD/seJrzPa/cGjY1VtIn5E09Oi9/dB4JwctnfZ8Q8iT7rioVv5k/FNT/uf54g==",
-      "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
       "bin": {
@@ -1002,7 +1258,6 @@
       "version": "6.5.0",
       "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
       "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12.0.0"
@@ -1020,7 +1275,6 @@
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
       "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-      "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
@@ -1031,6 +1285,12 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
+    "node_modules/graceful-fs": {
+      "version": "4.2.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
+      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
+      "license": "ISC"
+    },
     "node_modules/is-reference": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/is-reference/-/is-reference-3.0.3.tgz",
@@ -1041,6 +1301,15 @@
         "@types/estree": "^1.0.6"
       }
     },
+    "node_modules/jiti": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.5.1.tgz",
+      "integrity": "sha512-twQoecYPiVA5K/h6SxtORw/Bs3ar+mLUtoPSc7iMXzQzK8d7eJ/R09wmTwAjiamETn1cXYPGfNnu7DMoHgu12w==",
+      "license": "MIT",
+      "bin": {
+        "jiti": "lib/jiti-cli.mjs"
+      }
+    },
     "node_modules/kleur": {
       "version": "4.1.5",
       "resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz",
@@ -1051,6 +1320,234 @@
         "node": ">=6"
       }
     },
+    "node_modules/lightningcss": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.1.tgz",
+      "integrity": "sha512-xi6IyHML+c9+Q3W0S4fCQJOym42pyurFiJUHEcEyHS0CeKzia4yZDEsLlqOFykxOdHpNy0NmvVO31vcSqAxJCg==",
+      "license": "MPL-2.0",
+      "dependencies": {
+        "detect-libc": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "lightningcss-darwin-arm64": "1.30.1",
+        "lightningcss-darwin-x64": "1.30.1",
+        "lightningcss-freebsd-x64": "1.30.1",
+        "lightningcss-linux-arm-gnueabihf": "1.30.1",
+        "lightningcss-linux-arm64-gnu": "1.30.1",
+        "lightningcss-linux-arm64-musl": "1.30.1",
+        "lightningcss-linux-x64-gnu": "1.30.1",
+        "lightningcss-linux-x64-musl": "1.30.1",
+        "lightningcss-win32-arm64-msvc": "1.30.1",
+        "lightningcss-win32-x64-msvc": "1.30.1"
+      }
+    },
+    "node_modules/lightningcss-darwin-arm64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.30.1.tgz",
+      "integrity": "sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-x64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.30.1.tgz",
+      "integrity": "sha512-k1EvjakfumAQoTfcXUcHQZhSpLlkAuEkdMBsI/ivWw9hL+7FtilQc0Cy3hrx0AAQrVtQAbMI7YjCgYgvn37PzA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-freebsd-x64": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.30.1.tgz",
+      "integrity": "sha512-kmW6UGCGg2PcyUE59K5r0kWfKPAVy4SltVeut+umLCFoJ53RdCUWxcRDzO1eTaxf/7Q2H7LTquFHPL5R+Gjyig==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm-gnueabihf": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.30.1.tgz",
+      "integrity": "sha512-MjxUShl1v8pit+6D/zSPq9S9dQ2NPFSQwGvxBCYaBYLPlCWuPh9/t1MRS8iUaR8i+a6w7aps+B4N0S1TYP/R+Q==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-gnu": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.30.1.tgz",
+      "integrity": "sha512-gB72maP8rmrKsnKYy8XUuXi/4OctJiuQjcuqWNlJQ6jZiWqtPvqFziskH3hnajfvKB27ynbVCucKSm2rkQp4Bw==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-musl": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.30.1.tgz",
+      "integrity": "sha512-jmUQVx4331m6LIX+0wUhBbmMX7TCfjF5FoOH6SD1CttzuYlGNVpA7QnrmLxrsub43ClTINfGSYyHe2HWeLl5CQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-gnu": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.30.1.tgz",
+      "integrity": "sha512-piWx3z4wN8J8z3+O5kO74+yr6ze/dKmPnI7vLqfSqI8bccaTGY5xiSGVIJBDd5K5BHlvVLpUB3S2YCfelyJ1bw==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-musl": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.30.1.tgz",
+      "integrity": "sha512-rRomAK7eIkL+tHY0YPxbc5Dra2gXlI63HL+v1Pdi1a3sC+tJTcFrHX+E86sulgAXeI7rSzDYhPSeHHjqFhqfeQ==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-arm64-msvc": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.30.1.tgz",
+      "integrity": "sha512-mSL4rqPi4iXq5YVqzSsJgMVFENoa4nGTT/GjO2c0Yl9OuQfPsIfncvLrEW6RbbB24WtZ3xP/2CCmI3tNkNV4oA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-x64-msvc": {
+      "version": "1.30.1",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.30.1.tgz",
+      "integrity": "sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
     "node_modules/locate-character": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",
@@ -1062,12 +1559,47 @@
       "version": "0.30.18",
       "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.18.tgz",
       "integrity": "sha512-yi8swmWbO17qHhwIBNeeZxTceJMeBvWJaId6dyvTSOwTipqeHhMhOrz6513r1sOKnpvQ7zkhlG8tPrpilwTxHQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.5.5"
       }
     },
+    "node_modules/minipass": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
+      "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      }
+    },
+    "node_modules/minizlib": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-3.0.2.tgz",
+      "integrity": "sha512-oG62iEk+CYt5Xj2YqI5Xi9xWUeZhDI8jjQmC5oThVH5JGCTgIjr7ciJDzC7MBzYd//WvR1OTmP5Q38Q8ShQtVA==",
+      "license": "MIT",
+      "dependencies": {
+        "minipass": "^7.1.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/mkdirp": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-3.0.1.tgz",
+      "integrity": "sha512-+NsyUUAZDmo6YVHzL/stxSu3t9YS1iljliy3BSDrXJ/dkn1KYdmtZODGGjLcc9XLgVVpH4KshHB8XmZgMhaBXg==",
+      "license": "MIT",
+      "bin": {
+        "mkdirp": "dist/cjs/src/bin.js"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/mri": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/mri/-/mri-1.2.0.tgz",
@@ -1089,7 +1621,6 @@
       "version": "3.3.11",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
       "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -1108,14 +1639,12 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
       "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/picomatch": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=12"
@@ -1128,7 +1657,6 @@
       "version": "8.5.6",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
       "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
-      "dev": true,
       "funding": [
         {
           "type": "opencollective",
@@ -1171,7 +1699,6 @@
       "version": "4.48.1",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.48.1.tgz",
       "integrity": "sha512-jVG20NvbhTYDkGAty2/Yh7HK6/q3DGSRH4o8ALKGArmMuaauM9kLfoMZ+WliPwA5+JHr2lTn3g557FxBV87ifg==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "@types/estree": "1.0.8"
@@ -1224,7 +1751,6 @@
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
       "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
-      "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.10.0"
@@ -1280,11 +1806,46 @@
         "typescript": ">=5.0.0"
       }
     },
+    "node_modules/tailwindcss": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.12.tgz",
+      "integrity": "sha512-DzFtxOi+7NsFf7DBtI3BJsynR+0Yp6etH+nRPTbpWnS2pZBaSksv/JGctNwSWzbFjp0vxSqknaUylseZqMDGrA==",
+      "license": "MIT"
+    },
+    "node_modules/tapable": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.3.tgz",
+      "integrity": "sha512-ZL6DDuAlRlLGghwcfmSn9sK3Hr6ArtyudlSAiCqQ6IfE+b+HHbydbYDIG15IfS5do+7XQQBdBiubF/cV2dnDzg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/webpack"
+      }
+    },
+    "node_modules/tar": {
+      "version": "7.4.3",
+      "resolved": "https://registry.npmjs.org/tar/-/tar-7.4.3.tgz",
+      "integrity": "sha512-5S7Va8hKfV7W5U6g3aYxXmlPoZVAwUMy9AOKyF2fVuZa2UD3qZjg578OrLRt8PcNN1PleVaL/5/yYATNL0ICUw==",
+      "license": "ISC",
+      "dependencies": {
+        "@isaacs/fs-minipass": "^4.0.0",
+        "chownr": "^3.0.0",
+        "minipass": "^7.1.2",
+        "minizlib": "^3.0.1",
+        "mkdirp": "^3.0.1",
+        "yallist": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/tinyglobby": {
       "version": "0.2.14",
       "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.14.tgz",
       "integrity": "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "fdir": "^6.4.4",
@@ -1315,7 +1876,6 @@
       "version": "7.1.3",
       "resolved": "https://registry.npmjs.org/vite/-/vite-7.1.3.tgz",
       "integrity": "sha512-OOUi5zjkDxYrKhTV3V7iKsoS37VUM7v40+HuwEmcrsf11Cdx9y3DIr2Px6liIcZFwt3XSRpQvFpL3WVy7ApkGw==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "esbuild": "^0.25.0",
@@ -1406,6 +1966,15 @@
         }
       }
     },
+    "node_modules/yallist": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-5.0.0.tgz",
+      "integrity": "sha512-YgvUTfwqyc7UXVMrB+SImsVYSmTS8X/tSrtdNZMImM+n7+QTriRXyXim0mBrTXNeqzVF0KWGgHPeiyViFFrNDw==",
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/zimmerframe": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/zimmerframe/-/zimmerframe-1.1.2.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index a7337c0..37dee84 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -14,7 +14,11 @@
     "@tsconfig/svelte": "^5.0.4",
     "svelte": "^5.38.1",
     "svelte-check": "^4.3.1",
+    "tailwindcss": "^4.1.12",
     "typescript": "~5.8.3",
     "vite": "^7.1.2"
+  },
+  "dependencies": {
+    "@tailwindcss/vite": "^4.1.12"
   }
 }
diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index 10a279c..fd889b5 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -10,7 +10,8 @@
   let es: EventSource | null = null;
 
   function addLog(line: string) {
-    log.update((l) => [new Date().toISOString() + '  ' + line, ...l].slice(0, 200));
+  // keep a fairly large history and prefix with an ISO timestamp
+  log.update((l) => [new Date().toISOString() + '  ' + line, ...l].slice(0, 2000));
   }
 
   async function list() {
@@ -26,14 +27,18 @@
   const res = await fetch('/serial/open', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ path }) });
   const j = await res.json().catch(() => null);
   console.log('[serial] openPort result', j);
-  // refresh status
+  // log result and refresh status
+  if (j?.ok) addLog('PORT: open requested ' + path);
+  else addLog('PORT: open request failed - ' + (j?.error ?? 'unknown'));
   setTimeout(getStatus, 300);
   }
 
   async function closePort() {
   console.log('[serial] closePort()');
   const res = await fetch('/serial/close', { method: 'POST' });
-  console.log('[serial] closePort result', await res.json().catch(() => null));
+  const j = await res.json().catch(() => null);
+  console.log('[serial] closePort result', j);
+  addLog('PORT: close requested');
   }
 
   async function sendLine(txt: string) {
@@ -61,13 +66,17 @@
     if (es) return;
     console.log('[serial] startStream()');
     es = new EventSource('/serial/stream');
-    es.addEventListener('open', () => { console.log('[serial][SSE] open'); connected.set(true); });
-    es.addEventListener('close', () => { console.log('[serial][SSE] close'); connected.set(false); });
-    es.addEventListener('error', (e: any) => { console.warn('[serial][SSE] error', e); addLog('SSE error'); });
+    // connection lifecycle events - also log them so the serial box shows open/close/errors
+    es.addEventListener('open', () => { console.log('[serial][SSE] open'); connected.set(true); addLog('[SSE] connected'); });
+    es.addEventListener('close', () => { console.log('[serial][SSE] close'); connected.set(false); addLog('[SSE] disconnected'); });
+    es.addEventListener('error', (e: any) => { console.warn('[serial][SSE] error', e); addLog('[SSE] error: ' + (e?.message ?? JSON.stringify(e))); });
+
+    // data events contain the actual lines emitted by the Pico; parse JSON payloads but fall back to raw
     es.addEventListener('data', (ev: any) => {
       console.log('[serial][SSE] data event', ev.data);
       try {
         const d = JSON.parse(ev.data);
+        // always show the raw line emitted by the firmware
         addLog('RX: ' + d.line);
       } catch (e) {
         addLog('RX (raw): ' + ev.data);
@@ -83,6 +92,10 @@
   }
 
   let statusInterval: any;
+  // quick test command defaults
+  let stepVal: string = '4096';
+  let dirVal: string = '1';
+  let speedVal: string = '3000';
   onMount(() => {
     list();
     startStream();
@@ -93,43 +106,109 @@
     stopStream();
     clearInterval(statusInterval);
   });
+
+  function sendStepCmd() {
+    const steps = Number(stepVal);
+    const dir = Number(dirVal) === 1 ? 1 : 0;
+    if (!Number.isFinite(steps) || steps <= 0) {
+      addLog('TX error: invalid STEP value: ' + stepVal);
+      return;
+    }
+    const line = `STEP ${steps} ${dir}`;
+    sendLine(line);
+    addLog('TX: ' + line);
+  }
+
+  function sendSpeedCmd() {
+    const d = Number(speedVal);
+    if (!Number.isFinite(d) || d <= 0) {
+      addLog('TX error: invalid SPEED value: ' + speedVal);
+      return;
+    }
+    const line = `SPEED ${d}`;
+    sendLine(line);
+    addLog('TX: ' + line);
+  }
 </script>
 
-<main>
-  <h1>Raspberry Pico — Serial Monitor</h1>
+<main class="min-h-screen bg-gradient-to-b from-bg to-surface text-gray-100 p-8">
+    <h1 class="text-3xl font-bold underline">
+    Hello world!
+  </h1>
+  <div class="container mx-auto">
+    <header class="flex items-center justify-between mb-6">
+      <div>
+        <h1 class="text-2xl font-semibold">Raspberry Pico</h1>
+        <p class="text-sm text-gray-400">Serial monitor & command tester</p>
+      </div>
+      <div class="flex items-center gap-3">
+        <span class="text-sm text-gray-300">SSE: {$connected ? 'connected' : 'disconnected'}</span>
+        <button class="px-3 py-1 bg-primary text-white rounded-md text-sm" on:click={startStream}>Start</button>
+        <button class="px-3 py-1 bg-gray-700 text-white rounded-md text-sm" on:click={stopStream}>Stop</button>
+      </div>
+    </header>
 
-  <section>
-    <h3>Available ports</h3>
-    <button on:click={list}>Refresh</button>
-    <ul>
-      {#each $ports as p}
-        <li>
-          <code>{p.path}</code>
-          <button on:click={() => openPort(p.path)}>Open</button>
-        </li>
-      {/each}
-    </ul>
-    <button on:click={closePort}>Close port</button>
-  </section>
+    <div class="grid grid-cols-12 gap-6">
+      <aside class="col-span-4 bg-gray-900/60 p-4 rounded-lg border border-gray-800">
+        <section class="mb-4">
+          <h3 class="text-sm text-gray-300 font-medium">Available ports</h3>
+          <div class="flex items-center gap-2 mt-2">
+            <button class="px-2 py-1 text-sm bg-gray-700 rounded" on:click={list}>Refresh</button>
+            <button class="px-2 py-1 text-sm bg-red-600 rounded" on:click={closePort}>Close port</button>
+          </div>
+          <ul class="mt-3 space-y-2">
+            {#each $ports as p}
+              <li class="flex items-center justify-between bg-gray-800/40 p-2 rounded">
+                <code class="text-xs text-gray-200">{p.path}</code>
+                <button class="px-2 py-1 text-sm bg-primary rounded" on:click={() => openPort(p.path)}>Open</button>
+              </li>
+            {/each}
+          </ul>
+        </section>
 
-  <section>
-    <h3>Send</h3>
-    <div style="display:flex; align-items:center; gap:1rem;">
-  <div>Port: {$portOpen ? 'open' : 'closed'}</div>
-  <SendBox disabled={!$portOpen} on:send={(e) => { sendLine(e.detail); addLog('TX: ' + e.detail); }} />
+        <section class="mb-4">
+          <h3 class="text-sm text-gray-300 font-medium">Send</h3>
+          <div class="mt-2 flex items-center gap-2">
+            <div class="text-xs text-gray-300">Port: <span class="font-medium">{$portOpen ? 'open' : 'closed'}</span></div>
+          </div>
+          <div class="mt-2">
+            <SendBox disabled={!$portOpen} on:send={(e) => { sendLine(e.detail); addLog('TX: ' + e.detail); }} />
+          </div>
+        </section>
+
+        <section>
+          <h3 class="text-sm text-gray-300 font-medium">Quick commands</h3>
+          <div class="mt-2 space-y-2">
+            <div class="flex gap-2 items-center">
+              <input class="w-28 p-2 rounded bg-gray-800 text-sm" type="number" bind:value={stepVal} min="1" />
+              <select class="p-2 rounded bg-gray-800 text-sm" bind:value={dirVal}>
+                <option value="1">1 (forward)</option>
+                <option value="0">0 (reverse)</option>
+              </select>
+              <button class="px-3 py-1 bg-primary text-white rounded" on:click={sendStepCmd} disabled={!$portOpen}>Send STEP</button>
+            </div>
+
+            <div class="flex gap-2 items-center">
+              <input class="w-28 p-2 rounded bg-gray-800 text-sm" type="number" bind:value={speedVal} min="1" />
+              <button class="px-3 py-1 bg-primary text-white rounded" on:click={sendSpeedCmd} disabled={!$portOpen}>Send SPEED</button>
+            </div>
+          </div>
+        </section>
+      </aside>
+
+      <section class="col-span-8 bg-gray-900/60 p-4 rounded-lg border border-gray-800 flex flex-col">
+        <div class="flex items-center justify-between mb-3">
+          <h3 class="text-sm text-gray-300 font-medium">Live log</h3>
+          <div class="text-xs text-gray-400">Showing last {2000} lines</div>
+        </div>
+        <div class="flex-1 overflow-auto bg-[#0b0b0b] p-3 rounded text-sm font-mono text-gray-100">
+          {#each $log as l}
+            <div class="py-0.5"><code class="text-xs">{l}</code></div>
+          {/each}
+        </div>
+      </section>
     </div>
-  </section>
-
-  <section>
-    <h3>Live log ({$connected ? 'connected' : 'disconnected'})</h3>
-    <button on:click={startStream}>Start stream</button>
-    <button on:click={stopStream}>Stop stream</button>
-    <div style="height:320px; overflow:auto; background:#111; color:#dfe6ef; padding:8px; border-radius:6px;">
-      {#each $log as l}
-        <div><code>{l}</code></div>
-      {/each}
-    </div>
-  </section>
+  </div>
 </main>
 
 <style>
diff --git a/frontend/src/SendBox.svelte b/frontend/src/SendBox.svelte
index 7a9961d..b51de38 100644
--- a/frontend/src/SendBox.svelte
+++ b/frontend/src/SendBox.svelte
@@ -12,7 +12,7 @@
   }
 </script>
 
-  <div style="margin-top:0.5rem; display:flex; gap:0.5rem; align-items:center;">
-  <input bind:value={txt} placeholder={placeholder} on:keydown={(e) => e.key === 'Enter' && doSend()} style="flex:1; padding:0.4rem;" disabled={disabled} />
-  <button on:click={doSend} disabled={disabled}>Send</button>
-</div>
+  <div class="mt-2 flex gap-2 items-center">
+    <input class="flex-1 p-2 rounded bg-gray-800 text-sm text-gray-100" bind:value={txt} placeholder={placeholder} on:keydown={(e) => e.key === 'Enter' && doSend()} disabled={disabled} />
+    <button class="px-3 py-1 bg-primary text-white rounded text-sm" on:click={doSend} disabled={disabled}>Send</button>
+  </div>
diff --git a/frontend/src/app.css b/frontend/src/app.css
index f496343..e51f549 100644
--- a/frontend/src/app.css
+++ b/frontend/src/app.css
@@ -30,3 +30,15 @@ a:hover { opacity: 0.9; }
 @media (prefers-color-scheme: light) {
   :root { --bg: #fafafa; --surface:#fff; --text:#111827; --muted:#556; }
 }
+
+
+/* small helpers that complement tailwind tokens */
+.container { max-width: 1100px; margin: 0 auto; padding: 1.25rem; }
+
+:focus { outline: 3px solid rgba(124,108,255,0.18); outline-offset: 2px; }
+
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@import "tailwindcss";
\ No newline at end of file
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index de3b288..ea5bf81 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -1,9 +1,13 @@
 import { defineConfig } from 'vite'
 import { svelte } from '@sveltejs/vite-plugin-svelte'
+import tailwindcss from '@tailwindcss/vite'
 
 // https://vite.dev/config/
 export default defineConfig({
-  plugins: [svelte()],
+  plugins: [
+    svelte(),
+    tailwindcss(),
+  ],
   server: {
     proxy: {
       // forward serial API calls (including SSE) to backend running on :3000
diff --git a/pico/README_PICO_SERIAL.md b/pico/README_PICO_SERIAL.md
index 2045bd7..625bebf 100644
--- a/pico/README_PICO_SERIAL.md
+++ b/pico/README_PICO_SERIAL.md
@@ -1,35 +1,280 @@
-# Pico Serial Motor Control Integration
+# Pico Serial Motor Control — README for Copilot/Developers
 
-This project enables a Raspberry Pi Pico to be controlled via serial commands from a TypeScript backend. The Pico firmware parses commands received over serial and controls a stepper motor accordingly, while also sending log/status messages back.
+Purpose
+-------
+This file documents the exact serial message contract between the Raspberry Pi Pico firmware and a TypeScript backend. It's written so another Copilot or developer can implement a backend and extend firmware features without guesswork.
 
-## Serial Commands Supported
-- `STEP <steps> <direction>`: Move the motor by the specified number of steps. Direction: 1 for forward, 0 for reverse.
-- `SPEED <delay_us>`: Set the motor speed (delay in microseconds between steps).
-- `LOG <message>`: Print a log message to serial.
+Transport modes
+---------------
+The firmware supports two serial transports (selected automatically):
 
-## Firmware Files
-- `src/main.cpp`: Main firmware logic, serial command parsing, motor control, logging.
-- `src/ULN2003Stepper.h`, `src/Stepper.h`: Stepper motor driver classes.
+1. USB CDC (preferred)
+	 - When the Pico is connected over USB and a host opens the port, firmware uses `Serial`.
+	 - Typical device name:
+		 - Windows: `COMx`
+		 - Linux (Pi): `/dev/ttyACM0`
+	 - Vendor/Product IDs: 0x2E8A / 0x000A (can be used for auto-detection).
 
-## How to Extend
-- Add new serial commands by updating the parser in `main.cpp`.
-- Implement additional motor features or logging as needed.
-- Ensure any new global variables are only defined in one source file, and declared as `extern` elsewhere.
+2. UART0 on GPIO0/GP0 (TX) and GPIO1/GP1 (RX)
+	 - Activated if USB CDC is not opened within ~2 seconds at boot; firmware falls back to `Serial1`.
+	 - Used for headless integration when the Pico is cabled to a Raspberry Pi's UART pins.
 
-## TypeScript Backend
-- Use a library like `serialport` to communicate with the Pico.
-- Send commands as plain text terminated by `\n`.
-- Read and process log/status messages from serial.
+Wiring (Pico UART0 <-> Raspberry Pi UART)
+----------------------------------------
+All signals are 3.3V. DO NOT connect 5V to Pico GPIOs.
+
+| Function | Pico Pin | Pi (BCM) | Pi Physical Pin |
+|----------|----------|----------|-----------------|
+| UART0 TX | GP0      | RXD0 (15)| 10              |
+| UART0 RX | GP1      | TXD0 (14)| 8               |
+| GND      | GND      | GND      | (any GND)       |
+
+Power options:
+- Preferred: Power Pico over USB (isolated data + power). Only connect GND and TX/RX for UART logic level link.
+- Alternate: Power from Pi 3V3 pin to Pico 3V3 pin (NOT VBUS) plus GND. Never power from USB and Pi 3V3 simultaneously unless you know backfeed protection is in place.
+
+Raspberry Pi configuration (enable UART)
+---------------------------------------
+Edit `/boot/firmware/config.txt` (newer Raspberry Pi OS) or `/boot/config.txt` (older) and ensure:
 
-## Example Serial Session
 ```
-SPEED 3000
+enable_uart=1
+```
+
+If the serial console/login is enabled, you may need to disable it (via `sudo raspi-config` -> Interface Options -> Serial) so `/dev/serial0` is free.
+
+After reboot you should see one of:
+- `/dev/serial0` (symlink to the primary UART)
+- `/dev/ttyAMA0` or `/dev/ttyS0` depending on Pi model.
+
+Docker usage on Raspberry Pi
+----------------------------
+Expose the UART device inside the container:
+
+```
+docker run \
+	--device /dev/serial0:/dev/serial0 \
+	-e PICO_SERIAL_PORT=/dev/serial0 \
+	your-image:tag
+```
+
+If using USB instead of GPIO UART, expose `/dev/ttyACM0` (or appropriate) similarly.
+
+Single combined app container (frontend + backend)
+-------------------------------------------------
+The project Dockerfile now builds both the frontend and backend. To run on a Pi with GPIO UART wiring:
+
+```
+docker build -t schafkop-app .
+docker run --rm \
+	--device /dev/serial0:/dev/serial0 \
+	-e PICO_SERIAL_PORT=/dev/serial0 \
+	-p 80:3000 \
+	schafkop-app
+```
+
+For USB Pico:
+```
+docker run --rm \
+	--device /dev/ttyACM0:/dev/ttyACM0 \
+	-e PICO_SERIAL_PORT=/dev/ttyACM0 \
+	-p 80:3000 \
+	schafkop-app
+```
+
+If you omit PICO_SERIAL_PORT the backend will attempt auto-detection (vendorId 2e8a or common paths).
+
+Environment variables (suggested backend behavior):
+- `PICO_SERIAL_PORT`: If set, backend uses this path directly.
+- `PICO_BAUD`: Override baud rate (default 115200).
+
+Backend port auto-detection logic (recommended order):
+1. If `PICO_SERIAL_PORT` env var exists, use it.
+2. Else list serial ports; prefer any with vendorId `2e8a` (Pico USB).
+3. Else probe common paths: `/dev/serial0`, `/dev/ttyACM0`, `/dev/ttyAMA0`, Windows `COM` ports (highest matching newly added), macOS `/dev/tty.usbmodem*`.
+4. Fallback: error with clear message.
+
+Contract (high-level)
+---------------------
+- Commands to Pico: ASCII text lines terminated by LF ("\\n") or CRLF ("\\r\\n").
+- Events/logs from Pico: ASCII text lines, one event per line. Backend must split on newlines.
+- Baud rate: 115200 (firmware uses Serial.begin(115200)).
+
+Accepted commands (input to Pico)
+---------------------------------
+1) STEP <steps> <direction>
+	 - steps: integer (positive number of micro-steps)
+	 - direction: 1 (forward) or 0 (reverse)
+	 - Example: `STEP 4096 1`
+
+2) SPEED <delay_us>
+	 - delay_us: integer microseconds between internal step micro-operations
+	 - Example: `SPEED 3000`
+
+Notes:
+- Commands are trimmed for leading/trailing whitespace before parsing.
+- Invalid or malformed commands result in an error event emitted by the Pico.
+
+Events/log lines emitted by Pico (output)
+----------------------------------------
+The firmware emits structured lines with prefixes so the backend can parse them easily.
+
+- `EVENT:RECEIVED <raw-command>`
+	- Emitted immediately when a command line is received (before execution).
+	- Example: `EVENT:RECEIVED STEP 4096 1`
+
+- `EVENT:COMPLETED STEP <steps> <direction>`
+	- Emitted after a successful STEP command completes.
+	- Example: `EVENT:COMPLETED STEP 4096 1`
+
+- `EVENT:COMPLETED SPEED <delay_us>`
+	- Emitted after the SPEED command is applied.
+
+- `EVENT:COMPLETED ERROR: <message>`
+	- Emitted when a command fails to parse or run.
+	- Example: `EVENT:COMPLETED ERROR: malformed STEP command`
+
+- `STATUS: OK` or `STATUS: ERROR: <message>`
+	- Short summary always emitted after processing a command.
+
+Parsing guidance for backend:
+- Read raw bytes, split on `\\n` (handle `\\r\\n`).
+- Ignore empty lines.
+- Inspect prefixes `EVENT:RECEIVED`, `EVENT:COMPLETED`, `STATUS:` and parse the remainder.
+
+Backend responsibilities (TypeScript)
+------------------------------------
+- Open the serial port at 115200 baud.
+- Provide a small API:
+	- `sendStep(steps: number, direction: 0|1): Promise<void>`
+	- `setSpeed(delayUs: number): Promise<void>`
+	- `onEvent(cb: (evt: {type: string; payload: string}) => void)`
+- Send commands as ASCII lines terminated by `\\n`.
+- Listen for events; map them to higher-level promises if desired.
+- Implement reconnect logic with exponential backoff if the device disconnects.
+- Add basic validation before sending commands to avoid malformed requests.
+
+Suggested libraries / implementation notes
+-----------------------------------------
+- Use `serialport` (npm) and its `ReadlineParser` or equivalent.
+- Keep a small FIFO of pending commands if you want to wait for `EVENT:COMPLETED` per command.
+- For each command you can:
+	1. Write the line `CMD\\n` to the port.
+	2. Wait for `EVENT:RECEIVED CMD` then `EVENT:COMPLETED ...` and `STATUS: ...`.
+- Ensure the backend tolerates duplicate or out-of-order messages (don't assume perfect timing).
+
+Examples
+--------
+Example sequence for a STEP command:
+
+```
+// backend writes:
 STEP 4096 1
-LOG Motor moved
+
+// pico emits:
+EVENT:RECEIVED STEP 4096 1
+EVENT:COMPLETED STEP 4096 1
+STATUS: OK
 ```
 
-## Build & Upload
-Use PlatformIO to build and upload the firmware to the Pico.
+TypeScript example (auto-detect & simple API)
+--------------------------------------------
+```ts
+import { SerialPort } from 'serialport';
+import { ReadlineParser } from '@serialport/parser-readline';
+
+interface PicoEvent { type: string; payload: string; raw: string; }
+
+async function findPort(): Promise<string> {
+	if (process.env.PICO_SERIAL_PORT) return process.env.PICO_SERIAL_PORT;
+	const ports = await SerialPort.list();
+	// Prefer Pico USB (vendorId 2e8a)
+	const pico = ports.find(p => (p.vendorId||'').toLowerCase()==='2e8a');
+	if (pico && pico.path) return pico.path;
+	const candidates = ['/dev/serial0','/dev/ttyACM0','/dev/ttyAMA0'];
+	for (const c of candidates) if (ports.find(p=>p.path===c)) return c;
+	if (ports[0]) return ports[0].path; // fallback
+	throw new Error('No serial ports detected for Pico');
+}
+
+export class PicoClient {
+	private port!: SerialPort;
+	private parser!: ReadlineParser;
+	private listeners: ((e:PicoEvent)=>void)[] = [];
+	constructor(private baud = Number(process.env.PICO_BAUD)||115200) {}
+	async init() {
+		const path = await findPort();
+		this.port = new SerialPort({ path, baudRate: this.baud });
+		this.parser = this.port.pipe(new ReadlineParser({ delimiter: '\n' }));
+		this.parser.on('data', line => {
+			const l = line.trim();
+			if (!l) return;
+			let type='RAW'; let payload=l;
+			if (l.startsWith('EVENT:RECEIVED ')) { type='EVENT:RECEIVED'; payload=l.substring(15); }
+			else if (l.startsWith('EVENT:COMPLETED ')) { type='EVENT:COMPLETED'; payload=l.substring(17); }
+			else if (l.startsWith('STATUS: ')) { type='STATUS'; payload=l.substring(8); }
+			this.listeners.forEach(cb=>cb({ type, payload, raw:l }));
+		});
+		return this;
+	}
+	onEvent(cb:(e:PicoEvent)=>void){ this.listeners.push(cb); }
+	private write(cmd:string){ this.port.write(cmd.endsWith('\n')?cmd:cmd+'\n'); }
+	sendStep(steps:number, dir:0|1){ this.write(`STEP ${steps} ${dir}`); }
+	setSpeed(delayUs:number){ this.write(`SPEED ${delayUs}`); }
+}
+
+// Usage example
+// (async () => {
+//   const pico = await new PicoClient().init();
+//   pico.onEvent(e => console.log('EVENT', e));
+//   pico.setSpeed(3000);
+//   pico.sendStep(4096,1);
+// })();
+```
+
+Manual testing
+--------------
+- Build and upload firmware with PlatformIO (pico environment).
+- Open a serial terminal at 115200 and send commands.
+- Observe `EVENT:` and `STATUS:` lines.
+
+Testing inside Docker (Pi UART example)
+--------------------------------------
+1. Connect wiring (see table above) and power Pico.
+2. Confirm `/dev/serial0` exists on host (`ls -l /dev/serial0`).
+3. Run container with device passed through.
+4. Inside container: run a small Node script using the TypeScript example (compiled) or `screen /dev/serial0 115200` for manual check.
+
+Troubleshooting
+---------------
+| Symptom | Likely Cause | Action |
+|---------|--------------|--------|
+| No output on UART | Pi serial console still enabled | Disable login shell on serial via `raspi-config` |
+| Garbled characters | Baud mismatch | Ensure both sides at 115200 |
+| Only EVENT:START appears | Backend not sending newline | Ensure commands end with `\n` |
+| USB port not found | Missing udev permissions | Add user to `dialout` (Linux) or run with proper permissions |
+| Command times out | Long step count | Consider splitting into smaller STEP commands |
+
+Extending the firmware
+----------------------
+- Add new command parsing in `src/main.cpp`.
+- Emit `EVENT:RECEIVED <cmd>` when a command is received.
+- Emit `EVENT:COMPLETED <...>` once the command finishes (or `EVENT:COMPLETED ERROR: ...` on failure).
+- Update this README with any new event formats.
+
+Files of interest
+-----------------
+- `src/main.cpp` — serial parser, command dispatch, and event emission.
+- `src/ULN2003Stepper.h`, `src/Stepper.h` — stepper implementation.
+- `src/schafkopf-bot.cpp` — helper logic; references globals via `extern`.
+
+Notes for a Copilot implementer
+------------------------------
+- Preserve the exact prefixes (`EVENT:RECEIVED`, `EVENT:COMPLETED`, `STATUS:`).
+- Add unit tests for the backend parser to assert the event shapes.
+- Keep CLI/manual examples minimal and copyable.
+ - When adding new commands, document: syntax, EVENT:COMPLETED form, error cases, sample sequence.
+ - Keep the README as the single source of truth for the serial protocol.
 
 ---
-This README is intended for another developer or Copilot to implement further changes or features.
+This README is intended as the definitive reference for implementing the TypeScript backend and for extending the Pico firmware. Follow the message formats exactly to avoid breaking existing parsers.
diff --git a/pico/src/main.cpp b/pico/src/main.cpp
index cc01033..5b24ec0 100644
--- a/pico/src/main.cpp
+++ b/pico/src/main.cpp
@@ -1,50 +1,111 @@
+// Supports two transport modes:
+// 1. USB CDC (Serial) when connected over USB (preferred)
+// 2. Hardware UART0 (Serial1) on GPIO pins for headless Raspberry Pi connection
+//    Wiring for UART mode (3.3V logic only):
+//      Pi GPIO14 (TXD0, physical pin 8)  --> Pico GP1 (UART0 RX)
+//      Pi GPIO15 (RXD0, physical pin 10) <-- Pico GP0 (UART0 TX)
+//      Pi GND (any) <--------------------> Pico GND
+//    Optionally power Pico via USB. If powering from Pi 3V3, DO NOT also power via USB simultaneously.
+
 #include <Arduino.h>
 #include "Stepper.h"
 #include "ULN2003Stepper.h"
 
-
 ULN2003Stepper driver1({18, 19, 20, 21}, 4096);
 int revSteps = 0;
 
+// Generic IO pointers (assigned to USB Serial or Serial1 at runtime)
+Stream* serialIn = nullptr;  // for available()/read()
+Print*  serialOut = nullptr; // for print()/println()
+
 void setup() {
+  // Start USB CDC first
   Serial.begin(115200);
+  unsigned long start = millis();
+  while (!Serial && (millis() - start) < 2000UL) {
+    // wait up to 2 seconds for host to open USB (non-blocking fallback)
+  }
+  if (Serial) {
+    serialIn = &Serial;
+    serialOut = &Serial;
+    Serial.println("INFO: Using USB CDC Serial");
+  } else {
+    // Fall back to UART0 on GPIO0 (TX) / GPIO1 (RX)
+    Serial1.begin(115200); // default pins for UART0 in Arduino-Pico core
+    serialIn = &Serial1;
+    serialOut = &Serial1;
+    Serial1.println("INFO: Using UART0 (Serial1) on GP0(TX)/GP1(RX)");
+  }
   revSteps = driver1.get_steps_per_rev();
-  Serial.print("Steps: ");
-  Serial.println(revSteps);
+  serialOut->print("EVENT:START STEPS_PER_REV ");
+  serialOut->println(revSteps);
+}
+
+// helper: trim leading/trailing whitespace
+static String trim(const String &s) {
+  int start = 0;
+  int end = s.length() - 1;
+  while (start <= end && isspace(s.charAt(start))) start++;
+  while (end >= start && isspace(s.charAt(end))) end--;
+  if (end < start) return String("");
+  return s.substring(start, end + 1);
 }
 
 void loop() {
+  if (!serialIn || !serialOut) return; // safety
   static String input = "";
-  while (Serial.available()) {
-    char c = Serial.read();
+  while (serialIn->available()) {
+    char c = serialIn->read();
     if (c == '\n' || c == '\r') {
-      if (input.length() > 0) {
-        Serial.print("Received: ");
-        Serial.println(input);
+      String cmd = trim(input);
+      if (cmd.length() > 0) {
+        // Emit event: received
+        serialOut->print("EVENT:RECEIVED ");
+        serialOut->println(cmd);
+
+        bool success = true;
+        String result = "OK";
+
         // Parse command
-        if (input.startsWith("STEP ")) {
-          int idx1 = input.indexOf(' ');
-          int idx2 = input.indexOf(' ', idx1 + 1);
-          int steps = input.substring(idx1 + 1, idx2).toInt();
-          int dir = input.substring(idx2 + 1).toInt();
-          driver1.step(steps, dir != 0);
-          Serial.print("Motor moved ");
-          Serial.print(steps);
-          Serial.print(" steps in direction ");
-          Serial.println(dir);
-        } else if (input.startsWith("SPEED ")) {
-          int delay_us = input.substring(6).toInt();
+        if (cmd.startsWith("STEP ")) {
+          int idx1 = cmd.indexOf(' ');
+          int idx2 = cmd.indexOf(' ', idx1 + 1);
+          if (idx1 != -1 && idx2 != -1) {
+            int steps = cmd.substring(idx1 + 1, idx2).toInt();
+            int dir = cmd.substring(idx2 + 1).toInt();
+            // execute
+            driver1.step(steps, dir != 0);
+            // report completion
+            serialOut->print("EVENT:COMPLETED STEP ");
+            serialOut->print(steps);
+            serialOut->print(" ");
+            serialOut->println(dir);
+          } else {
+            success = false;
+            result = "ERROR: malformed STEP command";
+          }
+        } else if (cmd.startsWith("SPEED ")) {
+          int delay_us = cmd.substring(6).toInt();
           driver1.setSpeed(delay_us);
-          Serial.print("Speed set to ");
-          Serial.println(delay_us);
-        } else if (input.startsWith("LOG ")) {
-          Serial.print("LOG: ");
-          Serial.println(input.substring(4));
+          serialOut->print("EVENT:COMPLETED SPEED ");
+          serialOut->println(delay_us);
         } else {
-          Serial.println("Unknown command");
+          success = false;
+          result = "ERROR: unknown command";
+          serialOut->print("EVENT:COMPLETED ");
+          serialOut->println(result);
+        }
+
+        // always print a short status summary
+        if (success) {
+          serialOut->print("STATUS: ");
+          serialOut->println("OK");
+        } else {
+          serialOut->print("STATUS: ");
+          serialOut->println(result);
         }
-        input = "";
       }
+      input = "";
     } else {
       input += c;
     }