feat: phase 0 foundation — monorepo scaffold, backend, frontend, CI, docker

Establishes the skeleton every later phase builds on: Go+Gin API with
zap logging, /api/healthz, SQLite+goose runner; Vite+React18+TS strict+
Tailwind v4 frontend with bento-mono theme tokens; openapi.yaml driving
a generated TS client; oxlint with vendored anti-slop rules; GitHub CI;
multi-stage Dockerfile -> 33.6MB distroless image; docker compose up
serves the blank board.


Generated with [Devin](https://devin.ai)

Authored By: TDvorak <[email protected]>
Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>

apps/frontend/src/App.tsx

@@ -0,0 +1,54 @@
+import { useEffect, useState } from "react";
+import { Moon, Plus, Sun } from "lucide-react";
+
+type Theme = "dark" | "light";
+
+function initialTheme(): Theme {
+	const saved = localStorage.getItem("dash.theme");
+	return saved === "light" ? "light" : "dark";
+}
+
+export default function App() {
+	const [theme, setTheme] = useState<Theme>(initialTheme);
+
+	useEffect(() => {
+		document.documentElement.dataset.theme = theme;
+		localStorage.setItem("dash.theme", theme);
+	}, [theme]);
+
+	return (
+		<div className="font-sans">
+			<header className="sticky top-0 z-10 flex items-center gap-3.5 border-b border-border bg-bg/80 px-7 py-3.5 backdrop-blur-md">
+				<div className="flex items-center gap-2.5 text-[15px] font-semibold tracking-tight">
+					<svg width="18" height="18" viewBox="0 0 18 18" fill="none" aria-hidden>
+						<rect x="1" y="1" width="7" height="7" rx="1.5" fill="currentColor" />
+						<rect x="10" y="1" width="7" height="7" rx="1.5" fill="currentColor" opacity=".45" />
+						<rect x="1" y="10" width="7" height="7" rx="1.5" fill="currentColor" opacity=".45" />
+						<rect x="10" y="10" width="7" height="7" rx="1.5" fill="currentColor" />
+					</svg>
+					Dash
+				</div>
+				<button
+					type="button"
+					onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
+					aria-label="Toggle theme"
+					className="ml-auto flex size-[34px] items-center justify-center rounded-lg border border-border bg-surface text-text-dim transition-colors hover:border-border-strong hover:text-text active:scale-95"
+				>
+					{theme === "dark" ? <Moon size={15} strokeWidth={1.8} /> : <Sun size={15} strokeWidth={1.8} />}
+				</button>
+				<button
+					type="button"
+					className="flex h-[34px] items-center gap-1.5 rounded-lg bg-text px-3.5 text-[13px] font-medium text-bg transition-transform active:scale-95"
+				>
+					<Plus size={13} strokeWidth={2.2} />
+					Add service
+				</button>
+			</header>
+			<main className="mx-auto max-w-[1140px] px-7 pb-24 pt-9">
+				<p className="text-center text-[13px] text-text-faint">
+					No sections yet. Add a service to get started.
+				</p>
+			</main>
+		</div>
+	);
+}

apps/frontend/src/index.css

@@ -0,0 +1,81 @@
+@import "tailwindcss";
+
+/* Design tokens — ported from mockups/d-bento-mono.html.
+   Semantic vars flip on [data-theme]; Tailwind utilities map via @theme. */
+:root {
+  --ease: cubic-bezier(0.2, 0, 0, 1);
+}
+
+[data-theme="dark"] {
+  --bg: #0a0a0a;
+  --surface: #111111;
+  --surface-hover: #161616;
+  --border: rgba(255, 255, 255, 0.08);
+  --border-strong: rgba(255, 255, 255, 0.14);
+  --text: #fafafa;
+  --text-dim: #a1a1aa;
+  --text-faint: #52525b;
+  --accent: #3b82f6;
+  --up: #22c55e;
+  --down: #f59e0b;
+  --icon-bg: #1c1c1e;
+  --popover: #141414;
+}
+
+[data-theme="light"] {
+  --bg: #fafafa;
+  --surface: #ffffff;
+  --surface-hover: #f4f4f5;
+  --border: rgba(0, 0, 0, 0.08);
+  --border-strong: rgba(0, 0, 0, 0.16);
+  --text: #09090b;
+  --text-dim: #52525b;
+  --text-faint: #a1a1aa;
+  --accent: #2563eb;
+  --up: #16a34a;
+  --down: #d97706;
+  --icon-bg: #f4f4f5;
+  --popover: #ffffff;
+}
+
+@theme inline {
+  --color-bg: var(--bg);
+  --color-surface: var(--surface);
+  --color-surface-hover: var(--surface-hover);
+  --color-border: var(--border);
+  --color-border-strong: var(--border-strong);
+  --color-text: var(--text);
+  --color-text-dim: var(--text-dim);
+  --color-text-faint: var(--text-faint);
+  --color-accent: var(--accent);
+  --color-up: var(--up);
+  --color-down: var(--down);
+  --color-icon-bg: var(--icon-bg);
+  --color-popover: var(--popover);
+  --font-sans: "Geist Variable", ui-sans-serif, system-ui, -apple-system, sans-serif;
+  --font-mono: "Geist Mono Variable", ui-monospace, monospace;
+}
+
+html {
+  -webkit-font-smoothing: antialiased;
+}
+
+body {
+  background: var(--bg);
+  color: var(--text);
+  min-height: 100dvh;
+  transition:
+    background 200ms var(--ease),
+    color 200ms var(--ease);
+}
+
+:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 2px;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  * {
+    transition: none !important;
+  }
+}

apps/frontend/src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+	return twMerge(clsx(inputs));
+}

apps/frontend/src/main.tsx

@@ -0,0 +1,16 @@
+import "@fontsource-variable/geist";
+import "@fontsource-variable/geist-mono";
+import "./index.css";
+
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import App from "./App.tsx";
+
+const root = document.getElementById("root");
+if (!root) throw new Error("#root missing");
+
+createRoot(root).render(
+	<StrictMode>
+		<App />
+	</StrictMode>,
+);

apps/frontend/src/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />