feat(design): re-theme to CIBG Huisstijl (Bootstrap 5.2), replacing RHC/Utrecht

The portal now adheres to the CIBG design system (designsystem.cibg.nl) — a customized
Bootstrap 5.2 build — replacing the Rijkshuisstijl-Community / Utrecht theme. See ADR-0003.

- Vendor @cibg/huisstijl@3.22.0 under public/cibg-huisstijl/, loaded via a <link> in
  index.html (Storybook serves it via staticDirs). Drop the two @rijkshuisstijl-community deps.
- Token bridge in styles.scss: redefine the app's ~54 --rhc-* tokens onto CIBG/--bs-* values,
  so components keep referencing tokens (no 300+ site rewrite). System-font stack; licensed
  RO/Rijks text fonts intentionally not shipped.
- Re-skin every shared atom to Bootstrap/CIBG classes (btn, form-control, form-check-*,
  table, breadcrumb, …) keeping their input() APIs. alert is hand-rolled (CIBG drops .alert);
  local .card/.badge renamed to avoid Bootstrap collisions.
- Domain pages: drop stray rhc-*/utrecht-* classes; registration-table → table table-striped.

Verified: build green, check:tokens OK, lint clean, 174 tests pass, build-storybook OK,
and the served build loads the vendored CSS (200, .btn-primary present).

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

src/styles.scss

@@ -1,12 +1,88 @@
-/* Rijkshuisstijl design tokens (already themed) + Utrecht/RHC component CSS.
-   ponytail: we import the published CSS instead of hand-writing styles — the
-   whole point is that the design system gives us Rijkshuisstijl for free. */
-@import '@rijkshuisstijl-community/design-tokens/dist/index.css';        /* .rhc-theme tokens */
-@import '@rijkshuisstijl-community/design-tokens/dist/lintblauw/index.css'; /* .lintblauw palette */
-@import '@rijkshuisstijl-community/components-css/dist/index.css';        /* component classes */
+/* CIBG Huisstijl (a customized Bootstrap 5.2 build) is loaded as a plain <link> in
+   index.html (public/cibg-huisstijl/css/huisstijl.min.css) so its relative url(../fonts|
+   icons|images) references resolve at runtime.
+
+   Token bridge: the app's components reference a semantic `--rhc-*` token vocabulary
+   (316 refs, 54 tokens). Rather than rewrite every reference, we redefine those tokens
+   HERE onto CIBG/Bootstrap values (--bs-* where one exists, CIBG palette hex otherwise).
+   The names are now an internal alias set; the VALUES are CIBG. (styles.scss is exempt
+   from check:tokens, so palette hex is allowed in this one file.) */
+:root {
+  /* — semantic foreground/background/border — */
+  --rhc-color-foreground-default: var(--bs-body-color);
+  --rhc-color-foreground-subtle: #617286;               /* CIBG meta grey */
+  --rhc-color-foreground-link: var(--bs-link-color);    /* #01689b */
+  --rhc-color-foreground-link-hover: #154273;           /* CIBG active/hover */
+  --rhc-color-foreground-on-primary: #fff;
+  --rhc-color-border-default: var(--bs-border-color);
+  --rhc-color-border-subtle: #e2e8f0;
+  --rhc-color-border-strong: #adb5bd;
+  --rhc-color-wit: #fff;
+
+  /* — greys — */
+  --rhc-color-cool-grey-100: #f8fafc;
+  --rhc-color-cool-grey-200: #f1f5f9;
+  --rhc-color-cool-grey-300: #e2e8f0;
+  --rhc-color-grijs-100: #f1f5f9;
+  --rhc-color-grijs-200: #e2e8f0;
+  --rhc-color-grijs-300: #cbd5e1;
+  --rhc-color-grijs-400: #94a3b8;
+  --rhc-color-grijs-700: #334155;
+
+  /* — blues (CIBG primary family) — */
+  --rhc-color-lintblauw-100: #e6eef3;
+  --rhc-color-lintblauw-500: #01689b;
+  --rhc-color-lintblauw-600: #015a87;
+  --rhc-color-lintblauw-700: #154273;
+  --rhc-color-hemelblauw-100: #e6f0f5;
+  --rhc-color-hemelblauw-500: #01689b;
+  --rhc-color-hemelblauw-700: #154273;
+  --rhc-color-donkerblauw-700: #154273;
+
+  /* — status colors (CIBG semantic) — */
+  --rhc-color-groen-300: #e3f0d8;
+  --rhc-color-groen-500: #39870c;
+  --rhc-color-groen-700: #2a6609;
+  --rhc-color-rood-100: #fbe4e2;
+  --rhc-color-rood-300: #f0a9a3;
+  --rhc-color-rood-500: #d52b1e;
+  --rhc-color-rood-600: #b81f14;
+  --rhc-color-geel-100: #fff4d6;
+  --rhc-color-geel-600: #ffb612;
+  --rhc-color-oranje-500: #e17000;
+
+  /* — spacing scale (rem, Bootstrap-aligned) — */
+  --rhc-space-max-xs: 0.25rem;
+  --rhc-space-max-sm: 0.5rem;
+  --rhc-space-max-md: 1rem;
+  --rhc-space-max-lg: 1.5rem;
+  --rhc-space-max-xl: 2rem;
+  --rhc-space-max-2xl: 3rem;
+  --rhc-space-max-3xl: 4rem;
+  --rhc-space-max-4xl: 5rem;
+  --rhc-space-max-5xl: 6rem;
+
+  /* — border — */
+  --rhc-border-radius-sm: var(--bs-border-radius-sm);
+  --rhc-border-radius-md: var(--bs-border-radius);
+  --rhc-border-radius-round: 50%;
+  --rhc-border-width-sm: 1px;
+  --rhc-border-width-md: 2px;
+
+  /* — typography — */
+  --rhc-text-font-size-sm: 0.875rem;
+  --rhc-text-font-size-lg: 1.25rem;
+  --rhc-text-font-weight-regular: 400;
+  --rhc-text-font-weight-semi-bold: 600;
+  --rhc-text-font-weight-bold: 700;
+  --rhc-text-line-height-sm: 1.4;
+
+  /* System-font stack (licensed Rijksoverheid fonts intentionally not bundled — POC). */
+  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+}
 
 html, body { margin: 0; min-height: 100%; }
-/* Rijkshuisstijl pages sit on white; cards/panels carry the subtle grey. */
+/* Pages sit on white; cards/panels carry the subtle grey. */
 body { background: var(--rhc-color-wit); color: var(--rhc-color-foreground-default); }
 
 /* App theme layer: a few app-specific measures RHC has no token for (content/form