html {
	--neutral: 0, 0%;
	--treshold: 60%;
	--hue: 240;
	--analog: calc(var(--hue) + 30);
	--right: 150;
	--wrong: calc(var(--right) + 180);
	--light-scale: 1.61803398875;
	--lightness: 30%;
	--brighter: calc(var(--lightness)*var(--light-scale));
	--darker: calc(var(--lightness)/var(--light-scale));
	--switch: calc((var(--lightness) - var(--treshold))*-100);
	--secondary: var(--hue), 100%, var(--lightness);
	--secondary-dark: var(--hue), 100%, var(--darker);
	--accent: var(--analog), 50%, var(--lightness);
	--accent-dark: var(--analog), 50%, var(--darker);
	--alert: var(--wrong), 100%, var(--lightness);
	--alert-light: var(--wrong), 100%, var(--brighter);
	--success: var(--right), 100%, var(--lightness);
	--success-light: var(--right), 100%, var(--brighter);
	--success-dark: var(--right), 100%, var(--darker);
	--contrast: var(--neutral), var(--switch);
	--contrast-inverse: var(--neutral), calc(var(--switch)*-1);
	--muted: var(--neutral), var(--lightness);
	--muted-light: var(--neutral), var(--brighter);
	--muted-dark: var(--neutral), var(--darker);
	--background: var(--neutral), 96%;
	--enter: cubic-bezier(0, .5, .5, 1);
	--exit: cubic-bezier(.5, 0, 1, .5);
	--external: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M91.875 62H85v23H15V15h23V0H0v100h100V62z'/%3E%3Cpath d='M54 0v.627l17.787 17.85L52.701 38H38v24h24V49.799l20.773-20.337L99.374 46H100V0z'/%3E%3C/svg%3E");
	--select: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 59 47.5'%3E%3Cpath d='M29.414 37.657.344 8.586 8.828.102l20.586 20.584L50 .1l8.484 8.485-29.07 29.072'/%3E%3C/svg%3E");
	--invalid: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 125'%3E%3Cpath fill='hsl(var(--alert))' d='M74.749 11.109 50 35.858 25.251 11.109 11.109 25.251 35.858 50 11.109 74.749l14.142 14.142L50 64.142l24.749 24.749 14.142-14.142L64.142 50l24.749-24.749z'/%3E%3C/svg%3E");
	/*color-scheme: light dark*/
}
@media screen and (min-width:37.5em) {
	html {
		--light-scale: 1.25;
		--lightness: 40%
	}
} /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ html {
	-webkit-text-size-adjust: 100%;
	line-height: 1.15
}

.graphique-container .td-empty::before {
	display: none;
}

