feat(frontend): Ambient/WebGL console revamp + lint/type cleanup

Ground-up rebuild of the GMW frontend as an Ambient Field console:
- WebGL ambient background (Three.js shader, drifting motes, reduced-motion aware)
- Glassmorphism dark cyber theme across all 8 routes
- SSR page + client view split with SWR fallback; realtime via WebSocket
- Command palette (Cmd+K), chatbot FAB, guild/channel pickers
- Chart primitives: donut, radial-gauge, area-activity, sparkline, equalizer

Cleanup (review pass):
- Remove stray Puppeteer nav-test/nav-debug scripts
- Replace non-null assertions with guards (dashboard/moderation)
- Drop unused useGuilds fetches in messages/voice views
- Type implicit-any `let` declarations across pages
- Add a11y roles/labels to SVG charts and audio, tidy imports

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

@@ -1,29 +1,27 @@
 "use client";
 
-import { useEffect, useState } from "react";
 import {
   ListMusic,
-  Pause,
   Play,
+  Radio,
   Repeat,
   SkipForward,
   Square,
-  Radio,
 } from "lucide-react";
-import { useWebSocket } from "@/lib/ws/context";
+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 {
-  useMediaState,
+  useMediaLoop,
   useMediaQueue,
   useMediaSkip,
+  useMediaState,
   useMediaStop,
-  useMediaLoop,
   useMediaWsSync,
 } from "@/hooks";
-import { useAmbient } from "@/components/ambient/ambient-context";
-import { GlassPanel, GlassCard, Button, Input } from "@/components/primitives";
-import { SectionHeader, ErrorState, LoadingState } from "@/components/shared";
-import { toast } from "@/components/primitives";
 import type { MediaState } from "@/lib/types";
+import { useWebSocket } from "@/lib/ws/context";
 
 export function MediaView({ initialStatus }: { initialStatus?: MediaState }) {
   const ws = useWebSocket();
@@ -43,7 +41,11 @@ export function MediaView({ initialStatus }: { initialStatus?: MediaState }) {
 
   const tone = playing ? "signal" : queueList.length ? "amber" : "signal";
   useEffect(() => {
-    ambient.set(tone, playing ? 0.5 : 0.25, playing ? "now playing" : "media idle");
+    ambient.set(
+      tone,
+      playing ? 0.5 : 0.25,
+      playing ? "now playing" : "media idle",
+    );
   }, [tone, playing, ambient]);
 
   const onPlay = async () => {
@@ -57,7 +59,11 @@ export function MediaView({ initialStatus }: { initialStatus?: MediaState }) {
       setUrl("");
       toast({ title: "Queued", tone: "signal" });
     } catch (e) {
-      toast({ title: "Queue failed", description: String(e), tone: "vermilion" });
+      toast({
+        title: "Queue failed",
+        description: String(e),
+        tone: "vermilion",
+      });
     }
   };
 
@@ -83,16 +89,33 @@ export function MediaView({ initialStatus }: { initialStatus?: MediaState }) {
               {current?.title ?? "Nothing queued"}
             </h2>
             {current?.source && (
-              <div className="mono mt-1 truncate text-xs text-ink-faint">{current.source}</div>
+              <div className="mono mt-1 truncate text-xs text-ink-faint">
+                {current.source}
+              </div>
             )}
             <div className="mt-4 flex flex-wrap items-center gap-2">
-              <Button variant="primary" size="sm" onClick={onPlay} disabled={queue.isPending}>
+              <Button
+                variant="primary"
+                size="sm"
+                onClick={onPlay}
+                disabled={queue.isPending}
+              >
                 <Play className="size-4" /> Queue & play
               </Button>
-              <Button variant="outline" size="sm" onClick={() => skip.mutate()} disabled={skip.isPending}>
+              <Button
+                variant="outline"
+                size="sm"
+                onClick={() => skip.mutate()}
+                disabled={skip.isPending}
+              >
                 <SkipForward className="size-4" /> Skip
               </Button>
-              <Button variant="outline" size="sm" onClick={() => stop.mutate()} disabled={stop.isPending}>
+              <Button
+                variant="outline"
+                size="sm"
+                onClick={() => stop.mutate()}
+                disabled={stop.isPending}
+              >
                 <Square className="size-4" /> Stop
               </Button>
               <Button
@@ -121,22 +144,33 @@ export function MediaView({ initialStatus }: { initialStatus?: MediaState }) {
         <SectionHeader
           eyebrow="up next"
           title="Queue"
-          action={<span className="mono text-xs text-ink-faint">{queueList.length} tracks</span>}
+          action={
+            <span className="mono text-xs text-ink-faint">
+              {queueList.length} tracks
+            </span>
+          }
         />
         {queueList.length === 0 ? (
           <div className="flex flex-col items-center gap-2 py-10 text-center">
             <Radio className="size-6 text-ink-faint" />
             <div className="text-sm text-ink-soft">Queue is empty</div>
-            <div className="text-xs text-ink-faint">Paste a URL above to start playback.</div>
+            <div className="text-xs text-ink-faint">
+              Paste a URL above to start playback.
+            </div>
           </div>
         ) : (
           <div className="space-y-2">
             {queueList.map((item, i) => (
-              <div key={`${item.source}-${i}`} className="flex items-center gap-3 rounded-[10px] border border-hairline bg-white/5 px-3 py-2.5">
+              <div
+                key={`${item.source}-${i}`}
+                className="flex items-center gap-3 rounded-[10px] border border-hairline bg-white/5 px-3 py-2.5"
+              >
                 <span className="mono w-5 text-ink-faint">{i + 1}</span>
                 <div className="min-w-0 flex-1">
                   <div className="truncate text-sm text-ink">{item.title}</div>
-                  <div className="mono truncate text-[0.65rem] text-ink-faint">{item.source}</div>
+                  <div className="mono truncate text-[0.65rem] text-ink-faint">
+                    {item.source}
+                  </div>
                 </div>
                 <span className="pill">{item.mode ?? "music"}</span>
               </div>