DRY pass #2, batch 5, F14: the web's repeated class lists become component classes (#5372)

style.css gains the classes the views spelled out in full: .section-label
(17 sites), .hint (20), .form-error (13), .alert-error (5), .row-card (5),
.list-empty (5), .field (5), .page-shell (3), and the small row action
.btn-sm (4) / .btn-sm-danger (3). Only exact runs moved, so nothing renders
differently; spacing a site adds beyond a run stays a utility beside it.

Kept: the Reminders and Timeline small buttons. They carry no text colour
and inherit it, so putting them on .btn-sm would recolour them.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

frontend/src/components/ShareDialog.vue

@@ -115,7 +115,7 @@ onMounted(load);
       <p v-if="loading" class="py-4 text-center text-sm text-neutral-400">Loading…</p>
 
       <div v-else-if="loadError" class="py-4 text-center">
-        <p class="text-sm text-red-600 dark:text-red-400">{{ loadError }}</p>
+        <p class="form-error">{{ loadError }}</p>
         <button
           type="button"
           class="mt-2 rounded-md border border-neutral-300 px-3 py-1 text-sm hover:bg-neutral-100 dark:border-neutral-700 dark:hover:bg-neutral-800"
@@ -126,7 +126,7 @@ onMounted(load);
       </div>
 
       <template v-else>
-        <p v-if="!anyone" class="text-sm text-neutral-500 dark:text-neutral-400">
+        <p v-if="!anyone" class="hint">
           No one else has an account here yet. An admin can invite people from Settings.
         </p>
 
@@ -156,10 +156,10 @@ onMounted(load);
           </button>
         </form>
 
-        <p v-if="error" role="alert" class="text-sm text-red-600 dark:text-red-400">{{ error }}</p>
+        <p v-if="error" role="alert" class="form-error">{{ error }}</p>
 
         <div class="flex flex-col gap-1">
-          <p class="text-xs font-semibold uppercase tracking-wide text-neutral-400">Shared with</p>
+          <p class="section-label">Shared with</p>
           <p v-if="!shares.length" class="text-sm text-neutral-400">Only you.</p>
           <ul v-else class="flex flex-col gap-1">
             <li v-for="s in shares" :key="s.id" class="flex items-center gap-2 rounded-lg px-1 py-1">