.accessibility {
	position: fixed;
	inset: 0;
	margin: auto;
	width: min(calc(var(--spacing-32) * 22), calc(100% - var(--spacing-32)));
	max-height: calc(100dvh - var(--spacing-32));
	padding: clamp(var(--spacing-20), 3vw, var(--spacing-32));
	color: var(--color-off-black);
	background: var(--color-white);
	border: 1px solid var(--color-gray);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	overflow-y: auto;
	overscroll-behavior: contain;
}

.accessibility::backdrop {
	background: color-mix(in srgb, var(--color-black) 45%, transparent);
}

.accessibility__heading {
	display: flex;
	align-items: start;
	gap: var(--spacing-20);
	margin-bottom: var(--spacing-24);
}

.accessibility h2 {
	font-size: clamp(var(--font-size-xl), 2vw + 1rem, var(--font-size-heading));
	line-height: var(--line-height-heading);
}

.accessibility__close {
	display: grid;
	place-items: center;
	min-width: calc(var(--spacing-24) * 2);
	min-height: calc(var(--spacing-24) * 2);
	margin-left: auto;
	font-size: var(--font-size-xl);
}

.accessibility__form {
	display: grid;
	gap: var(--spacing-24);
}

.accessibility fieldset {
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-10) var(--spacing-24);
	border: 0;
	min-width: 0;
}

.accessibility legend {
	font-weight: var(--font-weight-semibold);
	margin-bottom: var(--spacing-10);
}

.accessibility label {
	display: flex;
	align-items: center;
	gap: var(--spacing-10);
	min-height: calc(var(--spacing-24) * 2);
}

.accessibility input {
	width: var(--spacing-24);
	height: var(--spacing-24);
	flex: none;
	accent-color: var(--color-black);
}

.accessibility__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--spacing-14);
}