@conduction/nextcloud-vue 2.144.0 → 2.145.0

package/dist/nextcloud-vue.css

@@ -731,12 +731,17 @@
 }
 
 /* Two buttons in a card's title row stand 8px apart (DqZaakContact "Live
-   gesprek", DqZaakEmail "Mail koppelen" / "Mail opstellen").
+   gesprek", DqZaakEmail "Mail koppelen" / "Mail opstellen"), also in an
+   integration card's CnDetailCard header (DqZaakTaken "Afspraken", "Kaarten").
    @spec openspec/changes/board-card-header-actions-gap/specs/board-card-header-actions-gap/spec.md#requirement-a-board-cards-title-row-buttons-stand-8px-apart */
 .cn-look-board .cn-widget-wrapper__actions:not(.cn-look-nextcloud *) {
 	gap: 8px;
 }
 
+.cn-look-board .cn-detail-card__header-right:not(.cn-look-nextcloud *) {
+	gap: 8px;
+}
+
 /* A detail page marked `cardButtons: "regular"` draws them at the 40px
    control height: the case page's tab cards (DqZaakContact "Live gesprek",
    DqZaakHistorie, DqZaakBetrokkenen), where setting and case-type pages keep 34.
@@ -1534,6 +1539,90 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 	text-decoration: underline;
 }
 
+/* A plain table an app draws in a settings card (dossiq's ZGW mapping, StUF
+   endpoints and audit log, AWB terms) reads as the board's settings tables:
+   14px, a near-white head with muted 600 labels, 10px 12px cells, soft rules.
+   The theme paints every th through its table header tokens, so the head
+   hands those tokens the board's values too.
+   @spec openspec/changes/board-settings-plain-tables/specs/settings-board-look/spec.md */
+.cn-look-board .settings-section table:not(.cn-data-table):not(.cn-look-nextcloud *) {
+	width: 100%;
+	border-collapse: collapse;
+	font-size: 14px;
+	line-height: 1.2;
+}
+
+.cn-look-board .settings-section table:not(.cn-data-table):not(.cn-look-nextcloud *) th {
+	--nldesign-component-table-header-background-color: var(--cn-board-table-head-bg, color-mix(in srgb, var(--color-background-hover) 40%, var(--color-main-background)));
+	--nldesign-component-table-header-color: var(--color-text-maxcontrast);
+	--nldesign-component-table-header-font-weight: 600;
+	padding: 10px 12px;
+	border-bottom: 1px solid var(--color-border);
+	background: var(--cn-board-table-head-bg, color-mix(in srgb, var(--color-background-hover) 40%, var(--color-main-background)));
+	color: var(--color-text-maxcontrast);
+	font-size: 14px;
+	font-weight: 600;
+	line-height: 1.2;
+	text-align: start;
+}
+
+/* The working calendar's month reads as the board draws it: the month name
+   first, at the content edge, with the previous and next month buttons after
+   it, and the buttons add no height to the line, so the month sits 20px under
+   the card title (DqInstellingenAlgemeen "Werkdagen en feestdagen": the
+   arrow put the month 30px in and 28px down).
+   @spec openspec/changes/working-calendar-board-head/specs/settings-board-look/spec.md */
+.cn-look-board .cn-working-calendar__title:not(.cn-look-nextcloud *) {
+	order: -1;
+	min-width: 0;
+	margin-inline-end: 4px;
+	line-height: 1.2;
+	text-align: start;
+}
+
+.cn-look-board .settings-section table:not(.cn-data-table):not(.cn-look-nextcloud *) td {
+	padding: 10px 12px;
+	border-bottom: 1px solid var(--color-background-dark);
+	color: var(--color-main-text);
+	font-size: 14px;
+	line-height: 1.2;
+	vertical-align: middle;
+}
+
+/* A strong cell's name in a settings card reads 15px bold over its muted
+   second line, as the boards draw a connection's name (DqInstellingen
+   "Koppelingen": <strong> 15px), not the index tables' 14px 500.
+   @spec openspec/changes/board-settings-strong-cell-name/specs/settings-board-look/spec.md */
+.cn-look-board .settings-section .cn-data-table td.cn-cell--strong:not(.cn-look-nextcloud *) {
+	font-weight: 400;
+}
+
+.cn-look-board .settings-section .cn-data-table td.cn-cell--strong:not(.cn-look-nextcloud *) > .cn-cell-renderer {
+	font-size: 15px;
+	font-weight: 700;
+}
+
+.cn-look-board .cn-working-calendar__head:not(.cn-look-nextcloud *) > .button-vue:not(.cn-working-calendar__add) {
+	margin-block: -8px;
+}
+
+/* In a one-column settings card a single-line field is at most 560px wide,
+   its hint under it, as the boards draw a field on its own row
+   (DqBeheerGeavanceerd "Financiële integratie", "Storeregister"); a text
+   area, a note or a switch still spans the card.
+   @spec openspec/changes/board-settings-single-field-width/specs/settings-board-look/spec.md */
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--text,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--password,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--secret,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--number,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--email,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--url,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--select,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--date,
+.cn-look-board .cn-settings-fields__grid--1:not(.cn-look-nextcloud *) > .cn-settings-field--datetime-local {
+	max-width: 560px;
+}
+
 /* Section actions sit at the end of the title row. The row is a grid, so a
    long title wraps beside the buttons instead of running under them. A
    half-width card keeps them there (DqVthInstellingen "Inspectiechecklists",
@@ -1590,6 +1679,24 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 	align-self: center;
 }
 
+/* A switch or radio in a board settings card starts at the card's content
+   edge, its label 12px (switch) or 10px (radio) after the control, as the
+   boards draw them (DqBeheerinstellingen "AI-ondersteunde verwerking").
+   NcCheckboxRadioSwitch pads its content 9px on each side, which set the
+   control 9px in from the fields above and below it.
+   @spec openspec/changes/board-settings-switch-radio-flush/specs/settings-board-look/spec.md */
+.cn-look-board .cn-settings-fields:not(.cn-look-nextcloud *) .checkbox-content {
+	padding-inline: 0;
+}
+
+.cn-look-board .cn-settings-fields:not(.cn-look-nextcloud *) .checkbox-content-switch {
+	gap: 12px;
+}
+
+.cn-look-board .cn-settings-fields:not(.cn-look-nextcloud *) .checkbox-content-radio {
+	gap: 10px;
+}
+
 /* The "Uitleg tonen" toggle is a text link flush with the card's right edge
    (DqBeheerinstellingen Zaak-e-mail), not a padded tertiary button.
    @spec openspec/changes/board-settings-title-centred-and-link-flush/specs/settings-board-look/spec.md */
@@ -1663,8 +1770,12 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 	max-width: none;
 }
 
-.cn-look-board .settings-section.cn-settings-section--wide:not(.cn-look-nextcloud *) .settings-section__name,
-.cn-look-board .settings-section.cn-settings-section--wide:not(.cn-look-nextcloud *) .settings-section__desc {
+/* A board card's title and subtitle run the card's width, wide or not
+   (DqBeheerGeavanceerd "Eerste keer", "StUF-ZKN-endpoints": the subtitle
+   wrapped at NcSettingsSection's 900px measure, the board's does not).
+   @spec openspec/changes/board-settings-desc-full-width/specs/settings-board-look/spec.md */
+.cn-look-board .settings-section:not(.cn-look-nextcloud *) .settings-section__name,
+.cn-look-board .settings-section:not(.cn-look-nextcloud *) .settings-section__desc {
 	max-width: none;
 }
 
@@ -2223,7 +2334,7 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
    12px follows it: the boards' card is title, 6px, rule, row (DqMijnTeam
    "Vastgelopen zaken", DqMijnWerk "Zaken die u volgt").
    @spec openspec/changes/board-card-title-above-ruled-list/specs/board-card-title-above-ruled-list/spec.md#requirement-a-ruled-list-starts-6px-under-the-card-title */
