feat: improve bookmark dialog UX with distinct modes, inline validation, and accessibility

Refine bookmark create/edit and group create/edit dialogs to enterprise
quality: distinct titles per mode (Add bookmark vs Edit bookmark), URL
preview when creating, inline field validation with aria-invalid instead
of toast-only errors, loading spinner on submit, compact inline
new-group link, human-readable icon picker aria-labels, and aria-pressed
on selected icons.

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

modules/bookmarks/web/css/components/app-bookmark-form.css

@@ -56,6 +56,68 @@
     padding-top: var(--app-spacing);
   }
 
+  /* URL preview */
+  .app-bookmark-url-preview {
+    color: var(--app-muted-color);
+    font-size: 0.8rem;
+    line-height: 1.3;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    max-width: 100%;
+    margin-bottom: 0.25rem;
+  }
+
+  /* Inline field errors */
+  .app-bookmark-field-error {
+    color: var(--app-action-danger-background);
+    font-size: 0.8rem;
+    line-height: 1.3;
+    min-height: 0;
+  }
+
+  .app-bookmark-field-error:empty {
+    display: none;
+  }
+
+  dialog[data-app-bookmark-dialog] form input[aria-invalid="true"],
+  dialog[data-app-bookmark-group-dialog] form input[aria-invalid="true"] {
+    border-color: var(--app-action-danger-background);
+  }
+
+  /* Group label row with inline new-group link */
+  .app-bookmark-group-label-row {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 0.5rem;
+  }
+
+  .app-bookmark-new-group-link {
+    all: unset;
+    cursor: pointer;
+    font-size: 0.8rem;
+    color: var(--app-primary);
+    display: inline-flex;
+    align-items: center;
+    gap: 0.15rem;
+  }
+
+  .app-bookmark-new-group-link:hover {
+    text-decoration: underline;
+  }
+
+  .app-bookmark-new-group-link:focus-visible {
+    outline: 2px solid var(--app-primary);
+    outline-offset: 2px;
+    border-radius: 2px;
+  }
+
+  .app-bookmark-new-group-link > i {
+    font-size: 0.85rem;
+  }
+
+  /* Delete button */
   .app-bookmark-delete-btn {
     color: var(--app-action-danger-background);
     border-color: var(--app-action-danger-background);
@@ -67,10 +129,7 @@
     color: var(--app-action-danger-color);
   }
 
-  .app-bookmark-new-group-btn {
-    width: 100%;
-  }
-
+  /* Icon picker */
   .app-bookmark-group-icon-picker {
     display: grid;
     grid-template-columns: repeat(7, minmax(0, 1fr));