Portal: Keys page layout shifts and list column gets squeezed when a key is selected #1455

Please do not report security vulnerabilities here. Follow SECURITY.md instead.
Redact secrets and sensitive data from examples, logs, and screenshots.

Summary

Portal → Keys page (apps/portal/src/pages/TokenList.tsx): selecting a key to open the right-hand detail panel breaks the page layout.

Steps to reproduce

1. Open the Portal and go to the Keys page (Keys tab).
2. Click any key row in the table to open the detail panel on the right.
3. Compare the layout before and after selection. This happens every time.

Expected behavior

The tabs, filter rail, and header stay in the same position when the detail panel opens. The list column shrinks gracefully: the table scrolls horizontally if needed, and the header and pagination stay on one line.

Actual behavior

• Content shifts right / gutter appears: the whole content area (Keys/Accounts tabs, search box, CAPABILITY filter rail) moves right and down. This leaves an empty gutter between the left nav and the filter rail. The top edge also no longer lines up with the nav.
• Center column gets too narrow:
  • The header subtitle is truncated ("Manage API keys for workers and…").
  • The "Missing coverage" banner wraps onto 4 lines.
  • The table is squeezed: columns are hidden, and a horizontal scroll chevron appears.
  • The pagination footer wraps ("1–7 of 7 / keys", "Rows per / page", "1 / / 1").
• The detail panel doesn't seem to have a constrained width. It takes space from the list instead of using the right-panel layout contract used elsewhere (ListLayout / FilterRail / DataTable).

Environment and logs

• Portal: d83b362, API: d83b362, DB: v30 (2026-10-01)
• Hosted Portal, macOS, desktop browser
• Screenshots below (key values redacted).

Before selecting a key

After selecting a key