feat: add Calculator & Grapher tool

Adds a full-featured mathematical calculator and interactive function
grapher at /calculate. Powered by Math.js v15 with a HiDPI Canvas
renderer for the graph.

- Evaluates arbitrary math expressions (trig, log, complex, matrices,
  factorials, combinatorics, and more) with named variable scope
- Persists history (50 entries) and variables via localStorage
- 32 quick-insert buttons for constants and functions
- Interactive graph: pan (drag), zoom (scroll), crosshair tooltip
  showing cursor coords and f₁(x)…f₈(x) values simultaneously
- Up to 8 color-coded functions with inline color pickers and
  visibility toggles
- Discontinuity detection for functions like tan(x)
- Adaptive grid labels that rescale with zoom
- Responsive layout: 2/5–3/5 split on desktop, tabbed on mobile

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

components/calculate/Calculator.tsx

@@ -0,0 +1,62 @@
+'use client';
+
+import { useState } from 'react';
+import { cn } from '@/lib/utils';
+import { ExpressionPanel } from './ExpressionPanel';
+import { GraphPanel } from './GraphPanel';
+
+type Tab = 'calc' | 'graph';
+
+export default function Calculator() {
+  const [tab, setTab] = useState<Tab>('calc');
+
+  return (
+    <div className="flex flex-col gap-4">
+
+      {/* Mobile tab switcher — hidden on lg+ */}
+      <div className="flex lg:hidden glass rounded-xl p-1 gap-1">
+        {(['calc', 'graph'] as Tab[]).map((t) => (
+          <button
+            key={t}
+            onClick={() => setTab(t)}
+            className={cn(
+              'flex-1 py-2.5 rounded-lg text-sm font-medium capitalize transition-all',
+              tab === t
+                ? 'bg-primary text-primary-foreground shadow-sm'
+                : 'text-muted-foreground hover:text-foreground'
+            )}
+          >
+            {t === 'calc' ? 'Calculator' : 'Graph'}
+          </button>
+        ))}
+      </div>
+
+      {/* Main layout — side-by-side on lg, tabbed on mobile */}
+      <div
+        className="grid grid-cols-1 lg:grid-cols-5 gap-4"
+        style={{ height: 'calc(100svh - 220px)', minHeight: '620px' }}
+      >
+        {/* Expression panel */}
+        <div
+          className={cn(
+            'lg:col-span-2 overflow-hidden flex flex-col',
+            tab !== 'calc' && 'hidden lg:flex'
+          )}
+        >
+          <ExpressionPanel />
+        </div>
+
+        {/* Graph panel */}
+        <div
+          className={cn(
+            'lg:col-span-3 overflow-hidden flex flex-col',
+            tab !== 'graph' && 'hidden lg:flex'
+          )}
+        >
+          <GraphPanel />
+        </div>
+      </div>
+
+    </div>
+  );
+}