.graphique-container a {
	background-color: #0000
}
.graphique-container abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	-webkit-text-decoration: underline dotted;
	text-decoration: underline dotted
}
.graphique-container b,
.graphique-container strong {
	font-weight: bolder
}
.graphique-container code {
	font-family: monospace, monospace;
	font-size: 1em
}
.graphique-container small {
	font-size: 80%
}
.graphique-container sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: initial
}
.graphique-container sup {
	top: -.5em
}
.graphique-container img {
	border-style: none
}
.graphique-container button {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0
}
.graphique-container button {
	overflow: visible
}
.graphique-container button {
	text-transform: none
}
.graphique-container [type=button],
.graphique-container button {
	-webkit-appearance: button
}
.graphique-container [type=button]::-moz-focus-inner,
.graphique-container button::-moz-focus-inner {
	border-style: none;
	padding: 0
}
.graphique-container [type=button]:-moz-focusring,
.graphique-container button:-moz-focusring {
	outline: 1px dotted ButtonText
}
.graphique-container fieldset {
	padding: .35em .75em .625em
}
.graphique-container legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal
}
.graphique-container [type=number]::-webkit-inner-spin-button,
.graphique-container [type=number]::-webkit-outer-spin-button {
	height: auto
}
.graphique-container [type=search] {
	-webkit-appearance: textfield;
	outline-offset: -2px
}
.graphique-container [type=search]::-webkit-search-decoration {
	-webkit-appearance: none
}
.graphique-container ::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit
}
.graphique-container details {
	display: block
}
.graphique-container summary {
	display: list-item
} /*! PrismJS 1.11.0
http://prismjs.com/download.html?themes=prism-dark&languages=markup+css+clike+javascript+bash+css-extras+git+json+markdown+php+php-extras+scss */
.graphique-container .token.cdata,
.graphique-container .token.comment,
.graphique-container .token.doctype,
.graphique-container .token.prolog,
.graphique-container .token.punctuation {
	color: hsl(var(--background))
}
.graphique-container .namespace {
	opacity: .7
}
.graphique-container .token.boolean,
.graphique-container .token.constant,
.graphique-container .token.number,
.graphique-container .token.property,
.graphique-container .token.symbol,
.graphique-container .token.tag {
	color: hsl(var(--success-light))
}
.graphique-container .token.attr-name,
.graphique-container .token.builtin,
.graphique-container .token.char,
.graphique-container .token.inserted,
.graphique-container .token.selector,
.graphique-container .token.string {
	color: hsl(var(--contrast))
}
.graphique-container .language-css .token.string,
.graphique-container .style .token.string,
.graphique-container .token.entity,
.graphique-container .token.operator,
.graphique-container .token.url,
.graphique-container .token.variable {
	color: orange
}
.graphique-container .token.atrule,
.graphique-container .token.attr-value,
.graphique-container .token.keyword {
	color: hsl(var(--success-light))
}
.graphique-container .token.important,
.graphique-container .token.regex {
	color: hsl(var(--alert-light))
}
.graphique-container .token.bold,
.graphique-container .token.important {
	font-weight: 700
}
.graphique-container .token.italic {
	font-style: italic
}
.graphique-container .token.entity {
	cursor: help
}
.graphique-container .token.deleted {
	color: hsl(var(--alert));
	text-decoration: line-through
}
/*html[lang] {
	box-sizing: border-box;
	overflow-y: scroll;
	overflow: -moz-scrollbars-vertical;
	position: relative;
	scroll-behavior: smooth
}*/
.graphique-container *,
.graphique-container :after,
.graphique-container :before {
	box-sizing: inherit
}
.pie-container {
	-webkit-font-smoothing: subpixel-antialiased;
	/*background: hsl(var(--background));*/
	color: hsl(var(--muted-dark));
	counter-reset: footnotes;
	font: normal 400 1em/1.5 sans-serif;
	font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
	overflow-x: hidden;
	position: relative;
	text-rendering: optimizeSpeed
}
.graphique-container ::selection {
	background-color: hsl(var(--accent));
	color: hsl(var(--background));
	text-shadow: none
}
.graphique-container ::placeholder {
	color: hsl(var(--muted))
}
.pie-container:hover [tabindex="-1"]:focus {
	outline-color: #0000
}
.graphique-container a {
	-webkit-text-decoration-skip: ink;
	color: hsl(var(--secondary));
	outline: .125rem solid #0000;
	outline-offset: 2rem;
	text-decoration-skip-ink: auto;
	text-decoration-style: dotted;
	transition: outline-offset .3s var(--enter)
}
.graphique-container a:focus,
.graphique-container a:hover {
	color: hsl(var(--secondary-dark))
}
.graphique-container a:active {
	opacity: .75;
	transition: none
}
.graphique-container a:visited {
	color: hsl(var(--success-dark))
}
.graphique-container a[target$=blank]:after {
	content: "";
	display: inline-block;
	margin: 0 .25em 0 0
}
.graphique-container a[target$=blank]:after {
	content: "🗗";
	margin: 0 0 0 .25em
}
@supports((-webkit-mask-image:url()) or (mask-image:url())) {
	.graphique-container a[target$=blank]:after {
		background: currentColor;
		content: "";
		height: .625em;
		-webkit-mask-position: center center;
		mask-position: center center;
		-webkit-mask-repeat: no-repeat;
		mask-repeat: no-repeat;
		width: .625em
	}
	.graphique-container a[target$=blank]:after {
		-webkit-mask-image: var(--external);
		mask-image: var(--external)
	}
}
.graphique-container code,
.graphique-container pre,
.graphique-container svg {
	max-width: 100%
}
.graphique-container a svg,
.graphique-container button svg {
	pointer-events: none
}
.pie-container {
	margin: 0 auto;
	outline-color: #0000
}
@media screen and (prefers-reduced-motion:reduce) {
	.graphique-container * {
		animation-duration: 0s !important;
		scroll-behavior: auto !important;
		transition: none !important
	}
}
@media screen and (-ms-high-contrast:active) {
	.graphique-container a svg,
	.graphique-container button svg {
		fill: Highlight;
		background: none;
		border-color: Highlight
	}
}
.graphique-container caption,
.graphique-container dl,
.graphique-container ol,
.graphique-container p,
.graphique-container pre,
.graphique-container td,
.graphique-container th,
.graphique-container ul {
	font-size: 1em;
	line-height: 1.5;
	margin: 1.5em 0
}
.graphique-container .h1,
.graphique-container .h2,
.graphique-container .h3,
.graphique-container .h4,
.graphique-container .h5,
.graphique-container b,
.graphique-container cite,
.graphique-container h1,
.graphique-container h2,
.graphique-container h3,
.graphique-container h4,
.graphique-container h5,
.graphique-container strong {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: hsl(var(--contrast-inverse));
	font-weight: 700;
	text-rendering: optimizelegibility
}
.graphique-container .h1:first-child,
.graphique-container .h2:first-child,
.graphique-container .h3:first-child,
.graphique-container .h4:first-child,
.graphique-container .h5:first-child,
.graphique-container b:first-child,
.graphique-container cite:first-child,
.graphique-container h1:first-child,
.graphique-container h2:first-child,
.graphique-container h3:first-child,
.graphique-container h4:first-child,
.graphique-container h5:first-child,
.graphique-container strong:first-child {
	margin-top: 0
}
.graphique-container .h1,
.graphique-container h1 {
	color: hsl(var(--secondary));
	font-size: 2.875em;
	line-height: 1.0434;
	margin: 1.0434782609em 0 .5217391304em
}
.graphique-container .h1 strong,
.graphique-container h1 strong {
	color: hsl(var(--muted-dark))
}
.graphique-container .h2,
.graphique-container h2 {
	color: hsl(var(--accent));
	font-size: 2.5em;
	line-height: 1.2;
	margin: 1.2em 0 .6em
}
.graphique-container .h3,
.graphique-container h3 {
	color: hsl(var(--muted-dark));
	font-size: 2.25em;
	line-height: 1.3334;
	margin: 1.3333333333em 0 .6666666667em
}
.graphique-container .h4,
.graphique-container h4 {
	font-size: 1.875em;
	line-height: 1.6;
	margin: 1.6em 0 .8em
}
.graphique-container .h5,
.graphique-container h5 {
	font-size: 1.625em;
	line-height: 1.8462;
	margin: 1.8461538462em 0 .9230769231em
}
.graphique-container div,
.graphique-container li,
.graphique-container p,
table.pie-container,
.graphique-container table,
.graphique-container td,
.graphique-container th {
	word-wrap: break-word;
	-webkit-hyphens: auto;
	hyphens: auto
}
.graphique-container li,
.graphique-container p {
	-ms-hyphenate-limit-chars: 6 3 2;
	-ms-hyphenate-limit-lines: 2;
	-ms-hyphenate-limit-last: always;
	-ms-hyphenate-limit-zone: 8%;
	hyphenate-limit-chars: 6 3 2;
	hyphenate-limit-lines: 2;
	hyphenate-limit-last: always;
	hyphenate-limit-zone: 8%
}
.graphique-container li ol,
.graphique-container li p,
.graphique-container li ul {
	margin-bottom: 0;
	margin-top: 0
}
.graphique-container abbr[aria-label] {
	border-bottom: 1px dotted;
	cursor: help;
	text-decoration: none;
	text-transform: uppercase
}
@media screen and (max-width:1270px) {
	.graphique-container td > abbr {
		display: none;
	}
}
.graphique-container .landscape-container,
.graphique-container .toosmall-container {
	display: none;
    padding: 0 1rem;
}
.graphique-container .landscape-container p,
.graphique-container .toosmall-container p {
    hyphens: none;
    text-align: center;
}
.graphique-container .landscape-container img {
	margin-bottom: 1rem;
}
@media screen and (max-width:800px) {
	.graphique-container .line-container {
		display: none;
	}
	.graphique-container .landscape-container {
		display: block;
	}
}
@media screen and (max-width:799px) and (orientation: landscape) {
	.graphique-container .toosmall-container {
		display: block;
	}
	.graphique-container .landscape-container {
		display: none;
	}
}

