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:805px;
	margin:0px auto;
	color:var(--text-body);
	background:var(--back-body);
	user-select:none;
}
@media (max-width:960px) {
  .mob {
  	display:none;
  }
}
a {
	background:transparent;
	text-decoration:none;
	cursor:pointer;
	color:var(--text-name);
}
a:hover {
	text-decoration:underline;
	color:var(--text-link);
}
em {
	font-size:17px;
	font-weight:bold;
}
hr {
	margin:5px 0;
	border:1px solid var(--back-body);
}
.main {
	margin:3px;
	padding:3px;
	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;
}
.bold {
	font-weight:bold;
}
.warn {
	color:red;
}
form {
	text-align:left;
}
mark {
	display:block;
	margin:3px 3px 5px 3px;
	padding:3px 5px;
	font-size:13px;
	text-align:left;
	background:var(--back-head);
	color:var(--text-body);
	border-radius:3px;
	border:1px solid rgba(0,0,0,0.05);
	white-space:pre-wrap;
	word-break:break-all;
}
mark.snap {
	margin:7px -1px -5px 0;
	padding:0 3px 0 3px;
	border:none;
	background:var(--back-main);
}
mark > span > a {
	font-size:56px;
	height:32px;
	line-height:32px;
	margin:-8px 0 0 0;
	padding:1px;
	position:relative;
	display:inline-block;
	overflow:hidden;
}
mark > span > a:hover {
	text-decoration:none;
}
mark > .hour > a:before {
	content:"";
	display:block;
	width:2px;
	height:30px;
	top:5px;
	left:1px;
	index:1;
	background:rgba(255,0,0,0.5);
	position:absolute;
}
mark > .gray > a {
	color:rgba(50,50,50,0.3);
}
mark > .okay > a,mark > span > .okay {
	color:rgba(0,128,0,1);
}
mark > .skip.okay > a {
	color:rgba(0,128,0,0.3);
}
mark > .fail > a,mark > span > .fail {
	color:rgba(255,0,0,1);
}
mark > .skip.fail > a {
	color:rgba(255,0,0,0.3);
}
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);
}
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);
}
.chart {
	height:180px;
	background:var(--back-head);
	margin:3px 3px 5px 3px;
	padding:3px 5px;
}