/*
@import "../../node_modules/@fontsource/roboto/latin-400.css";
@import "../../node_modules/@fontsource/roboto-mono/latin-400.css";
*/
@import "../../node_modules/mdui/mdui.css";

:not(:defined) {
	visibility: hidden;
}

html,
body {
	height: 100dvh;
}

body {
	margin: 0;
	padding: 0;
	font-family: sans-serif;

	color: rgb(var(--mdui-color-on-background));
	background-color: rgb(var(--mdui-color-background));
}

.shj-lang-json {
	white-space: pre;
	color: #f8f8f2;
	background: var(--mdui-color-secondary-container);
	text-shadow: none;
	box-sizing: border-box;
	border-radius: 10px;
	max-width: min(100%, 100vw);
	margin: 10px 0;
	padding: 30px 20px;
	font: 18px / 24px monospace;
	box-shadow: 0 0 5px #0001;
}

.shj-inline {
	border-radius: 5px;
	margin: 0;
	padding: 2px 5px;
	display: inline-block;
}

.shj-syn-str {
	color: #7d8;
}

.shj-syn-var {
	color: #ff5261;
}

.shj-syn-str {
	color: #4dacfa;
}