feat(design): adopt CIBG component patterns (header, forms, wizards, dashboard)

Re-skins the app's layout on top of the CIBG Huisstijl theme (previous commit) so it
matches designsystem.cibg.nl, not just its colour tokens — magenta ("robijn") header,
horizontal nav, and the CIBG component markup for forms/wizards/dashboard.

- Header: logo block + robijn titlebar (breadcrumb + user menu) + grey horizontal nav
  (4 links) replacing the dashboard side-nav; breadcrumb restyled for the titlebar
  (no background of its own — CIBG's global `header nav` rule otherwise bleeds a grey
  fill into it, fixed by scoping an override inside BreadcrumbComponent).
- Forms: form-field/radio-group/checkbox rebuilt on CIBG's horizontal `form-group row`
  / `form-check.styled` markup (label col-md-4, control col-md-8); same input() APIs.
- Wizards: stepper rebuilt as the CIBG "stappenindicator" (numbered circles, visited
  steps clickable for back-nav, title merged in); wizard-shell adopts the CIBG
  procesnavigatie button row. Back-navigation wired into all three wizard machines
  (registratie-wizard already had it; added `GaNaarStap` to intake/herregistratie
  machines, pure + spec'd).
- New shared/ui molecules: confirmation (animated bevestiging checkmark, replaces
  plain alerts on submit), review-section (controlestap sections with "Wijzigen"),
  application-list/application-link (CIBG "aanvragen" rows, replace the dashboard's
  card grid and aanvraag-block).
- Cleanup: delete side-nav and now-unused styles.scss utilities (.app-overview,
  .app-form-panel, .app-card-grid); correct design-tokens.mdx (it referenced tokens
  that no longer exist) and document the CIBG-value token bridge.

Verified: build/lint/check:tokens green, 178 tests pass (4 new GaNaarStap cases), and
manually driven end-to-end (dashboard, a full herregistratie submission through to the
confirmation screen, mobile width, keyboard focus).

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

src/app/registratie/ui/dashboard.page.ts

@@ -2,13 +2,13 @@ import { Component, computed, inject } from '@angular/core';
 import { Router } from '@angular/router';
 import { PageShellComponent } from '@shared/layout/page-shell/page-shell.component';
 import { HeadingComponent } from '@shared/ui/heading/heading.component';
-import { LinkComponent } from '@shared/ui/link/link.component';
 import { AlertComponent } from '@shared/ui/alert/alert.component';
 import { SkeletonComponent } from '@shared/ui/skeleton/skeleton.component';
 import { DataRowComponent } from '@shared/ui/data-row/data-row.component';
 import { CardComponent } from '@shared/ui/card/card.component';
 import { TaskListComponent } from '@shared/ui/task-list/task-list.component';
-import { SideNavComponent, NavItem } from '@shared/layout/side-nav/side-nav.component';
+import { ApplicationListComponent } from '@shared/ui/application-list/application-list.component';
+import { ApplicationLinkComponent } from '@shared/ui/application-link/application-link.component';
 import { ASYNC } from '@shared/ui/async/async.component';
 import { RegistrationSummaryComponent } from '@registratie/ui/registration-summary/registration-summary.component';
 import { RegistrationTableComponent } from '@registratie/ui/registration-table/registration-table.component';
@@ -24,24 +24,21 @@ import { tasksFromProfile } from '@registratie/domain/tasks';
 @Component({
   selector: 'app-dashboard-page',
   imports: [
-    PageShellComponent, HeadingComponent, LinkComponent, AlertComponent, SkeletonComponent,
-    DataRowComponent, CardComponent, TaskListComponent, SideNavComponent, ...ASYNC,
+    PageShellComponent, HeadingComponent, AlertComponent, SkeletonComponent,
+    DataRowComponent, CardComponent, TaskListComponent, ApplicationListComponent, ApplicationLinkComponent, ...ASYNC,
     RegistrationSummaryComponent, RegistrationTableComponent, AanvraagBlockComponent,
   ],
   template: `
     <app-page-shell i18n-heading="@@dashboard.heading" heading="Mijn overzicht" i18n-intro="@@dashboard.intro" intro="Welkom in uw persoonlijke omgeving van het BIG-register. Hier ziet u uw registratie en regelt u uw zaken.">
-      <div class="app-overview">
-        <app-side-nav [items]="nav" />
-
         <div class="app-stack">
           @if (aanvragen().length) {
             <section>
               <app-heading [level]="2" i18n="@@dashboard.mijnAanvragen">Mijn aanvragen</app-heading>
-              <div class="app-stack app-section">
+              <app-application-list class="app-section">
                 @for (a of aanvragen(); track a.id) {
                   <app-aanvraag-block animate.enter="app-item-enter" animate.leave="app-item-leave" [aanvraag]="a" (resume)="resume(a)" (cancel)="cancelAanvraag(a)" />
                 }
-              </div>
+              </app-application-list>
             </section>
           }
 
@@ -68,7 +65,7 @@ import { tasksFromProfile } from '@registratie/domain/tasks';
                   <app-registration-summary [reg]="$any(p).registration" />
                 </div>
                 <app-card class="app-section" i18n-heading="@@dashboard.persoonsgegevens" heading="Persoonsgegevens (BRP)">
-                  <dl>
+                  <dl class="row mb-0">
                     <app-data-row i18n-key="@@dashboard.straat" key="Straat" [value]="$any(p).person.adres.straat" />
                     <app-data-row i18n-key="@@dashboard.postcode" key="Postcode" [value]="$any(p).person.adres.postcode" />
                     <app-data-row i18n-key="@@dashboard.woonplaats" key="Woonplaats" [value]="$any(p).person.adres.woonplaats" />
@@ -100,19 +97,13 @@ import { tasksFromProfile } from '@registratie/domain/tasks';
 
           <section>
             <app-heading [level]="2" i18n="@@dashboard.watWiltUDoen">Wat wilt u doen?</app-heading>
-            <ul class="app-card-grid app-section">
+            <app-application-list class="app-section">
               @for (a of acties; track a.to) {
-                <li>
-                  <app-card [heading]="a.titel">
-                    <p>{{ a.tekst }}</p>
-                    <app-link [to]="a.to">{{ a.actie }} →</app-link>
-                  </app-card>
-                </li>
+                <app-application-link [heading]="a.titel" [subtitle]="a.tekst" [cta]="a.actie" [to]="a.to" />
               }
-            </ul>
+            </app-application-list>
           </section>
         </div>
-      </div>
     </app-page-shell>
   `,
 })
@@ -158,21 +149,15 @@ export class DashboardPage {
     return tasksFromProfile(reg, this.eligible());
   }
 
-  /** Portal sections (navigation, not actions). */
-  protected readonly nav: NavItem[] = [
-    { label: $localize`:@@dashboard.nav.overzicht:Overzicht`, to: '/dashboard' },
-    { label: $localize`:@@dashboard.nav.gegevens:Mijn gegevens`, to: '/registratie' },
-    { label: $localize`:@@dashboard.nav.herregistratie:Herregistratie`, to: '/herregistratie' },
-    { label: $localize`:@@dashboard.nav.inschrijven:Inschrijven`, to: '/registreren' },
-    { label: $localize`:@@dashboard.nav.concepten:Functionele patronen`, to: '/concepts' },
-    { label: $localize`:@@dashboard.nav.brief:Brief opstellen`, to: '/brief' },
-  ];
-
-  /** Primary transactional actions, as a card grid. */
+  /** Primary transactional actions, as an "aanvragen" list (see CIBG's
+      componenten/aanvragen). The core portal sections live in the header nav now;
+      the teaching pages (concepts/brief) are only reachable from here. */
   protected readonly acties = [
     { to: '/registreren', titel: $localize`:@@dashboard.actie.inschrijven.titel:Inschrijven`, tekst: $localize`:@@dashboard.actie.inschrijven.tekst:Schrijf u in in het BIG-register via de registratiewizard.`, actie: $localize`:@@dashboard.actie.inschrijven.actie:Start inschrijving` },
     { to: '/herregistratie', titel: $localize`:@@dashboard.actie.herregistratie.titel:Herregistratie aanvragen`, tekst: $localize`:@@dashboard.actie.herregistratie.tekst:Verleng uw registratie voor de komende periode.`, actie: $localize`:@@dashboard.actie.herregistratie.actie:Vraag aan` },
     { to: '/intake', titel: $localize`:@@dashboard.actie.intake.titel:Herregistratie-intake`, tekst: $localize`:@@dashboard.actie.intake.tekst:Vragenlijst met vertakkingen.`, actie: $localize`:@@dashboard.actie.intake.actie:Start intake` },
     { to: '/registratie', titel: $localize`:@@dashboard.actie.wijzigen.titel:Gegevens wijzigen`, tekst: $localize`:@@dashboard.actie.wijzigen.tekst:Bekijk uw gegevens of geef een wijziging door.`, actie: $localize`:@@dashboard.actie.wijzigen.actie:Bekijk gegevens` },
+    { to: '/concepts', titel: $localize`:@@dashboard.actie.concepten.titel:Functionele patronen`, tekst: $localize`:@@dashboard.actie.concepten.tekst:Bekijk de FP/TEA-bouwstenen van deze POC.`, actie: $localize`:@@dashboard.actie.concepten.actie:Bekijk patronen` },
+    { to: '/brief', titel: $localize`:@@dashboard.actie.brief.titel:Brief opstellen`, tekst: $localize`:@@dashboard.actie.brief.tekst:Stel een brief samen uit vaste en vrije onderdelen.`, actie: $localize`:@@dashboard.actie.brief.actie:Start brief` },
   ];
 }