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>

calcpad-web/src/styles/status-bar.css

@@ -0,0 +1,159 @@
+/* ---------- Status Bar ---------- */
+
+.status-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 24px;
+  padding: 0 12px;
+  background: var(--bg-secondary);
+  border-top: 1px solid var(--border);
+  flex-shrink: 0;
+  font-family: var(--mono);
+  font-size: 11px;
+  color: var(--text);
+  opacity: 0.8;
+  user-select: none;
+}
+
+.status-bar-left,
+.status-bar-right {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.status-bar-engine {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.status-bar-dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+}
+
+.status-bar-dot.ready {
+  background: var(--success);
+}
+
+.status-bar-dot.loading {
+  background: var(--warning);
+  animation: pulse 1.5s ease-in-out infinite;
+}
+
+.status-bar-dedication {
+  opacity: 0.6;
+  font-family: var(--sans);
+  font-size: 10px;
+  letter-spacing: 0.2px;
+  cursor: pointer;
+  transition: opacity 0.15s;
+}
+
+.status-bar-dedication:hover {
+  opacity: 1;
+}
+
+.status-bar-heart {
+  color: #e53e3e;
+  font-size: 11px;
+}
+
+/* ---------- Dedication Overlay ---------- */
+
+.dedication-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 500;
+  animation: dedication-fade-in 0.2s ease-out;
+}
+
+@keyframes dedication-fade-in {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+.dedication-card {
+  background: var(--bg);
+  border: 1px solid var(--border);
+  border-radius: 16px;
+  padding: 40px;
+  max-width: 420px;
+  text-align: center;
+  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+  animation: dedication-card-in 0.3s ease-out;
+}
+
+@keyframes dedication-card-in {
+  from { opacity: 0; transform: scale(0.9) translateY(20px); }
+  to { opacity: 1; transform: scale(1) translateY(0); }
+}
+
+.dedication-heart {
+  font-size: 48px;
+  color: #e53e3e;
+  margin-bottom: 16px;
+  animation: dedication-beat 1.2s ease-in-out infinite;
+}
+
+@keyframes dedication-beat {
+  0%, 100% { transform: scale(1); }
+  14% { transform: scale(1.15); }
+  28% { transform: scale(1); }
+  42% { transform: scale(1.1); }
+  56% { transform: scale(1); }
+}
+
+.dedication-card h2 {
+  margin: 0 0 16px;
+  font-size: 22px;
+  font-weight: 600;
+  color: var(--text-h);
+  font-family: var(--sans);
+}
+
+.dedication-card p {
+  margin: 0 0 12px;
+  font-size: 14px;
+  line-height: 1.6;
+  color: var(--text);
+  font-family: var(--sans);
+}
+
+.dedication-tagline {
+  font-style: italic;
+  opacity: 0.7;
+  font-size: 13px !important;
+}
+
+.dedication-close {
+  margin-top: 20px;
+  padding: 8px 24px;
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text);
+  font-size: 13px;
+  font-family: var(--sans);
+  cursor: pointer;
+  transition: background 0.15s, color 0.15s;
+}
+
+.dedication-close:hover {
+  background: var(--accent-bg);
+  color: var(--accent);
+  border-color: var(--accent-border);
+}
+
+@media (max-width: 768px) {
+  .status-bar-left span:not(:first-child) {
+    display: none;
+  }
+}