/* Applies to theme instead of body for specificity; otherwise color tokens
 * aren't available. */
[data-theme] {
	--mw-background: var(--sl-color-neutral-200);
	--mw-color-gray-text: var(--sl-color-neutral-500);
}

html {
	overflow: hidden;
}

body {
	display: flex;
	background: var(--mw-background);
	height: 100vh;
	margin: 0;
}

.sl-toast-stack {
	bottom: 0;
	top: auto;
	left: 50%;
	right: auto;
	transform: translateX(-50%);
}

sl-alert::part(base) {
	backdrop-filter: blur(12px);
	border: 1px solid color-mix(in oklab, var(--sl-color-neutral-300), transparent 60%);
}

sl-alert::part(close-button):hover {
	transform: scale(1.1);
}