body.night {
	--back-body:#131313;
	--back-erro:#2c323c;
	--back-table:#161b22;
	--back-hover:#272822;
	--back-head:#2c323c;
	--back-fine:#2c323c;
	--back-warn:#272822;
	--back-risk:#272822;
	--text-erro:#dcdfe4;
	--text-body:#dcdfe4;
	--text-link:#e47911;
	--text-name:#dcdfe4;
	--text-gray:#abb2bf;
	--text-tips:#696969;
	--text-green:#008000;
	--text-red:#ff0000;
	--text-gold:#ffd700;
	--text-blue:#1e90ff;
	--text-olive:#808000;
	--box-border:#3a3939;
	--box-shadow:rgba(0,0,0,0.15);
	--text-shadow:rgba(255,255,255,0.15);
}
body.light {
	--back-body:#c0c0c0;
	--back-erro:#d2691e;
	--back-table:#ffffff;
	--back-hover:#f8f8ff;
	--back-head:#f0f8ff;
	--back-fine:#f5f5dc;
	--back-warn:#fddde6;
	--back-risk:#ffc0cb;
	--text-erro:#fff5ee;
	--text-body:#282828;
	--text-link:#e47911;
	--text-name:#696969;
	--text-gray:#696969;
	--text-tips:#c0c0c0;
	--text-green:#008000;
	--text-red:#ff0000;
	--text-gold:#ffd700;
	--text-blue:#0000ff;
	--text-olive:#808000;
	--box-border:#e0e0e0;
	--box-shadow:rgba(0,0,0,0.15);
	--text-shadow:rgba(255,255,255,0.15);
}
div,span,ul,li,form,input,select,option,textarea,a,html,body {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	-webkit-appearance:none;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;
}
body {
	font:15px/20px serif,verdana,helvetica;
	min-height:100%;
	min-width:320px;
	max-width:935px;
	margin:0px auto;
	padding:3px 5px 10px 5px;
	color:var(--text-body);
	background:var(--back-body);
}
body#fail {
	background:#b22222;
}
#nav {
	margin-bottom:10px;
	text-align:center;
}
#nav > .new {
	display:inline;
	padding:3px 5px;
	background:var(--back-head);
	border-radius:3px;
	font-size:16px;
}
#nav > .new mark {
	font-size:17px;
}
#nav > .old {
	padding-bottom:2px;
}
#nav > .old mark {
	background:transparent;
	color:var(--text-green);
}
#nav > .raw {
	margin:-2px auto 3px auto;
	width:100%;
	max-width:460px;
	background:var(--back-fine);
	color:var(--text-gray);
	padding:3px 5px;
	border-radius:3px;
}
#app {
	margin:0px auto;
	max-width:730px;
	max-height:100%;
}
a {
	background:transparent;
	text-decoration:none;
	cursor:pointer;
	color:var(--text-body);
}
a:hover {
	text-decoration:underline;
	color:var(--text-link);
}
.stat {
	font-size:13px;
	line-height:16px;
	margin:0 5px;
	padding:10px;
	background:var(--back-table);
}
.jbox {
	padding:7px 10px;
	color:var(--text-gray);
	background:var(--back-table);
}
.hide {
	display:none;
}
.lite {
	font-size:smaller;
}
.lite:before{
	content:"(";
}
.lite:after{
	content:")";
}
.bold {
	font-weight:bold;
}
.green {
	color:var(--text-green);
}
.olive {
	color:var(--text-olive);
}
.blue {
	color:var(--text-blue);
}
.red {
	color:var(--text-red);
}
.navs {
	clear:both;
	margin:5px 0 10px 0;
	font-size:18px;
	text-align:center;
	padding:5px 0;
	color:var(--text-gray);
	text-shadow:1px 2px 3px var(--text-shadow);
}
.erro,.tool {
	clear:both;
	background:var(--back-erro);
	color:var(--text-erro);
	margin-bottom:10px;
	padding:5px 7px;
	line-height:16px;
	box-shadow:3px 3px 5px var(--box-shadow);
}
.tool {
	background:var(--back-fine);
	color:var(--text-gray);
}
.rush {
	color:var(--text-body);
	margin-left:5px;
}
.rush > select {
	color:var(--text-green);
	background:var(--back-head);
	border:1px dashed var(--box-border);
	padding:3px 5px;
	max-width:128px;
	font-family:monospace;
}
.rush > select.odds {
	border:1px dashed var(--text-gold);
	box-shadow:0 0 2px 1px var(--text-gold);
}
.more {
	clear:both;
	text-align:center;
	color:var(--text-gray);
	text-shadow:1px 2px 3px var(--text-shadow);
}
.phase > a {
	padding-right:5px;
}
.chart {
	clear:both;
	margin-bottom:10px;
	color:var(--text-name);
	font-family:monospace;
	background:var(--back-table);
	box-shadow:3px 3px 5px var(--box-shadow);
}
.chart > .name {
	padding:5px 7px;
	background:var(--back-head);
	border-bottom:1px dashed var(--box-border);
	text-align:center;
}
.chart > .value {
	height:320px;
}

