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/app/dashboard/ai-coach/strategy/page.tsx

@@ -1,4 +1,4 @@
-"use client"
+"use client"
 
 import { ExamStrategyCard } from "@/components/AI/ExamStrategyCard"
 import { StudyTimeOptimizationCard } from "@/components/AI/StudyTimeOptimizationCard"
@@ -30,8 +30,8 @@ export default function StrategyPage() {
         <div className="flex items-start justify-between gap-4 flex-wrap">
           <div>
             <h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-2">
-              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20">
-                <Zap className="text-cyan-700 dark:text-[#00F0FF]" size={28} />
+              <span className="p-2.5 rounded-xl bg-cyan-50 dark:bg-[var(--cyan-ai-10)] border border-cyan-300/60 dark:border-[var(--cyan-ai-20)]">
+                <Zap className="text-cyan-700 dark:text-[var(--cyan-ai)]" size={28} />
               </span>
               Exam Strategy &amp; Time Optimization
             </h1>
@@ -39,7 +39,7 @@ export default function StrategyPage() {
               Master time allocation per question, eliminate negative marking traps, and fine-tune your subject sequence for maximum score yield.
             </p>
           </div>
-          <span className="text-xs font-bold uppercase tracking-wider text-[#00F0FF] bg-cyan-50 dark:bg-[#00F0FF]/10 border border-cyan-300/60 dark:border-[#00F0FF]/20 px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
+          <span className="text-xs font-bold uppercase tracking-wider text-[var(--cyan-ai)] bg-cyan-50 dark:bg-[var(--cyan-ai-10)] border border-cyan-300/60 dark:border-[var(--cyan-ai-20)] px-3 py-1.5 rounded-full flex items-center gap-1.5 shrink-0 self-start">
             <Zap size={12} /> AI Powered
           </span>
         </div>
@@ -50,7 +50,7 @@ export default function StrategyPage() {
         {[
           { label: "Time Per Question", value: isDemo ? "45 sec" : "-- sec", note: isDemo ? "Target: 38 sec" : "Not calibrated", icon: <Clock size={18} className="text-red-400" />, color: "border-red-400/20 bg-red-400/5" },
           { label: "Negative Marks Lost", value: isDemo ? "−29" : "0", note: isDemo ? "Last mock test" : "0 negative marks", icon: <AlertTriangle size={18} className="text-amber-400" />, color: "border-amber-400/20 bg-amber-400/5" },
-          { label: "Attempted Questions", value: isDemo ? "93 / 120" : "0 / 120", note: isDemo ? "+7 vs last test" : "0 attempted", icon: <Target size={18} className="text-[#00F0FF]" />, color: "border-[#00F0FF]/20 bg-[#00F0FF]/5" },
+          { label: "Attempted Questions", value: isDemo ? "93 / 120" : "0 / 120", note: isDemo ? "+7 vs last test" : "0 attempted", icon: <Target size={18} className="text-[var(--cyan-ai)]" />, color: "border-[var(--cyan-ai-20)] bg-[var(--cyan-ai-10)]" },
           { label: "Score Yield", value: isDemo ? "214" : "0", note: isDemo ? "Predicted score" : "Baseline", icon: <TrendingUp size={18} className="text-green-400" />, color: "border-green-400/20 bg-green-400/5" },
         ].map((kpi) => (
           <Card key={kpi.label} className={`rounded-2xl border ${kpi.color} hover:scale-[1.02] transition-transform`}>
@@ -68,7 +68,7 @@ export default function StrategyPage() {
       <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
         <div className="space-y-3">
           <div className="flex items-center gap-2 text-sm font-black uppercase tracking-wider text-muted-foreground">
-            <Target size={16} className="text-[#00F0FF]" />
+            <Target size={16} className="text-[var(--cyan-ai)]" />
             Subject Sequence Strategy
           </div>
           <ExamStrategyCard />
@@ -131,7 +131,7 @@ export default function StrategyPage() {
       </Card>
 
       {/* Strategy Tips */}
-      <Card className="p-6 bg-gradient-to-br from-[#00F0FF]/5 via-secondary/10 to-background border border-[#00F0FF]/20 rounded-3xl">
+      <Card className="p-6 bg-gradient-to-br from-[var(--cyan-ai-10)] via-secondary/10 to-background border border-[var(--cyan-ai-20)] rounded-3xl">
         <div className="flex items-center gap-2 mb-4">
           <Lightbulb size={20} className="text-yellow-400" />
           <h3 className="text-base font-black tracking-tight">AI Strategy Recommendations</h3>
@@ -140,7 +140,7 @@ export default function StrategyPage() {
           {[
             { tip: "Start with Chemistry (highest accuracy) to build momentum and bank easy marks in the first 40 minutes.", color: "text-green-400", label: "Opening Strategy" },
             { tip: "Attempt Physics only if you are 80%+ confident per question. Otherwise, mark and skip — recover in last 10 min buffer.", color: "text-red-400", label: "Physics Guard" },
-            { tip: "Reserve 10–15 minutes at the end to revisit starred questions. Your review accuracy is historically 20% higher than first-attempt.", color: "text-[#00F0FF]", label: "Review Window" },
+            { tip: "Reserve 10–15 minutes at the end to revisit starred questions. Your review accuracy is historically 20% higher than first-attempt.", color: "text-[var(--cyan-ai)]", label: "Review Window" },
           ].map((s) => (
             <div key={s.label} className="p-4 rounded-xl bg-white/5 border border-border/30 space-y-2">
               <div className={`text-xs font-black uppercase tracking-wider ${s.color}`}>{s.label}</div>