Apply Burcu's design-review feedback to Adorn UI

[lukemelia]

Refactors the Adorn components/modifiers and their consumers to follow the design-system conventions, applying each item from Burcu's review.

Conventions applied

• data-* over class names for DOM targeting — the label-boundary resolver now keys off data-adorn-context instead of closest('.adorn-context'). The class stays for styling; the data attribute is the JS contract.
• rem instead of px — converted dimensional CSS across the Adorn primitives, the card-search selection trigger, and the card-header utility-menu trigger. SVG-internal coordinates and JS pixel math left in px.
• Hardcoded colors → semantic tokens — no raw hex in components; all references go through tokens.
• cn helper for conditional classes — replaced inline {{if}}/{{unless}} class-string concatenation in AdornLabel / AdornSelectChip (and the AdornContext consumer). Emits identical class strings, so behavior and selectors are unchanged.
• currentColor for SVGs — the themeable check stroke follows color; fixed brand parts reference a token.
• --boxel-highlight instead of --boxel-teal for the highlight accent, app-wide.

Token consolidation

• --boxel-dark-teal is now #00da9f (previously #00ebac), so the existing --boxel-highlight-hover carries it rather than introducing a parallel variable. This is an app-wide shift: hover/highlight states (buttons, pills, selects, pickers, multi-select, codemirror, …) move to the slightly deeper teal.
• Added --boxel-highlight-foreground: #0a2e1c — the readable dark-green foreground for text/icons on a --boxel-highlight surface, following the established <surface> / <surface>-foreground convention. Wired through the Adorn primitives, the card-search selection trigger, and card-header (whose utility-menu trigger previously duplicated the same pattern with hardcoded colors).

Visual impact

• No change: teal backgrounds and icon colors resolve to the same hex as before.
• Intended changes: text/icons on highlight surfaces shift from pure black to the dark-green --boxel-highlight-foreground (the editing card-header bar and the selection/utility-menu triggers), and hover/highlight teal deepens slightly via the --boxel-dark-teal value change.

Docs

• New gts-component-conventions skill capturing these guidelines.
• The skill plus AGENTS.md now document the content-tag <template>-detection hazards hit during this work, including a previously-undocumented trigger (a backtick-wrapped bracket token inside a template-region comment) and its ESLint-phantom-unused-import symptom.

🤖 Generated with Claude Code

[github-actions]

Preview deployments

• Host staging preview

• Host production preview

• Boxel UI staging preview

Host Test Results

    1 files      1 suites   1h 50m 56s ⏱️
2 931 tests 2 916 ✅ 15 💤 0 ❌
2 950 runs  2 935 ✅ 15 💤 0 ❌

Results for commit 88db2a4.

Realm Server Test Results

    1 files      1 suites   10m 0s ⏱️
1 549 tests 1 548 ✅ 1 💤 0 ❌
1 640 runs  1 639 ✅ 1 💤 0 ❌

Results for commit 88db2a4.

[lukemelia]

@burieberry still more to come based on your feedback, but please review this batch

[burieberry]

Looks good, thanks for updating the skills!