/* table */
@media (max-width:980px) {
	table td {
		padding:3px 3px;
	}
	table .mob {
		display:none;
	}
	table .num {
		padding:1px 3px;
	}
}
@media (min-width:980px) {
	table td {
		padding:7px 10px;
	}
	table .mob {
		display:revert;
	}
	table .num {
		padding:2px 5px;
	}
}
.rows {
	clear:both;
	margin-bottom:10px;
	overflow-x:auto;
	font-family:monospace;
	background:var(--back-table);
	box-shadow:3px 3px 5px var(--box-shadow);
}
table {
	border-collapse:collapse;
	border-spacing:0;
	width:100%;
}
table td {
	border-top:1px dashed var(--box-border);
	border-left:1px dashed var(--box-border);
	white-space:nowrap;
}
table tr:first-child td {
	border-top:none;
}
table tr td:first-child {
	border-left:none;
}
table tr.fine > td {
	background:var(--back-fine);
}
table tr.warn > td {
	background:var(--back-warn);
}
table tr.risk > td {
	background:var(--back-risk);
}
.from > .icon:before {
	margin-right:-5px;
	padding:1px;
	font-size:13px;
	font-weight:normal;
	font-style:normal;
	color:var(--text-red);
	border:1px dashed var(--text-red);
}
.from > .hazard:before {
	content:"\9669\fe0e";
}
.from > .expired:before {
	content:"\8150\fe0e";
}
.from > .depth:before {
	content:"\6db8\fe0e";
}
.from > .tax:before {
	content:"\7a0e\fe0e";
}
.from > .greed:before {
	content:"\8d2a\fe0e";
}
.from > .abnormal:before {
	content:"\7578\fe0e";
}
.from > .chain:before {
	color:var(--text-red);
	font-weight:bold;
	content:"\94fe\fe0e";
}
.from > .bridge:before {
	color:var(--text-red);
	font-weight:bold;
	content:"\6865\fe0e";
}
table .name {
	background:var(--back-head);
	color:var(--text-name);
	text-align:center;
}
table .name > td {
	padding:5px 7px;
}
table .head {
	background:var(--back-head);
	color:var(--text-gray);
}
table .data {
	color:var(--text-name);
}
table .data:hover {
	background:var(--back-hover);
}
table a:hover {
	text-decoration:none;
}
table .sup {
	vertical-align:super;
	font-size:13px;
	padding-left:3px;
}
table .num {
	background:var(--back-fine);
	border-radius:3px;
}
table .act {
	font-size:20px;
	text-align:center;
	min-width:20px;
	color:var(--text-tips);
	cursor:pointer;
}
table .act > a {
	display:inline-block;
	padding-top:3px;
}

/* form */
.auth {
	font-family:monospace;
	margin:10px 0;
	padding:7px 10px;
	background:var(--back-table);
	box-shadow:3px 3px 5px var(--box-shadow);
}
.exit {
	margin:7px 0;
	padding:5px 7px;
	color:var(--text-name);
	background:var(--back-fine);
	border-radius:3px;
	box-shadow:1px 3px 5px var(--box-shadow);
}
.unit {
	clear:both;
	margin:3px 0;
	overflow:hidden;
}
.unit > .part {
	color:var(--text-name);
	font-style:italic;
	background:var(--back-head);
	border-radius:3px;
	margin:7px 0 5px 100px;
	padding:3px 7px;
	display:inline-block;
}
.unit > .name {
	float:left;
	width:95px;
	font-size:13px;
	color:var(--text-gray);
	text-align:right;
	padding:5px 0;
}
.unit > .name:after {
	content:":";
}
.unit > .value {
	margin-left:100px;
	margin-right:16px;
	margin-bottom:5px;
	padding:0;
}
.unit > .value > .plain {
	font-size:13px;
	color:var(--text-green);
	background:var(--back-head);
	padding:5px 7px;
	margin:1px -16px 1px 0;
	border:1px dashed var(--box-border);
	line-height:16px;
}
.unit > .value.select {
	margin-right:0px;
}
.unit input,.unit select,.unit textarea {
	background:var(--back-table);
	color:var(--text-name);
	font-family:monospace;
	font-size:15px;
	line-height:20px;
	border:1px dashed var(--box-border);
	padding:5px 7px;
	width:100%;
	display:block;
}
.unit input:disabled {
	color:var(--text-green);
	background:var(--back-head);
}
.unit input:focus,.unit select:focus,.unit textarea:focus {
	color:var(--text-olive);
	border:1px dashed var(--text-gold);
}
.unit textarea {
	height:58px;
}
.unit .post {
	margin-top:5px;
	margin-left:100px;
	display:inline-block;
}
.unit .post > input {
	background:linear-gradient(var(--back-hover),var(--back-fine));
	border:1px dashed var(--box-border);
	border-radius:3px;
	font-weight:normal;
	text-align:center;
	vertical-align:top;
	padding:5px 12px;
	cursor:pointer;
}
.unit .post > input:hover {
	background:var(--back-fine);
}
.item {
	font-family:monospace;
	font-size:13px;
	border:1px dashed var(--box-border);
	margin:5px 7px 0 0;
	padding:2px 5px;
	line-height:15px;
	background:var(--back-table);
	border-radius:3px;
	display:inline-block;
}
.item.gold {
	border:1px dashed var(--text-gold);
	box-shadow:0 0 2px 1px var(--text-gold);
}
.item.dail {
	background:var(--back-fine);
	font-size:14px;
}
