Give the modal scrim a token, and drop the guard's exception

The Circle port added a rule that the Issues stylesheet paints only with
tokens, then whitelisted one literal in the same test. A rule written with its
own exception baked in protects less than it appears to.

The literal was real, though, and so was the reason: `#08090a` is `--ink-void`
in dark mode but `#f7f8f8` in light, and a scrim built from the page colour
would be a white veil over a white page, hiding nothing. That value could not
come from any existing token.

So it gets one. `--scrim` is fixed dark in both themes and says in its comment
why it does not reference `--ink-void`. The guard now permits no literals at
all, which is the rule it was trying to be.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0149rBWy7br1Z7bbz9NrQhEr

Co-Authored-By

Claude Opus 5 (1M context) <noreply@anthropic.com>

Claude-Session

https://claude.ai/code/session_0149rBWy7br1Z7bbz9NrQhEr

Deploy story

What this commit did to the running system — joined from the forge receipt chain, the part a commit page elsewhere cannot show.

Changed files

• modified assets/css/app.css
• modified assets/css/openagents.css
• modified test/openagents_web/components/circle_test.exs

Diff

3 files changed, +11 -4

  --wash-selected: color-mix(in oklab, var(--text-ink) 10%, transparent); /* 10% */

  --wash-strong: color-mix(in oklab, var(--text-ink) 14%, transparent); /* 14% */

  /* The scrim behind a modal. Deliberately NOT built from `--ink-void`, which

     is the page and flips to near-white in light mode: a scrim's job is to

     darken whatever is behind it, and a white one over a white page hides

     nothing. Fixed dark in both themes, which is why it is a token of its own

     rather than a reference to another. */

  --scrim: color-mix(in oklab, #08090a 55%, transparent);

  /* The hover surface is the wash resolved opaquely over the raised rung. */

  --ink-hover: color-mix(in oklab, var(--text-ink) 4%, var(--ink-raised)); /* 4% over raised */

  }

  .command-palette::backdrop {

    background: color-mix(in oklab, #08090a 55%, transparent);

    background: var(--scrim);

  }

  .command-palette__panel {

        ~r/(?<![-\w])#[0-9a-fA-F]{3,8}\b/

        |> Regex.scan(section)

        |> List.flatten()

        |> Enum.reject(&(&1 == "#08090a"))

      assert literals == [], """

      The Issues section names colours directly instead of resolving to a

      token: #{Enum.join(literals, ", ")}

      The one permitted literal is the backdrop scrim, which mixes against the

      darkest ink on purpose.

      There are no permitted literals. The modal scrim, which is the one value

      that cannot come from `--ink-void` (that token flips to near-white in

      light mode and a white scrim hides nothing), has its own `--scrim` token.

      """

    end