Now let me generate a product image and then build the modal component.

Now let me build the modal component and the page:

Now let me update the metadata and the globals.css theme to match the Vercel-inspired dark dashboard aesthetic:

The inventory adjustment modal is live! Here's a breakdown of the interaction design choices:

Why this pattern works for operations teams:

1. Segmented add/subtract toggle — makes the intent explicit and prevents accidental removals vs. additions, reducing costly mistakes in high-volume environments.
2. Stepper + quick-add buttons — the +1 / +5 / +10 / +25 shortcuts cover the most common restock scenarios without requiring keyboard input, making batch adjustments fast.
3. Live preview panel — showing Current → Change → New Stock in real time eliminates mental arithmetic and lets the user verify before committing, which is critical when stock errors affect fulfilment.
4. Disabled "Apply" until a change is made — prevents empty submissions and makes the action feel intentional, not accidental.

The reference image shows a much simpler, cleaner modal: centered bold title, a hairline divider, a subtitle line, one large centered number input, a comment textarea, and two big full-width action buttons (red Subtract, green Add) — no product card, no toggle segment, no quick-add chips, no preview panel.

The modal is now rebuilt to exactly match the reference: centered bold product title with a close button, a hairline divider, a subtitle, a large centered number input, a resizable comment textarea, and two full-width action buttons — red Subtract and green Add — flush to the bottom of the card. All the extra complexity (product card, segment toggle, quick-add chips, preview panel) has been removed in favor of this clean, focused layout.