Fix: Use @shared/* alias instead of relative paths for Docker compat

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

studio-v2/components/gamification/StarRating.tsx

@@ -0,0 +1,45 @@
+'use client'
+
+import React from 'react'
+
+interface StarRatingProps {
+  stars: number       // 0-3
+  total?: number      // total stars earned (shown as badge)
+  size?: 'sm' | 'md' | 'lg'
+  animated?: boolean
+  showLabel?: boolean
+}
+
+const sizeMap = { sm: 'text-lg', md: 'text-2xl', lg: 'text-4xl' }
+
+export function StarRating({ stars, total, size = 'md', animated = false, showLabel = false }: StarRatingProps) {
+  return (
+    <div className="inline-flex items-center gap-1">
+      {[1, 2, 3].map((i) => (
+        <span
+          key={i}
+          className={`${sizeMap[size]} transition-all ${
+            i <= stars
+              ? `text-yellow-400 ${animated ? 'animate-bounce' : ''}`
+              : 'text-gray-300 dark:text-gray-600'
+          }`}
+          style={animated && i <= stars ? { animationDelay: `${(i - 1) * 150}ms` } : undefined}
+        >
+          {i <= stars ? '\u2B50' : '\u2606'}
+        </span>
+      ))}
+      {total != null && showLabel && (
+        <span className="ml-1 text-sm font-bold text-yellow-500 tabular-nums">{total}</span>
+      )}
+    </div>
+  )
+}
+
+/** Calculate stars from accuracy percentage */
+export function accuracyToStars(correct: number, total: number): number {
+  if (total === 0) return 0
+  const pct = (correct / total) * 100
+  if (pct >= 100) return 3
+  if (pct >= 70) return 2
+  return 1
+}