test(web-app-gitlab): assert the palette on the admin dashboard and users list

The design spec reached the admin area only to prove root can sign in
there; nothing checked that the admin pages take the palette. The new
test opens /admin as root and asserts in light and dark mode that the
frame, the panel and the dashboard cards take their surface tokens, the
card titles --design-text and the card dividers --design-border, then
checks the cards against light and dark and the headings, titles, links
and dividers for contrast. On /admin/users the New user action must
take --design-primary on --design-on-primary and stay readable.

The selectors follow the CNG v19.5.0 markup (.admin-dashboard,
.crud-body, data-testid crud-title), so a GitLab bump that renames them
fails loudly instead of passing on nothing.

Verified on the designer stack: deploy spec 12 passed 5 skipped with the
new test green; with the role stylesheet aborted through page.route it
fails on the admin chrome; closing sync 12 passed 4 skipped.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

roles/web-app-gitlab/files/playwright/test-design.js

@@ -31,6 +31,11 @@ const GROUP = "design-showcase";
 const PROJECT = `${GROUP}/showcase`;
 const PREFERENCES = "/-/profile/preferences";
 const ROOT_USERNAME = "root";
+const ADMIN_HEADING = ".admin-dashboard h2";
+const ADMIN_CARD = ".admin-dashboard .crud-body";
+const ADMIN_CARD_TITLE = ".admin-dashboard [data-testid='crud-title']";
+const ADMIN_DIVIDER = ".admin-dashboard .crud-body p.gl-border-b";
+const ADMIN_NEW_USER = "main a.btn-confirm[href$='/admin/users/new']";
 
 let session = null;
 
@@ -352,6 +357,38 @@ test("design: root signs in natively and reaches the admin area", async ({ page
   await expect(page.locator(`${TOPBAR} [data-testid='user-menu-toggle']`)).toBeVisible({ timeout: resolveTimeout(10_000) });
 });
 
+test("design: the admin area takes frame, panel, cards, dividers and primary action from the palette", async ({ page }) => {
+  skipUnlessServiceEnabled("design");
+  await signIn(page);
+  await gotoOnion(page, `${base}/admin`);
+  await shown(ADMIN_HEADING)(page);
+  for (const mode of MODES) {
+    await page.emulateMedia({ colorScheme: mode });
+    await assertToken(page, "body", "background-color", "--design-frame", `admin chrome ${mode}`);
+    await assertToken(page, PANEL, "background-color", "--design-surface-2", `admin panel ${mode}`);
+    await assertToken(page, ADMIN_CARD, "background-color", "--design-surface-2", `admin card ${mode}`);
+    await assertToken(page, ADMIN_CARD_TITLE, "color", "--design-text", `admin card title ${mode}`);
+    await assertToken(page, ADMIN_DIVIDER, "border-bottom-color", "--design-border", `admin divider ${mode}`);
+  }
+  await page.emulateMedia({ colorScheme: null });
+  await assertLightAndDark(page, ADMIN_CARD, "GitLab admin card");
+  await assertReadable(
+    page,
+    [ADMIN_HEADING, ADMIN_CARD_TITLE, `${ADMIN_CARD} a`, ADMIN_DIVIDER, { selector: `${ADMIN_CARD} .gl-text-subtle`, optional: true }],
+    "GitLab admin dashboard",
+  );
+
+  await gotoOnion(page, `${base}/admin/users`);
+  await shown(ADMIN_NEW_USER)(page);
+  for (const mode of MODES) {
+    await page.emulateMedia({ colorScheme: mode });
+    await assertToken(page, ADMIN_NEW_USER, "background-color", "--design-primary", `admin users ${mode}`);
+    await assertToken(page, ADMIN_NEW_USER, "color", "--design-on-primary", `admin users ${mode}`);
+  }
+  await page.emulateMedia({ colorScheme: null });
+  await assertReadable(page, [ADMIN_NEW_USER, "main h1"], "GitLab admin users");
+});
+
 test("design: gallery of sign-in, project, issues, merge requests, settings, admin and menus", async ({ page }) => {
   skipUnlessServiceEnabled("design");
   test.skip(!galleryEnabled(), "INFINITO_PLAYWRIGHT_KEEP is not true");