/* Light color scheme (Default) */
/* Can be forced with data-theme="light" */
[data-theme="light"],
:root:not([data-theme="dark"]) {
	--h1-mark-gradient: linear-gradient(225deg, #9c3cff 0%, #4e4ba0 50%, #2B86C5 100%);
}

/* Dark color scheme (Auto) */
/* TODO make the gradient more obvious in dark mode */
/* Automatically enabled if user has Dark mode enabled */
@media only screen and (prefers-color-scheme: dark) {
	:root:not([data-theme]) {
		--h1-mark-gradient: linear-gradient(-20deg, #ccadf9 0%, #f5f8a5 100%);
	}
}

/* Dark color scheme (Forced) */
/* Enabled if forced with data-theme="dark" */
[data-theme="dark"] {
	--h1-mark-gradient: linear-gradient(-20deg, #ccadf9 0%, #f5f8a5 100%);
}

header {
	margin: 1rem auto;
}

mark {
	padding: 0;
	background-color: #74EBD5;
	background-image: var(--h1-mark-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

h1 {
	font-size: 3rem;
	font-weight: 650;
}

hgroup {
	margin-bottom: 2rem;
}

header .share {
	float: right;
	margin-top: 1.2rem;
	cursor: pointer;
}

th {
	overflow: visible;
	white-space: nowrap;
}

td.wide {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	max-width: min-content;
}
