feat: add sequential progression and video watch lesson completion

Gate student content by completion order, track per-video watch progress
with seek enforcement, and auto-complete lessons at the configured
threshold. Show ring progress in the lesson header, keep watch progress
on rewatch, and sync progression locks client-side so the next item
unlocks after completion.

packages/ui/src/custom/image-cropper/image-cropper-use-original.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+  import Button, { type ButtonElementProps } from '../../base/button/button.svelte';
+  import { useImageCropperUseOriginal } from './image-cropper-context.svelte';
+  import ImageIcon from '@lucide/svelte/icons/image';
+
+  let {
+    ref = $bindable(null),
+    variant = 'outline',
+    size = 'sm',
+    onclick,
+    children,
+    ...rest
+  }: ButtonElementProps = $props();
+
+  const useOriginalState = useImageCropperUseOriginal();
+</script>
+
+<Button
+  {...rest}
+  bind:ref
+  {size}
+  {variant}
+  onclick={(
+    e: MouseEvent & {
+      currentTarget: EventTarget & HTMLButtonElement;
+    }
+  ) => {
+    onclick?.(e);
+
+    useOriginalState.onclick();
+  }}
+>
+  <ImageIcon />
+  {#if children}
+    {@render children()}
+  {:else}
+    <span>Don't Crop</span>
+  {/if}
+</Button>