Say Remove for displays, and make the default accent purple (#210050)

Administrators now remove a display: the card's Remove, "Remove display?",
and "Display removed". The platform still revokes the device's credential;
the endpoint, fields, and security history keep revoke/revoked (ADR 0065).

The default accent is a deep purple anchored on #210050, set in the shared
design tokens only (ADR 0066, superseding ADR 0060's teal in part). The
anchor is the light primary action with white on it; the light accent text,
focus ring, and selection, and the dark theme's lavender accent, are
variants on its hue chosen for contrast. The teal-tinted neutrals move to a
faint violet-grey at the same lightness, so every contrast pairing holds.
The contrast test gains six pairings the accent depends on, and pins the
anchor.

Co-Authored-By: Claude Opus 5.5 <[email protected]>

packages/design-tokens/tests/contrast.test.ts

@@ -87,6 +87,12 @@ const PAIRINGS: readonly Pairing[] = [
   ["accent.focus", "background.canvas", NON_TEXT, "focus ring in the sidebar"],
   ["accent.focus", "background.surface", NON_TEXT, "focus ring in a panel"],
   ["accent.focus", "background.raised", NON_TEXT, "focus ring in a dialog"],
+  ["accent.base", "background.page", NON_TEXT, "the brand mark and a spinner on the page"],
+  ["accent.base", "background.canvas", NON_TEXT, "the brand mark in the sidebar"],
+  ["accent.base", "background.surface", NON_TEXT, "a selected tab's underline in a panel"],
+  ["state.selected-foreground", "accent.subtle", TEXT, "a selected tab's label"],
+  ["accent.strong", "background.raised", TEXT, "accent text in a dialog"],
+  ["background.surface", "accent.strong", NON_TEXT, "the mark inside a checked box or radio"],
 ];
 
 describe.each([
@@ -102,6 +108,19 @@ describe.each([
   });
 });
 
+describe("the default accent (ADR 0066)", () => {
+  it("is anchored on #210050: the light primary action, with white on it", () => {
+    expect(ekklesiaDesignTokens.valueFor("accent.base", "light")).toBe("#210050");
+    expect(ekklesiaDesignTokens.valueFor("accent.foreground", "light")).toBe("#ffffff");
+  });
+
+  it("is lifted in dark rather than forced, and draws the anchor on it", () => {
+    // #210050 on a dark surface would all but vanish; the dark accent is a lavender of its hue.
+    expect(ekklesiaDesignTokens.valueFor("accent.base", "dark")).not.toBe("#210050");
+    expect(ekklesiaDesignTokens.valueFor("accent.foreground", "dark")).toBe("#210050");
+  });
+});
+
 describe("the contrast calculator", () => {
   it("agrees with WCAG's reference values", () => {
     expect(contrastRatio("#000000", "#ffffff")).toBeCloseTo(21, 5);

packages/design-tokens/tests/theme.test.ts

@@ -99,8 +99,8 @@ describe("light and dark token sets", () => {
   });
 
   it("answers a token's value per scheme, falling back to its single value", () => {
-    expect(ekklesiaDesignTokens.valueFor("background.page", "light")).toBe("#f3f7f6");
-    expect(ekklesiaDesignTokens.valueFor("background.page", "dark")).toBe("#0e1615");
+    expect(ekklesiaDesignTokens.valueFor("background.page", "light")).toBe("#f6f5f9");
+    expect(ekklesiaDesignTokens.valueFor("background.page", "dark")).toBe("#141319");
     expect(ekklesiaDesignTokens.valueFor("spacing.md", "dark")).toBe("0.75rem");
     expect(() => ekklesiaDesignTokens.valueFor("nope" as "spacing.md", "dark")).toThrow(
       DesignTokenError,
@@ -132,7 +132,7 @@ describe("the theme stylesheet resolves appearance and motion in CSS", () => {
 
   it("is light by default and says so to the browser", () => {
     expect(stylesheet.startsWith(":root {\n  color-scheme: light;\n")).toBe(true);
-    expect(stylesheet).toContain("--ekklesia-background-page: #f3f7f6;");
+    expect(stylesheet).toContain("--ekklesia-background-page: #f6f5f9;");
   });
 
   it("follows the system into dark unless light was chosen, and goes dark when dark was chosen", () => {
@@ -145,7 +145,7 @@ describe("the theme stylesheet resolves appearance and motion in CSS", () => {
     const darkRule = stylesheet.slice(
       stylesheet.indexOf(`:root[${DESIGN_TOKEN_APPEARANCE_ATTRIBUTE}="dark"]`),
     );
-    expect(darkRule).toContain("--ekklesia-background-page: #0e1615;");
+    expect(darkRule).toContain("--ekklesia-background-page: #141319;");
   });
 
   it("zeroes every motion duration when the system asks, unless motion was allowed, and when reduce was chosen", () => {