feat(builder): media package -- image crop/perf, video size+picker, gallery cols/lightbox, box-model+anim/vis rollout

- ImageBlock/ImageStylePanel: SizeControl width(absorbs old maxWidth
  presets)/height, AspectRatioControl + OBJECT_FIT grid + FocalPointGrid for
  CSS framing crop (aspect-ratio/object-fit/object-position on the <img>).
  Exported <img> always gets loading="lazy" decoding="async", plus width/
  height attrs when the style has a plain px length (pxAttr helper).
- VideoBlock/MediaStylePanel: Video URL text input replaced with
  AssetPicker(mediaType="video") writing videoUrl (paste-URL still handles
  YouTube/Vimeo, upload/browse handle files). Added SizeControl(width) +
  AspectRatioControl so the video frame honors real size/aspect instead of
  a hardcoded 16:9 (padding-bottom hack replaced with CSS aspect-ratio).
  New optional `poster` prop (image AssetPicker) + preload="metadata" on
  file-type <video>.
- Gallery: surfaced the existing-but-unexposed `columns` and `lightbox`
  props with panel controls.
- All 5 owned components (ImageBlock, VideoBlock, Gallery, ContentSlider,
  MapEmbed): added margin/padding (per-side)/border/box-shadow/opacity style
  defaults + AnimationControl/VisibilityControl-backed animation/
  animationDelay/hideOnDesktop/hideOnTablet/hideOnMobile props. New shared
  mediaBoxModel.tsx (package-local, not shared.tsx) DRYs the box-model +
  border/effects + animation/visibility panel sections across
  ImageStylePanel and MediaStylePanel.
- Tests: extended *.toHtml.test.ts for all 5 components (crop/perf attrs,
  video size/aspect/poster/preload, gallery columns/lightbox, box-model
  style emission, craft.props presence) + new MediaStylePanel.video.test.tsx
  verifying the AssetPicker wiring writes videoUrl/poster and the video-only
  size controls are gated on videoUrl. 694 tests green, tsc + vite build
  clean.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

craft/src/components/sections/ContentSlider.toHtml.test.ts

@@ -139,3 +139,46 @@ describe('ContentSlider.toHtml interval is NOT runtime-type-checked -- must be c
     expect(html).toMatch(/setInterval\(function\(\)\{show\(current\+1\);\},3000\);/);
   });
 });
+
+describe('ContentSlider.toHtml box-model styles (margin/padding/border/shadow/opacity)', () => {
+  test('margin/padding/border/box-shadow/opacity all flow into the section style attribute', () => {
+    const { html } = toHtml(
+      {
+        slides,
+        style: {
+          marginBottom: '24px',
+          paddingTop: '8px',
+          border: '3px dashed #00ff00',
+          boxShadow: '0 10px 24px rgba(0,0,0,0.18)',
+          opacity: '0.75',
+        },
+      },
+      ''
+    );
+    expect(html).toContain('margin-bottom:24px');
+    expect(html).toContain('padding-top:8px');
+    expect(html).toContain('border:3px dashed #00ff00');
+    expect(html).toContain('box-shadow:0 10px 24px rgba(0,0,0,0.18)');
+    expect(html).toContain('opacity:0.75');
+  });
+});
+
+describe('ContentSlider.craft.props exposes the animation/visibility rollout', () => {
+  test('animation, animationDelay, hideOnDesktop/Tablet/Mobile are present with blank/false defaults', () => {
+    const props = (ContentSlider as any).craft.props;
+    expect(props.animation).toBe('');
+    expect(props.animationDelay).toBe('0');
+    expect(props.hideOnDesktop).toBe(false);
+    expect(props.hideOnTablet).toBe(false);
+    expect(props.hideOnMobile).toBe(false);
+  });
+
+  test('style carries blank/default box-model keys', () => {
+    const style = (ContentSlider as any).craft.props.style;
+    expect(style).toHaveProperty('marginTop');
+    expect(style).toHaveProperty('paddingTop');
+    expect(style.border).toBe('none');
+    expect(style.boxShadow).toBe('none');
+    expect(style.opacity).toBe('1');
+  });
+});