.datavis-page {
		--datavis-page-shell-width: 85.5rem;
		--datavis-page-copy-width: 57rem;
		--datavis-filter-panel-bg: #054244;
		--datavis-filter-panel-border: var(--e-global-color-869b992, #115d5f);
		--datavis-filter-surface: var(--e-global-color-5645078, #013537);
		--datavis-filter-surface-strong: color-mix(in srgb, var(--datavis-filter-surface) 74%, black);
		--datavis-filter-accent: var(--e-global-color-dc8ed05, #00b0b3);
		--datavis-filter-action-bg: var(--e-global-color-1a7e01b, #005f62);
		--datavis-filter-action-hover: #319da0;
		--datavis-filter-text: #fff;
		--datavis-filter-text-muted: var(--e-global-color-8d1b442, #8cafb1);
		--datavis-filter-ring: color-mix(in srgb, var(--datavis-filter-accent) 42%, transparent);
		--datavis-filter-shadow: 0 24px 48px rgb(0 0 0 / 22%);
		--datavis-filter-radius: 0.5rem;
		--datavis-filter-pill-radius: 999px;
		--datavis-filter-control-height: 3.25rem;
		--datavis-filter-font-size: 0.875rem;
		padding-block: 3rem 2rem;
		padding-inline: 1rem;
	}

	.datavis-page__article {
		margin: 0;
	}

	.datavis-page__shell {
		display: grid;
		gap: 1.5rem;
		inline-size: min(100%, var(--datavis-page-shell-width));
		margin-inline: auto;
	}

	.datavis-page__header {
		display: flex;
		justify-content: center;
		text-align: center;
	}

	.datavis-page__header-copy {
		display: grid;
		gap: 0.75rem;
		max-inline-size: var(--datavis-page-copy-width);
	}

	.datavis-page__title {
		margin: 0;
		color: var(--datavis-filter-text);
		font-family: var(--e-global-typography-primary-font-family, "Work Sans"), sans-serif;
		font-size: clamp(1.5rem, 3.5vw, 2.75rem);
		font-weight: 700;
		line-height: 1.1;
		text-transform: uppercase;
	}

	.datavis-page__subtitle {
		margin: 0;
		color: var(--datavis-filter-text-muted);
		font-family: var(--e-global-typography-accent-font-family, "Work Sans"), sans-serif;
		font-size: clamp(0.9375rem, 1.5vw, 1.125rem);
		font-weight: 400;
		line-height: 1.55;
	}

	.datavis-page__body {
		display: grid;
		gap: 1.5rem;
		min-inline-size: 0;
	}

	.datavis-filters {
		inline-size: 100%;
	}

	.datavis-filters,
	.datavis-filters :where(*, *::before, *::after) {
		box-sizing: border-box;
	}

	.datavis-filters :where(form, fieldset, legend, label, input, select, button, details, summary) {
		margin: 0;
		font: inherit;
		letter-spacing: inherit;
	}

	.datavis-filters :where(fieldset, legend) {
		min-inline-size: 0;
		padding: 0;
		border: 0;
	}

	.datavis-filters :where(input, select, button) {
		color: inherit;
	}

	.datavis-filters__panel {
		padding: 0.75rem 1.25rem 1rem;
		border: 1px solid var(--datavis-filter-panel-border);
		border-radius: var(--datavis-filter-radius);
		background: var(--datavis-filter-panel-bg);
		box-shadow: inset 0 0 0 1px rgb(255 255 255 / 3%);
	}

	.datavis-filters__header {
		display: flex;
		align-items: center;
		gap: 0.875rem;
		margin-block-end: 1rem;
		color: var(--datavis-filter-text);
	}

	.datavis-filters__icon {
		display: inline-flex;
		inline-size: 2rem;
		block-size: 2rem;
		flex: none;
		color: var(--datavis-filter-accent);

		svg {
			inline-size: 100%;
			block-size: 100%;
			fill: currentColor;
		}
	}

	.datavis-filters__title {
		margin: 0;
		color: var(--datavis-filter-text);
		font-family: var(--e-global-typography-primary-font-family, "Work Sans"), sans-serif;
		font-size: clamp(1.6rem, 2vw, 1.9rem);
		font-weight: 600;
		line-height: 1.2;
	}

	.datavis-filters__form {
		display: grid;
		gap: 0.75rem;
	}

	.datavis-filters__grid {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr);
		gap: 1rem;
		align-items: end;
	}

	.datavis-filters__field {
		min-inline-size: 0;
		margin: 0;
	}

	.datavis-filters__field--date-range {
		min-inline-size: 0;
		padding: 0;
		border: 0;
	}

	.datavis-filters__field--visualisation {
		grid-column: 1 / 2;
	}

	.datavis-filters__label {
		display: block;
		margin-block-end: 0.5rem;
		padding: 0;
		color: var(--datavis-filter-text);
		font-family: var(--e-global-typography-accent-font-family, "Work Sans"), sans-serif;
		font-size: var(--datavis-filter-font-size);
		font-weight: 500;
		line-height: 1.2;
	}

	.datavis-filters__control,
	.datavis-filters__submit,
	.datavis-chart__download {
		min-block-size: var(--datavis-filter-control-height);
		border: 1px solid var(--datavis-filter-panel-border);
		border-radius: var(--datavis-filter-radius);
		font: inherit;
		font-size: var(--datavis-filter-font-size);
		line-height: 1.2;
		transition:
			border-color 180ms ease,
			background-color 180ms ease,
			box-shadow 180ms ease,
			color 180ms ease,
			transform 180ms ease;
	}

	.datavis-filters__control {
		inline-size: 100%;
		padding-block: 0.875rem;
		padding-inline: 1.125rem;
		background: var(--datavis-filter-surface);
		color: var(--datavis-filter-text);
		box-shadow: inset 0 0 0 1px rgb(255 255 255 / 2%);

		&::placeholder {
			color: color-mix(in srgb, var(--datavis-filter-text) 78%, transparent);
			opacity: 1;
		}

		&:focus-visible {
			outline: 0;
			border-color: var(--datavis-filter-accent);
			box-shadow:
				inset 0 0 0 1px rgb(255 255 255 / 2%),
				0 0 0 3px var(--datavis-filter-ring);
		}
	}

	.datavis-filters :is(input, select).datavis-filters__control {
		inline-size: 100%;
		padding-block: 0.875rem;
		padding-inline: 1.125rem;
		border: 1px solid var(--datavis-filter-panel-border);
		border-radius: var(--datavis-filter-radius);
		background: var(--datavis-filter-surface);
		color: var(--datavis-filter-text);
		box-shadow: inset 0 0 0 1px rgb(255 255 255 / 2%);
	}

	.datavis-filters :is(input, select).datavis-filters__control:focus-visible {
		outline: 0;
		border-color: var(--datavis-filter-accent);
		box-shadow:
			inset 0 0 0 1px rgb(255 255 255 / 2%),
			0 0 0 3px var(--datavis-filter-ring);
	}

	.datavis-filters__control--date {
		position: relative;
		box-sizing: border-box;
		padding-inline-end: 1.125rem;
		background-image: none;
		color-scheme: dark;
		appearance: none;
		-webkit-appearance: none;

		&::-webkit-date-and-time-value {
			min-block-size: 1.2em;
			text-align: left;
		}

		&::-webkit-datetime-edit,
		&::-webkit-datetime-edit-fields-wrapper,
		&::-webkit-datetime-edit-text,
		&::-webkit-datetime-edit-month-field,
		&::-webkit-datetime-edit-day-field,
		&::-webkit-datetime-edit-year-field {
			padding: 0;
			color: inherit;
		}

		&::-webkit-clear-button,
		&::-webkit-inner-spin-button {
			display: none;
		}

		&::-webkit-calendar-picker-indicator {
			position: absolute;
			inset: 0;
			inline-size: auto;
			block-size: auto;
			cursor: pointer;
			opacity: 0;
		}
	}

	.datavis-filters__multi-select {
		position: relative;

		&[open] {
			z-index: 20;

			.datavis-filters__control--summary {
				border-color: var(--datavis-filter-accent);
				box-shadow:
					inset 0 0 0 1px rgb(255 255 255 / 2%),
					0 0 0 3px var(--datavis-filter-ring);
			}

			.datavis-filters__summary-icon {
				transform: rotate(-135deg);
			}
		}

		& > summary {
			list-style: none;
			cursor: pointer;

			&::-webkit-details-marker {
				display: none;
			}
		}
	}

	.datavis-filters__control--summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
	}

	.datavis-filters__summary-text {
		min-inline-size: 0;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.datavis-filters__summary-icon {
		inline-size: 0.7rem;
		block-size: 0.7rem;
		flex: none;
		border-inline-end: 2px solid var(--datavis-filter-panel-border);
		border-block-end: 2px solid var(--datavis-filter-panel-border);
		transform: rotate(45deg);
		transition: transform 180ms ease;
	}

	.datavis-filters__dropdown {
		position: absolute;
		inset-block-start: calc(100% + 0.5rem);
		inset-inline: 0;
		padding: 0.5rem;
		border: 1px solid color-mix(in srgb, var(--datavis-filter-panel-border) 90%, black);
		border-radius: 1rem;
		background:
			linear-gradient(180deg, rgb(5 66 68 / 97%), rgb(1 53 55 / 96%)),
			var(--datavis-filter-panel-bg);
		box-shadow: var(--datavis-filter-shadow);
	}

	.datavis-filters__options {
		display: grid;
		gap: 0.2rem;
		max-block-size: 20rem;
		overflow: auto;
		padding-inline-end: 0.25rem;
		scrollbar-gutter: stable;

		&::-webkit-scrollbar {
			inline-size: 0.5rem;
		}

		&::-webkit-scrollbar-thumb {
			border-radius: 999px;
			background: color-mix(in srgb, var(--datavis-filter-accent) 45%, transparent);
		}
	}

	.datavis-filters__option {
		display: flex;
		align-items: flex-start;
		gap: 0.75rem;
		padding: 0.625rem 0.75rem;
		border-radius: 0.75rem;
		color: var(--datavis-filter-text);
		cursor: pointer;
		transition: background-color 160ms ease;

		&:hover {
			background: rgb(255 255 255 / 4%);
		}
	}

	.datavis-filters__option--incident-type {
		padding-inline-start: calc(0.75rem + var(--datavis-option-indent, 0rem));
	}

	.datavis-filters__option--incident-type:has(
		.datavis-filters__checkbox[data-datavis-parent-id="0"]
	) .datavis-filters__option-label {
		font-weight: 600;
	}

	.datavis-filters__checkbox {
		appearance: none;
		inline-size: 1rem;
		block-size: 1rem;
		box-sizing: border-box;
		flex: none;
		margin: 0.15rem 0 0;
		border: 1px solid var(--datavis-filter-panel-border);
		border-radius: 0.25rem;
		background: var(--datavis-filter-surface-strong);
		cursor: pointer;
		transition:
			background-color 160ms ease,
			border-color 160ms ease,
			box-shadow 160ms ease;

		&:checked {
			border-color: var(--datavis-filter-accent);
			background: var(--datavis-filter-action-bg);
			box-shadow: inset 0 0 0 1px rgb(255 255 255 / 8%);
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='M3.5 8.25 6.4 11.15 12.5 4.85'/%3E%3C/svg%3E");
			background-repeat: no-repeat;
			background-position: center;
			background-size: 0.7rem 0.7rem;
		}

		&:indeterminate {
			border-color: var(--datavis-filter-accent);
			background-color: var(--datavis-filter-action-bg);
			background-image: linear-gradient(
				to right,
				transparent 20%,
				#fff 20%,
				#fff 80%,
				transparent 80%
			);
			background-repeat: no-repeat;
			background-position: center;
			background-size: 0.7rem 0.14rem;
		}

		&:disabled {
			opacity: 0.45;
			cursor: not-allowed;
		}

		&:focus-visible {
			outline: 0;
			box-shadow: 0 0 0 3px var(--datavis-filter-ring);
		}
	}

	.datavis-filters__option-label {
		color: var(--datavis-filter-text);
		font-size: 1rem;
		line-height: 1.3;
	}

	.datavis-filters__date-row {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
		gap: 1rem;
		align-items: stretch;
	}

	.datavis-filters__submit,
	.datavis-chart__download {
		padding-inline: 1.5rem;
		border-color: var(--datavis-filter-action-bg);
		background: var(--datavis-filter-action-bg);
		color: var(--datavis-filter-text);
		font-family: var(--e-global-typography-accent-font-family, "Work Sans"), sans-serif;
		font-weight: 500;
		white-space: nowrap;
		cursor: pointer;

		&:hover,
		&:focus-visible {
			outline: 0;
			border-color: var(--datavis-filter-action-hover);
			background: var(--datavis-filter-action-hover);
			box-shadow: 0 0 0 3px color-mix(in srgb, var(--datavis-filter-action-hover) 28%, transparent);
		}
	}

	.datavis-filters button.datavis-filters__submit,
	.datavis-chart button.datavis-chart__download {
		appearance: none;
		-webkit-appearance: none;
		border: 1px solid var(--datavis-filter-action-bg);
		border-radius: var(--datavis-filter-radius);
		background: var(--datavis-filter-action-bg);
		color: var(--datavis-filter-text);
		text-transform: none;
	}

	.datavis-filters button.datavis-filters__submit:hover,
	.datavis-filters button.datavis-filters__submit:focus-visible,
	.datavis-chart button.datavis-chart__download:hover,
	.datavis-chart button.datavis-chart__download:focus-visible {
		border-color: var(--datavis-filter-action-hover);
		background: var(--datavis-filter-action-hover);
	}

	.datavis-filters button.datavis-filters__submit:disabled,
	.datavis-chart button.datavis-chart__download:disabled {
		opacity: 0.78;
		cursor: wait;
	}

	.datavis-filters__footer {
		display: flex;
		justify-content: flex-end;
	}

	.datavis-filters .datavis-filters__footer :is(button, a).datavis-filters__reset {
		padding: 0;
		border: 0;
		background: none;
		color: var(--datavis-filter-text);
		font-size: var(--datavis-filter-font-size);
		font-weight: 500;
		text-decoration: underline;
		text-decoration-color: color-mix(in srgb, var(--datavis-filter-accent) 60%, transparent);
		text-underline-offset: 0.2em;
		transition: color 160ms ease, text-decoration-color 160ms ease;
		cursor: pointer;

		&:hover,
		&:focus-visible {
			color: var(--datavis-filter-accent);
			text-decoration-color: currentColor;
		}
	}

	.datavis-filters .datavis-filters__footer a.datavis-filters__reset--noscript {
		display: inline-block;
	}

	.datavis-chart {
		min-inline-size: 0;
		padding: 1.25rem;
		border: 1px solid var(--datavis-filter-panel-border);
		border-radius: var(--datavis-filter-radius);
		background:
			linear-gradient(180deg, rgb(4 73 76 / 72%), rgb(1 53 55 / 88%)),
			var(--datavis-filter-panel-bg);
		box-shadow: inset 0 0 0 1px rgb(255 255 255 / 3%);
	}

	.datavis-chart__header {
		display: grid;
		gap: 0.35rem;
		margin-block-end: 1rem;
	}

	.datavis-chart__title {
		margin: 0;
		color: var(--datavis-filter-text);
		font-family: var(--e-global-typography-primary-font-family, "Work Sans"), sans-serif;
		font-size: clamp(1.25rem, 1.8vw, 1.6rem);
		font-weight: 600;
		line-height: 1.2;
	}

	.datavis-chart__summary {
		margin: 0;
		color: var(--datavis-filter-text-muted);
		white-space: pre-line;
		font-family: var(--e-global-typography-accent-font-family, "Work Sans"), sans-serif;
		font-size: 0.9375rem;
		line-height: 1.45;
	}

	.datavis-chart__legend {
		display: flex;
		flex-wrap: wrap;
		min-inline-size: 0;
		max-inline-size: 100%;
		gap: 0.5rem 1rem;
		margin-block-end: 1rem;
	}

	.datavis-page .datavis-chart button.datavis-chart__legend-item {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		min-inline-size: 0;
		max-inline-size: 100%;
		box-sizing: border-box;
		min-block-size: 0;
		margin: 0 !important;
		padding: 0.25rem 0.5rem !important;
		border: 0 !important;
		border-radius: 0;
		background: transparent !important;
		background-color: transparent !important;
		background-image: none !important;
		box-shadow: none !important;
		color: var(--datavis-filter-text);
		font: inherit;
		font-size: var(--datavis-filter-font-size);
		line-height: 1.3;
		text-align: start;
		text-decoration: none;
		text-transform: none;
		appearance: none;
		-webkit-appearance: none;
		cursor: pointer;

		&[aria-pressed="false"] {
			color: var(--datavis-filter-text-muted) !important;
			text-decoration: line-through;
		}

		&:is(:hover, :active) {
			border: 0 !important;
			background: transparent !important;
			background-color: transparent !important;
			box-shadow: none !important;
			color: var(--datavis-filter-accent) !important;
		}

		&:focus-visible {
			outline: 2px solid var(--datavis-filter-accent);
			outline-offset: 3px;
		}
	}

	.datavis-page .datavis-chart .datavis-chart__legend-swatch {
		inline-size: 0.875rem;
		block-size: 0.875rem;
		flex: none;
		border: 1px solid rgb(255 255 255 / 35%);
		border-radius: 0.125rem;
	}

	.datavis-page .datavis-chart .datavis-chart__legend-label {
		min-inline-size: 0;
		white-space: normal;
		overflow-wrap: anywhere;
	}

	.datavis-chart__actions {
		display: flex;
		align-items: center;
		gap: 1rem;
		justify-content: flex-end;
		margin-block-start: 1rem;
	}

	.datavis-chart__theme-option {
		display: inline-flex;
		align-items: center;
		gap: 0.625rem;
		color: var(--datavis-filter-text);
		font-family: var(--e-global-typography-accent-font-family, "Work Sans"), sans-serif;
		font-size: var(--datavis-filter-font-size);
		font-weight: 500;
		cursor: pointer;

		input {
			accent-color: var(--datavis-filter-accent);
			inline-size: 1rem;
			block-size: 1rem;
			margin: 0;
		}
	}

	.datavis-chart__canvas-wrap {
		position: relative;
		inline-size: 100%;
		min-inline-size: 0;
		aspect-ratio: 21 / 4;
		min-block-size: 20rem;
		max-block-size: 24.75rem;
		overflow: hidden;
	}

	.datavis-chart__canvas-wrap--stacked {
		overflow-x: auto;
		overflow-y: hidden;
	}

	.datavis-chart__canvas-scroll {
		inline-size: 100%;
		block-size: 100%;
		min-inline-size: 0;
	}

	.datavis-chart__canvas {
		display: block;
		inline-size: 100%;
		block-size: 100%;
	}

	.datavis-chart[aria-busy="true"] .datavis-chart__canvas-wrap {
		opacity: 0.66;
		transition: opacity 180ms ease;
	}

	.datavis-chart__empty,
	.datavis-chart__fallback {
		margin: 0;
		padding: 1rem 1.125rem;
		border: 1px dashed color-mix(in srgb, var(--datavis-filter-panel-border) 88%, transparent);
		border-radius: var(--datavis-filter-radius);
		background: rgb(255 255 255 / 3%);
		color: var(--datavis-filter-text-muted);
		font-size: 0.9375rem;
		line-height: 1.5;
	}

	@media (width <= 1024px) {
		.datavis-filters__grid {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		.datavis-filters__field--date-range {
			grid-column: 1 / -1;
		}

		.datavis-chart__canvas-wrap {
			min-block-size: 18rem;
		}
	}

	@media (width <= 767px) {
		.datavis-page {
			padding-block: 2rem 1.5rem;
		}

		.datavis-page__header-copy {
			gap: 0.5rem;
		}

		.datavis-page__subtitle {
			font-size: 0.875rem;
			line-height: 1.3;
		}

		.datavis-page__body {
			gap: 1.25rem;
		}

		.datavis-filters__panel {
			padding: 1rem 1rem 1.125rem;
		}

		.datavis-chart {
			padding: 1rem;
		}

		.datavis-page .datavis-chart button.datavis-chart__legend-item {
			inline-size: 100%;
		}

		.datavis-chart__canvas-wrap {
			aspect-ratio: 16 / 5;
			min-block-size: 14rem;
			max-block-size: 16.5rem;
		}

		.datavis-filters__header {
			gap: 0.75rem;
		}

		.datavis-filters__title {
			font-size: 1.35rem;
		}

		.datavis-filters__grid {
			grid-template-columns: minmax(0, 1fr);
		}

		.datavis-filters__field--visualisation {
			grid-column: 1 / -1;
		}

		.datavis-filters__date-row {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}

		.datavis-filters__submit {
			grid-column: 1 / -1;
			inline-size: 100%;
		}

		.datavis-filters__footer {
			justify-content: stretch;
		}

		.datavis-filters .datavis-filters__footer :is(button, a).datavis-filters__reset {
			display: block;
			inline-size: 100%;
			text-align: center;
		}
	}