feat: Professional UI overhaul - design system, CSS/JS extraction, settings reorg (#66)

[deucebucket]

The Problem

The frontend works but looks like a prototype. CSS is 100% inlined (728 lines in base.html), JS helpers duplicated 4 times, settings page is 3,373 lines across 7 tabs with related settings scattered, mobile is broken (1 media query total), and colors are inconsistent.

The Fix - Complete Professional Overhaul

1. Design System & CSS Extraction

• Extract all CSS to static/css/style.css
• Proper design tokens (spacing, colors, typography, shadows)
• Fix color palette: kill #00ff00, standardize on theme variables everywhere
• Consistent card, table, button, badge, modal styling across ALL pages
• Dark theme that looks invested, not default Bootstrap dark

2. JS Consolidation

• Extract shared helpers to static/js/common.js (escapeHtml x4, showToast, fetch helpers)
• Remove duplicate edit modal code (history.html + queue.html)
• Standardize on toasts (kill all confirm()/alert() dialogs)

3. Settings Reorganization

• Reduce 7 tabs to ~4 logical groups
• Group related settings together (confidence + AI config, processing + pipeline)
• Clean conditional field show/hide

4. Mobile Responsive Pass

• table-responsive wrappers on ALL tables
• Media queries for 576px, 768px, 1024px breakpoints
• Settings tabs → accordion on mobile
• Modal sizing for small screens

5. Consistency Pass

• Every page uses same card style, same table style, same button patterns
• Navigation state preserved across all pages
• No style dropping when navigating between pages

[deucebucket]

Implemented and merged to develop in commit 2986cdb