Redesign dashboard with steampunk neon theme and live gauges.

Ambient background, 3D neon cards, brass HUD styling, glowing charts, gauge rings, and refreshed Command Deck, Fleet Roster, Forge, and Calibrate pages.

server/web/src/components/NeonCard/NeonCard.css

@@ -0,0 +1,53 @@
+.neon-card {
+  padding: 1.5rem;
+}
+
+.neon-card-rim {
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  padding: 1px;
+  background: linear-gradient(
+    135deg,
+    var(--brass-light) 0%,
+    transparent 25%,
+    transparent 75%,
+    var(--neon-cyan) 100%
+  );
+  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  pointer-events: none;
+  opacity: 0.6;
+  z-index: 2;
+}
+
+.neon-card-cyan .neon-card-rim {
+  background: linear-gradient(135deg, var(--neon-cyan), transparent 40%, var(--brass) 100%);
+  opacity: 0.8;
+}
+
+.neon-card-magenta .neon-card-rim {
+  background: linear-gradient(135deg, var(--neon-magenta), transparent 50%, var(--brass) 100%);
+}
+
+.neon-card-amber .neon-card-rim {
+  background: linear-gradient(135deg, var(--neon-amber), var(--brass-dark) 100%);
+}
+
+.neon-card-green .neon-card-rim {
+  background: linear-gradient(135deg, var(--neon-green), transparent 50%, var(--brass) 100%);
+}
+
+.neon-card-purple .neon-card-rim {
+  background: linear-gradient(135deg, var(--neon-purple), var(--neon-cyan) 100%);
+}
+
+.neon-card-cyan:hover {
+  box-shadow: var(--shadow-panel), var(--shadow-neon-cyan);
+}
+
+.neon-card-magenta:hover {
+  box-shadow: var(--shadow-panel), var(--shadow-neon-magenta);
+}

server/web/src/components/NeonCard/NeonCard.tsx

@@ -0,0 +1,32 @@
+import { ReactNode, CSSProperties } from 'react';
+import './NeonCard.css';
+
+type Accent = 'cyan' | 'magenta' | 'amber' | 'green' | 'purple' | 'brass';
+
+interface NeonCardProps {
+  children: ReactNode;
+  className?: string;
+  accent?: Accent;
+  tilt3d?: boolean;
+  hud?: boolean;
+  style?: CSSProperties;
+}
+
+export default function NeonCard({
+  children,
+  className = '',
+  accent = 'brass',
+  tilt3d = true,
+  hud = false,
+  style,
+}: NeonCardProps) {
+  return (
+    <div
+      className={`neon-card neon-card-${accent} ${tilt3d ? 'neon-card-3d' : ''} ${hud ? 'hud-corners' : ''} ${className}`}
+      style={style}
+    >
+      <div className="neon-card-rim" />
+      {children}
+    </div>
+  );
+}