feat(style): update fonts & themes in frontend (#14)

Reviewed-on: https://gitea.vodsystem.ddns.net/dylan/vod-system/pulls/14

frontend/src/pages/MyClips.tsx

@@ -26,7 +26,7 @@ const MyClips = () => {
 
     return (
         <div className="p-6">
-            <h1 className="text-2xl font-semibold text-gray-900 mb-6">My Clips</h1>
+            <h1 className="text-4xl font-heading text-text-primary mb-6">My Clips</h1>
 
             <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4">
                 {clips.map((clip) => (
@@ -43,13 +43,13 @@ const MyClips = () => {
             </div>
 
             {clips.length === 0 && !error && (
-                <div className="flex flex-col items-center justify-center py-16 text-gray-400">
+                <div className="flex flex-col items-center justify-center py-16 text-muted">
                     <p className="text-base">No clips yet.</p>
                     <p className="text-sm mt-1">Upload your first clip to get started.</p>
                 </div>
             )}
 
-            {error && <p className="text-sm text-red-500 mt-4">{error.toString()}</p>}
+            {error && <p className="text-sm text-error mt-4">{error.toString()}</p>}
         </div>
     );
 }