Add vpinball: a browser Visual Pinball player

Next.js app that plays real .vpx tables via @valknar/vpinball-wasm
(WebAssembly Visual Pinball). Demo mode with the bundled default
table, drag-and-drop custom table upload, a cabinet-styled UI with a
coin-door HUD (fullscreen/stats/info/eject), a custom 404 page, PWA
support (hand-rolled service worker), and a static Docker Compose
deployment behind nginx.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_012hQoM3jJT1Lx7CMTciMzvD

components/ui/Button.tsx

@@ -0,0 +1,22 @@
+import type { ButtonHTMLAttributes } from "react";
+
+export type ButtonVariant = "primary" | "outline" | "quiet";
+
+const variantClasses: Record<ButtonVariant, string> = {
+  primary:
+    "border-2 border-marquee bg-marquee/10 text-marquee shadow-[0_0_24px_rgba(255,122,41,0.35)] hover:bg-marquee/20",
+  outline: "border-2 border-chrome/50 text-paper hover:border-arc hover:text-arc",
+  quiet: "border border-transparent text-chrome hover:text-paper",
+};
+
+export function buttonClassName(variant: ButtonVariant = "primary", className = ""): string {
+  return `inline-block rounded-full px-6 py-3 font-display text-lg tracking-wide transition ${variantClasses[variant]} ${className}`;
+}
+
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: ButtonVariant;
+}
+
+export default function Button({ variant = "primary", className = "", ...props }: ButtonProps) {
+  return <button className={buttonClassName(variant, className)} {...props} />;
+}

components/ui/Panel.tsx

@@ -0,0 +1,10 @@
+import type { HTMLAttributes } from "react";
+
+export default function Panel({ className = "", ...props }: HTMLAttributes<HTMLDivElement>) {
+  return (
+    <div
+      className={`rounded-lg border border-chrome/30 bg-ash/80 shadow-lg ${className}`}
+      {...props}
+    />
+  );
+}