feat(ui-modal): add margin to fullscreen modal

[git-nandor]

INSTUI-5067

Summary

A size="fullscreen" Modal previously covered the entire viewport edge-to-edge, making it hard to tell it was a modal.

Changes

• Modal applies fullScreenMargin (new token) based on sharedTokens.breakpoints (new token).
• The Small viewports docs example now uses a theme override to simulate the small viewport media query behavior.
• The Constraining Modal to a parent element section example was updated to fix the scrollbar introduced by the new margin changes by increasing its size.
• prettier@3.8.1 pulled by new style-dictionary@4.4.0 caused conflicts with ui-codemods. Fixed by adding "prettier": "2.8.8" to the root package.json.

Test plan

Check the Modal page Media Modal example with default (fullscreen, cover) settings.

• Large screen (≥ 768px): it is inset on all sides, rounded corners + shadow, backdrop visible around it.
• Small screen (< 768px): edge-to-edge, no margin/radius.

Co-Authored-By: 🤖 Claude

[github-actions]

PR Preview Action v1.8.1
🚀 View preview at https://instructure.design/pr-preview/pr-2608/
Built to branch gh-pages at 2026-06-25 10:55 UTC. Preview will be ready when the GitHub Pages deployment is complete.

[github-actions]

Visual regression report

✅ No changes.

Status	Count
Unchanged	32
Changed	0
New	0
Removed	0

📊 View full report

_{Baselines come from the visual-baselines branch. They refresh on every merge to master.}