body {
	margin: 0; padding: 0 0 0 0;
	background: #000 url(../i/bg/circuit_dark.webp); background-size: 736px 1280px;
	font: 400 100% "Source Sans Pro",sans-serif; color: #eee;
}
div, span {
	box-sizing: border-box;
}
img {
	display: block;
}
button {
	-webkit-appearance: none;
	display: inline-block;
	margin: 0; padding: 0.75rem 1rem;
	background: #333d; border: 1px solid #555; border-radius: 0.5rem;
	-webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
	font-size: 1.125rem; color: #fff;
	cursor: pointer;
}
button.full {
	width: 100%;
}
button i {
	margin-left: 0.75rem;
}

a {
	color: #eee; text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

h1 {
	margin: 0 0 1.125rem 0;
	font-size: 1.25rem; font-weight: 700;
}
h2 {
	margin: 0 0 0.5rem 0;
	font-size: 1.125rem; font-weight: 400;
}

p {
	margin: 1.25rem 0 0 0;
}
p:first-child,
p.first {
	margin-top: 0 !important;
}
p.center {
	text-align: center;
}
p.center img {
	display: inline-block;
}

ul.sq {
	list-style: square;
	margin: 0.375rem 0 0 0; padding: 0 0 0 2rem;
}
ul.sq li {
	margin: 0.375rem 0 0 0;
}
ul.sq li:first-child {
	margin-top: 0;
}

hr {
	margin: 1.25rem 0;
	border: none; border-top: 0.25rem solid #5559;
}

input,
select,
textarea {
	-webkit-appearance: none;
	box-sizing: border-box;
	border-radius: 0;
	font: 400 1.125rem "Source Sans Pro",sans-serif; color: #fff;
}
input[type="text"],
input[type="email"],
input[type="password"],
textarea {
	width: 100%; margin: 0; padding: 1rem;
	background: #0007; border: none; border-bottom: 1px solid #0007;
	color: #fff;
}
input[type="file"] {
	max-width: 220px;
}
input[readonly],
textarea[readonly],
select[readonly] {
	background: #eee; color: #777;
}
select {
	-webkit-appearance: none;
	width: 100%; margin: 0; padding: 0.75rem; padding-right: 2rem;
	background: #fff; border: 1px solid #aaa; border-radius: 0;
}
select::-ms-expand {
	display: none;
}
input[type="checkbox"], input[type="radio"] {
	margin: 0; padding: 0;
	vertical-align: middle;
}
input::placeholder, textarea::placeholder {
	color: #fff5; font-style: italic;
}
input:focus,
select:focus,
textarea:focus {
	outline: none;
	border-color: #999;
}
p+fieldset {
	margin-top: 1.5rem;
}
fieldset {
	display: block; position: relative;
	padding: 1rem;
	background: #333; border: none;
}
fieldset .label {
	display: block;
	margin: 1.25rem 0 0.75rem 0;
	font-size: 1.125rem;
}
fieldset .label:first-child {
	margin-top: 0;
}

.submits {
	display: block; position: relative;
	text-align: right;
}
.submits button {
	margin: 1rem 0 0 1rem;
}

.uicon {
	display: block; position: relative; overflow: hidden;
	width: 100%; padding-bottom: 100%;
	border-radius: 48px; box-shadow: 0 0 1px 1px #0009;
}
.uicon img {
	position: absolute;
	top: 0; left: 0; width: 100%; height: 100%;
}

#game {
/*
	display: block; position: fixed;
	left: 0; right: 0; top: 0; bottom: 0; padding: 4rem 0 0 0;
*/
	padding: 4rem 0 1rem 0;
}

#game .panel {
	display: block; position: fixed;
	left: 0; right: 0;
}
#game .block {
	display: block; position: relative;
	width: 100%; max-width: 480px; margin: 0 auto; padding: 0 1rem;
}
#game .block.full {
	padding: 0;
}

#header_panel {
	z-index: 999;
	top: 0; height: 3rem; padding: 0 1rem;
	background: #333;
}
#header .title {
	display: block; position: absolute;
	left: 0; top: 0.75rem; height: 1.5rem;
	font-size: 1.125rem; line-height: 1.5rem;
}
#header .title img {
	display: inline-block;
	width: auto; height: 1.5rem; margin: 0 0.5rem 0 0;
	vertical-align: bottom;
}
#header .toggle {
	display: block; position: absolute;
	right: 0; top: 0.75rem; width: 1rem; height: 1.5rem;
	font-size: 1rem; line-height: 1.5rem;
	cursor: pointer;
}

#game #menu_panel {
	display: none; z-index: 800;
	top: 3rem;
}
#game #menu {
	padding: 1rem;
	background: #222;
}
#game #menu .links {
}
#game #menu .links .link {
	margin-top: 0.25rem;
}
#game #menu .links .link button {
	display: block;
	width: 100%; padding: 1rem;
	text-align: left;
}
#game #menu .links .link button i {
	width: 1.5rem; margin: 0 0.5rem 0 0;
	text-align: center;
}
#game #menu .tms {
	margin-top: 1rem; padding: 1rem 0;
}
#game #menu .tms img {
	display: block;
	width: auto; height: 3rem; margin: 0 auto;
}

#notify {
	display: none; position: fixed; z-index: 900;
	left: 0; right: 0; bottom: 0; padding: 1.75rem 0;
	background: #333; border-top: 1px solid #000;
	color: #fff; text-align: center;
	font-size: 1.125rem;
}

.rblock {
	display: block; position: relative;
	margin: 1.125rem 0 0 0;
}
.rblock:first-child {
	margin-top: 0;
}
.rblock.hug {
	margin-top: 0.125rem;
}
.rblock.snug {
	margin-top: 0.5rem;
}
.rblock.middle {
	align-items: center;
}
.rblock .col {
	display: block; position: relative;
	min-height: 1px; margin-top: 1rem;
}
.rblock .col:first-child {
	margin-top: 0;
}
@media (min-width: 768px) {
	.rblock {
		display: grid;
		grid-template: auto / repeat(12, 1fr); column-gap: 1rem;
	}
	.rblock.nogut { column-gap: 0; }
	.rblock.biggut { column-gap: 2rem; }

	.rblock .col {
		grid-column-start: auto; grid-column-end: span 12;
		margin-top: 0;
	}

	.rblock .col.f1 { grid-column-end: span 1; }
	.rblock .col.f2 { grid-column-end: span 2; }
	.rblock .col.f3 { grid-column-end: span 3; }
	.rblock .col.f4 { grid-column-end: span 4; }
	.rblock .col.f5 { grid-column-end: span 5; }
	.rblock .col.f6 { grid-column-end: span 6; }
	.rblock .col.f7 { grid-column-end: span 7; }
	.rblock .col.f8 { grid-column-end: span 8; }
	.rblock .col.f9 { grid-column-end: span 9; }
	.rblock .col.f10 { grid-column-end: span 10; }
	.rblock .col.f11 { grid-column-end: span 11; }
	.rblock .col.f12 { grid-column-end: span 12; }
}