/* Dark mode colors. */
:root {
	--sl-color-accent-low: #3f1505;
	--sl-color-accent: #b43c00;
	--sl-color-accent-high: #f2b9a6;
	--sl-color-white: #ffffff;
	--sl-color-gray-1: #eeeeee;
	--sl-color-gray-2: #c2c2c2;
	--sl-color-gray-3: #8b8b8b;
	--sl-color-gray-4: #585858;
	--sl-color-gray-5: #383838;
	--sl-color-gray-6: #272727;
	--sl-color-black: #181818;
	--yellow-hsl: 43.3,96.4%,56.3%;
    --overlay-yellow: hsla(var(--yellow-hsl), .2);
	--backdrop-color: #272727cc;
}
/* Light mode colors. */
:root[data-theme='light'] {
	--sl-color-accent-low: #f7ccbd;
	--sl-color-accent: #b73d00;
	--sl-color-accent-high: #5a1a00;
	--sl-color-white: #181818;
	--sl-color-gray-1: #272727;
	--sl-color-gray-2: #383838;
	--sl-color-gray-3: #585858;
	--sl-color-gray-4: #8b8b8b;
	--sl-color-gray-5: #c2c2c2;
	--sl-color-gray-6: #eeeeee;
	--sl-color-gray-7: #f6f6f6;
	--sl-color-black: #ffffff;
	--yellow-hsl: 47.9,95.8%,53.1%;
	--backdrop-color: #F6F6F699;
}

.page {
    background: linear-gradient(215deg, var(--overlay-yellow), transparent 40%), radial-gradient(var(--overlay-yellow), transparent 40%) no-repeat center center / cover, radial-gradient(var(--overlay-yellow), transparent 65%) no-repeat center center / cover;
    background-blend-mode: overlay;
}

header {
	backdrop-filter: blur(12px) !important;
    background-color: var(--backdrop-color) !important;
} 

ol {
    list-style: circle;
}

select {
	background-image: none;
}