feat(design): glass surfaces by role, the static Badge, LinkButton, user pickers on the Combobox (E28 S3d1)

frontend/src/components/legal/LegalLayout.tsx

@@ -13,6 +13,7 @@ import { setLanguage, type LangCode } from "../../i18n";
 import { formatDate } from "../../lib/format";
 import { send } from "../../lib/http";
 import LanguageSwitcher from "../LanguageSwitcher";
+import { SURFACE } from "../ui/surfaces";
 
 // The day the text last changed materially — bump it with every edit of either body.
 const LAST_UPDATED = "2026-09-17";
@@ -86,7 +87,7 @@ export default function LegalLayout({ title, children }: { title: string; childr
           {/* The landing page's own picker, so the public pages switch language one way. */}
           <LanguageSwitcher value={i18n.language as LangCode} onChange={setLanguage} />
         </div>
-        <div className="glass rounded-2xl p-8">
+        <div className={`${SURFACE.panel} p-8`}>
           <h1 className="text-2xl font-semibold">{title}</h1>
           <p className="text-xs text-muted mt-1 mb-6">
             {t("legal.lastUpdated", { date: formatDate(LAST_UPDATED, i18n.language) })}