@conduction/nextcloud-vue 2.147.0 → 2.148.0

package/dist/esm/nextcloud-vue.css

@@ -3287,6 +3287,8 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
    Nextcloud's input height stretched it to 13x36. Its weight outranks the
    18px other native radios take.
    @spec openspec/changes/board-setup-choice-radio/specs/board-setup-choice-radio/spec.md#requirement-a-setup-steps-choice-radio-is-20px */
+/* The board's native radio keeps the browser's 3px end margin before the
+   12px gap, so the option title starts 56px in (DqInstellen), not 53. */
 .cn-look-board .cn-setup-step .cn-choice-cards input.cn-choice-cards__row-input:not(.cn-look-nextcloud *) {
 	box-sizing: border-box;
 	width: 20px;
@@ -3294,6 +3296,7 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .v-popper__popper.action-
 	height: 20px;
 	min-height: 20px;
 	accent-color: var(--color-primary-element);
+	margin-inline-end: 3px;
 }
 
 /* The chosen setup choice is edged by a real 2px border, as DqInstellen
@@ -3804,8 +3807,11 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	margin-bottom: 4px;
 }
 
-/* Footer: 16px 24px, hairline on top, right aligned, 40px buttons, 10px gap. */
-.cn-dialog-board .dialog__actions {
+/* Footer: 16px 24px, hairline on top, right aligned, 40px buttons, 10px gap,
+   flush with the dialog's bottom. NcDialog's own footer rule (6px 0 12px
+   margin, 12px end padding) ties a two-class selector and wins when its
+   stylesheet loads later, so `.dialog` is added to outrank it. */
+.cn-dialog-board .dialog .dialog__actions {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: center;
@@ -7077,6 +7083,20 @@ body:has(.cn-look-board):not(:has(.cn-look-nextcloud)) .modal-mask {
 	padding-inline-start: 12px;
 }
 
+/* The boards draw the leading icon inside the title cell, so the title's
+   heading starts over the icon (DqOrganisaties "Naam" at 76, the icon's x),
+   as an avatar shares its column's heading (DqContacten). The blank icon
+   heading stays for the column count; the title heading reaches back over it.
+   @spec openspec/changes/board-head-over-row-icon/specs/data-table/spec.md#requirement-a-board-title-heading-starts-over-the-row-icon */
+.cn-look-board .cn-table-container--board .cn-data-table th.cn-table-col--icon + th:not(.cn-look-nextcloud *) {
+	padding-inline-start: 0;
+	overflow: visible;
+}
+
+.cn-look-board .cn-table-container--board .cn-data-table th.cn-table-col--icon + th:not(.cn-look-nextcloud *) > :first-child {
+	margin-inline-start: -32px;
+}
+
 /* ---- The table beside the open side panel (DqZakenSorteren, DqFilterBeheren) */
 /* The table takes its column's width: its configured column widths make way
    for the content, titles and names wrap (a long word hyphenated, an
@@ -32951,7 +32971,7 @@ a.cn-kpi-card--board * {
 }
 
 
-.cn-object-data-widget__image[data-v-702c7c98] {
+.cn-object-data-widget__image[data-v-344df010] {
 	max-width: 100%;
 	max-height: 160px;
 	border-radius: 8px;
@@ -32959,33 +32979,33 @@ a.cn-kpi-card--board * {
 }
 
 /* Shimmering placeholder while a relation's display name resolves. */
-.cn-object-data-widget__skeleton[data-v-702c7c98] {
+.cn-object-data-widget__skeleton[data-v-344df010] {
 	display: inline-block;
 	width: 90px;
 	height: 1em;
 	border-radius: 4px;
 	background: linear-gradient(90deg, var(--color-background-dark) 25%, var(--color-background-hover) 50%, var(--color-background-dark) 75%);
 	background-size: 200% 100%;
-	animation: cn-odw-shimmer-702c7c98 1.2s ease-in-out infinite;
+	animation: cn-odw-shimmer-344df010 1.2s ease-in-out infinite;
 }
-@keyframes cn-odw-shimmer-702c7c98 {
+@keyframes cn-odw-shimmer-344df010 {
 from { background-position: 200% 0;
 }
 to { background-position: -200% 0;
 }
 }
 @media (prefers-reduced-motion: reduce) {
-.cn-object-data-widget__skeleton[data-v-702c7c98] { animation: none;
+.cn-object-data-widget__skeleton[data-v-344df010] { animation: none;
 }
 }
-.cn-object-data-widget__grid[data-v-702c7c98] {
+.cn-object-data-widget__grid[data-v-344df010] {
 	display: grid;
 	gap: calc(2 * var(--default-grid-baseline, 4px)) calc(4 * var(--default-grid-baseline, 4px));
 }
-.cn-object-data-widget__toggle[data-v-702c7c98] {
+.cn-object-data-widget__toggle[data-v-344df010] {
 	margin-top: 4px;
 }
-.cn-object-data-widget__cell[data-v-702c7c98] {
+.cn-object-data-widget__cell[data-v-344df010] {
 	display: flex;
 	flex-direction: column;
 	gap: 2px;
@@ -32993,12 +33013,12 @@ to { background-position: -200% 0;
 	border-bottom: 1px solid var(--color-border-dark);
 	min-width: 0;
 }
-.cn-object-data-widget__label[data-v-702c7c98] {
+.cn-object-data-widget__label[data-v-344df010] {
 	font-size: 0.85em;
 	color: var(--color-text-maxcontrast);
 	font-weight: 500;
 }
-.cn-object-data-widget__value[data-v-702c7c98] {
+.cn-object-data-widget__value[data-v-344df010] {
 	font-size: 1em;
 	color: var(--color-main-text);
 	overflow-wrap: anywhere;
@@ -33012,24 +33032,24 @@ to { background-position: -200% 0;
    which drew a horizontal scrollbar under every data widget in a tab (dossiq's
    case page, Data tab). The end padding drops by the same 4px so the text and
    the edit icon sit where they sat. */
-.cn-object-data-widget__value--editable[data-v-702c7c98] {
+.cn-object-data-widget__value--editable[data-v-344df010] {
 	cursor: pointer;
 	border-radius: var(--border-radius);
 	padding: 4px 20px 4px 4px;
 	margin: -4px 0 -4px -4px;
 }
-.cn-object-data-widget__value--editable[data-v-702c7c98]:hover {
+.cn-object-data-widget__value--editable[data-v-344df010]:hover {
 	background: var(--color-background-dark);
 }
-.cn-object-data-widget__value--editable[data-v-702c7c98]:focus-visible {
+.cn-object-data-widget__value--editable[data-v-344df010]:focus-visible {
 	outline: 2px solid var(--color-primary-element);
 	outline-offset: 2px;
 }
-.cn-object-data-widget__value--empty[data-v-702c7c98] {
+.cn-object-data-widget__value--empty[data-v-344df010] {
 	color: var(--color-text-maxcontrast);
 	font-style: italic;
 }
-.cn-object-data-widget__edit-icon[data-v-702c7c98] {
+.cn-object-data-widget__edit-icon[data-v-344df010] {
 	position: absolute;
 	right: 4px;
 	top: 50%;
@@ -33038,21 +33058,21 @@ to { background-position: -200% 0;
 	opacity: 0;
 	transition: opacity 0.15s ease;
 }
-.cn-object-data-widget__value--editable:hover .cn-object-data-widget__edit-icon[data-v-702c7c98],
-.cn-object-data-widget__value--editable:focus-visible .cn-object-data-widget__edit-icon[data-v-702c7c98] {
+.cn-object-data-widget__value--editable:hover .cn-object-data-widget__edit-icon[data-v-344df010],
+.cn-object-data-widget__value--editable:focus-visible .cn-object-data-widget__edit-icon[data-v-344df010] {
 	opacity: 1;
 }
-.cn-object-data-widget__editor[data-v-702c7c98] {
+.cn-object-data-widget__editor[data-v-344df010] {
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 }
-.cn-object-data-widget__editor-actions[data-v-702c7c98] {
+.cn-object-data-widget__editor-actions[data-v-344df010] {
 	display: flex;
 	gap: 2px;
 	justify-content: flex-end;
 }
-.cn-object-data-widget__textarea[data-v-702c7c98] {
+.cn-object-data-widget__textarea[data-v-344df010] {
 	width: 100%;
 	min-height: 80px;
 	padding: 8px;
@@ -33064,16 +33084,16 @@ to { background-position: -200% 0;
 	font-size: inherit;
 	resize: vertical;
 }
-.cn-object-data-widget__textarea[data-v-702c7c98]:focus {
+.cn-object-data-widget__textarea[data-v-344df010]:focus {
 	border-color: var(--color-primary-element);
 	outline: none;
 }
-.cn-object-data-widget__footnote[data-v-702c7c98] {
+.cn-object-data-widget__footnote[data-v-344df010] {
 	margin: calc(var(--default-grid-baseline, 4px) * 3) 0 0;
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-object-data-widget__empty[data-v-702c7c98] {
+.cn-object-data-widget__empty[data-v-344df010] {
 	color: var(--color-text-maxcontrast);
 	font-style: italic;
 	padding: calc(2 * var(--default-grid-baseline, 4px));
@@ -33081,16 +33101,16 @@ to { background-position: -200% 0;
 
 /* Compact inline table for array-of-objects values. Dense + unstyled-simple;
    fits the card and participates in the whole-row overflow handling. */
-.cn-object-data-widget__mini-table-wrap[data-v-702c7c98] {
+.cn-object-data-widget__mini-table-wrap[data-v-344df010] {
 	max-width: 100%;
 }
-.cn-object-data-widget__mini-table[data-v-702c7c98] {
+.cn-object-data-widget__mini-table[data-v-344df010] {
 	width: 100%;
 	border-collapse: collapse;
 	font-size: 0.9em;
 }
-.cn-object-data-widget__mini-table th[data-v-702c7c98],
-.cn-object-data-widget__mini-table td[data-v-702c7c98] {
+.cn-object-data-widget__mini-table th[data-v-344df010],
+.cn-object-data-widget__mini-table td[data-v-344df010] {
 	text-align: start;
 	padding: 2px 8px 2px 0;
 	border-bottom: 1px solid var(--color-border);
@@ -33101,23 +33121,23 @@ to { background-position: -200% 0;
 	   cell, and the card 8px wider than its cell (pipelinq's ticket page). */
 	white-space: normal;
 }
-.cn-object-data-widget__mini-table th[data-v-702c7c98] {
+.cn-object-data-widget__mini-table th[data-v-344df010] {
 	color: var(--color-text-maxcontrast);
 	font-weight: 500;
 }
-.cn-object-data-widget__more[data-v-702c7c98] {
+.cn-object-data-widget__more[data-v-344df010] {
 	margin-top: 2px;
 	font-size: 0.85em;
 	color: var(--color-text-maxcontrast);
 }
 
 /* Comma-less chip row for array-of-scalars values. */
-.cn-object-data-widget__chips[data-v-702c7c98] {
+.cn-object-data-widget__chips[data-v-344df010] {
 	display: flex;
 	flex-wrap: wrap;
 	gap: 4px;
 }
-.cn-object-data-widget__chip[data-v-702c7c98] {
+.cn-object-data-widget__chip[data-v-344df010] {
 	padding: 1px 8px;
 	border-radius: 12px;
 	background: var(--color-background-dark);
@@ -33125,37 +33145,37 @@ to { background-position: -200% 0;
 }
 
 /* Key: value definition list for a single plain-object value. */
-.cn-object-data-widget__deflist[data-v-702c7c98] {
+.cn-object-data-widget__deflist[data-v-344df010] {
 	display: grid;
 	grid-template-columns: auto 1fr;
 	gap: 2px 8px;
 	margin: 0;
 }
-.cn-object-data-widget__deflist dt[data-v-702c7c98] {
+.cn-object-data-widget__deflist dt[data-v-344df010] {
 	color: var(--color-text-maxcontrast);
 	font-size: 0.9em;
 }
-.cn-object-data-widget__deflist dd[data-v-702c7c98] {
+.cn-object-data-widget__deflist dd[data-v-344df010] {
 	margin: 0;
 	overflow-wrap: anywhere;
 }
 
 /* A long description keeps its own paragraphs. Set on an inline span with no
    surrounding template whitespace, so only the value's own line breaks show. */
-.cn-object-data-widget__deflist-text[data-v-702c7c98] {
+.cn-object-data-widget__deflist-text[data-v-344df010] {
 	white-space: pre-wrap;
 }
-.cn-object-data-widget__deflist--nested[data-v-702c7c98] {
+.cn-object-data-widget__deflist--nested[data-v-344df010] {
 	padding-inline-start: 8px;
 	border-inline-start: 2px solid var(--color-border);
 }
 
 /* Responsive: collapse to single column on narrow widths */
 @media (max-width: 600px) {
-.cn-object-data-widget__grid[data-v-702c7c98] {
+.cn-object-data-widget__grid[data-v-344df010] {
 		grid-template-columns: 1fr !important;
 }
-.cn-object-data-widget__cell[data-v-702c7c98] {
+.cn-object-data-widget__cell[data-v-344df010] {
 		grid-column: span 1 !important;
 		grid-row: span 1 !important;
 }
@@ -34711,7 +34731,7 @@ to { background-position: -200% 0;
 
 
 /* The Nextcloud look: the stacked stepper, unchanged. */
-.cn-stepper[data-v-3cab4d7d] {
+.cn-stepper[data-v-3d784176] {
 	display: flex;
 	align-items: flex-start;
 	justify-content: center;
@@ -34720,7 +34740,7 @@ to { background-position: -200% 0;
 	margin: 0 0 20px;
 	list-style: none;
 }
-.cn-stepper__item[data-v-3cab4d7d] {
+.cn-stepper__item[data-v-3d784176] {
 	position: relative;
 	flex: 1 1 0;
 	min-width: 0;
@@ -34732,7 +34752,7 @@ to { background-position: -200% 0;
 	color: var(--color-text-maxcontrast);
 	font-size: 0.8125rem;
 }
-.cn-stepper__step[data-v-3cab4d7d] {
+.cn-stepper__step[data-v-3d784176] {
 	display: flex;
 	flex-direction: column;
 	align-items: center;
@@ -34745,10 +34765,18 @@ to { background-position: -200% 0;
 	color: inherit;
 	font: inherit;
 }
-button.cn-stepper__step[data-v-3cab4d7d] {
+
+/* Nextcloud's server.css gives every plain button a 3px margin and the
+   clickable-area height (`button:not(.button-vue, …):not(…)`, 0,2,1), which
+   made a done step 40px tall around its 28px circle. Two classes outrank it. */
+.cn-stepper button.cn-stepper__step[data-v-3d784176] {
+	margin: 0;
+	min-height: 0;
+}
+button.cn-stepper__step[data-v-3d784176] {
 	cursor: pointer;
 }
-.cn-stepper__dot[data-v-3cab4d7d] {
+.cn-stepper__dot[data-v-3d784176] {
 	display: inline-flex;
 	align-items: center;
 	justify-content: center;
@@ -34763,17 +34791,17 @@ button.cn-stepper__step[data-v-3cab4d7d] {
 	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
 	z-index: 1;
 }
-.cn-wizard-dialog__progress-check[data-v-3cab4d7d] {
+.cn-wizard-dialog__progress-check[data-v-3d784176] {
 	font-size: 16px;
 	line-height: 1;
 }
-.cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper__label[data-v-3d784176] {
 	max-width: 100%;
 	overflow: hidden;
 	text-overflow: ellipsis;
 	white-space: nowrap;
 }
-.cn-stepper__connector[data-v-3cab4d7d] {
+.cn-stepper__connector[data-v-3d784176] {
 	position: absolute;
 	top: 17px;
 	left: calc(50% + 21px);
@@ -34781,26 +34809,26 @@ button.cn-stepper__step[data-v-3cab4d7d] {
 	height: 2px;
 	background: var(--color-border-dark);
 }
-.cn-stepper__connector--done[data-v-3cab4d7d] {
+.cn-stepper__connector--done[data-v-3d784176] {
 	background: var(--color-primary-element);
 }
-.cn-stepper__item--current .cn-stepper__dot[data-v-3cab4d7d],
-.cn-stepper__item--done .cn-stepper__dot[data-v-3cab4d7d] {
+.cn-stepper__item--current .cn-stepper__dot[data-v-3d784176],
+.cn-stepper__item--done .cn-stepper__dot[data-v-3d784176] {
 	border-color: var(--color-primary-element);
 	background: var(--color-primary-element);
 	color: var(--color-primary-element-text, #fff);
 }
-.cn-stepper__item--current .cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper__item--current .cn-stepper__label[data-v-3d784176] {
 	color: var(--color-main-text);
 	font-weight: 600;
 }
-.cn-stepper__item--done .cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper__item--done .cn-stepper__label[data-v-3d784176] {
 	color: var(--color-main-text);
 }
-.cn-stepper__item--done button.cn-stepper__step:hover .cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper__item--done button.cn-stepper__step:hover .cn-stepper__label[data-v-3d784176] {
 	color: var(--color-primary-element);
 }
-.cn-stepper__sr[data-v-3cab4d7d] {
+.cn-stepper__sr[data-v-3d784176] {
 	position: absolute;
 	width: 1px;
 	height: 1px;
@@ -34811,16 +34839,16 @@ button.cn-stepper__step[data-v-3cab4d7d] {
 }
 
 /* The board look: one row, 28px circles, the label beside the circle. */
-/* The board leaves 20px between the stepper and the step's body (DqInstellen). */
-.cn-stepper--board[data-v-3cab4d7d] {
+/* The board leaves 16px between the stepper and the step's body (DqInstellen). */
+.cn-stepper--board[data-v-3d784176] {
 	flex-wrap: wrap;
 	align-items: center;
 	justify-content: flex-start;
 	gap: 8px;
 	padding: 0;
-	margin: 0 0 20px;
+	margin: 0 0 16px;
 }
-.cn-stepper--board .cn-stepper__item[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__item[data-v-3d784176] {
 	flex: 0 1 auto;
 	flex-direction: row;
 	align-items: center;
@@ -34828,67 +34856,67 @@ button.cn-stepper__step[data-v-3cab4d7d] {
 	max-width: none;
 	font-size: 14px;
 }
-.cn-stepper--board .cn-stepper__item[data-v-3cab4d7d]:not(:last-child) {
+.cn-stepper--board .cn-stepper__item[data-v-3d784176]:not(:last-child) {
 	flex: 1 1 auto;
 }
-.cn-stepper--board .cn-stepper__step[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__step[data-v-3d784176] {
 	flex-direction: row;
 	gap: 8px;
 }
-.cn-stepper--board .cn-stepper__dot[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__dot[data-v-3d784176] {
 	flex: 0 0 auto;
 	width: 28px;
 	height: 28px;
 	font-size: 14px;
 }
-.cn-stepper--board .cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__label[data-v-3d784176] {
 	overflow: visible;
 	text-overflow: clip;
 	white-space: nowrap;
 	font-size: 14px;
 }
-.cn-stepper--board .cn-stepper__connector[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__connector[data-v-3d784176] {
 	position: static;
 	flex: 1 1 24px;
 	min-width: 16px;
 	height: 2px;
 	background: var(--color-border);
 }
-.cn-stepper--board .cn-stepper__connector--done[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__connector--done[data-v-3d784176] {
 	background: var(--color-success);
 }
 
 /* Done: filled success circle, 16px check, secondary label. */
-.cn-stepper--board .cn-stepper__item--done .cn-stepper__dot[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__item--done .cn-stepper__dot[data-v-3d784176] {
 	border-color: var(--color-success);
 	background: var(--color-success);
 	color: var(--color-success-text, #fff);
 }
-.cn-stepper--board .cn-stepper__item--done .cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__item--done .cn-stepper__label[data-v-3d784176] {
 	color: var(--cn-board-text-soft, var(--color-main-text));
 	font-weight: 400;
 }
 
 /* Current: filled primary, number 14/700, label 14/700 in the main text colour. */
-.cn-stepper--board .cn-stepper__item--current .cn-stepper__dot[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__item--current .cn-stepper__dot[data-v-3d784176] {
 	border-color: var(--color-primary-element);
 	background: var(--color-primary-element);
 	color: var(--color-primary-element-text, #fff);
 	font-weight: 700;
 }
-.cn-stepper--board .cn-stepper__item--current .cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__item--current .cn-stepper__label[data-v-3d784176] {
 	color: var(--color-main-text);
 	font-weight: 700;
 }
 
 /* Upcoming: 2px outline, number 14/600, label in the max-contrast tone. */
-.cn-stepper--board .cn-stepper__item--upcoming .cn-stepper__dot[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__item--upcoming .cn-stepper__dot[data-v-3d784176] {
 	border: 2px solid var(--color-border-dark);
 	background: transparent;
 	color: var(--color-text-maxcontrast);
 	font-weight: 600;
 }
-.cn-stepper--board .cn-stepper__item--upcoming .cn-stepper__label[data-v-3cab4d7d] {
+.cn-stepper--board .cn-stepper__item--upcoming .cn-stepper__label[data-v-3d784176] {
 	color: var(--color-text-maxcontrast);
 }
 
@@ -40581,13 +40609,13 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 }
 
 
-.cn-facts-widget[data-v-6351bc64] {
+.cn-facts-widget[data-v-48761b13] {
 	display: flex;
 	flex-direction: column;
 	gap: 10px;
 	min-width: 0;
 }
-.cn-facts-widget__pills[data-v-6351bc64] {
+.cn-facts-widget__pills[data-v-48761b13] {
 	display: flex;
 	flex-wrap: wrap;
 	gap: 8px;
@@ -40596,7 +40624,7 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 /* `padding: 0`: Nextcloud's core stylesheet pads every `dl` 12px at the top
    and bottom, which put a side card's facts 24px under its title, against
    the board's 12 (DqZaak "Behandeling", DqZaakDocumenten). */
-.cn-facts-widget__rows[data-v-6351bc64] {
+.cn-facts-widget__rows[data-v-48761b13] {
 	display: grid;
 	grid-template-columns: max-content 1fr;
 	gap: 8px 16px;
@@ -40606,17 +40634,17 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 }
 
 /* Each row is a grid of its own children: the wrapper takes no box. */
-.cn-facts-widget__row[data-v-6351bc64] {
+.cn-facts-widget__row[data-v-48761b13] {
 	display: contents;
 }
-.cn-facts-widget__row--inline[data-v-6351bc64] {
+.cn-facts-widget__row--inline[data-v-48761b13] {
 	display: flex;
 	grid-column: 1 / -1;
 	flex-wrap: wrap;
 	align-items: center;
 	gap: 10px;
 }
-.cn-facts-widget__row--inline .cn-facts-widget__value[data-v-6351bc64] {
+.cn-facts-widget__row--inline .cn-facts-widget__value[data-v-48761b13] {
 	display: flex;
 	flex-wrap: wrap;
 	align-items: center;
@@ -40628,14 +40656,14 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
    12px around both and widened the label column to 130px. The class is
    doubled so these resets outrank that rule, and a dossiq-style `:deep()`
    override in an app is not needed. */
-.cn-facts-widget__label.cn-facts-widget__label[data-v-6351bc64] {
+.cn-facts-widget__label.cn-facts-widget__label[data-v-48761b13] {
 	width: auto;
 	margin: 0;
 	padding: 0;
 	text-align: start;
 	color: var(--color-text-maxcontrast);
 }
-.cn-facts-widget__value.cn-facts-widget__value[data-v-6351bc64] {
+.cn-facts-widget__value.cn-facts-widget__value[data-v-48761b13] {
 	margin: 0;
 	padding: 0;
 	text-align: start;
@@ -40643,56 +40671,56 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 	min-width: 0;
 	overflow-wrap: anywhere;
 }
-.cn-facts-widget__title[data-v-6351bc64] {
+.cn-facts-widget__title[data-v-48761b13] {
 	font-size: 15px;
 	font-weight: 600;
 	color: var(--color-main-text);
 }
-.cn-facts-widget__line[data-v-6351bc64] {
+.cn-facts-widget__line[data-v-48761b13] {
 	font-size: 13px;
 	color: var(--color-text-maxcontrast);
 }
-.cn-facts-widget__meter[data-v-6351bc64] {
+.cn-facts-widget__meter[data-v-48761b13] {
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 	font-size: 14px;
 }
-.cn-facts-widget__meter-head[data-v-6351bc64] {
+.cn-facts-widget__meter-head[data-v-48761b13] {
 	display: flex;
 	justify-content: space-between;
 	gap: 16px;
 }
-.cn-facts-widget__meter-label[data-v-6351bc64] {
+.cn-facts-widget__meter-label[data-v-48761b13] {
 	color: var(--color-text-maxcontrast);
 }
-.cn-facts-widget__meter-value[data-v-6351bc64] {
+.cn-facts-widget__meter-value[data-v-48761b13] {
 	font-weight: 500;
 	text-align: end;
 }
-.cn-facts-widget__meter-track[data-v-6351bc64] {
+.cn-facts-widget__meter-track[data-v-48761b13] {
 	height: 6px;
 	border-radius: 3px;
 	background: var(--color-background-darker);
 	overflow: hidden;
 }
-.cn-facts-widget__meter-bar[data-v-6351bc64] {
+.cn-facts-widget__meter-bar[data-v-48761b13] {
 	display: block;
 	height: 100%;
 	border-radius: inherit;
 	background: var(--color-primary-element);
 }
-.cn-facts-widget__meter--over .cn-facts-widget__meter-value[data-v-6351bc64] {
+.cn-facts-widget__meter--over .cn-facts-widget__meter-value[data-v-48761b13] {
 	color: var(--color-error-text);
 }
-.cn-facts-widget__meter--over .cn-facts-widget__meter-bar[data-v-6351bc64] {
+.cn-facts-widget__meter--over .cn-facts-widget__meter-bar[data-v-48761b13] {
 	background: var(--color-error);
 }
-.cn-facts-widget__muted[data-v-6351bc64] {
+.cn-facts-widget__muted[data-v-48761b13] {
 	margin: 0;
 	color: var(--color-text-maxcontrast);
 }
-.cn-facts-widget__label .hidden-visually[data-v-6351bc64] {
+.cn-facts-widget__label .hidden-visually[data-v-48761b13] {
 	clip-path: inset(50%);
 	height: 1px;
 	overflow: hidden;
@@ -40700,27 +40728,27 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 	white-space: nowrap;
 	width: 1px;
 }
-.cn-facts-widget__label--icon[data-v-6351bc64] {
+.cn-facts-widget__label--icon[data-v-48761b13] {
 	align-items: center;
 	display: flex;
 }
-.cn-facts-widget__value-link[data-v-6351bc64] {
+.cn-facts-widget__value-link[data-v-48761b13] {
 	color: var(--color-primary-element);
 	text-decoration: underline;
 }
-.cn-facts-widget__inline-button[data-v-6351bc64],
-.cn-facts-widget__icon-button[data-v-6351bc64],
-.cn-facts-widget__action[data-v-6351bc64] {
+.cn-facts-widget__inline-button[data-v-48761b13],
+.cn-facts-widget__icon-button[data-v-48761b13],
+.cn-facts-widget__action[data-v-48761b13] {
 	align-items: center;
 	cursor: pointer;
 	display: inline-flex;
 	font: inherit;
 }
-.cn-facts-widget__reveal-error[data-v-6351bc64] {
+.cn-facts-widget__reveal-error[data-v-48761b13] {
 	font-size: 13px;
 	color: var(--color-text-error, var(--color-error));
 }
-.cn-facts-widget__inline-button[data-v-6351bc64] {
+.cn-facts-widget__inline-button[data-v-48761b13] {
 	background: var(--color-main-background);
 	border: 1px solid var(--color-border-dark);
 	border-radius: 16px;
@@ -40732,7 +40760,7 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 	min-height: 30px;
 	padding: 0 10px;
 }
-.cn-facts-widget__icon-button[data-v-6351bc64] {
+.cn-facts-widget__icon-button[data-v-48761b13] {
 	background: transparent;
 	border: 0;
 	border-radius: 6px;
@@ -40741,23 +40769,23 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 	padding: 2px;
 	vertical-align: middle;
 }
-.cn-facts-widget__icon-button[data-v-6351bc64]:hover,
-.cn-facts-widget__icon-button[data-v-6351bc64]:focus-visible {
+.cn-facts-widget__icon-button[data-v-48761b13]:hover,
+.cn-facts-widget__icon-button[data-v-48761b13]:focus-visible {
 	background: var(--color-background-hover);
 	color: var(--color-main-text);
 }
-.cn-facts-widget__text[data-v-6351bc64] {
+.cn-facts-widget__text[data-v-48761b13] {
 	color: var(--color-main-text);
 	font-size: 15px;
 }
 
 /* A lead: an icon tile or initials beside a bold title and a muted subtitle. */
-.cn-facts-widget__lead[data-v-6351bc64] {
+.cn-facts-widget__lead[data-v-48761b13] {
 	align-items: center;
 	display: flex;
 	gap: 12px;
 }
-.cn-facts-widget__lead-tile[data-v-6351bc64] {
+.cn-facts-widget__lead-tile[data-v-48761b13] {
 	align-items: center;
 	background: var(--color-background-dark);
 	border-radius: 8px;
@@ -40772,32 +40800,32 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 }
 
 /* Initials stand for a person: round, as an avatar. */
-.cn-facts-widget__lead-tile--initials[data-v-6351bc64] {
+.cn-facts-widget__lead-tile--initials[data-v-48761b13] {
 	border-radius: 50%;
 }
-.cn-facts-widget__lead-tile--success[data-v-6351bc64] {
+.cn-facts-widget__lead-tile--success[data-v-48761b13] {
 	background: color-mix(in srgb, var(--color-success) 14%, var(--color-main-background));
 	border-radius: 50%;
 	color: var(--color-success-text, var(--color-success));
 }
-.cn-facts-widget__lead-tile--info[data-v-6351bc64] {
+.cn-facts-widget__lead-tile--info[data-v-48761b13] {
 	background: var(--color-primary-element-light);
 	border-radius: 50%;
 	color: var(--color-primary-element-light-text, var(--color-primary-element));
 }
-.cn-facts-widget__lead-text[data-v-6351bc64] {
+.cn-facts-widget__lead-text[data-v-48761b13] {
 	display: flex;
 	flex-direction: column;
 	min-width: 0;
 }
-.cn-facts-widget__lead-title[data-v-6351bc64] {
+.cn-facts-widget__lead-title[data-v-48761b13] {
 	font-size: 15px;
 }
-.cn-facts-widget__lead-subtitle[data-v-6351bc64] {
+.cn-facts-widget__lead-subtitle[data-v-48761b13] {
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 }
-.cn-facts-widget__action[data-v-6351bc64] {
+.cn-facts-widget__action[data-v-48761b13] {
 	align-self: flex-start;
 	background: var(--color-primary-element-light);
 	border: 0;
@@ -40809,27 +40837,27 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 	min-height: 32px;
 	padding: 0 14px;
 }
-.cn-facts-widget__action[data-v-6351bc64]:hover,
-.cn-facts-widget__action[data-v-6351bc64]:focus-visible {
+.cn-facts-widget__action[data-v-48761b13]:hover,
+.cn-facts-widget__action[data-v-48761b13]:focus-visible {
 	background: var(--color-primary-element-light-hover, var(--color-primary-element-light));
 }
-.cn-facts-widget__notice[data-v-6351bc64] {
+.cn-facts-widget__notice[data-v-48761b13] {
 	margin: 4px 0 0;
 }
 
 /* A div, not a p: a theme sets every paragraph's size with !important. */
-.cn-facts-widget__footnote[data-v-6351bc64] {
+.cn-facts-widget__footnote[data-v-48761b13] {
 	color: var(--color-text-maxcontrast);
 	font-size: 13px;
 	line-height: 1.2;
 }
-.cn-facts-widget__link[data-v-6351bc64] {
+.cn-facts-widget__link[data-v-48761b13] {
 	font-size: 14px;
 	font-weight: 600;
 	color: var(--color-primary-element);
 	text-decoration: underline;
 }
-.cn-facts-widget__link--button[data-v-6351bc64] {
+.cn-facts-widget__link--button[data-v-48761b13] {
 	display: inline-flex;
 	align-items: center;
 	gap: 6px;
@@ -40844,12 +40872,12 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 
 /* `columns: 2` (board DqContact): two columns, the label above the value, a
    hairline under each fact; one column on a phone. */
-.cn-facts-widget__rows--columns[data-v-6351bc64] {
+.cn-facts-widget__rows--columns[data-v-48761b13] {
 	grid-template-columns: repeat(2, minmax(0, 1fr));
 	gap: 14px 24px;
 	font-size: 15px;
 }
-.cn-facts-widget__rows--columns .cn-facts-widget__row[data-v-6351bc64] {
+.cn-facts-widget__rows--columns .cn-facts-widget__row[data-v-48761b13] {
 	display: flex;
 	flex-direction: column;
 	gap: 3px;
@@ -40857,21 +40885,21 @@ a.cn-flow-runs-widget__row-content:hover .cn-flow-runs-widget__name[data-v-76cc4
 	padding-bottom: 10px;
 	border-bottom: 1px solid var(--color-border);
 }
-.cn-facts-widget__rows--columns .cn-facts-widget__label.cn-facts-widget__label[data-v-6351bc64] {
+.cn-facts-widget__rows--columns .cn-facts-widget__label.cn-facts-widget__label[data-v-48761b13] {
 	font-size: 13px;
 }
 
 /* One column, label above value: 2px under its label, 10px to the next
    label, so a long label never squeezes its value (DqHandhaving). */
-.cn-facts-widget__rows--stacked[data-v-6351bc64] {
+.cn-facts-widget__rows--stacked[data-v-48761b13] {
 	grid-template-columns: minmax(0, 1fr);
 	gap: 2px 0;
 }
-.cn-facts-widget__rows--stacked .cn-facts-widget__value.cn-facts-widget__value[data-v-6351bc64] {
+.cn-facts-widget__rows--stacked .cn-facts-widget__value.cn-facts-widget__value[data-v-48761b13] {
 	margin-bottom: 8px;
 }
 @media (max-width: 640px) {
-.cn-facts-widget__rows--columns[data-v-6351bc64] {
+.cn-facts-widget__rows--columns[data-v-48761b13] {
 		grid-template-columns: minmax(0, 1fr);
 }
 }
@@ -51891,15 +51919,21 @@ textarea.cn-sm-field__input[data-v-3e23dab3] {
 }
 
 
-.cn-access-purpose__sentence[data-v-7fa35363] {
+.cn-access-purpose__sentence[data-v-64fad2b3] {
 	margin: 0 0 12px;
 }
-.cn-access-purpose__choices[data-v-7fa35363] {
+.cn-access-purpose__choices[data-v-64fad2b3] {
 	margin: 0 0 12px;
 	padding: 0;
 	border: 0;
 }
-.cn-access-purpose__legend[data-v-7fa35363] {
+.cn-access-purpose__hint[data-v-64fad2b3] {
+	margin: 0 0 6px;
+	padding-inline-start: 36px;
+	color: var(--color-text-maxcontrast);
+	font-size: 13px;
+}
+.cn-access-purpose__legend[data-v-64fad2b3] {
 	margin-bottom: 4px;
 	font-weight: 600;
 }