fix(app): preserve compact paint field sizing

- Keep embedded number fields from crowding color values\n- Cover paint-row geometry in property-panel E2E tests\n- Refresh the reviewed typography panel snapshot for visible variable actions

CHANGELOG.md

@@ -18,7 +18,7 @@
 - Add saved per-node export settings for repeat exports.
 - Add Design panel controls for layer blend modes and alpha, vector, and luminance masks.
 - Refine Design panel foundations with 26px controls, consistently aligned action rails, shared Tailwind themes, and Storybook component states.
-- Fix variable binding action visibility, picker anchoring, hover treatment, and Design panel number-field heights.
+- Fix variable binding action visibility, picker anchoring, hover treatment, and Design panel number-field sizing, including embedded paint rows.
 - Scale the Layers panel to 5,000-node documents with virtualized rows, indexed updates, scroll-to-selection, range selection, and focus-aware themed states.
 - Add Figma-style horizontal and vertical constraint controls with pin interactions, mixed-selection editing, undo, and responsive frame resizing.
 - Add mixed-selection stroke cap, join, and miter-limit controls with CanvasKit rendering and `.fig` roundtrip support.

src/theme/number-field.ts

@@ -4,7 +4,7 @@ const numberFieldTheme = {
   slots: {
     root: [
       panelFieldBase,
-      'group flex flex-auto cursor-ew-resize items-center tabular-nums data-[disabled]:cursor-auto data-[editing]:cursor-auto'
+      'group flex min-h-control flex-1 cursor-ew-resize items-center tabular-nums data-[disabled]:cursor-auto data-[editing]:cursor-auto'
     ],
     leading:
       'flex shrink-0 items-center justify-center self-stretch px-[5px] text-muted select-none [&>*]:pointer-events-none',

tests/e2e/properties/panel.spec.ts

@@ -55,6 +55,20 @@ test('appearance fields share control height and show variable actions', async (
     Math.abs(pickerBox.y + pickerBox.height / 2 - (triggerBox.y + triggerBox.height / 2))
   ).toBeLessThan(4)
   await search.press('Escape')
+
+  const fillItem = propertyItems(editor.page, 'fills').first()
+  const paintField = fillItem.locator('[data-slot="paint-field"]')
+  await expect(paintField).toHaveCSS('height', '26px')
+  const colorBox = expectDefined(
+    await fillItem.getByRole('textbox', { name: 'Fill' }).boundingBox(),
+    'fill color bounds'
+  )
+  const opacityBox = expectDefined(
+    await fillItem.getByRole('spinbutton', { name: 'Opacity' }).boundingBox(),
+    'fill opacity bounds'
+  )
+  expect(colorBox.width).toBeGreaterThanOrEqual(42)
+  expect(opacityBox.width).toBeGreaterThanOrEqual(40)
 })
 
 test('NumberField drag changes X position', async () => {