# Capture

Runs in the browser on phone and PC.
This increment ends at step 8. It does not create a WooCommerce product.

## Setup

Photograph the slab on a green or black sheet.

- Sheet fills the frame around the slab.
- Slab is fully on the sheet.
- First photo is top-down, lens parallel to the face.
- Length of the slab is aligned with the long side of the picture.

The app expects that sheet. Background removal keys green or black. Other backgrounds are out of this increment.

## Flow

1. User adds one photo taken under Setup.
2. App removes the background and shows a mask overlay on the source photo: slab pixels vs removed pixels. Controls: sheet Auto / Green / Black, one sensitivity slider. Overlay updates as the slider moves.
3. User adjusts until only the slab remains, then approves the mask. That approved mask is the slab footprint for every later step.
4. App draws the minimum-area bounding rectangle of the mask and the length axis on the long side of that rectangle. User rotates the axis if it does not follow the slab length, then approves the axis.
5. User enters length `L` in inches (1/8 in steps) and thickness (1/8 in steps).
6. App sets `scale = longest_axis_px / L`.
7. App computes widths, sqft, and bdft from the mask, and writes the inventory PNG.
8. User sees the PNG and the numbers. Stop.

## Device draft

One in-progress slab is stored on the device.
This is not a WooCommerce draft.

On open or refresh, if that draft exists, the user chooses Continue or Start fresh.

- Continue restores the slab at the last approved step, including step 8.
- Start fresh discards the device draft and returns to Setup.

Milestone 3 clears the device draft after Woo create. That is outside this increment.

## Measurements

- Widths: min, max, avg, sampled every 6 in along the approved length axis, perpendicular to it
- `sqft = (mask_pixels / scale²) / 144` (2 decimals)
- `bdft = sqft × thickness_in` (2 decimals)

## Inventory PNG

Role: `kind=inventory`. Filename is an implementation detail.
The first inventory photo is the measurement reference. Later inventory photos use the same file properties.

| Property | Value |
|---|---|
| Format | PNG, 8-bit RGBA (`image/png`) |
| Alpha | Kept through encode and upload |
| Aspect | 3:4 portrait |
| Layout | Slab centered, 80% fill at the widest and tallest points |
| Size | After crop, shorter side ≥ 1600px when the source can supply it |

Source below that floor: warn and require a new photo. No upscale from an undersized source.
Editor preview of alpha is a light gray checkerboard. The storefront uses the theme background.