Phase 2(A) Typography selection per workspace

[knightedcodemonkey]

1. Locked decisions (as implemented scope)

1. Typography config will be a single text input for a CSS stylesheet URL (for example Google Fonts CSS2 URLs).
2. Typography is applied when workspace actions commit state: Open, New workspace, Initialize.
3. PAT-gated Workspaces behavior remains unchanged for now.
4. A default typography URL is used when workspace config is empty or invalid.

2. Data model and normalization

1. Add a new workspace record field, for example typographyCssUrl, normalized as a string.
2. Normalize on read and write in workspace-storage.js:

• trim whitespace
• allow only safe URL values (https recommended)
• fallback to empty string in storage-level normalization if invalid

3. Keep backward compatibility: older records with no field continue to work.
4. Define one app default typography URL constant in a small shared module, then use it in runtime fallback paths.

3. Workspaces drawer UX changes

1. Add a new input row in index.html inside the Workspaces drawer body:

• label: Typography stylesheet URL
• placeholder/example for Google Fonts CSS2 URL
• optional tooltip/help text

2. Extend drawer.js:

• accept the new input element
• keep a staged value while drawer is open
• do not apply to preview on typing
• pass staged value to Open/New/Initialize callbacks

3. Keep existing action flow and status copy semantics.

4. Snapshot/apply pipeline wiring

1. Include typographyCssUrl in workspace snapshots via workspace-sync-controller.js.
2. On workspace load, apply the workspace typography value through workspace-context-controller.js.
3. Update record-applied plumbing where needed in workspace-record-applied-handler.js and app.js so the current runtime config knows the active typography URL.
4. Ensure Open/New/Initialize commit the staged drawer value into the target workspace record before render.

5. Preview runtime integration

1. Extend render payload in render-runtime.js to send resolvedTypographyCssUrl:

• workspace value if valid
• otherwise default URL

2. Extend visual config handling in iframe-preview-executor.js:

• create/reuse a dedicated link node (for example knighted-preview-font-stylesheet)
• set rel=stylesheet and href to resolved URL
• keep deterministic order with existing style nodes

3. Preserve Phase 1(B) separation: base styles and user styles remain separate and unchanged.

6. Test plan

1. Storage normalization and round-trip tests for typographyCssUrl in workspace storage unit coverage.
2. Drawer action tests in Playwright for:

• value entered
• Open/New/Initialize persist value
• switching workspaces restores corresponding value

3. Preview runtime test:

• iframe contains the font stylesheet link with expected href after workspace action
• fallback default applied when workspace value is empty/invalid

4. Keep tests deterministic by asserting URL plumbing/link presence rather than depending on remote font rendering.

7. Acceptance criteria (updated)

1. User can set a typography CSS URL in Workspaces drawer.
2. URL is saved per workspace record.
3. Typography applies on Open/New/Initialize, not on every input change.
4. Empty/invalid values fall back to default typography URL.
5. Existing preview style behavior from Phase 1(B) remains intact.

[knightedcodemonkey]

This no longer needs to be gated behind PAT storage since the workspaces drawer isn't.