.toc {
	padding-bottom: var(--space-m);
	& div.toc {
		background-color: var(--contrast-color-tint);
		border-radius: var(--large-rounded-radius);
		border-top-left-radius: 0;
		color: var(--contrast-color);
		font-family: var(--font-family-ui);
		font-variation-settings: "wght" 360;
		margin-left: 0;
		margin-right: 0;
		padding: var(--space-s) var(--space-l) var(--space-m) var(--space-m);
	}
	& ol {
		margin-bottom: 0;
		margin-top: 0;
		padding-left: var(--space-m);
		& li {
			font-size: var(--step--1);
			& a {
				text-decoration: none;
			}
		}
	}
	&[open] {
		& summary::marker {
			content: "✸ ";
			font-size: var(--step--1);
		}
	}
	& summary {
		cursor: pointer;
		font-family: var(--font-family-ui);
		font-size: var(--step--2);
		font-variation-settings: "wght" 700;
		letter-spacing: var(--wide-letter-spacing);
		margin-left: -1.5em;
		text-transform: uppercase;
		&::marker {
			color: var(--contrast-color);
			content: "✸ ";
			font-size: var(--step--1);
			padding-top: 1em;
		}
	}
}