Visual redesign, message input, reversed messages, systemd service

- New visual identity: solid dark cards, purple accent, iOS-like feel
- Session replay: newest messages first, message input with send button
- Chat proxy route for sending messages to sessions
- systemd user service with deploy script
- All pages restyled: Pulse, Memory, History, Skills, Cron, Soul, Config

components/StatsCard.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { BarChart3 } from "lucide-react";
 import { useSessions } from "@/lib/hooks";
 import { formatTokens } from "@/lib/utils";
 
@@ -10,30 +9,22 @@ export function StatsCard() {
   const items = data?.items || [];
   const total = data?.total || 0;
   const totalTokens = items.reduce((s, i) => s + i.input_tokens + i.output_tokens, 0);
-  const totalCost = items.reduce((s, i) => s + (i.estimated_cost_usd || 0), 0);
   const platforms = new Set(items.map((i) => i.source));
 
-  const stats = [
-    { label: "Sessions", value: String(total) },
-    { label: "Tokens (recent)", value: formatTokens(totalTokens) },
-    { label: "Platforms", value: String(platforms.size) },
-    ...(totalCost > 0 ? [{ label: "Est. Cost", value: "$" + totalCost.toFixed(2) }] : []),
-  ];
-
   return (
-    <div className="glass p-4">
-      <div className="flex items-center gap-2 mb-3">
-        <BarChart3 size={16} style={{ color: "#22c55e" }} />
-        <span className="text-sm font-medium text-zinc-200">Stats</span>
-      </div>
-      <div className="grid grid-cols-3 gap-3">
-        {stats.map((s) => (
-          <div key={s.label} className="text-center">
-            <div className="text-lg font-bold text-zinc-200">{s.value}</div>
-            <div className="text-[10px] text-zinc-500">{s.label}</div>
-          </div>
-        ))}
-      </div>
+    <div className="card p-4 grid grid-cols-3 gap-4">
+      <Stat value={String(total)} label="Sessions" />
+      <Stat value={formatTokens(totalTokens)} label="Tokens" />
+      <Stat value={String(platforms.size)} label="Platforms" />
+    </div>
+  );
+}
+
+function Stat({ value, label }: { value: string; label: string }) {
+  return (
+    <div className="text-center">
+      <div className="text-xl font-semibold" style={{ color: "var(--text-1)" }}>{value}</div>
+      <div className="text-[11px]" style={{ color: "var(--text-3)" }}>{label}</div>
     </div>
   );
 }