design: cyan -> rgb(12,96,96) in light theme, #00F0FF stays in dark theme

- globals.css: add --cyan-ai CSS variable (rgb(12,96,96) light / #00F0FF dark)
  + opacity variants --cyan-ai-10/20/30/40/50/80
- Bulk replace all #00F0FF hardcoded Tailwind arbitrary values with
  var(--cyan-ai) / var(--cyan-ai-10) / etc across 55+ TSX/TS files
- Shadow glow colours also updated (suppressed by box-shadow:none in light mode)
- TypeScript: 0 errors

src/components/AI/MistakeHeatmap.tsx

@@ -1,4 +1,4 @@
-"use client"
+"use client"
 
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
 import { Badge } from "@/components/ui/badge"
@@ -39,7 +39,7 @@ export function MistakeHeatmap() {
         <div className="flex items-center justify-between">
           <CardTitle className="text-xl flex items-center gap-2">
             <Flame className="text-orange-500" /> Mistake Heatmap
-            <Badge variant="outline" className="border-[#00F0FF]/30 text-[#00F0FF] bg-[#00F0FF]/5 rounded-md text-[10px] uppercase font-bold ml-2 hidden sm:flex">AI Coach</Badge>
+            <Badge variant="outline" className="border-[var(--cyan-ai-30)] text-[var(--cyan-ai)] bg-[var(--cyan-ai-10)] rounded-md text-[10px] uppercase font-bold ml-2 hidden sm:flex">AI Coach</Badge>
           </CardTitle>
           <Info size={16} className="text-muted-foreground" />
         </div>