feat(frontend): skeleton loading states, empty-state glow, light-mode polish

- Add shared skeleton building blocks (SkeletonHero, SkeletonMetricRow,
  SkeletonPanel, SkeletonRows) and wire them into every view's initial
  loading branch, replacing bare spinners for a cohesive shimmering shell.
- Polish EmptyState with a glow-ring icon chip instead of a flat icon.
- Harden .light theme: color-scheme, tuned scrollbar + selection for pale
  canvas. Dark/light theme toggle (next-themes) already persisted in TopBar.

services/frontend/src/app/(dashboard)/media/view.tsx

@@ -12,7 +12,12 @@ import {
 import { useEffect, useState } from "react";
 import { useAmbient } from "@/components/ambient/ambient-context";
 import { Button, GlassPanel, Input, toast } from "@/components/primitives";
-import { ErrorState, LoadingState, SectionHeader } from "@/components/shared";
+import {
+  ErrorState,
+  SectionHeader,
+  SkeletonHero,
+  SkeletonPanel,
+} from "@/components/shared";
 import {
   useMediaLoop,
   useMediaQueue,
@@ -74,7 +79,13 @@ export function MediaView({ initialStatus }: { initialStatus?: MediaState }) {
   };
 
   if (error && !media) return <ErrorState error={error} />;
-  if (!media && isLoading) return <LoadingState label="Reading deck" />;
+  if (!media && isLoading)
+    return (
+      <div className="space-y-5">
+        <SkeletonHero />
+        <SkeletonPanel rows={4} />
+      </div>
+    );
 
   return (
     <div className="space-y-5">