feat(web): implement complete workspace with themes, tabs, sidebar, and mobile

Transform CalcText from a single-document calculator into a full workspace
application with multi-document support, theming, and responsive mobile experience.

- Theme system: 5 presets (Light, Dark, Matrix, Midnight, Warm) + accent colors
- Document model with localStorage persistence and auto-save
- Tab bar with keyboard shortcuts (Ctrl+N/W/Tab/1-9), rename, close
- Sidebar with search, recent, favorites, folders, templates, drag-and-drop
- 5 templates: Budget, Invoice, Unit Converter, Trip Planner, Loan Calculator
- Status bar with cursor position, engine status, dedication to Igor Cassel
- Results panel: type-specific colors, click-to-copy, error hints
- Format toolbar: H, B, I, //, color labels with live preview toggle
- Syntax highlighting using theme CSS variables
- Error hover tooltips
- Mobile: bottom results tray, sidebar drawer, touch targets, safe areas
- Docker multi-stage build (Rust WASM + Vite + Nginx)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

_bmad-output/D-Design-System/00-design-system.md

@@ -0,0 +1,104 @@
+# Design System: CalcText
+
+> Components, tokens, and patterns that grow from actual usage — not upfront planning.
+
+**Created:** 2026-03-17
+**Phase:** 7 — Design System (optional)
+**Agent:** Freya (Designer)
+
+---
+
+## What Belongs Here
+
+The Design System captures reusable patterns that emerge during UX Design (Phase 4). It is not designed upfront — it crystallizes from real page specifications.
+
+**What goes here:**
+- **Design Tokens** — Colors, spacing, typography, shadows
+- **Components** — Buttons, inputs, cards, navigation elements
+- **Patterns** — Layouts, form structures, content blocks
+- **Visual Design** — Mood boards, design concepts, color and typography explorations
+- **Assets** — Logos, icons, images, graphics
+
+---
+
+## Folder Structure
+
+```
+D-Design-System/
+├── 00-design-system.md          <- This file (hub + guide)
+├── 01-Visual-Design/
+│   ├── mood-boards/
+│   ├── design-concepts/
+│   ├── color-exploration/
+│   └── typography-tests/
+├── 02-Assets/
+│   ├── logos/
+│   ├── icons/
+│   ├── images/
+│   └── graphics/
+└── components/
+    ├── interactive/
+    ├── form/
+    ├── layout/
+    ├── content/
+    ├── feedback/
+    └── navigation/
+```
+
+---
+
+## Spacing Scale
+
+_Will be defined during first design session._
+
+| Token | Value | Use |
+|-------|-------|-----|
+| space-3xs | — | Hairline gaps |
+| space-2xs | — | Minimal spacing |
+| space-xs | — | Tight spacing |
+| space-sm | — | Small gaps |
+| **space-md** | — | **Default element spacing** |
+| space-lg | — | Comfortable spacing |
+| space-xl | — | Section padding |
+| space-2xl | — | Section gaps |
+| space-3xl | — | Page-level breathing room |
+
+---
+
+## Type Scale
+
+_Will be defined during first design session._
+
+| Token | Value | Use |
+|-------|-------|-----|
+| text-3xs | — | Fine print |
+| text-2xs | — | Metadata |
+| text-xs | — | Captions |
+| text-sm | — | Labels |
+| text-md | — | Body text |
+| text-lg | — | Emphasis |
+| text-xl | — | Subheadings |
+| text-2xl | — | Section titles |
+| text-3xl | — | Hero headings |
+
+---
+
+## Tokens
+
+_Additional design tokens will be documented here as they emerge from page specifications._
+
+---
+
+## Patterns
+
+_Patterns will be documented here as spacing objects recur across pages._
+
+---
+
+## Components
+
+_Components will be documented here as patterns emerge across scenarios._
+
+---
+
+_Created using Whiteport Design Studio (WDS) methodology_