feat(ui): semantic light/dark tokens, ThemeProvider with FOUC guard, token-restyle Toaster/Cover

frontend/src/components/Toaster.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState, type ReactNode } from "react";
-import { IconAlert, IconCheck } from "./icons";
+import { CheckCircle2, XCircle } from "lucide-react";
 
 type Toast = { id: number; kind: "ok" | "err"; text: ReactNode };
 
@@ -32,13 +32,11 @@ export function Toaster() {
         <div
           key={t.id}
           role="status"
-          className={`fx-rise flex max-w-sm items-center gap-2 rounded-xl px-4 py-2.5 text-sm shadow-xl ring-1 backdrop-blur-md ${
-            t.kind === "ok"
-              ? "bg-emerald-950/90 text-emerald-100 ring-emerald-500/25"
-              : "bg-red-950/90 text-red-100 ring-red-500/30"
+          className={`fx-rise flex max-w-sm items-center gap-2 rounded-lg border bg-card px-4 py-2.5 text-sm text-card-foreground shadow-lg ${
+            t.kind === "ok" ? "border-border" : "border-destructive/40"
           }`}
         >
-          {t.kind === "ok" ? <IconCheck className="size-4 shrink-0 text-emerald-400" /> : <IconAlert className="size-4 shrink-0 text-red-400" />}
+          {t.kind === "ok" ? <CheckCircle2 className="size-4 shrink-0 text-accent" /> : <XCircle className="size-4 shrink-0 text-destructive" />}
           {t.text}
         </div>
       ))}