fix(web): .badge displays as inline-block so wrapped labels keep their shape

As a plain inline span, a badge that wraps to two lines fragments into
per-line boxes: the clip-path and ::before fill cover the wrong region,
so overflow text renders bare outside the beveled shape (storefront
DTLabel ribbons at <=375px viewports). inline-block keeps the badge one
box; the bevel and fill wrap all lines.

Revert with: git revert <this-sha>

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

packages/web/src/components/bevels.css

@@ -226,6 +226,9 @@
 [data-brand="dt"] .badge {
   --badge-border-color: var(--color-border);
   --badge-fill: var(--color-surface);
+  /* inline-block so a wrapping badge stays one box — clip-path and the
+     ::before fill fragment across line boxes on a plain inline span */
+  display: inline-block;
   position: relative;
   isolation: isolate;
   background: var(--badge-border-color);