-.cn-look-board .cn-dashboard-page:not(.cn-look-nextcloud *) .cn-widget-wrapper:not(.cn-widget-wrapper--nc-dashboard):not(.cn-widget-wrapper--borderless):has(> .cn-widget-wrapper__content .cn-record-list--rule-above, > .cn-widget-wrapper__content .cn-tasks-widget__list, > .cn-widget-wrapper__content .cn-decision-list__rows) .cn-widget-wrapper__header {
+.cn-look-board .cn-dashboard-page:not(.cn-look-nextcloud *) .cn-widget-wrapper:not(.cn-widget-wrapper--nc-dashboard):not(.cn-widget-wrapper--borderless):has(> .cn-widget-wrapper__content .cn-record-list--rule-above, > .cn-widget-wrapper__content .cn-tasks-widget__list, > .cn-widget-wrapper__content .cn-decision-list__rows, > .cn-widget-wrapper__content .cn-nc-widget-widget__body--vertical) .cn-widget-wrapper__header {
 	padding-bottom: 6px;
 }
 
@@ -2759,13 +2870,13 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 
 /* A vertical NC widget is the board's activity list (DqMijnWerk "Recente
    activiteit"): hairline rows 12px above and below the text, a 10px dot in
-   the icon's place, the title 14px in the main ink and wrapping, the first
-   hairline 12px under the title. Thematiq underlines links with a heavier
-   selector, hence the !important.
+   the icon's place, the title 14px in the main ink and wrapping. Thematiq underlines links with a heavier
+   selector, hence the !important. The first hairline stands 6px under the
+   title, as on every Dq list card (design-system #432).
    @spec openspec/changes/board-nc-widget-activity-rows/specs/board-nc-widget-activity-rows/spec.md#requirement-a-board-dashboard-nc-widget-draws-its-items-as-activity-rows */
 .cn-look-board .cn-dashboard-page:not(.cn-look-nextcloud *) .cn-widget-wrapper:not(.cn-widget-wrapper--borderless) .cn-nc-widget-widget__body--vertical {
 	gap: 0;
-	padding: 2px var(--cn-board-dashboard-card-inset) 10px;
+	padding: 0 var(--cn-board-dashboard-card-inset) 10px;
 }
 
 .cn-look-board .cn-dashboard-page:not(.cn-look-nextcloud *) .cn-nc-widget-widget__body--vertical a.cn-nc-widget-widget__item--vertical {
@@ -3199,6 +3310,25 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 	line-height: normal;
 }
 
+/* A bar list in a framed section of a sections card is the board's small
+   list: 13px rows 8px apart, a 150px label column, a 10px bar and a 48px
+   value column (DqDoorlooptijd "Naleving per zaaktype").
+   @spec openspec/changes/board-section-bar-list-compact/specs/board-section-bar-list-compact/spec.md#requirement-a-bar-list-in-a-sections-card-section-is-compact */
+.cn-look-board .cn-sections-widget__section .cn-chart-widget__bar-list:not(.cn-look-nextcloud *) {
+	gap: 8px;
+}
+
+.cn-look-board .cn-sections-widget__section .cn-chart-widget__bar-list:not(.cn-look-nextcloud *) .cn-chart-widget__bar-line {
+	grid-template-columns: 150px minmax(0, 1fr) 48px;
+	gap: 10px;
+	font-size: 13px;
+}
+
+.cn-look-board .cn-sections-widget__section .cn-chart-widget__bar-list:not(.cn-look-nextcloud *) .cn-chart-widget__bar-track {
+	height: 10px;
+	border-radius: 5px;
+}
+
 /* A bar list with the value at the bar's end (DqProcesanalyse "Doorlooptijd
    per status") sets its rows in 13px, the label in the secondary text, the
    value in the main ink at 600, rows 34px apart.
@@ -3556,11 +3686,14 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	color: var(--color-text-maxcontrast);
 }
 
-/* The saved-view edit and share forms start 22px under the subtitle, as
-   the Dq dialog boards draw a first field: the body's 16px gap and 6px. */
+/* A body starts 22px under the subtitle, as the Dq dialog boards draw a
+   first field: the header's foot and the body gap alone, so the saved-view
+   edit and share forms and the confirm sentence pad nothing on top
+   (r29 on :8080: 28, 28 and 26px with their own padding). */
 .cn-dialog-board .dialog__content .cn-edit-view,
-.cn-dialog-board .dialog__content .cn-share-view {
-	padding-top: 6px;
+.cn-dialog-board .dialog__content .cn-share-view,
+.cn-dialog-board .dialog__content .cn-confirm__confirm {
+	padding-top: 0;
 }
 
 /* The close button is a 36px circle. NcButton sizes an icon-only button by
@@ -3597,7 +3730,9 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
    10px 14px padding, the checkbox row at the 24px minimum target instead of
    NcCheckboxRadioSwitch's 34px, the note at 1.2 line height; the card's
    corners 8px and the label on an 18px line, as the board draws them. */
-.cn-dialog-board .cn-assign-dialog__toggle {
+/* `.dialog` outranks the component's scoped rule (class + attribute), which
+   loads after this sheet and kept 12px 14px and 12px corners on :8080 (r29). */
+.cn-dialog-board .dialog .cn-assign-dialog__toggle {
 	padding: 10px 14px;
 	border-radius: 8px;
 }
@@ -3726,10 +3861,14 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
    border and radius 8 (PlanItemDialog, DqWerkvoorraad). NcInputField draws
    its border as a 65%-transparent shadow, which on the white dialog read as
    an empty band, and floats its label inside the border. A field with
-   `labelOutside` keeps the app's own label and takes the same control. */
+   `labelOutside` keeps the app's own label and takes the same control. The
+   label's box starts where the field starts and the control 23px under it,
+   as on every dialog board (72 fields on 11 boards): the label at the font's
+   normal line, 21px of room plus the control's 2px focus inset, the label
+   4px above that room's end. */
 .cn-dialog-board .dialog__content .input-field:has(.input-field__label),
 .cn-dialog-board .dialog__content .textarea:has(.textarea__label) {
-	margin-block-start: 26px;
+	margin-block-start: 21px;
 }
 
 /* NcSelect's search is an NcInputField inside the select, and the select's
@@ -3738,7 +3877,7 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
    select makes the label's room instead.
    @spec openspec/changes/board-dialog-select-label-room/specs/board-dialog-select-label-room/spec.md#requirement-a-board-dialog-select-makes-room-for-its-raised-label */
 .cn-dialog-board .dialog__content .v-select:has(.input-field__label) {
-	margin-block-start: 26px;
+	margin-block-start: 21px;
 }
 
 /* A select in a form dialog sits under its label and over its help line
@@ -3799,7 +3938,7 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	color: var(--color-main-text);
 	font-size: var(--cn-field-label-size, 14px);
 	font-weight: 600;
-	line-height: 20px;
+	line-height: normal;
 	pointer-events: auto;
 	transition: none;
 }
@@ -4615,7 +4754,7 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	grid-column: 1 / -1;
 	grid-row: 2;
 	justify-self: start;
-	margin-block: 6px 3px;
+	margin-block: 6px 0;
 }
 
 .cn-look-board.cn-index-page--sidebar-open .cn-page-header .cn-header-trail,
@@ -4628,6 +4767,13 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	grid-row: 4;
 }
 
+/* Without a breadcrumb trail the count line takes the trail's row, so no
+   empty row adds a second gap (DqZakenSorteren: 58px under the title). */
+.cn-look-board.cn-index-page--sidebar-open .cn-page-header:not(:has(.cn-header-trail)) .cn-page-header__text > .cn-page-header__description,
+.cn-look-board .cn-index-page--sidebar-open .cn-page-header:not(:has(.cn-header-trail)) .cn-page-header__text > .cn-page-header__description {
+	grid-row: 3;
+}
+
 /* The header buttons keep the board's button under a theme that styles every
    secondary or primary button with `!important` (the nldesign theme: a
    primary border, 8px 16px padding): Download and the Actions menu are 40px,
@@ -4728,6 +4874,15 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	gap: 8px;
 }
 
+/* With the side panel open the boards keep Filter on row 1 after Save view
+   and wrap the view switch alone to row 2 (DqFilterBeheren, DqZakenSorteren):
+   the unit dissolves into the bar's flex row.
+   @spec openspec/changes/board-filter-row-one-beside-side-panel/specs/board-filter-row-one-beside-side-panel/spec.md */
+.cn-look-board.cn-index-page--sidebar-open .cn-actions-bar--board .cn-actions-bar__view-controls,
+.cn-look-board .cn-index-page--sidebar-open .cn-actions-bar--board .cn-actions-bar__view-controls {
+	display: contents;
+}
+
 /* `quickFilterPlacement: "toolbar"` (DqTeamwachtrij): the chips take the room
    the Filter button and the view switch leave on row 1, so the three stay on
    one row in the column beside a side panel; the chips that do not fit move
@@ -5447,16 +5602,21 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
    `#content[class*="app-"]`, an id selector no class rule outranks, so a plain
    `content-box` here was ignored and the cell left 12px for the checkbox (the
    header's checkbox showed as a stray bracket). */
-/* The checkbox starts 20px in, as the boards draw a native checkbox (16px of
-   cell padding and its 4px margin; DqZoekresultaten), in the same 60px. */
+/* The cell pads 16px as the boards do and the checkbox starts 4px further in,
+   a native checkbox's margin (DqZoekresultaten, DqPostvak, DqContracten), in
+   the same 60px. */
 .cn-look-board .cn-table-container--board .cn-data-table .cn-table-col--checkbox {
 	box-sizing: border-box !important;
 	width: 60px;
 	min-width: 60px;
-	padding-inline: 20px 12px;
+	padding-inline: 16px;
 	text-align: start;
 }
 
+.cn-look-board .cn-table-container--board .cn-data-table .cn-table-col--checkbox .checkbox-radio-switch {
+	margin-inline-start: 4px;
+}
+
 .cn-look-board .cn-table-container--board .cn-data-table .checkbox-radio-switch {
 	--icon-size: 18px;
 }
@@ -5966,6 +6126,19 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	padding-top: 0;
 }
 
+/* The selection box sits flush where the boards draw it: NcCheckbox pads its
+   content 7px on each side (DqAanMijToegewezen card head, DqTeamwachtrij rows,
+   whose box starts 18px in).
+   @spec openspec/changes/board-selection-box-flush/specs/board-selection-box-flush/spec.md#requirement-a-cards-and-a-rows-selection-box-sits-where-the-board-draws-it */
+.cn-look-board .cn-object-card__record-head > .cn-object-card__checkbox .checkbox-radio-switch__content,
+.cn-look-board .cn-object-row__checkbox .checkbox-radio-switch__content {
+	padding-inline: 0;
+}
+
+.cn-look-board .cn-object-row__checkbox {
+	margin-inline-start: 6px;
+}
+
 .cn-look-board .cn-object-card--board .cn-object-card__record-head > .cn-object-card__checkbox ~ .cn-object-card__record-pill {
 	margin-inline-start: auto;
 }
@@ -7142,7 +7315,7 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 .cn-data-table--fit td.cn-table-col--grow.cn-cell--wrap {
 	min-width: 8em;
 	max-width: none;
-	overflow-wrap: anywhere;
+	overflow-wrap: break-word;
 	white-space: normal;
 }
 
@@ -7191,6 +7364,13 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	font-weight: 500;
 }
 
+/* A lead cell's value reads 15px, a person's name over their function
+   (DqAfdelingen). */
+.cn-data-table td.cn-cell--lead > .cn-cell-renderer,
+.cn-data-table td.cn-cell--lead .cn-table-row__link > .cn-cell-renderer {
+	font-size: 15px;
+}
+
 .cn-data-table td.cn-cell--muted {
 	color: var(--color-text-maxcontrast);
 }
@@ -11918,6 +12098,30 @@ li[data-cn-admin-tag] > .action-link::after {
 	font-size: 14px;
 }
 
+/* The reply box's buttons (Opslaan als concept, Versturen) are the board's
+   40px control, as DqBerichtVersturen draws Versturen; NcButton draws 34
+   (DqZaakContact r29 controlHeight 34).
+   @spec openspec/changes/board-conversation-reply-buttons-40/specs/board-conversation-reply-buttons-40/spec.md#requirement-the-reply-boxs-buttons-are-the-boards-40px-control */
+.cn-look-board .cn-conversation-thread__reply .button-vue:where(:not(.cn-look-nextcloud *)) {
+	--button-size: var(--cn-board-control-height);
+}
+
+/* A lead widget in a card (the review summary over the files) stands 16px
+   above the card's own body, the boards' gap between a card's parts
+   (DqZaakDocumenten r29: the files toolbar sat flush under the summary).
+   @spec openspec/changes/board-lead-widget-gap-16/specs/board-lead-widget-gap-16/spec.md#requirement-a-lead-widget-stands-16px-above-the-cards-body */
+.cn-look-board .cn-detail-widget-host__lead:not(.cn-look-nextcloud *) {
+	margin-bottom: 16px;
+}
+
+/* The compact review summary runs on the normal line height, as the board
+   draws its heading and legend (DqZaakDocumenten r29: heading 22.5 vs 18,
+   the box 99.5 vs 91 high).
+   @spec openspec/changes/board-stacked-bar-compact-line-height/specs/board-stacked-bar-compact-line-height/spec.md#requirement-the-compact-summary-runs-on-the-normal-line-height */
+.cn-look-board .cn-stacked-bar--compact:not(.cn-look-nextcloud *) {
+	line-height: normal;
+}
+
 /* The case Status card as the board draws it: no grey box, the status's
    explanation as its bold line, the time in the status muted under it.
    @spec openspec/changes/status-explainer-board/specs/record-widgets/spec.md#requirement-the-status-card-says-where-the-record-stands-as-the-board-draws-it */
@@ -11998,6 +12202,14 @@ li[data-cn-admin-tag] > .action-link::after {
 	padding: calc(12px - var(--cn-board-first-line-leading)) var(--cn-board-card-inline-padding) 20px;
 }
 
+/* A history card with stacked rows (DqTaak "Historie") opens on the first
+   row's hairline 6px under the title, the row's own 12px padding above its
+   text, as drawn: 19px from the title to the first action.
+   @spec openspec/changes/board-history-card-ruled-start/specs/board-history-card-ruled-start/spec.md#requirement-a-board-history-card-with-stacked-rows-opens-on-its-first-rule */
+.cn-look-board .cn-detail-card .cn-detail-card__content:has(> .cn-audit-card__list > .cn-audit-card__row--stacked:first-child):not(.cn-look-nextcloud *) {
+	padding-top: 6px;
+}
+
 /* A data card (labels over values) starts 14px below its title (DqZaak
    "Zaakgegevens", DqContact "Contact"). A side card keeps its 10px.
    @spec openspec/changes/board-data-card-gap/specs/board-data-card-gap/spec.md#requirement-a-board-data-cards-body-starts-14px-below-its-title */
@@ -12078,6 +12290,47 @@ li[data-cn-admin-tag] > .action-link::after {
 	font-weight: 500;
 }
 
+/* A data card's label and value sit 3px apart on the normal line height, as
+   the boards draw their facts (194 of 212 dt/dd pairs: gap 3px, no line
+   height); live ran them at 1.5 with a 2px gap (DqZaakContact
+   Ontvangstbevestiging r29: the first label 33.8 under the title, board 29).
+   @spec openspec/changes/board-data-cell-rhythm/specs/board-data-cell-rhythm/spec.md#requirement-a-data-cards-label-and-value-sit-3px-apart-on-the-normal-line-height */
+.cn-look-board .cn-object-data-widget__grid .cn-object-data-widget__cell.cn-object-data-widget__cell {
+	gap: 3px;
+}
+
+.cn-look-board .cn-object-data-widget__grid .cn-object-data-widget__label.cn-object-data-widget__label,
+.cn-look-board .cn-object-data-widget__grid .cn-object-data-widget__value {
+	line-height: normal;
+}
+
+/* A note in a page card starts at the card's inset: no list-item padding
+   around it, its icon 12px before the text (DqZaakEmail Notities r29: icon
+   at 31 and text at 71 where the board draws 23 and 67).
+   @spec openspec/changes/board-notes-card-rows-flush/specs/board-notes-card-rows-flush/spec.md#requirement-a-note-in-a-page-card-starts-at-the-cards-inset */
+.cn-look-board .cn-detail-widget-host .cn-notes-tab__thread .list-item__wrapper:not(.cn-look-nextcloud *),
+.cn-look-board .cn-detail-widget-host .cn-notes-tab__thread .list-item:not(.cn-look-nextcloud *) {
+	padding: 0;
+}
+
+.cn-look-board .cn-detail-widget-host .cn-notes-tab__thread .list-item-content:not(.cn-look-nextcloud *) {
+	padding-inline-start: 12px;
+}
+
+/* The note's two lines on the normal line height and its icon at the top of
+   the row, as the board draws the author tile beside the name (probed on
+   :8080: the name 44.8 under the title as drawn, the icon 6.5px lower while
+   centred in the 45px item).
+   @spec openspec/changes/board-notes-card-rows-flush/specs/board-notes-card-rows-flush/spec.md#requirement-a-note-in-a-page-card-starts-at-the-cards-inset */
+.cn-look-board .cn-detail-widget-host .cn-notes-tab__thread .list-item-content__name:not(.cn-look-nextcloud *),
+.cn-look-board .cn-detail-widget-host .cn-notes-tab__thread .list-item-content__subname:not(.cn-look-nextcloud *) {
+	line-height: normal;
+}
+
+.cn-look-board .cn-detail-widget-host .cn-notes-tab__thread .list-item__anchor > :first-child:not(.list-item-content):not(.cn-look-nextcloud *) {
+	align-self: flex-start;
+}
+
 /* Side cards: the heading is a 15px muted label, not a title. The tone
    carries `!important` against a theme that colours every h3 that way
    (thematiq's heading colour). */
@@ -12097,6 +12350,14 @@ li[data-cn-admin-tag] > .action-link::after {
 	padding: calc(10px - var(--cn-board-first-line-leading)) 22px 20px;
 }
 
+/* A side card that opens on a list draws its first row's hairline 10px below
+   the title box; the row has no leading for the glyph gap above to subtract
+   (DqZaaktypeRegels, DqZaaktypeStatussen "Versies").
+   @spec openspec/changes/board-side-list-gap/specs/board-side-list-gap/spec.md#requirement-a-board-side-cards-list-starts-10px-below-its-title */
+.cn-look-board .cn-detail-page__side .cn-widget-wrapper__content:has(> .cn-record-list--rows) {
+	padding-top: 10px;
+}
+
 /* A side card that opens on a lead (DqZaak "Aanvrager", DqOrganisatie "KvK en
    adres") draws the lead row 12px below the title, its two lines at their
    normal height so they centre on the 40px tile.
@@ -12176,6 +12437,13 @@ li[data-cn-admin-tag] > .action-link::after {
 	line-height: 1;
 }
 
+/* A list's Add in the title row is the card's 34px control, as the boards
+   draw a card's Add (DqZaaktype "Variant toevoegen"). */
+.cn-look-board .cn-detail-page__catalog-action--add:not(.cn-detail-page__side *):not(.cn-look-nextcloud *) {
+	height: 34px;
+	min-height: 34px;
+}
+
 .cn-look-board .cn-detail-page__catalog-action:not(.cn-detail-page__side *):not(.cn-look-nextcloud *):hover {
 	background: var(--color-background-hover);
 }
@@ -12610,6 +12878,26 @@ li[data-cn-admin-tag] > .action-link::after {
 	line-height: 1.2;
 }
 
+/* The task name takes the spare width, so it wraps only when long; the
+   handler stays on one line. */
+.cn-look-board .cn-detail-page .cn-widget-wrapper__content > .cn-tasks-widget .cn-tasks-widget__table th:first-child,
+.cn-look-board .cn-detail-page .cn-widget-wrapper__content > .cn-tasks-widget .cn-tasks-widget__table .cn-tasks-widget__cell-task {
+	width: 100%;
+}
+
+.cn-look-board .cn-detail-page .cn-widget-wrapper__content > .cn-tasks-widget .cn-tasks-widget__table .cn-tasks-widget__cell-handler {
+	white-space: nowrap;
+}
+
+/* A head's filter is a 22px button, so a head is 42px high as drawn. */
+.cn-look-board .cn-detail-page .cn-widget-wrapper__content > .cn-tasks-widget .cn-tasks-widget__table .cn-tasks-widget__head-filter .button-vue {
+	--button-size: 22px;
+	min-width: 22px;
+	min-height: 22px;
+	width: 22px;
+	height: 22px;
+}
+
 /* A long task name wraps under itself, as the board draws it, rather than
    widening the table past the card. */
 .cn-look-board .cn-detail-page .cn-widget-wrapper__content > .cn-tasks-widget .cn-tasks-widget__table :is(.cn-tasks-widget__name, .cn-tasks-widget__meta) {
@@ -12643,6 +12931,13 @@ li[data-cn-admin-tag] > .action-link::after {
 	padding-inline-end: var(--cn-board-card-inline-padding);
 }
 
+/* A row menu in the last column keeps its 34px button and 16px start
+   padding beside the card's end padding, so it is not cut off. */
+.cn-look-board .cn-detail-page .cn-widget-wrapper__content > .cn-object-list-widget--bleed .cn-table-container .cn-data-table .cn-table-col--actions:last-child {
+	width: calc(50px + var(--cn-board-card-inline-padding));
+	min-width: calc(50px + var(--cn-board-card-inline-padding));
+}
+
 /* ---- Grouped cards (CnGroupedCardsWidget, DqZaaktype "Fasen en taken") --- */
 /* Groups 14px apart, each padded 14px with a 10px radius and a bold title; a
    card in a group is padded 9px 12px with the 8px control radius, its title
@@ -12668,6 +12963,14 @@ li[data-cn-admin-tag] > .action-link::after {
 
 .cn-look-board .cn-grouped-cards__group-title.cn-grouped-cards__group-title {
 	font-weight: 700;
+	line-height: 1.2;
+}
+
+/* The buttons above the groups are the card's 34px controls ("Bekijken als
+   flow", "Taak toevoegen"), not the page's 40px ones. */
+.cn-look-board .cn-grouped-cards__actions:not(.cn-look-nextcloud *) .button-vue {
+	min-height: 34px;
+	height: 34px;
 }
 
 .cn-look-board .cn-grouped-cards__item.cn-grouped-cards__item {
@@ -12677,6 +12980,7 @@ li[data-cn-admin-tag] > .action-link::after {
 
 .cn-look-board .cn-grouped-cards__item-title.cn-grouped-cards__item-title {
 	font-size: 15px;
+	line-height: 1.2;
 }
 
 /* A card with actions holds them at its end, beside the title and meta (the
@@ -12855,6 +13159,15 @@ li[data-cn-admin-tag] > .action-link::after {
 	font-size: 14px;
 }
 
+/* The mail card's description runs on the normal line height: thematiq's
+   board paragraph token (1.5) gave
+   it 21px lines (probed on :8080 after REFRESH-4b: 14px/21 vs the board's
+   normal; DqZaakEmail r29 E-mail gapBelowTitle 44.4 vs 49).
+   @spec openspec/changes/board-mail-subtitle-line-height/specs/board-mail-subtitle-line-height/spec.md#requirement-the-mail-cards-description-runs-on-the-normal-line-height */
+.cn-look-board .cn-detail-widget-host .cn-mail-tab__subtitle.cn-mail-tab__subtitle:not(.cn-look-nextcloud *) {
+	line-height: normal;
+}
+
 /* ---- The attention flag's buttons --------------------------------------- */
 /* The case boards draw "Markeer voor aandacht" and the flag's other labelled
    buttons at the 40px control height (DqZaak and the case tab boards);
@@ -13019,9 +13332,14 @@ li[data-cn-admin-tag] > .action-link::after {
 }
 
 .cn-look-board .cn-detail-page__leaf-card .cn-contacts-tab .cn-contacts-tab__header {
+	display: inline-flex;
 	justify-content: flex-start;
 }
 
+.cn-look-board .cn-detail-page__leaf-card .cn-contacts-tab .cn-contacts-tab__header .button-vue {
+	--button-size: var(--cn-board-control-height);
+}
+
 /* A body card's subtitle as the Dq boards draw it: 14px muted at line
    height 1.2, 3px under the title, and the content 12px under it.
    @spec openspec/changes/board-card-subtitle-gaps/specs/board-card/spec.md */
@@ -13127,23 +13445,25 @@ li[data-cn-admin-tag] > .action-link::after {
 /* Appointment and note rows (DqTaak Afspraken, Notities): a hairline above
    every row including the first, 12px 0 padding, a 32px round tile (the day
    an appointment starts, the author's initials) 12px before the text, the
-   title 15/600 and one 13px muted meta line joined with " · ".
+   title 15/600 and one 13px muted meta line joined with " · ". Every
+   selector carries :not(.cn-look-nextcloud *) to outrank the cards' scoped
+   rules, which tie with a two-class selector and load later.
    @spec openspec/changes/board-task-cards-rows/specs/task-cards/spec.md#requirement-board-appointment-and-note-rows-carry-a-tile-and-a-meta-line */
-.cn-look-board .cn-events-card__list {
+.cn-look-board .cn-events-card__list:not(.cn-look-nextcloud *) {
 	gap: 0;
 }
 
-.cn-look-board .cn-events-card__event,
-.cn-look-board .cn-events-card__event:last-child,
-.cn-look-board .cn-notes-card__note,
-.cn-look-board .cn-notes-card__note:last-child {
+.cn-look-board .cn-events-card__event:not(.cn-look-nextcloud *),
+.cn-look-board .cn-events-card__event:not(.cn-look-nextcloud *):last-child,
+.cn-look-board .cn-notes-card__note:not(.cn-look-nextcloud *),
+.cn-look-board .cn-notes-card__note:not(.cn-look-nextcloud *):last-child {
 	padding: 12px 0;
 	border-top: 1px solid var(--cn-board-hairline);
 	border-bottom: none;
 }
 
-.cn-look-board .cn-events-card__day,
-.cn-look-board .cn-notes-card__initials {
+.cn-look-board .cn-events-card__day:not(.cn-look-nextcloud *),
+.cn-look-board .cn-notes-card__initials:not(.cn-look-nextcloud *) {
 	display: inline-flex;
 	flex: 0 0 32px;
 	align-items: center;
@@ -13157,60 +13477,60 @@ li[data-cn-admin-tag] > .action-link::after {
 	font-weight: 700;
 }
 
-.cn-look-board .cn-events-card__text {
+.cn-look-board .cn-events-card__text:not(.cn-look-nextcloud *) {
 	flex-flow: row wrap;
 	row-gap: 2px;
 }
 
-.cn-look-board .cn-events-card__summary,
-.cn-look-board .cn-notes-card__body {
+.cn-look-board .cn-events-card__summary:not(.cn-look-nextcloud *),
+.cn-look-board .cn-notes-card__body:not(.cn-look-nextcloud *) {
 	font-size: 15px;
 	font-weight: 600;
 	line-height: 1.35;
 }
 
-.cn-look-board .cn-events-card__summary {
+.cn-look-board .cn-events-card__summary:not(.cn-look-nextcloud *) {
 	flex-basis: 100%;
 }
 
-.cn-look-board .cn-events-card__when,
-.cn-look-board .cn-events-card__where,
-.cn-look-board .cn-notes-card__author,
-.cn-look-board .cn-notes-card__time {
+.cn-look-board .cn-events-card__when:not(.cn-look-nextcloud *),
+.cn-look-board .cn-events-card__where:not(.cn-look-nextcloud *),
+.cn-look-board .cn-notes-card__author:not(.cn-look-nextcloud *),
+.cn-look-board .cn-notes-card__time:not(.cn-look-nextcloud *) {
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 	font-weight: 400;
 }
 
-.cn-look-board .cn-events-card__where::before,
-.cn-look-board .cn-notes-card__time::before {
+.cn-look-board .cn-events-card__where:not(.cn-look-nextcloud *)::before,
+.cn-look-board .cn-notes-card__time:not(.cn-look-nextcloud *)::before {
 	content: ' · ';
 	white-space: pre;
 }
 
-.cn-look-board .cn-notes-card__note {
+.cn-look-board .cn-notes-card__note:not(.cn-look-nextcloud *) {
 	display: flex;
 	flex-direction: column;
 	gap: 2px;
 	padding-inline-start: 44px;
 }
 
-.cn-look-board .cn-notes-card__initials {
+.cn-look-board .cn-notes-card__initials:not(.cn-look-nextcloud *) {
 	position: absolute;
 	top: 12px;
 	inset-inline-start: 0;
 }
 
-.cn-look-board .cn-notes-card__body {
+.cn-look-board .cn-notes-card__body:not(.cn-look-nextcloud *) {
 	order: -1;
 }
 
-.cn-look-board .cn-notes-card__note-header {
+.cn-look-board .cn-notes-card__note-header:not(.cn-look-nextcloud *) {
 	justify-content: flex-start;
 	margin-bottom: 0;
 }
 
-.cn-look-board .cn-notes-card__time {
+.cn-look-board .cn-notes-card__time:not(.cn-look-nextcloud *) {
 	margin-inline-start: 0;
 }
 
@@ -13219,6 +13539,10 @@ li[data-cn-admin-tag] > .action-link::after {
    that names the role, the pills at the end. The role headings stay for
    assistive tech only.
    @spec openspec/changes/board-parties-rows/specs/parties/spec.md */
+.cn-look-board .cn-object-parties--board {
+	gap: 8px;
+}
+
 .cn-look-board .cn-object-parties--board .cn-object-parties__role-label {
 	position: absolute;
 	width: 1px;
@@ -13330,6 +13654,58 @@ li[data-cn-admin-tag] > .action-link::after {
 	font-weight: 600;
 	text-decoration: underline;
 }
+
+/* Two-column facts (`columns: 2`, DqContact "Contact", DqOrganisatie
+   "Organisatie"): the boards draw the label 2px above a regular-weight
+   value, with no hairline under the fact; the 14px row gap separates them.
+   @spec openspec/changes/board-facts-columns-plain/specs/board-facts-columns-plain/spec.md#requirement-board-two-column-facts-are-plain-label-over-value-pairs */
+.cn-look-board .cn-facts-widget__rows--columns:not(.cn-look-nextcloud *) .cn-facts-widget__row {
+	gap: 2px;
+	padding-bottom: 0;
+	border-bottom: none;
+}
+
+.cn-look-board .cn-facts-widget__rows--columns:not(.cn-look-nextcloud *) .cn-facts-widget__value.cn-facts-widget__value {
+	font-weight: 400;
+	line-height: normal;
+}
+
+.cn-look-board .cn-facts-widget__rows--columns:not(.cn-look-nextcloud *) .cn-facts-widget__label.cn-facts-widget__label {
+	line-height: normal;
+}
+
+/* A ruled list in a page card (`ruleAbove`, DqContact and DqOrganisatie
+   "Zaken", "Tickets"): the rule sits 12px under the title and each row has
+   12px above and below its text, so the first row's text is 25px under the
+   title.
+   @spec openspec/changes/board-ruled-list-card-start/specs/board-ruled-list-card-start/spec.md#requirement-a-board-ruled-list-in-a-page-card-starts-12px-under-the-title */
+.cn-look-board .cn-detail-page .cn-widget-wrapper__content:has(> .cn-record-list--rows.cn-record-list--rule-above):not(.cn-detail-page__side *),
+.cn-look-board .cn-detail-card__content:has(> .cn-record-list--rows.cn-record-list--rule-above):not(.cn-detail-page__side *) {
+	padding-top: 12px;
+}
+
+.cn-look-board .cn-detail-page .cn-record-list--rows.cn-record-list--rule-above:not(.cn-detail-page__side *):not(.cn-look-nextcloud *) .cn-record-list__row {
+	padding: 12px 0;
+}
+
+/* A side list row with initials stays one line: a 28px circle 8px before
+   the regular-weight text (DqSociaalDomein "Wie"). The library stacks side
+   rows into a column, which put the initials above the name.
+   @spec openspec/changes/board-side-person-rows/specs/board-side-person-rows/spec.md#requirement-a-board-side-row-with-initials-keeps-them-beside-the-text */
+.cn-look-board .cn-detail-page__side .cn-record-list__row:has(> .cn-record-list__avatar):not(.cn-look-nextcloud *) {
+	flex-direction: row;
+	align-items: center;
+	gap: 8px;
+}
+
+.cn-look-board .cn-detail-page__side .cn-record-list__row:not(.cn-look-nextcloud *) > .cn-record-list__avatar {
+	width: 28px;
+	height: 28px;
+}
+
+.cn-look-board .cn-detail-page__side .cn-record-list__row:has(> .cn-record-list__avatar):not(.cn-look-nextcloud *) .cn-record-list__title {
+	font-weight: 400;
+}
 /*
  * The reports page under the board look (screens-reports-page-board-look,
  * board DcRapportages): a 28px title over a muted lead, one section per
@@ -19088,7 +19464,7 @@ svg.leaflet-image-layer.leaflet-interactive path {
 .cn-data-table--fit td.cn-table-col--grow.cn-cell--wrap {
 	min-width: 8em;
 	max-width: none;
-	overflow-wrap: anywhere;
+	overflow-wrap: break-word;
 	white-space: normal;
 }
 
@@ -19137,6 +19513,13 @@ svg.leaflet-image-layer.leaflet-interactive path {
 	font-weight: 500;
 }
 
+/* A lead cell's value reads 15px, a person's name over their function
+   (DqAfdelingen). */
+.cn-data-table td.cn-cell--lead > .cn-cell-renderer,
+.cn-data-table td.cn-cell--lead .cn-table-row__link > .cn-cell-renderer {
+	font-size: 15px;
+}
+
 .cn-data-table td.cn-cell--muted {
 	color: var(--color-text-maxcontrast);
 }
@@ -21035,56 +21418,56 @@ a.cn-analytics-card__title[data-v-f3ca7b06]:hover {
 }
 
 
-.cn-audit-card__list[data-v-401394d1] {
+.cn-audit-card__list[data-v-7e58faa4] {
 	list-style: none;
 	margin: 0;
 	padding: 0;
 }
-.cn-audit-card__row[data-v-401394d1] {
+.cn-audit-card__row[data-v-7e58faa4] {
 	padding: 6px 0;
 	border-bottom: 1px solid var(--color-border);
 }
-.cn-audit-card__row[data-v-401394d1]:last-child {
+.cn-audit-card__row[data-v-7e58faa4]:last-child {
 	border-bottom: none;
 }
-.cn-audit-card__row-head[data-v-401394d1] {
+.cn-audit-card__row-head[data-v-7e58faa4] {
 	display: flex;
 	justify-content: space-between;
 	gap: 8px;
 }
-.cn-audit-card__action[data-v-401394d1] {
+.cn-audit-card__action[data-v-7e58faa4] {
 	color: var(--color-main-text);
 }
-.cn-audit-card__when[data-v-401394d1] {
+.cn-audit-card__when[data-v-7e58faa4] {
 	color: var(--color-text-maxcontrast);
 	font-size: 0.85em;
 	white-space: nowrap;
 }
-.cn-audit-card__row-body[data-v-401394d1] {
+.cn-audit-card__row-body[data-v-7e58faa4] {
 	color: var(--color-text-maxcontrast);
 	font-size: 0.9em;
 }
-.cn-audit-card__refused[data-v-401394d1] {
+.cn-audit-card__refused[data-v-7e58faa4] {
 	margin-inline-start: 6px;
 	font-weight: 700;
 	color: var(--color-error-text, var(--color-main-text));
 }
-.cn-audit-card__reason[data-v-401394d1] {
+.cn-audit-card__reason[data-v-7e58faa4] {
 	margin: 2px 0 0;
 	font-size: 0.9em;
 	overflow-wrap: anywhere;
 }
-.cn-audit-card__empty[data-v-401394d1] {
+.cn-audit-card__empty[data-v-7e58faa4] {
 	color: var(--color-text-maxcontrast);
 	text-align: center;
 	padding: 12px 0;
 }
-.cn-audit-card__footnote[data-v-401394d1] {
+.cn-audit-card__footnote[data-v-7e58faa4] {
 	margin: 12px 0 0;
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-audit-card__show-all[data-v-401394d1] {
+.cn-audit-card__show-all[data-v-7e58faa4] {
 	background: none;
 	border: none;
 	color: var(--color-primary-element);
@@ -21092,7 +21475,7 @@ a.cn-analytics-card__title[data-v-f3ca7b06]:hover {
 	padding: 4px 0;
 	font: inherit;
 }
-.cn-audit-card__show-all[data-v-401394d1]:hover {
+.cn-audit-card__show-all[data-v-7e58faa4]:hover {
 	text-decoration: underline;
 }
 
@@ -32610,13 +32993,13 @@ to { background-position: -200% 0;
 }
 
 
-.cn-detail-widget-header-items[data-v-3a30dc4a] {
+.cn-detail-widget-header-items[data-v-7186a696] {
 	display: inline-flex;
 	flex-wrap: wrap;
 	align-items: center;
 	gap: 12px;
 }
-.cn-detail-page__catalog-action[data-v-3a30dc4a] {
+.cn-detail-page__catalog-action[data-v-7186a696] {
 	align-items: center;
 	background: var(--color-primary-element-light);
 	border: 0;
@@ -32635,7 +33018,7 @@ to { background-position: -200% 0;
 
 
 /* The card keeps its own box, footnote included. */
-.cn-audit-trail-widget[data-v-6387051e] {
+.cn-audit-trail-widget[data-v-87ba40b4] {
 	display: contents;
 }
 
@@ -34361,16 +34744,16 @@ button.cn-stepper__step[data-v-3cab4d7d] {
 }
 
 
-.cn-widget-object-table[data-v-22886682] {
+.cn-widget-object-table[data-v-7115cd32] {
 	width: 100%;
 }
-.cn-widget-object-table__footer[data-v-22886682] {
+.cn-widget-object-table__footer[data-v-7115cd32] {
 	display: flex;
 	gap: 4px;
 	padding: 4px 8px;
 	border-top: 1px solid var(--color-border);
 }
-.cn-widget-object-table__error[data-v-22886682] {
+.cn-widget-object-table__error[data-v-7115cd32] {
 	color: var(--color-text-error, var(--color-error-text));
 	font-size: 0.85em;
 	margin: 4px 8px 0;
@@ -40582,56 +40965,56 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 }
 
 
-.cn-mail-tab[data-v-12407f1c] {
+.cn-mail-tab[data-v-0fa12b0e] {
 	display: flex;
 	flex-direction: column;
 	gap: 16px;
 	padding: 12px;
 }
-.cn-mail-tab__header[data-v-12407f1c] {
+.cn-mail-tab__header[data-v-0fa12b0e] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: flex-start;
 	justify-content: space-between;
 	gap: 10px 16px;
 }
-.cn-mail-tab__heading[data-v-12407f1c] {
+.cn-mail-tab__heading[data-v-0fa12b0e] {
 	display: flex;
 	flex: 1 1 260px;
 	flex-direction: column;
 	gap: 3px;
 	min-width: 0;
 }
-.cn-mail-tab__header-actions[data-v-12407f1c] {
+.cn-mail-tab__header-actions[data-v-0fa12b0e] {
 	display: flex;
 	flex: none;
 	flex-wrap: wrap;
 	gap: 8px;
 }
-.cn-mail-tab__title[data-v-12407f1c] {
+.cn-mail-tab__title[data-v-0fa12b0e] {
 	margin: 0;
 	font-size: 16px;
 	font-weight: bold;
 }
-.cn-mail-tab__subtitle[data-v-12407f1c],
-.cn-mail-tab__hint[data-v-12407f1c] {
+.cn-mail-tab__subtitle[data-v-0fa12b0e],
+.cn-mail-tab__hint[data-v-0fa12b0e] {
 	margin: 0;
 	color: var(--color-text-maxcontrast);
 }
-.cn-mail-tab__template-row[data-v-12407f1c] {
+.cn-mail-tab__template-row[data-v-0fa12b0e] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: flex-end;
 	gap: 8px;
 }
-.cn-mail-tab__template-select[data-v-12407f1c] {
+.cn-mail-tab__template-select[data-v-0fa12b0e] {
 	flex: 1 1 260px;
 }
-.cn-mail-tab__unresolved[data-v-12407f1c] {
+.cn-mail-tab__unresolved[data-v-0fa12b0e] {
 	margin: 4px 0 0;
 	padding-inline-start: 20px;
 }
-.cn-mail-tab__unresolved code[data-v-12407f1c] {
+.cn-mail-tab__unresolved code[data-v-0fa12b0e] {
 	background: var(--color-background-dark);
 	padding: 2px 6px;
 	border-radius: var(--border-radius);
@@ -40834,38 +41217,38 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 }
 
 
-.cn-field-list-widget[data-v-91c65ff8] {
+.cn-field-list-widget[data-v-785b1f94] {
 	display: flex;
 	flex-direction: column;
 	gap: 12px;
 	min-width: 0;
 }
-.cn-field-list-widget__lead[data-v-91c65ff8] {
+.cn-field-list-widget__lead[data-v-785b1f94] {
 	margin: 0;
 	font-weight: bold;
 }
-.cn-field-list-widget__rows[data-v-91c65ff8] {
+.cn-field-list-widget__rows[data-v-785b1f94] {
 	list-style: none;
 	margin: 0;
 	padding: 0;
 	display: flex;
 	flex-direction: column;
 }
-.cn-field-list-widget__row[data-v-91c65ff8] {
+.cn-field-list-widget__row[data-v-785b1f94] {
 	padding: 10px 0;
 	border-top: 1px solid var(--color-border);
 }
-.cn-field-list-widget__row[data-v-91c65ff8]:first-child {
+.cn-field-list-widget__row[data-v-785b1f94]:first-child {
 	border-top: none;
 	padding-top: 0;
 }
-.cn-field-list-widget__line[data-v-91c65ff8] {
+.cn-field-list-widget__line[data-v-785b1f94] {
 	display: flex;
 	align-items: center;
 	gap: 12px;
 	min-width: 0;
 }
-.cn-field-list-widget__avatar[data-v-91c65ff8] {
+.cn-field-list-widget__avatar[data-v-785b1f94] {
 	flex: 0 0 auto;
 	display: inline-flex;
 	align-items: center;
@@ -40878,69 +41261,69 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	font-size: 12px;
 	font-weight: 700;
 }
-.cn-field-list-widget__main[data-v-91c65ff8] {
+.cn-field-list-widget__main[data-v-785b1f94] {
 	display: flex;
 	flex-direction: column;
 	flex: 1 1 auto;
 	min-width: 0;
 }
-.cn-field-list-widget__title[data-v-91c65ff8] {
+.cn-field-list-widget__title[data-v-785b1f94] {
 	font-weight: 600;
 	overflow-wrap: anywhere;
 }
-.cn-field-list-widget__meta[data-v-91c65ff8],
-.cn-field-list-widget__aside[data-v-91c65ff8],
-.cn-field-list-widget__detail[data-v-91c65ff8],
-.cn-field-list-widget__hint[data-v-91c65ff8],
-.cn-field-list-widget__empty[data-v-91c65ff8] {
+.cn-field-list-widget__meta[data-v-785b1f94],
+.cn-field-list-widget__aside[data-v-785b1f94],
+.cn-field-list-widget__detail[data-v-785b1f94],
+.cn-field-list-widget__hint[data-v-785b1f94],
+.cn-field-list-widget__empty[data-v-785b1f94] {
 	color: var(--color-text-maxcontrast);
 }
-.cn-field-list-widget__meta[data-v-91c65ff8],
-.cn-field-list-widget__aside[data-v-91c65ff8],
-.cn-field-list-widget__copies[data-v-91c65ff8] {
+.cn-field-list-widget__meta[data-v-785b1f94],
+.cn-field-list-widget__aside[data-v-785b1f94],
+.cn-field-list-widget__copies[data-v-785b1f94] {
 	display: flex;
 	flex-wrap: wrap;
 	gap: 4px;
 }
-.cn-field-list-widget__detail[data-v-91c65ff8] {
+.cn-field-list-widget__detail[data-v-785b1f94] {
 	font-size: 13px;
 }
-.cn-field-list-widget__aside[data-v-91c65ff8] {
+.cn-field-list-widget__aside[data-v-785b1f94] {
 	white-space: nowrap;
 }
-.cn-field-list-widget__detail[data-v-91c65ff8],
-.cn-field-list-widget__hint[data-v-91c65ff8],
-.cn-field-list-widget__empty[data-v-91c65ff8] {
+.cn-field-list-widget__detail[data-v-785b1f94],
+.cn-field-list-widget__hint[data-v-785b1f94],
+.cn-field-list-widget__empty[data-v-785b1f94] {
 	margin: 4px 0 0;
 	overflow-wrap: anywhere;
 }
-.cn-field-list-widget__add[data-v-91c65ff8] {
+.cn-field-list-widget__add[data-v-785b1f94] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: flex-end;
 	gap: 8px 12px;
 }
-.cn-field-list-widget__add[data-v-91c65ff8] > * {
+.cn-field-list-widget__add[data-v-785b1f94] > * {
 	flex: 1 1 180px;
 }
-.cn-field-list-widget__add > button[data-v-91c65ff8] {
+.cn-field-list-widget__add > button[data-v-785b1f94] {
 	flex: 0 0 auto;
 }
-.cn-field-list-widget__toolbar[data-v-91c65ff8] {
+.cn-field-list-widget__toolbar[data-v-785b1f94] {
 	display: flex;
 	justify-content: flex-end;
 }
-.cn-field-list-widget__table-wrap[data-v-91c65ff8] {
+.cn-field-list-widget__table-wrap[data-v-785b1f94] {
 	display: flex;
 	flex-direction: column;
 	gap: 12px;
 	overflow-x: auto;
 }
-.cn-field-list-widget__table[data-v-91c65ff8] {
+.cn-field-list-widget__table[data-v-785b1f94] {
 	width: 100%;
 	border-collapse: collapse;
 }
-.cn-field-list-widget__th[data-v-91c65ff8] {
+.cn-field-list-widget__th[data-v-785b1f94] {
 	padding: 8px 12px;
 	text-align: start;
 	font-size: 13px;
@@ -40949,31 +41332,31 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	color: var(--color-text-maxcontrast);
 	background: var(--color-background-hover);
 }
-.cn-field-list-widget__th--menu[data-v-91c65ff8],
-.cn-field-list-widget__code[data-v-91c65ff8] {
+.cn-field-list-widget__th--menu[data-v-785b1f94],
+.cn-field-list-widget__code[data-v-785b1f94] {
 	font-size: 0.85em;
 	word-break: break-all;
 }
-.cn-field-list-widget__td--menu[data-v-91c65ff8] {
+.cn-field-list-widget__td--menu[data-v-785b1f94] {
 	width: 1%;
 	text-align: end;
 }
-.cn-field-list-widget__tr[data-v-91c65ff8] {
+.cn-field-list-widget__tr[data-v-785b1f94] {
 	border-top: 1px solid var(--cn-board-hairline, var(--color-border));
 }
-.cn-field-list-widget__td[data-v-91c65ff8] {
+.cn-field-list-widget__td[data-v-785b1f94] {
 	padding: 10px 12px;
 	vertical-align: middle;
 	overflow-wrap: anywhere;
 }
-.cn-field-list-widget__sr[data-v-91c65ff8] {
+.cn-field-list-widget__sr[data-v-785b1f94] {
 	position: absolute;
 	width: 1px;
 	height: 1px;
 	overflow: hidden;
 	clip-path: inset(50%);
 }
-.cn-field-list-widget__band[data-v-91c65ff8] {
+.cn-field-list-widget__band[data-v-785b1f94] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: center;
@@ -41714,20 +42097,20 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 }
 
 
-.cn-record-list__checklist-bar[data-v-544b79cd] {
+.cn-record-list__checklist-bar[data-v-8b7be6f2] {
 	height: 8px;
 	margin-block-end: 16px;
 	border-radius: 4px;
 	background: var(--color-background-dark);
 	overflow: hidden;
 }
-.cn-record-list__checklist-fill[data-v-544b79cd] {
+.cn-record-list__checklist-fill[data-v-8b7be6f2] {
 	display: block;
 	height: 100%;
 	border-radius: 4px;
 	background: var(--color-primary-element);
 }
-.cn-record-list__checklist[data-v-544b79cd] {
+.cn-record-list__checklist[data-v-8b7be6f2] {
 	display: grid;
 	grid-template-columns: repeat(var(--cn-record-list-columns, 3), minmax(0, 1fr));
 	gap: 8px 16px;
@@ -41735,16 +42118,16 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	padding: 0;
 	list-style: none;
 }
-.cn-record-list__check[data-v-544b79cd] {
+.cn-record-list__check[data-v-8b7be6f2] {
 	display: flex;
 	align-items: center;
 	gap: 8px;
 	min-height: 28px;
 }
-.cn-record-list__check--done[data-v-544b79cd] {
+.cn-record-list__check--done[data-v-8b7be6f2] {
 	color: var(--color-text-maxcontrast);
 }
-.cn-record-list__check-mark[data-v-544b79cd] {
+.cn-record-list__check-mark[data-v-8b7be6f2] {
 	display: inline-flex;
 	flex: none;
 	align-items: center;
@@ -41754,45 +42137,45 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	border: 2px solid var(--color-border-maxcontrast);
 	border-radius: 50%;
 }
-.cn-record-list__check--done .cn-record-list__check-mark[data-v-544b79cd] {
+.cn-record-list__check--done .cn-record-list__check-mark[data-v-8b7be6f2] {
 	border-color: transparent;
 	background: var(--color-success-hover, var(--color-background-dark));
 	color: var(--color-success-text, var(--color-success));
 }
 @media (max-width: 640px) {
-.cn-record-list__checklist[data-v-544b79cd] {
+.cn-record-list__checklist[data-v-8b7be6f2] {
 		grid-template-columns: minmax(0, 1fr);
 }
 }
-.cn-record-list__set-field-done[data-v-544b79cd] {
+.cn-record-list__set-field-done[data-v-8b7be6f2] {
 	display: inline-flex;
 	align-items: center;
 	gap: 4px;
 	color: var(--color-success-text, var(--color-success));
 	font-weight: bold;
 }
-.cn-record-list__list[data-v-544b79cd] {
+.cn-record-list__list[data-v-8b7be6f2] {
 	list-style: none;
 	margin: 0;
 	padding: 0;
 }
-.cn-record-list__group-heading[data-v-544b79cd] {
+.cn-record-list__group-heading[data-v-8b7be6f2] {
 	margin: 6px 0 0;
 	font-size: 15px;
 	font-weight: 700;
 	line-height: 1.4;
 }
-.cn-record-list__group-head[data-v-544b79cd] {
+.cn-record-list__group-head[data-v-8b7be6f2] {
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
 	gap: 8px;
 	margin-top: 6px;
 }
-.cn-record-list__group-head .cn-record-list__group-heading[data-v-544b79cd] {
+.cn-record-list__group-head .cn-record-list__group-heading[data-v-8b7be6f2] {
 	margin: 0;
 }
-.cn-record-list__action--tonal.button-vue[data-v-544b79cd] {
+.cn-record-list__action--tonal.button-vue[data-v-8b7be6f2] {
 	min-height: 34px;
 	height: 34px;
 	padding: 0 12px;
@@ -41803,34 +42186,34 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	font-size: 13px;
 	font-weight: 600;
 }
-.cn-record-list__action--tonal.button-vue[data-v-544b79cd]:hover:not(:disabled) {
+.cn-record-list__action--tonal.button-vue[data-v-8b7be6f2]:hover:not(:disabled) {
 	background-color: var(--color-primary-element-light-hover);
 }
-.cn-record-list__footer[data-v-544b79cd] {
+.cn-record-list__footer[data-v-8b7be6f2] {
 	display: flex;
 	flex-direction: column;
 	align-items: flex-start;
 	gap: 6px;
 	margin-top: 10px;
 }
-.cn-record-list__footer--wide[data-v-544b79cd] {
+.cn-record-list__footer--wide[data-v-8b7be6f2] {
 	align-items: stretch;
 }
-.cn-record-list__footer-note[data-v-544b79cd] {
+.cn-record-list__footer-note[data-v-8b7be6f2] {
 	margin: 0 0 6px;
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-record-list__footer-reason[data-v-544b79cd] {
+.cn-record-list__footer-reason[data-v-8b7be6f2] {
 	font-size: 13px;
 	color: var(--color-text-maxcontrast);
 }
-.cn-record-list__empty[data-v-544b79cd],
-.cn-record-list__error[data-v-544b79cd] {
+.cn-record-list__empty[data-v-8b7be6f2],
+.cn-record-list__error[data-v-8b7be6f2] {
 	color: var(--color-text-maxcontrast);
 	margin: 0;
 }
-.cn-record-list__notice[data-v-544b79cd] {
+.cn-record-list__notice[data-v-8b7be6f2] {
 	display: flex;
 	gap: 10px;
 	align-items: flex-start;
@@ -41839,41 +42222,41 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	background: var(--color-primary-element-light, var(--color-background-dark));
 	color: var(--color-main-text);
 }
-.cn-record-list__notice--warning[data-v-544b79cd] {
+.cn-record-list__notice--warning[data-v-8b7be6f2] {
 	background: var(--color-warning-light, rgba(255, 196, 0, 0.12));
 	color: var(--color-warning-text, var(--color-main-text));
 }
-.cn-record-list__notice--error[data-v-544b79cd] {
+.cn-record-list__notice--error[data-v-8b7be6f2] {
 	background: var(--color-error-light, rgba(219, 0, 0, 0.08));
 	color: var(--color-error-text, var(--color-main-text));
 }
-.cn-record-list__notice--footnote[data-v-544b79cd] {
+.cn-record-list__notice--footnote[data-v-8b7be6f2] {
 	margin-top: 12px;
 }
-.cn-record-list__notice-icon[data-v-544b79cd] {
+.cn-record-list__notice-icon[data-v-8b7be6f2] {
 	flex: 0 0 auto;
 	margin-top: 1px;
 }
-.cn-record-list__notice-text[data-v-544b79cd] {
+.cn-record-list__notice-text[data-v-8b7be6f2] {
 	margin: 0;
 	line-height: 1.5;
 }
-.cn-record-list__loading[data-v-544b79cd] {
+.cn-record-list__loading[data-v-8b7be6f2] {
 	display: flex;
 	justify-content: center;
 	padding: 8px 0;
 }
 
 /* rows */
-.cn-record-list--rows .cn-record-list__item + .cn-record-list__item[data-v-544b79cd],
-.cn-record-list--rule-above .cn-record-list__item[data-v-544b79cd]:first-child {
+.cn-record-list--rows .cn-record-list__item + .cn-record-list__item[data-v-8b7be6f2],
+.cn-record-list--rule-above .cn-record-list__item[data-v-8b7be6f2]:first-child {
 	border-top: 1px solid var(--color-border);
 }
-.cn-record-list__pill-start[data-v-544b79cd] {
+.cn-record-list__pill-start[data-v-8b7be6f2] {
 	display: flex;
 	flex: none;
 }
-.cn-record-list__bar[data-v-544b79cd] {
+.cn-record-list__bar[data-v-8b7be6f2] {
 	background: var(--color-border);
 	border-radius: 3px;
 	display: block;
@@ -41881,15 +42264,15 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	margin: -6px 0 12px;
 	overflow: hidden;
 }
-.cn-record-list__bar-fill[data-v-544b79cd] {
+.cn-record-list__bar-fill[data-v-8b7be6f2] {
 	background: var(--color-primary-element);
 	display: block;
 	height: 100%;
 }
-.cn-record-list__bar--over .cn-record-list__bar-fill[data-v-544b79cd] {
+.cn-record-list__bar--over .cn-record-list__bar-fill[data-v-8b7be6f2] {
 	background: var(--color-error);
 }
-.cn-record-list__row[data-v-544b79cd] {
+.cn-record-list__row[data-v-8b7be6f2] {
 	align-items: center;
 	color: var(--color-main-text);
 	display: flex;
@@ -41897,17 +42280,17 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	padding: 12px 0;
 	text-decoration: none;
 }
-.cn-record-list__row--link:hover .cn-record-list__title[data-v-544b79cd],
-.cn-record-list__row--link:focus-visible .cn-record-list__title[data-v-544b79cd] {
+.cn-record-list__row--link:hover .cn-record-list__title[data-v-8b7be6f2],
+.cn-record-list__row--link:focus-visible .cn-record-list__title[data-v-8b7be6f2] {
 	text-decoration: underline;
 }
-.cn-record-list__dot[data-v-544b79cd] {
+.cn-record-list__dot[data-v-8b7be6f2] {
 	flex: 0 0 14px;
 	width: 14px;
 	height: 14px;
 	border-radius: 50%;
 }
-.cn-record-list__flag[data-v-544b79cd] {
+.cn-record-list__flag[data-v-8b7be6f2] {
 	color: var(--color-text-maxcontrast);
 	font-size: 14px;
 	white-space: nowrap;
@@ -41915,12 +42298,12 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 
 /* `avatar.size: 32`: the smaller circle, 12px from the title where the row
    keeps 16px between its other parts (DqZaakBesluiten Adviezen). */
-.cn-record-list__list--avatar-small .cn-record-list__avatar[data-v-544b79cd] {
+.cn-record-list__list--avatar-small .cn-record-list__avatar[data-v-8b7be6f2] {
 	width: 32px;
 	height: 32px;
 	margin-inline-end: -4px;
 }
-.cn-record-list__avatar[data-v-544b79cd] {
+.cn-record-list__avatar[data-v-8b7be6f2] {
 	align-items: center;
 	background: var(--color-background-hover);
 	border-radius: 50%;
@@ -41933,97 +42316,97 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	justify-content: center;
 	width: 36px;
 }
-.cn-record-list__main[data-v-544b79cd] {
+.cn-record-list__main[data-v-8b7be6f2] {
 	display: flex;
 	flex: 1 1 auto;
 	flex-direction: column;
 	gap: 2px;
 	min-width: 0;
 }
-.cn-record-list__title[data-v-544b79cd] {
+.cn-record-list__title[data-v-8b7be6f2] {
 	font-size: 15px;
 	font-weight: 700;
 }
-.cn-record-list--compact .cn-record-list__row[data-v-544b79cd] {
+.cn-record-list--compact .cn-record-list__row[data-v-8b7be6f2] {
 	box-sizing: border-box;
 	min-height: 56px;
 	padding: 10px 0;
 }
-.cn-record-list--compact .cn-record-list__title[data-v-544b79cd] {
+.cn-record-list--compact .cn-record-list__title[data-v-8b7be6f2] {
 	font-weight: 500;
 }
 
 /* `density: "stacked"`: the rows stand 10px apart with no rule and no row
    padding, a short side list (DqDagAfsluiten "Morgen eerst"). */
-.cn-record-list--stacked .cn-record-list__list[data-v-544b79cd] {
+.cn-record-list--stacked .cn-record-list__list[data-v-8b7be6f2] {
 	display: flex;
 	flex-direction: column;
 	gap: 10px;
 }
-.cn-record-list--stacked .cn-record-list__row[data-v-544b79cd] {
+.cn-record-list--stacked .cn-record-list__row[data-v-8b7be6f2] {
 	min-height: 0;
 	padding: 0;
 }
-.cn-record-list--stacked .cn-record-list__item + .cn-record-list__item[data-v-544b79cd] {
+.cn-record-list--stacked .cn-record-list__item + .cn-record-list__item[data-v-8b7be6f2] {
 	border-top: 0;
 }
-.cn-record-list__meta[data-v-544b79cd] {
+.cn-record-list__meta[data-v-8b7be6f2] {
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-record-list__aside[data-v-544b79cd] {
+.cn-record-list__aside[data-v-8b7be6f2] {
 	align-items: center;
 	display: flex;
 	flex: none;
 	gap: 16px;
 }
-.cn-record-list__leading[data-v-544b79cd] {
+.cn-record-list__leading[data-v-8b7be6f2] {
 	flex: 0 0 52px;
 	color: var(--color-text-maxcontrast);
 	font-size: 14px;
 	font-weight: 600;
 	font-variant-numeric: tabular-nums;
 }
-.cn-record-list__trailing[data-v-544b79cd] {
+.cn-record-list__trailing[data-v-8b7be6f2] {
 	font-size: 14px;
 	white-space: nowrap;
 }
-.cn-record-list__due[data-v-544b79cd] {
+.cn-record-list__due[data-v-8b7be6f2] {
 	font-size: 14px;
 	white-space: nowrap;
 }
-.cn-record-list__due--danger[data-v-544b79cd] {
+.cn-record-list__due--danger[data-v-8b7be6f2] {
 	color: var(--color-text-error, var(--color-error-text));
 	font-weight: 600;
 }
-.cn-record-list__table[data-v-544b79cd] {
+.cn-record-list__table[data-v-8b7be6f2] {
 	width: 100%;
 	border-collapse: collapse;
 	font-size: 14px;
 }
-.cn-record-list__table th[data-v-544b79cd] {
+.cn-record-list__table th[data-v-8b7be6f2] {
 	padding: 6px 0;
 	border-bottom: 1px solid var(--color-border);
 	color: var(--color-text-maxcontrast);
 	font-weight: 600;
 	text-align: start;
 }
-.cn-record-list__table td[data-v-544b79cd] {
+.cn-record-list__table td[data-v-8b7be6f2] {
 	padding: 8px 0;
 	border-bottom: 1px solid var(--color-border);
 }
-.cn-record-list__cell-sub[data-v-544b79cd] {
+.cn-record-list__cell-sub[data-v-8b7be6f2] {
 	display: block;
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-record-list__table .cn-record-list__cell--actions[data-v-544b79cd] {
+.cn-record-list__table .cn-record-list__cell--actions[data-v-8b7be6f2] {
 	width: 1%;
 	padding-inline-start: 12px;
 	text-align: end;
 	white-space: nowrap;
 }
-.cn-record-list__sort[data-v-544b79cd] {
+.cn-record-list__sort[data-v-8b7be6f2] {
 	display: inline-flex;
 	gap: 4px;
 	align-items: center;
@@ -42036,75 +42419,83 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	font: inherit;
 	cursor: pointer;
 }
-.cn-record-list__sort[data-v-544b79cd]:focus-visible {
+.cn-record-list__sort[data-v-8b7be6f2]:focus-visible {
 	outline: 2px solid var(--color-primary-element);
 	outline-offset: 2px;
 }
-.cn-record-list__sort-mark[data-v-544b79cd] {
+.cn-record-list__sort-mark[data-v-8b7be6f2] {
 	font-size: 10px;
 }
-.cn-record-list__table .cn-record-list__cell--end[data-v-544b79cd] {
+.cn-record-list__head[data-v-8b7be6f2] {
+	display: inline-flex;
+	gap: 4px;
+	align-items: center;
+}
+.cn-record-list__head-filter[data-v-8b7be6f2] {
+	--button-size: 22px;
+}
+.cn-record-list__table .cn-record-list__cell--end[data-v-8b7be6f2] {
 	padding-inline-start: 12px;
 	text-align: end;
 	font-variant-numeric: tabular-nums;
 }
-.cn-record-list__table .cn-record-list__cell--alert[data-v-544b79cd] {
+.cn-record-list__table .cn-record-list__cell--alert[data-v-8b7be6f2] {
 	color: var(--color-text-error, var(--color-error-text));
 	font-weight: 700;
 }
-.cn-record-list__intro[data-v-544b79cd] {
+.cn-record-list__intro[data-v-8b7be6f2] {
 	margin: 0 0 8px;
 	color: var(--color-text-maxcontrast);
 }
-.cn-record-list__footnote[data-v-544b79cd] {
+.cn-record-list__footnote[data-v-8b7be6f2] {
 	margin: 8px 0 0;
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-record-list__due--soon[data-v-544b79cd] {
+.cn-record-list__due--soon[data-v-8b7be6f2] {
 	color: var(--color-text-warning, var(--color-warning-text));
 	font-weight: 600;
 }
-.cn-record-list__due--empty[data-v-544b79cd] {
+.cn-record-list__due--empty[data-v-8b7be6f2] {
 	color: var(--color-text-maxcontrast);
 }
-.cn-record-list__row--action[data-v-544b79cd] {
+.cn-record-list__row--action[data-v-8b7be6f2] {
 	flex-wrap: wrap;
 	gap: 8px 16px;
 	padding: 14px 0;
 }
-.cn-record-list__row--action .cn-record-list__main[data-v-544b79cd] {
+.cn-record-list__row--action .cn-record-list__main[data-v-8b7be6f2] {
 	flex: 1 1 280px;
 	gap: 3px;
 }
-.cn-record-list__title--link[data-v-544b79cd] {
+.cn-record-list__title--link[data-v-8b7be6f2] {
 	color: var(--color-main-text);
 	text-decoration: underline;
 }
-.cn-record-list__pills[data-v-544b79cd] {
+.cn-record-list__pills[data-v-8b7be6f2] {
 	display: flex;
 	flex: 0 0 120px;
 	gap: 6px;
 	justify-content: flex-end;
 }
-.cn-record-list__due--below[data-v-544b79cd] {
+.cn-record-list__due--below[data-v-8b7be6f2] {
 	font-size: 13px;
 	font-weight: 600;
 	white-space: normal;
 }
-.cn-record-list__footer-link[data-v-544b79cd] {
+.cn-record-list__footer-link[data-v-8b7be6f2] {
 	align-self: flex-start;
 	padding-top: 8px;
 	font-size: 14px;
 	font-weight: 600;
 	text-decoration: underline;
 }
-.cn-record-list__due--column[data-v-544b79cd] {
+.cn-record-list__due--column[data-v-8b7be6f2] {
 	flex: 0 0 96px;
 	font-size: 13px;
 	text-align: end;
 }
-.cn-record-list__action[data-v-544b79cd] {
+.cn-record-list__action[data-v-8b7be6f2] {
 	align-items: center;
 	background: var(--color-primary-element-light);
 	border: 0;
@@ -42121,11 +42512,11 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	padding: 0 14px;
 	text-decoration: none;
 }
-.cn-record-list__action[data-v-544b79cd]:hover,
-.cn-record-list__action[data-v-544b79cd]:focus-visible {
+.cn-record-list__action[data-v-8b7be6f2]:hover,
+.cn-record-list__action[data-v-8b7be6f2]:focus-visible {
 	background: var(--color-primary-element-light-hover, var(--color-primary-element-light));
 }
-.cn-record-list__chevron[data-v-544b79cd] {
+.cn-record-list__chevron[data-v-8b7be6f2] {
 	color: var(--color-text-maxcontrast);
 	flex: none;
 }
@@ -42133,15 +42524,15 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 /* tiles (`tiles: true`, DqZaaktypeOverzicht "Statussen"): rows as framed
    tiles in a grid, the title at 14px regular. The selectors outrank the board
    look's list row rules. */
-.cn-record-list.cn-record-list--tiles .cn-record-list__list[data-v-544b79cd] {
+.cn-record-list.cn-record-list--tiles .cn-record-list__list[data-v-8b7be6f2] {
 	display: grid;
 	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
 	gap: 8px;
 }
-.cn-record-list.cn-record-list--tiles .cn-record-list__list .cn-record-list__item[data-v-544b79cd] {
+.cn-record-list.cn-record-list--tiles .cn-record-list__list .cn-record-list__item[data-v-8b7be6f2] {
 	border-top: 0;
 }
-.cn-record-list.cn-record-list--tiles .cn-record-list__list .cn-record-list__item .cn-record-list__row[data-v-544b79cd] {
+.cn-record-list.cn-record-list--tiles .cn-record-list__list .cn-record-list__item .cn-record-list__row[data-v-8b7be6f2] {
 	box-sizing: border-box;
 	height: 100%;
 	gap: 10px;
@@ -42150,19 +42541,19 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	border: 1px solid var(--cn-board-hairline, var(--color-border));
 	border-radius: 8px;
 }
-.cn-record-list.cn-record-list--tiles .cn-record-list__list .cn-record-list__item .cn-record-list__title[data-v-544b79cd] {
+.cn-record-list.cn-record-list--tiles .cn-record-list__list .cn-record-list__item .cn-record-list__title[data-v-8b7be6f2] {
 	font-size: 14px;
 	font-weight: 400;
 }
 
 /* cards (board ShBank): a grid of framed cards, 240px at the least. */
-.cn-record-list--cards .cn-record-list__list[data-v-544b79cd] {
+.cn-record-list--cards .cn-record-list__list[data-v-8b7be6f2] {
 	align-items: start;
 	display: grid;
 	gap: 16px;
 	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
 }
-.cn-record-list__card[data-v-544b79cd] {
+.cn-record-list__card[data-v-8b7be6f2] {
 	background: var(--color-main-background);
 	border: 1px solid var(--color-border);
 	border-radius: 12px;
@@ -42174,51 +42565,67 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	padding: 16px 18px;
 	text-decoration: none;
 }
-.cn-record-list__card--link[data-v-544b79cd]:hover,
-.cn-record-list__card--link[data-v-544b79cd]:focus-visible {
+
+/* `density: "compact"` on cards: the boards' small framed rows (DqInspectie
+   "Molenweg 4" and the outbox): 12px 14px in, the title 15px/700 on an
+   18px line with the pill at its end, the meta 6px under it. */
+.cn-record-list--compact .cn-record-list__card[data-v-8b7be6f2] {
+	gap: 6px;
+	padding: 12px 14px;
+}
+.cn-record-list--compact .cn-record-list__card-head[data-v-8b7be6f2] {
+	align-items: flex-start;
+}
+.cn-record-list--compact .cn-record-list__card .cn-record-list__title[data-v-8b7be6f2] {
+	font-size: 15px;
+	font-weight: 700;
+	line-height: 1.2;
+}
+.cn-record-list__card--link[data-v-8b7be6f2]:hover,
+.cn-record-list__card--link[data-v-8b7be6f2]:focus-visible {
 	border-color: var(--color-border-dark, var(--color-border));
 }
-.cn-record-list__card--link:hover .cn-record-list__title[data-v-544b79cd],
-.cn-record-list__card--link:focus-visible .cn-record-list__title[data-v-544b79cd] {
+.cn-record-list__card--link:hover .cn-record-list__title[data-v-8b7be6f2],
+.cn-record-list__card--link:focus-visible .cn-record-list__title[data-v-8b7be6f2] {
 	text-decoration: underline;
 }
-.cn-record-list__card-head[data-v-544b79cd] {
+.cn-record-list__card-head[data-v-8b7be6f2] {
 	align-items: center;
 	display: flex;
 	gap: 8px;
 	justify-content: space-between;
 }
-.cn-record-list__card-title[data-v-544b79cd] {
+.cn-record-list__card-title[data-v-8b7be6f2] {
 	align-items: center;
 	display: flex;
 	gap: 8px;
 	min-width: 0;
 }
-.cn-record-list__card-icon[data-v-544b79cd] {
+.cn-record-list__card-icon[data-v-8b7be6f2] {
 	color: var(--color-primary-element);
 	flex: none;
 }
-.cn-record-list__card-pills[data-v-544b79cd] {
+.cn-record-list__card-pills[data-v-8b7be6f2] {
 	display: flex;
 	flex: none;
 	gap: 6px;
 }
-.cn-record-list__card-value[data-v-544b79cd] {
+.cn-record-list__card-value[data-v-8b7be6f2] {
 	font-size: 24px;
 	font-weight: 700;
 }
 
 /* feed */
-.cn-record-list--feed .cn-record-list__item + .cn-record-list__item[data-v-544b79cd] {
+.cn-record-list--feed .cn-record-list__item + .cn-record-list__item[data-v-8b7be6f2] {
 	border-top: 1px solid var(--color-border);
 }
-.cn-record-list__feed-row[data-v-544b79cd] {
+.cn-record-list__feed-row[data-v-8b7be6f2] {
 	align-items: flex-start;
 	display: flex;
 	gap: 14px;
 	padding: 12px 0;
 }
-.cn-record-list__feed-icon[data-v-544b79cd] {
+.cn-record-list__feed-icon[data-v-8b7be6f2] {
 	align-items: center;
 	background: var(--color-primary-element-light);
 	border-radius: 50%;
@@ -42229,25 +42636,25 @@ button.cn-linked-widget__link[data-v-0fc31606] {
 	justify-content: center;
 	width: 36px;
 }
-.cn-record-list__text[data-v-544b79cd] {
+.cn-record-list__text[data-v-8b7be6f2] {
 	font-size: 15px;
 }
-.cn-record-list--feed .cn-record-list__main[data-v-544b79cd] {
+.cn-record-list--feed .cn-record-list__main[data-v-8b7be6f2] {
 	color: var(--color-main-text);
 	text-decoration: none;
 }
 
 /* inline */
-.cn-record-list__inline-row[data-v-544b79cd] {
+.cn-record-list__inline-row[data-v-8b7be6f2] {
 	padding: 4px 0;
 }
-.cn-record-list__label[data-v-544b79cd] {
+.cn-record-list__label[data-v-8b7be6f2] {
 	margin-inline-end: 4px;
 }
-.cn-record-list__inline-title[data-v-544b79cd] {
+.cn-record-list__inline-title[data-v-8b7be6f2] {
 	color: var(--color-main-text);
 }
-a.cn-record-list__inline-title[data-v-544b79cd] {
+a.cn-record-list__inline-title[data-v-8b7be6f2] {
 	color: var(--color-primary-element);
 	text-decoration: underline;
 }
@@ -42835,23 +43242,23 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 }
 
 
-.cn-workspace-filter-widget__form[data-v-59cf3a24] {
+.cn-workspace-filter-widget__form[data-v-476982f2] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: flex-end;
 	gap: 12px 16px;
 }
-.cn-workspace-filter-widget__field[data-v-59cf3a24] {
+.cn-workspace-filter-widget__field[data-v-476982f2] {
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 }
-.cn-workspace-filter-widget__field-label[data-v-59cf3a24] {
+.cn-workspace-filter-widget__field-label[data-v-476982f2] {
 	font-size: 14px;
 	font-weight: 600;
 	color: var(--color-main-text);
 }
-.cn-workspace-filter-widget__input[data-v-59cf3a24] {
+.cn-workspace-filter-widget__input[data-v-476982f2] {
 	box-sizing: border-box;
 	min-height: var(--default-clickable-area, 34px);
 	margin: 0;
@@ -42862,30 +43269,30 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 	color: var(--color-main-text);
 	font: inherit;
 }
-.cn-workspace-filter-widget__input[aria-invalid='true'][data-v-59cf3a24] {
+.cn-workspace-filter-widget__input[aria-invalid='true'][data-v-476982f2] {
 	border-color: var(--color-error);
 }
-.cn-workspace-filter-widget__input-error[data-v-59cf3a24] {
+.cn-workspace-filter-widget__input-error[data-v-476982f2] {
 	margin: 0;
 	color: var(--color-error-text, var(--color-error));
 	font-size: 13px;
 }
-.cn-workspace-filter-widget[data-v-59cf3a24] {
+.cn-workspace-filter-widget[data-v-476982f2] {
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
 	width: 100%;
 }
-.cn-workspace-filter-widget__label[data-v-59cf3a24] {
+.cn-workspace-filter-widget__label[data-v-476982f2] {
 	margin: 0;
 	font-weight: 600;
 	color: var(--color-main-text);
 }
-.cn-workspace-filter-widget__status[data-v-59cf3a24] {
+.cn-workspace-filter-widget__status[data-v-476982f2] {
 	color: var(--color-text-maxcontrast);
 	font-size: 0.9em;
 }
-.cn-workspace-filter-widget__list[data-v-59cf3a24] {
+.cn-workspace-filter-widget__list[data-v-476982f2] {
 	list-style: none;
 	margin: 0;
 	padding: 0;
@@ -42895,14 +43302,14 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 }
 
 /* The chips: the compact segmented group, left, in the card the grid draws. */
-.cn-workspace-filter-widget--chips[data-v-59cf3a24] {
+.cn-workspace-filter-widget--chips[data-v-476982f2] {
 	flex-direction: row;
 	flex-wrap: wrap;
 	align-items: center;
 }
 
 /* A bar: its controls in one row, an `align: "end"` control pushed right. */
-.cn-workspace-filter-widget--bar[data-v-59cf3a24] {
+.cn-workspace-filter-widget--bar[data-v-476982f2] {
 	flex-direction: row;
 	flex-wrap: wrap;
 	align-items: center;
@@ -42910,60 +43317,60 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 }
 
 /* An inline control sits in a bar: label left of the control, width to its content. */
-.cn-workspace-filter-widget--inline[data-v-59cf3a24] {
+.cn-workspace-filter-widget--inline[data-v-476982f2] {
 	flex-direction: row;
 	align-items: center;
 	gap: 8px;
 	width: auto;
 }
-.cn-workspace-filter-widget--inline .cn-workspace-filter-widget__label[data-v-59cf3a24] {
+.cn-workspace-filter-widget--inline .cn-workspace-filter-widget__label[data-v-476982f2] {
 	font-weight: 400;
 	color: var(--color-text-maxcontrast);
 }
-.cn-workspace-filter-widget--end[data-v-59cf3a24] {
+.cn-workspace-filter-widget--end[data-v-476982f2] {
 	margin-inline-start: auto;
 }
-.cn-workspace-filter-widget--end ~ .cn-workspace-filter-widget--end[data-v-59cf3a24] {
+.cn-workspace-filter-widget--end ~ .cn-workspace-filter-widget--end[data-v-476982f2] {
 	margin-inline-start: 0;
 }
-.cn-workspace-filter-widget__toggle[data-v-59cf3a24] {
+.cn-workspace-filter-widget__toggle[data-v-476982f2] {
 	font-weight: 600;
 }
 
 /* The start card: text left, control (and link) right, as PqDashboard's "Contact starten". */
-.cn-workspace-filter-widget--start[data-v-59cf3a24] {
+.cn-workspace-filter-widget--start[data-v-476982f2] {
 	flex-direction: row;
 	flex-wrap: wrap;
 	align-items: center;
 	gap: 16px 24px;
 }
-.cn-workspace-filter-widget__text[data-v-59cf3a24] {
+.cn-workspace-filter-widget__text[data-v-476982f2] {
 	flex: 1 1 320px;
 	min-width: 0;
 }
-.cn-workspace-filter-widget__title[data-v-59cf3a24] {
+.cn-workspace-filter-widget__title[data-v-476982f2] {
 	margin: 0 0 4px;
 	font-size: 17px;
 	font-weight: 700;
 	color: var(--color-main-text);
 }
-.cn-workspace-filter-widget__description[data-v-59cf3a24] {
+.cn-workspace-filter-widget__description[data-v-476982f2] {
 	margin: 0;
 	max-width: 420px;
 	color: var(--color-text-maxcontrast);
 }
-.cn-workspace-filter-widget--start .cn-workspace-filter-widget__control[data-v-59cf3a24],
-.cn-workspace-filter-widget--start > .v-select[data-v-59cf3a24] {
+.cn-workspace-filter-widget--start .cn-workspace-filter-widget__control[data-v-476982f2],
+.cn-workspace-filter-widget--start > .v-select[data-v-476982f2] {
 	flex: 0 1 480px;
 	min-width: 240px;
 }
-.cn-workspace-filter-widget__link[data-v-59cf3a24] {
+.cn-workspace-filter-widget__link[data-v-476982f2] {
 	font-weight: 600;
 	color: var(--color-primary-element);
 	text-decoration: underline;
 	white-space: nowrap;
 }
-.cn-workspace-filter-widget__count[data-v-59cf3a24] {
+.cn-workspace-filter-widget__count[data-v-476982f2] {
 	margin-inline-start: 6px;
 	padding: 0 6px;
 	border-radius: 999px;
@@ -42975,20 +43382,20 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 /* On a phone the bar's controls take a row each (the chips already wrap), and
    a switch and a select are 44px touch targets. */
 @media (max-width: 640px) {
-.cn-workspace-filter-widget--bar > .cn-workspace-filter-widget--inline[data-v-59cf3a24] {
+.cn-workspace-filter-widget--bar > .cn-workspace-filter-widget--inline[data-v-476982f2] {
 		flex: 1 1 100%;
 }
-.cn-workspace-filter-widget--bar > .cn-workspace-filter-widget--end[data-v-59cf3a24] {
+.cn-workspace-filter-widget--bar > .cn-workspace-filter-widget--end[data-v-476982f2] {
 		margin-inline-start: 0;
 }
-.cn-workspace-filter-widget--inline .cn-workspace-filter-widget__toggle[data-v-59cf3a24] {
+.cn-workspace-filter-widget--inline .cn-workspace-filter-widget__toggle[data-v-476982f2] {
 		min-height: 44px;
 }
-.cn-workspace-filter-widget--inline[data-v-59cf3a24] .v-select {
+.cn-workspace-filter-widget--inline[data-v-476982f2] .v-select {
 		flex: 1 1 auto;
 		min-width: 0;
 }
-.cn-workspace-filter-widget--inline[data-v-59cf3a24] .vs__dropdown-toggle {
+.cn-workspace-filter-widget--inline[data-v-476982f2] .vs__dropdown-toggle {
 		min-height: 44px;
 }
 }
@@ -43360,48 +43767,48 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 }
 
 
-.cn-settings-field[data-v-2f16c603] {
+.cn-settings-field[data-v-d11dd994] {
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 	min-width: 0;
 }
-.cn-settings-field__hint[data-v-2f16c603],
-.cn-settings-field__error[data-v-2f16c603] {
+.cn-settings-field__hint[data-v-d11dd994],
+.cn-settings-field__error[data-v-d11dd994] {
 	margin: 0;
 	font-size: 13px;
 	line-height: 1.4;
 }
-.cn-settings-field__image[data-v-2f16c603] {
+.cn-settings-field__image[data-v-d11dd994] {
 	display: flex;
 	flex-direction: column;
 	gap: 6px;
 }
-.cn-settings-field__image-label[data-v-2f16c603] {
+.cn-settings-field__image-label[data-v-d11dd994] {
 	font-weight: 600;
 }
 
 /* A note: the field's label, then a line of muted text where a control would
    stand (DqInstellingenAlgemeen "Toegestane websites (CORS)"). */
-.cn-settings-field__note[data-v-2f16c603] {
+.cn-settings-field__note[data-v-d11dd994] {
 	display: flex;
 	flex-direction: column;
 	gap: 6px;
 }
-.cn-settings-field__note-label[data-v-2f16c603] {
+.cn-settings-field__note-label[data-v-d11dd994] {
 	font-weight: 600;
 }
-.cn-settings-field__note-text[data-v-2f16c603] {
+.cn-settings-field__note-text[data-v-d11dd994] {
 	margin: 0;
 	color: var(--color-text-maxcontrast);
 }
-.cn-settings-field__image-row[data-v-2f16c603] {
+.cn-settings-field__image-row[data-v-d11dd994] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: center;
 	gap: 12px;
 }
-.cn-settings-field__image-tile[data-v-2f16c603] {
+.cn-settings-field__image-tile[data-v-d11dd994] {
 	display: inline-flex;
 	align-items: center;
 	justify-content: center;
@@ -43412,31 +43819,31 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 	border-radius: var(--border-radius-large);
 	background: var(--color-primary-element-light);
 }
-.cn-settings-field__image-tile img[data-v-2f16c603] {
+.cn-settings-field__image-tile img[data-v-d11dd994] {
 	max-width: 100%;
 	max-height: 100%;
 	object-fit: contain;
 }
-.cn-settings-field__image-initials[data-v-2f16c603] {
+.cn-settings-field__image-initials[data-v-d11dd994] {
 	font-size: 20px;
 	font-weight: 700;
 	color: var(--color-primary-element-light-text, var(--color-primary-element));
 }
-.cn-settings-field__hint[data-v-2f16c603],
-.cn-settings-field__option-description[data-v-2f16c603] {
+.cn-settings-field__hint[data-v-d11dd994],
+.cn-settings-field__option-description[data-v-d11dd994] {
 	color: var(--color-text-maxcontrast);
 }
-.cn-settings-field__heading[data-v-2f16c603] {
+.cn-settings-field__heading[data-v-d11dd994] {
 	margin: 8px 0 0;
 	font-size: 16px;
 	font-weight: 600;
 }
-.cn-settings-field__radio[data-v-2f16c603] {
+.cn-settings-field__radio[data-v-d11dd994] {
 	margin: 0;
 	padding: 0;
 	border: 0;
 }
-.cn-settings-field__week[data-v-2f16c603] {
+.cn-settings-field__week[data-v-d11dd994] {
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
@@ -43444,16 +43851,16 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 	padding: 0;
 	border: 0;
 }
-.cn-settings-field__day[data-v-2f16c603] {
+.cn-settings-field__day[data-v-d11dd994] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: flex-end;
 	gap: 8px;
 }
-.cn-settings-field__day[data-v-2f16c603] > :first-child {
+.cn-settings-field__day[data-v-d11dd994] > :first-child {
 	flex: 0 0 160px;
 }
-.cn-settings-field__pairs[data-v-2f16c603] {
+.cn-settings-field__pairs[data-v-d11dd994] {
 	display: flex;
 	flex-direction: column;
 	align-items: flex-start;
@@ -43462,32 +43869,32 @@ a.cn-record-list__inline-title[data-v-544b79cd] {
 	padding: 0;
 	border: 0;
 }
-.cn-settings-field__pair[data-v-2f16c603] {
+.cn-settings-field__pair[data-v-d11dd994] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: flex-end;
 	gap: 8px;
 	width: 100%;
 }
-.cn-settings-field__pair[data-v-2f16c603] > :not(button) {
+.cn-settings-field__pair[data-v-d11dd994] > :not(button) {
 	flex: 1 1 140px;
 	min-width: 0;
 }
-.cn-settings-field__radio-legend[data-v-2f16c603] {
+.cn-settings-field__radio-legend[data-v-d11dd994] {
 	font-weight: 600;
 }
-.cn-settings-field__option-description[data-v-2f16c603] {
+.cn-settings-field__option-description[data-v-d11dd994] {
 	margin: 0 0 8px calc(var(--default-grid-baseline, 4px) * 9);
 	font-size: 13px;
 	line-height: 1.4;
 }
-.cn-settings-field__action-row[data-v-2f16c603] {
+.cn-settings-field__action-row[data-v-d11dd994] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: center;
 	gap: 12px;
 }
-.cn-settings-field__error[data-v-2f16c603] {
+.cn-settings-field__error[data-v-d11dd994] {
 	color: var(--color-error-text, var(--color-error));
 }
 
@@ -50925,12 +51332,12 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 }
 
 
-.cn-action-dialog[data-v-60a1dc8f] {
+.cn-action-dialog[data-v-105a37b4] {
 	display: flex;
 	flex-direction: column;
 	gap: 16px;
 }
-.cn-action-dialog__summary[data-v-60a1dc8f] {
+.cn-action-dialog__summary[data-v-105a37b4] {
 	display: flex;
 	align-items: center;
 	gap: 12px;
@@ -50940,7 +51347,7 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 }
 
 /* The record's icon on a tinted tile (DqArchiveren). */
-.cn-action-dialog__summary-icon[data-v-60a1dc8f] {
+.cn-action-dialog__summary-icon[data-v-105a37b4] {
 	display: flex;
 	flex: none;
 	align-items: center;
@@ -50951,21 +51358,21 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 	background: var(--color-primary-element-light);
 	color: var(--color-primary-element-light-text);
 }
-.cn-action-dialog__summary-text strong[data-v-60a1dc8f] {
+.cn-action-dialog__summary-text strong[data-v-105a37b4] {
 	font-size: 15px;
 	font-weight: 600;
 	line-height: 1.2;
 }
-.cn-action-dialog__summary-text .cn-action-dialog__muted[data-v-60a1dc8f] {
+.cn-action-dialog__summary-text .cn-action-dialog__muted[data-v-105a37b4] {
 	font-size: 13px;
 }
-.cn-action-dialog__summary-text[data-v-60a1dc8f] {
+.cn-action-dialog__summary-text[data-v-105a37b4] {
 	display: flex;
 	flex: 1 1 auto;
 	flex-direction: column;
 	min-width: 0;
 }
-.cn-action-dialog__badge[data-v-60a1dc8f] {
+.cn-action-dialog__badge[data-v-105a37b4] {
 	padding: 3px 10px;
 	border-radius: 12px;
 	background: var(--color-background-dark);
@@ -50973,7 +51380,7 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 	font-weight: 600;
 	white-space: nowrap;
 }
-.cn-action-dialog__title[data-v-60a1dc8f] {
+.cn-action-dialog__title[data-v-105a37b4] {
 	margin: 0 0 8px;
 	font-size: 14px;
 	font-weight: 600;
@@ -50981,13 +51388,13 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 
 /* Facts in columns of at least 200px, each a label over its value above a
    hairline (DqArchiveren "Bewaring volgens het zaaktype"). */
-.cn-action-dialog__facts[data-v-60a1dc8f] {
+.cn-action-dialog__facts[data-v-105a37b4] {
 	display: grid;
 	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
 	gap: 12px 24px;
 	margin: 0;
 }
-.cn-action-dialog__fact[data-v-60a1dc8f] {
+.cn-action-dialog__fact[data-v-105a37b4] {
 	display: flex;
 	flex-direction: column;
 	gap: 3px;
@@ -50997,20 +51404,20 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 
 /* The server draws every dt as a 130px right-aligned inline block and pads
    dt and dd 12px; a fact is a label over its value. */
-.cn-action-dialog__facts dt[data-v-60a1dc8f],
-.cn-action-dialog__facts dd[data-v-60a1dc8f] {
+.cn-action-dialog__facts dt[data-v-105a37b4],
+.cn-action-dialog__facts dd[data-v-105a37b4] {
 	display: block;
 	width: auto;
 	white-space: normal;
 	text-align: start;
 }
-.cn-action-dialog__facts dt[data-v-60a1dc8f] {
+.cn-action-dialog__facts dt[data-v-105a37b4] {
 	margin: 0;
 	padding: 0;
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-action-dialog__facts dd[data-v-60a1dc8f] {
+.cn-action-dialog__facts dd[data-v-105a37b4] {
 	margin: 0;
 	padding: 0;
 	font-size: 15px;
@@ -51019,14 +51426,14 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 
 /* Checklist rows divided by hairlines, the detail at the row's end
    (DqArchiveren "Klaar om te archiveren"). */
-.cn-action-dialog__checks[data-v-60a1dc8f] {
+.cn-action-dialog__checks[data-v-105a37b4] {
 	display: flex;
 	flex-direction: column;
 	margin: 0;
 	padding: 0;
 	list-style: none;
 }
-.cn-action-dialog__check[data-v-60a1dc8f] {
+.cn-action-dialog__check[data-v-105a37b4] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: center;
@@ -51035,24 +51442,30 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 	border-top: 1px solid var(--color-border);
 	font-size: 15px;
 }
-.cn-action-dialog__check-label[data-v-60a1dc8f] {
+.cn-action-dialog__check-label[data-v-105a37b4] {
 	flex: 1 1 auto;
 	font-weight: 600;
 }
-.cn-action-dialog__check-icon[data-v-60a1dc8f] {
+.cn-action-dialog__check-icon[data-v-105a37b4] {
 	color: var(--color-text-maxcontrast);
 }
-.cn-action-dialog__check-icon--met[data-v-60a1dc8f] {
+.cn-action-dialog__check-icon--met[data-v-105a37b4] {
 	color: var(--color-success-text, var(--color-success));
 }
-.cn-action-dialog__muted[data-v-60a1dc8f] {
+.cn-action-dialog__muted[data-v-105a37b4] {
 	color: var(--color-text-maxcontrast);
 	font-size: 14px;
 }
 
 /* A checkbox field is a tinted box with a 2px edge, its label bold and its
    hint under it (DqArchiveren). */
-.cn-action-dialog__checkbox[data-v-60a1dc8f] {
+/* A note's own icon stands on the heading's line, as the variant's icon
+   does (NcNoteCard centres a slotted icon on the whole note). */
+.cn-action-dialog__note-icon[data-v-105a37b4] {
+	align-self: flex-start;
+	margin-top: 1px;
+}
+.cn-action-dialog__checkbox[data-v-105a37b4] {
 	padding: 12px 14px;
 	border: 2px solid var(--color-primary-element);
 	border-radius: var(--border-radius-element, 8px);
@@ -51062,37 +51475,37 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 /* The box sits at the card's inset, 12px before the label, the label on
    its first line (DqArchiveren "Sanne de Vries laten weten ..."):
    NcCheckboxRadioSwitch pads its row and centres a 34px target. */
-.cn-action-dialog__checkbox[data-v-60a1dc8f] .checkbox-content {
+.cn-action-dialog__checkbox[data-v-105a37b4] .checkbox-content {
 	padding: 0;
 	gap: 12px;
 	align-items: flex-start;
 	min-height: 0;
 }
-.cn-action-dialog__checkbox[data-v-60a1dc8f] .checkbox-content__icon {
+.cn-action-dialog__checkbox[data-v-105a37b4] .checkbox-content__icon {
 	margin: 0;
 }
-.cn-action-dialog__checkbox[data-v-60a1dc8f] .checkbox-radio-switch__input {
+.cn-action-dialog__checkbox[data-v-105a37b4] .checkbox-radio-switch__input {
 	min-height: 0;
 }
-.cn-action-dialog__checkbox-text[data-v-60a1dc8f] {
+.cn-action-dialog__checkbox-text[data-v-105a37b4] {
 	display: flex;
 	flex-direction: column;
 	gap: 2px;
 }
-.cn-action-dialog__checkbox-label[data-v-60a1dc8f] {
+.cn-action-dialog__checkbox-label[data-v-105a37b4] {
 	font-size: 15px;
 	font-weight: 600;
 	line-height: 1.2;
 }
-.cn-action-dialog__checkbox .cn-action-dialog__muted[data-v-60a1dc8f] {
+.cn-action-dialog__checkbox .cn-action-dialog__muted[data-v-105a37b4] {
 	font-size: 13px;
 }
-.cn-action-dialog__field[data-v-60a1dc8f] {
+.cn-action-dialog__field[data-v-105a37b4] {
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 }
-.cn-action-dialog__error[data-v-60a1dc8f] {
+.cn-action-dialog__error[data-v-105a37b4] {
 	margin: 0;
 	color: var(--color-error-text, var(--color-error));
 }
@@ -57305,31 +57718,31 @@ a.cn-integration-card__title[data-v-093a874d]:hover {
 	color: var(--color-text-maxcontrast);
 }
 
-.cn-notification-matrix__table[data-v-ebb6783e] {
+.cn-notification-matrix__table[data-v-93dc585a] {
   inline-size: 100%;
   border-collapse: collapse;
 }
 
-.cn-notification-matrix__caption[data-v-ebb6783e] {
+.cn-notification-matrix__caption[data-v-93dc585a] {
   text-align: start;
   padding-block-end: 8px;
 }
 
-.cn-notification-matrix__table th[data-v-ebb6783e],
-.cn-notification-matrix__table td[data-v-ebb6783e] {
+.cn-notification-matrix__table th[data-v-93dc585a],
+.cn-notification-matrix__table td[data-v-93dc585a] {
   text-align: start;
   padding: 6px 8px;
   border-block-end: 1px solid var(--color-border);
   vertical-align: top;
 }
 
-.cn-notification-matrix__muted[data-v-ebb6783e] {
+.cn-notification-matrix__muted[data-v-93dc585a] {
   display: block;
   color: var(--color-text-maxcontrast);
   font-size: 0.85rem;
 }
 
-.cn-notification-matrix__group[data-v-ebb6783e] {
+.cn-notification-matrix__group[data-v-93dc585a] {
   background: none;
   border: none;
   font-weight: bold;
@@ -57338,21 +57751,21 @@ a.cn-integration-card__title[data-v-093a874d]:hover {
   color: var(--color-main-text);
 }
 
-.cn-notification-matrix__scope[data-v-ebb6783e] {
+.cn-notification-matrix__scope[data-v-93dc585a] {
   padding-inline-start: 24px !important;
   font-weight: normal;
 }
 
-.cn-notification-matrix__row--scoped th[data-v-ebb6783e],
-.cn-notification-matrix__row--scoped td[data-v-ebb6783e] {
+.cn-notification-matrix__row--scoped th[data-v-93dc585a],
+.cn-notification-matrix__row--scoped td[data-v-93dc585a] {
   border-block-end-style: dotted;
 }
 
-.cn-notification-matrix__test[data-v-ebb6783e] {
+.cn-notification-matrix__test[data-v-93dc585a] {
   margin-block-start: 4px;
 }
 
-.cn-notification-matrix__note[data-v-ebb6783e] {
+.cn-notification-matrix__note[data-v-93dc585a] {
   color: var(--color-text-maxcontrast);
 }
 
@@ -57360,11 +57773,11 @@ a.cn-integration-card__title[data-v-093a874d]:hover {
    headers over a hairline, the channel columns 96px with a centred 20px
    checkbox, the event rows 10px high with the soft rule. The caption stays for
    assistive technology. */
-.cn-notification-matrix--board[data-v-ebb6783e] {
+.cn-notification-matrix--board[data-v-93dc585a] {
   /* A theme that colours every th (thematiq's table header token) leaves
      the board grid's head white. */
 }
-.cn-notification-matrix--board .cn-notification-matrix__caption[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__caption[data-v-93dc585a] {
   position: absolute;
   inline-size: 1px;
   block-size: 1px;
@@ -57372,11 +57785,11 @@ a.cn-integration-card__title[data-v-093a874d]:hover {
   clip-path: inset(50%);
   white-space: nowrap;
 }
-.cn-notification-matrix--board .cn-notification-matrix__table[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__table[data-v-93dc585a] {
   --nldesign-component-table-header-background-color: transparent;
   font-size: 14px;
 }
-.cn-notification-matrix--board .cn-notification-matrix__table thead th[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__table thead th[data-v-93dc585a] {
   padding: 8px 10px 8px 0;
   line-height: 1.2;
   border-block-end: 1px solid var(--color-border);
@@ -57385,45 +57798,48 @@ a.cn-integration-card__title[data-v-093a874d]:hover {
   font-weight: 600;
   vertical-align: bottom;
 }
-.cn-notification-matrix--board .cn-notification-matrix__table thead th[data-channel][data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__table thead th[data-channel][data-v-93dc585a] {
   inline-size: 96px;
   padding-inline: 4px;
   text-align: center;
 }
-.cn-notification-matrix--board .cn-notification-matrix__table tbody th[data-v-ebb6783e],
-.cn-notification-matrix--board .cn-notification-matrix__table tbody td[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__table tbody th[data-v-93dc585a],
+.cn-notification-matrix--board .cn-notification-matrix__table tbody td[data-v-93dc585a] {
   padding: 10px 10px 10px 0;
   border-block-end: 1px solid var(--color-background-dark);
   font-weight: 400;
   line-height: 1.4;
   vertical-align: middle;
 }
-.cn-notification-matrix--board .cn-notification-matrix__table tbody td[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__table tbody td[data-v-93dc585a] {
   padding-inline: 4px;
   text-align: center;
 }
-.cn-notification-matrix--board .cn-notification-matrix__table tbody td input[type=checkbox][data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__table tbody td input[type=checkbox][data-v-93dc585a] {
   inline-size: 20px;
   min-inline-size: 20px;
   block-size: 20px;
   min-block-size: 20px;
-  margin: 0;
+  /* A block box, so the line's baseline adds no height: the row is
+     42px as on the board (10px, the 1px-low checkbox, 10px, the rule). */
+  display: block;
+  margin: 1px auto 0;
 }
-.cn-notification-matrix--board .cn-notification-matrix__group[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__group[data-v-93dc585a] {
   padding: 4px 0;
   font-size: 13px;
   font-weight: 600;
   color: var(--color-text-maxcontrast);
 }
-.cn-notification-matrix--board .cn-notification-matrix__channels[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__channels[data-v-93dc585a] {
   margin-block-start: 16px;
 }
-.cn-notification-matrix--board .cn-notification-matrix__channels-summary[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__channels-summary[data-v-93dc585a] {
   font-size: 14px;
   font-weight: 600;
   cursor: pointer;
 }
-.cn-notification-matrix--board .cn-notification-matrix__channel[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__channel[data-v-93dc585a] {
   display: flex;
   flex-wrap: wrap;
   align-items: flex-end;
@@ -57431,7 +57847,7 @@ a.cn-integration-card__title[data-v-093a874d]:hover {
   padding-block: 10px;
   border-block-end: 1px solid var(--color-background-dark);
 }
-.cn-notification-matrix--board .cn-notification-matrix__channel-name[data-v-ebb6783e] {
+.cn-notification-matrix--board .cn-notification-matrix__channel-name[data-v-93dc585a] {
   flex: 1 0 100%;
   margin: 0;
   font-size: 14px;