.graphique-container .small,
.graphique-container small {
	font-size: .875em
}
.graphique-container cite {
	color: hsl(var(--accent));
	font-style: normal
}
.graphique-container code,
.graphique-container var {
	font: inherit;
	line-height: 1
}
.graphique-container pre {
	word-wrap: normal;
	background: hsl(var(--muted-dark));
	border: 0;
	border-radius: .25em;
	color: hsl(var(--contrast));
	direction: ltr;
	font-family: Fira Mono, Consolas, Monaco, Andale Mono, monospace;
	font-size: small;
	-webkit-hyphens: none;
	hyphens: none;
	line-height: 1.5;
	overflow-x: auto;
	padding: 2em 1em .5em;
	tab-size: 4;
	text-align: left;
	white-space: pre;
	word-break: normal;
	word-spacing: normal
}
.graphique-container pre:before {
	background: hsl(var(--alert));
	border-radius: 50%;
	box-shadow: 1.5em 0 0 0 orange, 3em 0 0 0 hsl(var(--success));
	content: "";
	display: block;
	height: 1rem;
	transform: translateY(-1rem);
	width: 1rem
}
.graphique-container :not(pre) > code,
.graphique-container :not(pre) > var {
	border: 1px solid;
	border-radius: .2em;
	color: hsl(var(--accent));
	display: inline-block;
	font-family: inherit;
	padding: .1em;
	white-space: nowrap
}
.graphique-container :not(pre) > var {
	background: hsl(var(--contrast));
	border-style: dashed;
	color: hsl(var(--accent-dark))
}
.graphique-container dl {
	margin: 0
}
.graphique-container figure dl + figcaption {
	text-align: center
}
.graphique-container img[alt] {
	display: inline-block;
	font-size: 0;
	max-width: 100%;
	vertical-align: middle
}
.graphique-container img[alt]:not([src$=".svg"]) {
	height: auto
}
.graphique-container img[alt]:after {
	background: hsl(var(--contrast));
	content: attr(alt) "\a""— "attr(src);
	display: block;
	font-size: 1rem;
	padding: .5rem;
	white-space: pre-wrap;
	width: 100%
}
.graphique-container svg {
	fill: currentColor
}
.graphique-container figure {
	background: hsl(var(--contrast));
	margin: 1rem auto;
	max-width: 100%;
	overflow: hidden;
	padding: 1rem
}
.graphique-container figure figcaption {
	display: block;
	font-size: .875em;
	padding: 1rem 0
}
@media screen and (min-width:37.5em) {
	.graphique-container figure {
		min-width: 37.5em;
		width: min-content
	}
	.graphique-container figure img {
		min-width: min-content
	}
	.graphique-container [class*=columns] figure,
	.graphique-container [class*=grid] figure,
	.graphique-container li figure {
		min-width: 0;
		width: auto
	}
	.graphique-container [class*=columns] figure img,
	.graphique-container [class*=grid] figure img,
	.graphique-container li figure img {
		min-width: 0
	}
}
@media(inverted-colors) {
	.graphique-container img {
		filter: invert(100%)
	}
}
@media screen and (-ms-high-contrast:active) {
	.graphique-container img {
		filter: brightness(1) contrast(1) saturate(1.5)
	}
}
table.pie-container {
	font-feature-settings: "tnum";
	border-collapse: collapse;
	caption-side: top;
	margin-bottom: 1.5rem;
	vertical-align: top;
	width: 100%
}
table.graphique-container > caption:first-child {
	font-style: italic;
	margin: 0;
	padding: 2.5rem 1rem
}
.graphique-container td,
.graphique-container th {
	padding: .5rem .75rem;
	text-align: left
}
table .graphique-container strong,
.graphique-container th {
	color: hsl(var(--contrast-inverse))
}
.graphique-container td {
	line-height: 1.25;
	max-width: 100%
}
.graphique-container tbody {
	border: 1px solid hsl(var(--muted-dark))
}
.graphique-container thead {
	border: 1px solid hsl(var(--contrast-inverse))
}
.pie-container {
	/*background: linear-gradient(90deg, #fff 30%, #fff0), linear-gradient(90deg, #fff0, #fff 70%) 0 100%, radial-gradient(farthest-side at 0 50%, #0003, #0000), radial-gradient(farthest-side at 100% 50%, #0003, #0000) 0 100%;
	background-attachment: local, local, scroll, scroll;
	background-color: var(--contrast);*/
	background-position: 0 0, 100%, 0 0, 100%;
	background-repeat: no-repeat;
	background-size: 2.5rem 100%, 2.5rem 100%, 1rem 100%, 1rem 100%;
	max-width: 100%;
	overflow-x: auto;
	overflow-y: hidden
}
.graphique-container details {
	border: .25em solid hsl(var(--contrast-inverse))
}
.graphique-container details + details {
	border-top-width: 0
}
.graphique-container details summary {
	background: hsl(var(--muted-dark));
	color: hsl(var(--contrast));
	cursor: pointer;
	padding: 1rem;
	transition: background .2s var(--enter)
}
.graphique-container details summary:focus,
.graphique-container details summary:hover {
	background: hsl(var(--contrast-inverse))
}
.graphique-container details summary ~ * {
	margin: 1.5rem 1rem 0
}
.graphique-container details[open] summary ~ * {
	animation: slide-down .5s var(--enter)
}
@keyframes slide-down {
	0%, 50% {
		opacity: 0;
		transform: translateY(1.5em)
	}
}
@media screen and (min-width:30em) {
	@supports(--css: var(--iables)) {
		.graphique-container .vertical {
			display: flex
		}
		.graphique-container .vertical details {
			flex: 0;
			min-width: 3.5em;
			overflow: hidden
		}
		.graphique-container .vertical details + details {
			border-width: .25em .25em .25em 0
		}
		.graphique-container .vertical details summary {
			float: left;
			min-height: 20em;
			writing-mode: vertical-lr;
			writing-mode: sideways-lr
		}
		.graphique-container .vertical details summary ~ * {
			padding-left: 3.5em
		}
		.graphique-container .vertical details summary ~ * > :first-child {
			margin-top: 0
		}
		.graphique-container .vertical details[open] {
			flex: 1
		}
		.graphique-container .vertical details[open] summary ~ * {
			animation: slide-in .5s var(--enter)
		}
	}
}
@keyframes slide-in {
	0%, 50% {
		opacity: 0;
		transform: translateX(-1.5em)
	}
}
.graphique-container label[for] {
	vertical-align: middle
}
.graphique-container button {
	border-radius: .25rem;
	font-family: inherit;
	font-size: 1em;
	padding: .5rem
}
.graphique-container .fieldset,
.graphique-container fieldset,
.graphique-container form {
	max-width: 37.5em
}
.graphique-container form > * + * {
	margin-top: 3em
}
.graphique-container .fieldset,
.graphique-container fieldset {
	border: 0;
	/*margin: 1rem auto 2rem;*/
	margin: 1rem auto 0rem;
	padding: 0
}
.graphique-container .fieldset > div,
.graphique-container .fieldset > p,
.graphique-container fieldset > div,
.graphique-container fieldset > p,
.graphique-container legend:first-child {
	margin-bottom: inherit
}
.graphique-container legend:first-child {
	font-weight: 700
}
.graphique-container label[for] {
	display: block
}
.graphique-container .button,
.graphique-container button,
.graphique-container label[for] {
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer
}
.graphique-container form [disabled] {
	cursor: not-allowed
}
.graphique-container ::-ms-clear {
	display: none
}
.graphique-container [type=search]::-webkit-search-cancel-button,
.graphique-container [type=search]::-webkit-search-decoration,
.graphique-container [type=search]::-webkit-search-results-button,
.graphique-container [type=search]::-webkit-search-results-decoration {
	display: none
}
.graphique-container .button,
.graphique-container button {
	-webkit-appearance: none;
	appearance: none;
	background-color: hsl(var(--accent));
	border: 1px solid hsl(var(--accent));
	border-radius: .25rem;
	color: hsl(var(--contrast));
	font-family: inherit;
	font-size: 1em;
	line-height: 1.5;
	margin: .5rem 0;
	padding: .5rem;
	transition: all .3s var(--move);
	vertical-align: middle;
	width: auto
}
.graphique-container .button:hover,
.graphique-container button:hover {
	background-color: hsl(var(--accent-light));
	border: 1px solid hsl(var(--accent-light))
}
.graphique-container .button:active,
.graphique-container .button:focus,
.graphique-container button:active,
.graphique-container button:focus {
	background-color: hsl(var(--accent-dark));
	border: 1px solid hsl(var(--accent-dark))
}
.graphique-container .button:focus,
.graphique-container button:focus {
	box-shadow: 0 0 0 .125rem hsla(var(--accent-light), .25);
	outline-color: #0000
}
.graphique-container .button:active,
.graphique-container button:active {
	transform: translateY(.125rem)
}
.graphique-container .button[disabled],
.graphique-container .button[disabled]:active,
.graphique-container .button[disabled]:focus,
.graphique-container .button[disabled]:hover,
.graphique-container button[disabled],
.graphique-container button[disabled]:active,
.graphique-container button[disabled]:focus,
.graphique-container button[disabled]:hover {
	background-color: hsl(var(--muted-dark));
	box-shadow: none;
	color: hsl(var(--background));
	cursor: not-allowed;
	pointer-events: none
}
.graphique-container .no-margin {
	margin: 0 !important
}
.graphique-container .no-padding {
	padding: 0 !important
}
.graphique-container .no-border {
	border: 0 !important
}
.graphique-container .no-list {
	list-style: none !important;
	padding: 0
}
.graphique-container .no-event {
	pointer-events: none !important
}
.graphique-container .ml-auto {
	margin-left: auto !important
}
.graphique-container .no-background {
	background: none !important
}
.graphique-container .ml-1 {
	margin-left: 1rem !important
}
.graphique-container .p-relative {
	position: relative !important
}
.graphique-container .d-flex {
	align-items: center;
	display: flex !important;
	flex-wrap: wrap
}
.graphique-container .fw-400 {
	font-weight: 400 !important
}
@media screen and (max-width:29.9375em) {
	.graphique-container .sm-hidden {
		display: none !important
	}
}
.graphique-container [class*="--s"] {
	font-size: .875rem;
	line-height: 1.5
}
.graphique-container [class*="--l"] {
	font-size: 1.25rem;
	line-height: 1.05
}
.graphique-container .sr-only {
	clip: rect(1px, 1px, 1px, 1px) !important;
	border: 0 !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	white-space: nowrap !important;
	width: 1px !important
}
.graphique-container .sr-only-focusable:active,
.graphique-container .sr-only-focusable:focus {
	clip: auto !important;
	clip-path: none !important;
	height: auto !important;
	overflow: visible !important;
	white-space: normal !important;
	width: auto !important
}
.pie-container > * {
	/*background: hsla(var(--background), .75);*/
	margin: 0 auto;
	max-width: 64em;
	padding: 1rem
}
.graphique-container [class*=columns] > *,
.graphique-container [class*=grid] > * {
	display: inline-block;
	margin-bottom: 2rem;
	max-width: 100%
}
@media screen and (min-width:37.5em) {
	.graphique-container [class*=columns],
	.graphique-container [class*=grid] {
		column-gap: 2rem;
		orphans: 1;
		widows: 1
	}
	.graphique-container [class*=columns] > *,
	.graphique-container [class*=grid] > * {
		break-inside: avoid;
		page-break-inside: avoid
	}
	.graphique-container .grid-2 {
		column-count: 2
	}
	.graphique-container .grid-1-2,
	.graphique-container .grid-2-1,
	.graphique-container .grid-3 {
		column-count: 3
	}
	.graphique-container .grid-1-3,
	.graphique-container .grid-3-1,
	.graphique-container 	.grid-4 {
		column-count: 4
	}
	@supports(display:grid) {
		.graphique-container [class*=grid] {
			grid-gap: 2rem;
			display: grid;
			width: 100%
		}
		.graphique-container .grid-2 {
			grid-template-columns: repeat(2, [col] 1fr)
		}
		.graphique-container .grid-1-2,
		.graphique-container .grid-2-1,
		.graphique-container .grid-3 {
			grid-template-columns: repeat(3, [col] 1fr)
		}
		.graphique-container .grid-1-3,
		.graphique-container .grid-3-1,
		.graphique-container .grid-4 {
			grid-template-columns: repeat(4, [col] 1fr)
		}
		.graphique-container .grid-1-2 > :nth-child(2n) {
			grid-column: 2/span 2
		}
		.graphique-container .grid-2-1 > :nth-child(odd) {
			grid-column: 1/span 2
		}
		.graphique-container .grid-1-3 > :nth-child(2n) {
			grid-column: 2/span 3
		}
		.graphique-container .grid-3-1 > :nth-child(odd) {
			grid-column: 1/span 3
		}
	}
}
.graphique-container header .sr-only-focusable {
	left: 1rem
}
.graphique-container nav ul {
	align-items: center;
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0
}
.graphique-container nav a {
	padding: .5em 1em
}
.graphique-container nav a[aria-current] {
	color: hsl(var(--accent))
}
.graphique-container nav a[aria-current],
.graphique-container nav a[aria-current]:active,
.graphique-container nav a[aria-current]:focus,
.graphique-container nav a[aria-current]:hover {
	border-bottom: .25em solid
}
.graphique-container nav button[aria-current] {
	color: hsl(var(--accent))
}
.graphique-container nav > ul > li + li {
	margin-left: 1rem
}
.graphique-container .note {
	background: hsl(var(--contrast));
	border-left: 1rem solid;
	color: hsl(var(--muted-dark));
	margin: 1rem 0;
	padding: .5rem 1rem .25rem
}
.graphique-container .note :not(pre) {
	color: inherit
}
@keyframes footnotes {
	0% {
		color: hsl(var(--secondary))
	}
}
.graphique-container [role=note]:target {
	animation: footnotes .5s var(--enter)
}
.graphique-container .tooltip {
	display: inline-block;
	position: relative
}
.graphique-container .tooltip button {
	margin: 0
}
.graphique-container [role=tooltip] {
	--arrow: calc(100% - 0.25rem);
	background: hsl(var(--muted-dark));
	bottom: calc(100% + .5em);
	clip-path: polygon(0 0, 100% 0, 100% var(--arrow), calc(50% - .25rem) var(--arrow), 50% 100%, calc(50% + .25rem) var(--arrow), 0 var(--arrow));
	color: hsl(var(--background));
	left: 50%;
	margin: 0;
	opacity: 0;
	padding: .25em .5em .5em;
	pointer-events: none;
	position: absolute;
	transform: perspective(1000px) rotateX(45deg) translateX(-50%);
	transform-origin: 50% calc(100% + 10px);
	transition: opacity .2s var(--enter), transform .2s var(--enter), visibility 0s linear .2s;
	visibility: hidden;
	white-space: nowrap
}
.graphique-container .tooltip button:active + [role=tooltip],
.graphique-container .tooltip button:focus + [role=tooltip],
.graphique-container .tooltip button:hover + [role=tooltip],
.graphique-container .tooltip:focus-within [role=tooltip] {
	opacity: 1;
	pointer-events: auto;
	transform: perspective(1000px) rotateX(0deg) translateX(-50%);
	transition: opacity .2s var(--exit), transform .2s var(--exit);
	visibility: visible
}
.graphique-container .card {
	--background: hsl(var(--contrast));
	--border: hsl(var(--muted-light));
	--color: hsl(var(--muted-dark));
	--shadow: hsla(var(--muted-dark), .25);
	background: var(--background);
	border: 1px solid var(--border);
	border-radius: .25em;
	color: var(--color);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	position: relative;
	transition: box-shadow .3s var(--enter)
}
.graphique-container .card:focus-within,
.graphique-container .card:hover {
	box-shadow: 0 0 0 .25rem var(--shadow)
}
.graphique-container .fly-out,
.graphique-container .fly-out ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	list-style: none;
	margin: 0;
	padding: 0
}
.graphique-container .fly-out a,
.graphique-container .fly-out button {
	background: hsl(var(--contrast));
	border: 0;
	border-radius: 0;
	color: hsl(var(--secondary));
	display: block;
	margin: 0;
	outline: .125rem solid #0000;
	outline-offset: 2rem;
	padding: .5rem 1rem;
	text-decoration: none;
	transition: outline-offset .3s var(--enter);
	white-space: nowrap
}
.graphique-container .fly-out a:active,
.graphique-container .fly-out a:focus,
.graphique-container .fly-out a:hover,
.graphique-container .fly-out button:active,
.graphique-container .fly-out button:focus,
.graphique-container .fly-out button:hover {
	background: hsl(var(--background));
	border: 0;
	color: hsl(var(--secondary-dark))
}
.graphique-container .fly-out a:focus,
.graphique-container .fly-out button:focus {
	box-shadow: none;
	outline: .125rem solid currentColor;
	outline-offset: 0
}
.graphique-container .fly-out > * {
	background: hsl(var(--contrast));
	margin: .5rem;
	position: relative;
	z-index: 1
}
.graphique-container .fly-out > :hover {
	z-index: 2
}
.graphique-container .fly-out > * > a:active,
.graphique-container .fly-out > * > a:focus,
.graphique-container .fly-out > * > a:hover,
.graphique-container .fly-out > * > button:active,
.graphique-container .fly-out > * > button:focus,
.graphique-container .fly-out > * > button:hover {
	background: none
}
.graphique-container .fly-out > * > button {
	padding-right: 1rem
}
.graphique-container .fly-out > * > button:after {
	content: "↓";
	display: inline-block;
	padding-left: .5rem;
	transition: transform .3s var(--enter) .5s;
	will-change: transform
}
.graphique-container .fly-out ul {
	clip: rect(0, 2rem, 2rem, 0);
	align-items: flex-start;
	background: inherit;
	flex-direction: column;
	font-size: inherit;
	min-width: 100%;
	padding-top: 2.5em;
	position: absolute;
	top: 0;
	transition: clip .3s var(--enter) .5s;
	will-change: clip;
	z-index: -1
}
.graphique-container .fly-out ul li {
	min-width: inherit
}
.graphique-container .fly-out ul a,
.graphique-container .fly-out ul button {
	padding: .5rem 1rem
}
.graphique-container .fly-out > * > button:active + ul,
.graphique-container .fly-out > * > button:focus + ul,
.graphique-container .fly-out > * > button:hover + ul,
.graphique-container .fly-out > :hover > ul {
	clip: auto;
	box-shadow: .25em .25em 0 0 hsla(var(--muted-dark), .25);
	outline: 1px solid hsl(var(--muted-light));
	transition: clip .3s var(--exit)
}
.graphique-container .fly-out > * > button:active:after,
.graphique-container .fly-out > * > button:focus:after,
.graphique-container .fly-out > * > button:hover:after,
.graphique-container .fly-out > :hover > button:after {
	transform: rotateX(.5turn);
	transition: transform .3s var(--exit)
}
@supports(clip-path:circle(150% at top right)) {
	@media screen and (min-width: 30em) {
		.graphique-container .fly-out,
		.graphique-container .fly-out ul {
			justify-content: normal
		}
		.graphique-container .fly-out > :focus-within {
			z-index: 2
		}
		.graphique-container .fly-out > :focus-within button {
			background: none
		}
		.graphique-container .fly-out ul {
			clip: auto;
			clip-path: circle(1.125em at left top);
			transition: clip-path .3s var(--enter) .5s;
			will-change: clip-path
		}
		.graphique-container .fly-out > * > button:active + ul,
		.graphique-container .fly-out > * > button:focus + ul,
		.graphique-container .fly-out > * > button:hover + ul,
		.graphique-container .fly-out > :focus-within > ul,
		.graphique-container .fly-out > :hover > ul {
			box-shadow: .25em .25em 0 0 hsla(var(--muted-dark), .25);
			clip-path: circle(150% at top right);
			outline: 1px solid hsl(var(--muted-light));
			transition: clip-path .3s var(--exit)
		}
		.graphique-container .fly-out > :focus-within > button:after {
			transform: rotateX(.5turn);
			transition: transform .3s var(--exit)
		}
	}
}
.graphique-container button[role=switch] {
	background-color: hsla(var(--muted), .1);
	border-radius: 1.375rem !important;
	box-sizing: initial;
	color: hsl(var(--muted-dark));
	height: 2.75rem;
	line-height: 2.75rem;
	outline-color: #0000;
	padding: 0 3rem;
	transition: all .3s var(--enter);
	width: 4.75rem;
	will-change: background-color
}
.graphique-container button[role=switch]:before {
	background: currentColor;
	border-radius: 1.375rem;
	content: "";
	height: 2.375rem;
	left: .25rem;
	position: absolute;
	top: .25rem;
	transform: none;
	transition: transform .3s var(--enter) 0s;
	width: 2.375rem;
	will-change: transform
}
.graphique-container button[role=switch]:active,
.graphique-container button[role=switch]:focus,
.graphique-container button[role=switch]:hover {
	background-color: hsla(var(--muted), .075);
	color: hsl(var(--contrast-inverse))
}
.graphique-container button[role=switch][aria-checked=true] {
	background-color: hsla(var(--success-light), .25)
}
.graphique-container button[role=switch][aria-checked=true]:before {
	background: hsl(var(--success-dark));
	transform: translateX(7.875rem)
}
.graphique-container button[role=switch][aria-checked=true]:focus {
	box-shadow: 0 0 0 .125rem hsla(var(--success-dark), .25)
}
.graphique-container button[role=switch] > :first-child,
.graphique-container button[role=switch][aria-checked=true] > :last-child {
	display: none
}
.graphique-container button[role=switch][aria-checked=true] > :first-child {
	display: block
}
.graphique-container pre[data-line] {
	position: relative
}
.graphique-container .line-highlight {
	background: #fff;
	left: 0;
	line-height: inherit;
	margin-top: 3.15em;
	mix-blend-mode: soft-light;
	padding: .25em;
	pointer-events: none;
	position: absolute;
	right: 0;
	white-space: pre
}
.graphique-container .line-highlight:before {
	color: #000;
	content: attr(data-start);
	font-weight: 700;
	left: .5em;
	min-width: 1ch;
	position: absolute;
	top: .4em
}
.graphique-container .mb-0 {
	margin-bottom: 0 !important
}
.graphique-container .pb-0 {
	padding-bottom: 0 !important
}
.graphique-container .fly-out [rel]:before {
	content: "🌍 "
}
.graphique-container details[open] > summary ~ * {
	box-sizing: border-box
}