refactor: move libs/shared/src/ui/ into atoms/molecules/organisms (RD-27)

The folder now equals the layer, as CLAUDE.md decision 2 requires. 33
directories move by git mv (25 flat, plus upload/'s 8 subfolders split
across all three layers). 28 distinct @shared/ui/* specifiers rewrite
across 73 files, longest-first. Five relative imports inside upload/
become @shared/ui aliases because their sibling now lives in a
different layer; two stay relative because both ends stay in the same
layer. Four .mdx docs get their seven broken story imports fixed;
atomic-design.mdx's page-shell import is untouched, because layout/
does not move.

No component, template, story title, or layer-tag comment changes.
That is RD-28's job.

Verified against the ticket's acceptance commands: the 26 flat
directories become exactly 3 layer folders with the counts the ticket
names, only three @shared/ui/* prefixes remain (atoms, molecules,
organisms), the .mdx import count holds at 7, and the relative-import
count inside ui/ drops from 7 to 2 as decision 4 requires. The
@shared/ui/ occurrence count moves from 200 to 205: decision 4
mandates turning 5 of those 7 relative imports into @shared/ui/*
aliases, which decision 3's "200 before, 200 after" check does not
account for. The 5-occurrence gap is exactly the 5 conversions decision
4 names, not a lost or duplicated specifier.

npm run ci --full passes: lint, typecheck, dep:check, format, tokens,
seam, both apps' + both libraries' tests, both apps' localized build,
audit, backend tests, all three generated-artifact drift checks, and
both Storybook instances' build + axe-core a11y suite (67+45 suites,
198+112 tests, all green).

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

libs/shared/src/ui/molecules/stepper/stepper.component.ts

@@ -0,0 +1,85 @@
+import { Component, ElementRef, input, output, viewChild } from '@angular/core';
+
+/** Molecule: the CIBG Huisstijl "stappenindicator" — numbered circles (`.step-list`),
+    visited steps clickable for back-only navigation, and the step title merged into
+    the same block (process name + "Stap X van Y: Titel", per the aanvraagproces
+    pattern). Domain-free; forward navigation only via the wizard's own buttons. */
+@Component({
+  selector: 'app-stepper',
+  template: `
+    <div class="stepper">
+      <ol class="step-list order-1">
+        @for (label of steps(); track label; let i = $index) {
+          <li>
+            @if (i < current()) {
+              <a
+                href="#"
+                class="step visited"
+                (click)="select($event, i)"
+                [attr.aria-label]="terugNaar(i, label)"
+              >
+                <span class="visually-hidden" i18n="@@stepper.stap">Stap</span> {{ i + 1 }}
+                <span class="visually-hidden" i18n="@@stepper.voltooid">Voltooid</span>
+              </a>
+            } @else if (i === current()) {
+              <span
+                class="step active"
+                aria-current="step"
+                [attr.aria-label]="huidigeStap(i, label)"
+              >
+                <span class="visually-hidden" i18n="@@stepper.stap">Stap</span> {{ i + 1 }}
+                <span class="visually-hidden" i18n="@@stepper.huidig">Huidige stap</span>
+              </span>
+            } @else {
+              <span class="step" [attr.aria-label]="stap(i, label)">
+                <span class="visually-hidden" i18n="@@stepper.stap">Stap</span> {{ i + 1 }}
+              </span>
+            }
+          </li>
+        }
+      </ol>
+      <h2 #title tabindex="-1" class="h1 order-0">
+        @if (processName()) {
+          <span class="process-name">{{ processName() }}</span>
+        }
+        <ng-container i18n="@@stepper.stapVan"
+          >Stap {{ current() + 1 }}<span class="visually-hidden"> van {{ steps().length }}</span
+          >: {{ stepTitle() || steps()[current()] }}</ng-container
+        >
+      </h2>
+    </div>
+  `,
+})
+export class StepperComponent {
+  steps = input.required<string[]>();
+  current = input.required<number>();
+  /** Name of the overall process, shown above the step title (e.g. "Herregistratie aanvragen"). */
+  processName = input('');
+  /** Overrides the step label as the title; falls back to `steps()[current()]`. */
+  stepTitle = input('');
+
+  /** Emitted when a visited (earlier) step is clicked — back-navigation only. */
+  stepSelected = output<number>();
+
+  private titleEl = viewChild<ElementRef<HTMLElement>>('title');
+
+  /** wizard-shell calls this after a step change so the new title is announced. */
+  focusTitle(): void {
+    this.titleEl()?.nativeElement.focus();
+  }
+
+  protected select(ev: Event, i: number) {
+    ev.preventDefault(); // fragment href resolves against <base href>, not the route
+    this.stepSelected.emit(i);
+  }
+
+  protected stap(i: number, label: string) {
+    return $localize`:@@stepper.naarStap:Stap ${i + 1}:nummer: ${label}:label:`;
+  }
+  protected huidigeStap(i: number, label: string) {
+    return $localize`:@@stepper.huidigeStapLabel:Huidige stap, stap ${i + 1}:nummer: ${label}:label:`;
+  }
+  protected terugNaar(i: number, label: string) {
+    return $localize`:@@stepper.terugNaarStap:Terug naar stap ${i + 1}:nummer: ${label}:label:`;
+  }
+}