body.night {
	--back-body:#131313;
	--back-main:#222222;
	--back-head:#2c323c;
	--text-body:#abb2bf;
	--text-name:#dcdfe4;
	--text-link:#e47911;
}
body.light {
	--back-body:#c0c0c0;
	--back-main:#fffafa;
	--back-head:#edeef0;
	--text-body:#808080;
	--text-name:#131313;
	--text-link:#e47911;
}
body {
	font:15px/18px monospace;
	min-height:100%;
	min-width:320px;
	max-width:935px;
	margin:0px auto;
	color:var(--text-body);
	background:var(--back-body);
}
body#blink {
	animation:blink 500ms infinite;
}
@keyframes blink {
	0%,49.9%{
		background:#ffcc00;
	}
	50%,99.9%{
		background:#cc3300;
	}
}
a {
	background:transparent;
	text-decoration:none;
	cursor:pointer;
	color:var(--text-name);
}
a:hover {
	text-decoration:underline;
	color:var(--text-link);
}
.main {
	clear:both;
	margin:7px 0;
	padding:5px 7px;
	text-align:center;
	background:var(--back-main);
	border-radius:5px;
	box-shadow:3px 3px 5px rgba(0,0,0,0.15);
}
.navs {
	font-size:17px;
	margin:3px 0;
}
#hide {
	display:none;
}
form {
	text-align:left;
}
mark {
	display:block;
	margin:3px 5px;
	padding:3px 5px;
	text-align:left;
	font-size:smaller;
	color:var(--text-body);
	background:var(--back-head);
	border-radius:3px;
	border:1px solid rgba(0,0,0,0.05);
	white-space:pre;
}
.warn,.hint.warn {
	background:tomato;
}
i {
	color:var(--text-body);
	font-size:smaller;
	padding-left:3px;
}
em {
	font-size:14px;
	font-weight:bold;
}
hr {
	margin:7px 0 5px 0;
	border:1px solid var(--back-body);
}
input[type="text"],input[type="password"] {
	width:390px;
	max-width:93%;
	margin:3px 0;
}
input {
	background:var(--back-head);
	color:var(--text-name);
	font-size:16px;
	line-height:20px;
	border:1px dashed var(--back-body);
	padding:3px 5px;
}
input[readonly] {
	background:var(--back-body);
	color:var(--text-link);
}
input[type="submit"]:hover {
	color:var(--text-link);
}
sup {
	font-weight:normal;
	padding:0 0 0 3px;
}
p {
	display:inline-block;
	margin:3px 0;
	padding:0 3px;
	background:var(--back-head);
	color:var(--text-name);
	border-radius:3px;
	border:1px solid rgba(0,0,0,0.05);
}
.okay {
	color:green;
}
.fail {
	color:red;
}
.stop {
	color:gray;
}
.bold {
	font-weight:bold;
}
.hint {
	text-align:left;
	margin:0 0 3px 0;
	padding:3px 7px;
	font-size:13px;
	background:var(--back-head);
	user-select:none;
	border-radius:3px;
	border:1px solid rgba(0,0,0,0.05);
}
.task {
	position:absolute;
	top:168px;
	left:128px;
	font-size:81px;
	font-weight:bold;
	color:blue;
	text-shadow:1px 1px 1px gold;
	text-transform:uppercase;
}
.chart {
	position:relative;
	clear:both;
	padding:3px 0 7px 0;
	user-select:none;
}
.chart > .title {
	padding:5px 7px;
	color:var(--text-name);
	background:var(--back-head);
	text-align:center;
	border-radius:3px;
	border:1px solid rgba(0,0,0,0.05);
}
.chart > pre {
	text-align:left;
	margin:0;
	padding:5px 7px;
	font-size:13px;
	line-height:13px;
	height:266px;
	overflow-y:hidden;
	scrollbar-width:none;
}
.chart > .value {
	height:250px;
	margin:0 0 -7px 0;
}