/* /FrontEnd/Components/IconButton.razor.rz.scp.css */
button[b-19wqnxnfkt] {
	padding: 0.2rem;
	background: none;
	border: 1px solid #444;
	display: grid;
}
/* /FrontEnd/Components/Layout/MainLayout.razor.rz.scp.css */
.MainLayout[b-7xw1dxfdxr] {
	display: grid;
	grid-template-rows: auto 1fr;
	place-items: stretch;
	gap: 5px;
}
/* /FrontEnd/Components/Layout/NavMenu.razor.rz.scp.css */
.NavMenu[b-hzfxme0mv1] {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 2rem;
	padding: 0 2rem;
}

	.NavMenu .spacer[b-hzfxme0mv1] {
		flex: 1;
	}

	/******************/
	/* Mobile Nav Menu*/
	/******************/

	.NavMenu.compact[b-hzfxme0mv1] {
		/* display is changed in @media */
		display: none;
	}

		.NavMenu.compact .flex[b-hzfxme0mv1] {
			display: flex;
			justify-content: space-between;
		}

		.NavMenu.compact .drop-down[b-hzfxme0mv1] {
			height: 0;
			overflow-y: clip;
			transition: height 0.25s ease-in;
		}

			.NavMenu.compact .drop-down.expand[b-hzfxme0mv1] {
				height: 100px;
			}


@media all and (max-width: 750px) {
	.NavMenu.compact[b-hzfxme0mv1] {
		display: block;
	}

	.NavMenu[b-hzfxme0mv1] {
		display: none;
	}
}
/* /FrontEnd/Components/Pages/FancyErrorPage.razor.rz.scp.css */
main[b-7bkdisbf6q] {
    display: grid;
    place-content: center;
}
/* /FrontEnd/Components/Pages/Home/HomePage.razor.rz.scp.css */
.shogi[b-4afu537t1o] {
	background-color: var(--primary-color);
	color: white;
	padding: 1rem;
	margin: auto;
	width: 100%;
	max-width: 80ch;
	padding-top: 0;
}

.shogi-toc[b-4afu537t1o] {
	display: none;
}

.shogi-content h2[b-4afu537t1o] {
	text-align: center;
	border-bottom: 1px solid white;
	margin-bottom: 1.5rem;
}

@media (min-width: 1025px) {
	.shogi[b-4afu537t1o] {
		max-width: 140ch;
		display: grid;
		grid-template-columns: 250px 1fr;
		gap: 4rem;
		align-items: start;
	}

	.shogi-toc[b-4afu537t1o] {
		display: block;
		position: sticky;
		top: 2rem;
		max-height: calc(100vh - 4rem);
		overflow-y: auto;
	}

	.shogi-toc h3[b-4afu537t1o] {
		margin-top: 0;
		font-size: 1.25rem;
		border-bottom: 1px solid rgba(255,255,255,0.3);
		padding-bottom: 0.5rem;
		margin-bottom: 1rem;
	}

	.shogi-toc ul[b-4afu537t1o] {
		list-style: none;
		padding-left: 0;
	}

	.shogi-toc > ul > li[b-4afu537t1o] {
		margin-bottom: 0.75rem;
		font-weight: bold;
	}

	.shogi-toc ul ul[b-4afu537t1o] {
		padding-left: 1rem;
		margin-top: 0.25rem;
		font-weight: normal;
		font-size: 0.9em;
	}

	.shogi-toc a[b-4afu537t1o] {
		color: rgba(255,255,255,0.8);
		text-decoration: none;
		display: block;
		padding: 0.1rem 0;
	}

	.shogi-toc a:hover[b-4afu537t1o] {
		color: white;
		text-decoration: underline;
	}
}
/* /FrontEnd/Components/Pages/Home/VisualAids/BoardSetupVisualAid.razor.rz.scp.css */
.BoardSetupVisualAid[b-kiitxj5gan] {
	max-width: 80vmin;
	width: 30rem;
	display: grid;
}
/* /FrontEnd/Components/Pages/Home/VisualAids/PieceMovesVisualAid.razor.rz.scp.css */
section[b-hrs640lhr9] {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

section:not(:last-of-type)[b-hrs640lhr9]{
	margin-bottom: 2rem;
}

.moves[b-hrs640lhr9] {
	width: 12rem;
	text-align: center;
}
/* /FrontEnd/Components/Pages/Home/VisualAids/PromotedPieceVisualAid.razor.rz.scp.css */
section[b-q0multvcwd] {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

section:not(:last-of-type)[b-q0multvcwd]{
	margin-bottom: 2rem;
}

.moves[b-q0multvcwd] {
	width: 12rem;
	text-align: center;
}
/* /FrontEnd/Components/Pages/Play/GameBoard/GameboardPresentation.razor.rz.scp.css */
.game-board[b-h9h4njzonl] {
	--ratio: 0.9;
	display: grid;
	grid-template-areas:
		"rank	board opponent-side-board"
		"rank board opponent-info"
		"rank board player-info"
		"rank	board player-side-board"
		".		file	.";
	grid-template-columns: auto 1fr auto;
	grid-template-rows: 3fr 1fr 1fr 3fr auto;
	background-color: #444;
	gap: 5px;
	place-self: center;
	color: beige;
}

	.game-board [data-upsidedown][b-h9h4njzonl] {
		transform: rotateZ(180deg);
	}

.board[b-h9h4njzonl] {
	display: grid;
	grid-template-areas:
		"A9 B9 C9 D9 E9 F9 G9 H9 I9"
		"A8 B8 C8 D8 E8 F8 G8 H8 I8"
		"A7 B7 C7 D7 E7 F7 G7 H7 I7"
		"A6 B6 C6 D6 E6 F6 G6 H6 I6"
		"A5 B5 C5 D5 E5 F5 G5 H5 I5"
		"A4 B4 C4 D4 E4 F4 G4 H4 I4"
		"A3 B3 C3 D3 E3 F3 G3 H3 I3"
		"A2 B2 C2 D2 E2 F2 G2 H2 I2"
		"A1 B1 C1 D1 E1 F1 G1 H1 I1";
	grid-template-columns: repeat(9, 1fr);
	grid-template-rows: repeat(9, 1fr);
	background-color: #444444;
	gap: 3px;
	max-height: 80vmin;
	aspect-ratio: var(--ratio);
}

	.board[data-perspective="Player2"][b-h9h4njzonl] {
		grid-template-areas:
			"I1 H1 G1 F1 E1 D1 C1 B1 A1"
			"I2 H2 G2 F2 E2 D2 C2 B2 A2"
			"I3 H3 G3 F3 E3 D3 C3 B3 A3"
			"I4 H4 G4 F4 E4 D4 C4 B4 A4"
			"I5 H5 G5 F5 E5 D5 C5 B5 A5"
			"I6 H6 G6 F6 E6 D6 C6 B6 A6"
			"I7 H7 G7 F7 E7 D7 C7 B7 A7"
			"I8 H8 G8 F8 E8 D8 C8 B8 A8"
			"I9 H9 G9 F9 E9 D9 C9 B9 A9";
	}

.tile[b-h9h4njzonl] {
	display: grid;
	place-content: center;
	aspect-ratio: var(--ratio);
	background-color: beige;
	transition: filter linear 0.25s;
}

	.tile[data-selected][b-h9h4njzonl] {
		filter: invert(0.8);
	}

.ruler[b-h9h4njzonl] {
	color: beige;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
}

	.ruler.vertical[b-h9h4njzonl] {
		flex-direction: column;
	}

.board[data-perspective="Player2"] .ruler[b-h9h4njzonl] {
	flex-direction: row-reverse;
}

	.board[data-perspective="Player2"] .ruler.vertical[b-h9h4njzonl] {
		flex-direction: column-reverse;
	}

.side-board[b-h9h4njzonl] {
	display: grid;
	grid-template-columns: repeat(auto-fill, 3rem);
	place-items: end start;
	gap: 5px;
	padding: 0.25rem;
	background: linear-gradient(45deg, beige, white);
}

	.side-board.opponent[b-h9h4njzonl] {
		place-items: start;
	}

	.side-board:empty[b-h9h4njzonl] {
		content: 'Captured Pieces';
	}

.player-info[b-h9h4njzonl] {
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-content: stretch;
}

.login-to-play[b-h9h4njzonl] {
	background: linear-gradient(45deg, beige, white);
	display: grid;
	place-content: center;
	min-height: 2rem;
}

@media all and (max-width: 750px) {
	.game-board[b-h9h4njzonl] {
		grid-template-areas:
			".		opponent-side-board"
			".		opponent-info"
			"rank	board"
			".		file"
			".		player-info"
			".		player-side-board";
		grid-template-rows: repeat(2, auto) 1fr repeat(3, auto);
		gap: 0.25rem;
	}

	.board[b-h9h4njzonl] {
		min-height: 95vmin;
	}

	.side-board[b-h9h4njzonl] {
		min-height: 2rem;
	}

	.player-info[b-h9h4njzonl] {
		text-align: center;
	}
}
/* /FrontEnd/Components/Pages/Play/GameBoard/OpponentName.razor.rz.scp.css */
.turn-marker[b-38banmmubp] {
	display: inline-block;
	padding: 2px 5px;
	background-color: var(--foregroundColor);
	background-color: var(--middlegroundColor);
	color: var(--backgroundColor);
	font-weight: bold;
	font-size: 80%;
	border-radius: 8px;
}

.check-marker[b-38banmmubp] {
	display: inline-block;
	padding: 3px 8px;
	background-color: darkred;
	color: beige;
	font-weight: bold;
	font-size: 80%;
}

.victory-marker[b-38banmmubp] {
	display: inline-block;
	padding: 3px 8px;
	background-color: darkgreen;
	color: beige;
	font-weight: bold;
	font-size: 80%;
}
/* /FrontEnd/Components/Pages/Play/GameBoard/PlayerName.razor.rz.scp.css */
.turn-marker[b-5ufyiwou8y] {
	display: inline-block;
	padding: 2px 5px;
	background-color: var(--foregroundColor);
	background-color: var(--middlegroundColor);
	color: var(--backgroundColor);
	font-weight: bold;
	font-size: 80%;
	border-radius: 8px;
}

.check-marker[b-5ufyiwou8y] {
	display: inline-block;
	padding: 2px 5px;
	background-color: #f3a1a1;
	color: darkred;
	font-weight: bold;
	font-size: 80%;
	border-radius: 8px;
}

.victory-marker[b-5ufyiwou8y] {
	display: inline-block;
	padding: 2px 5px;
	background-color: darkgreen;
	color: white;
	font-weight: bold;
	font-size: 80%;
	border-radius: 8px;
}
/* /FrontEnd/Components/Pages/Play/GameBoard/SeatedGameBoard.razor.rz.scp.css */
.promote-prompt[b-pyrgcbjj88] {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border: 2px solid #444;
	padding: 1rem;
	box-shadow: 1px 1px 1px #444;
	text-align: center;
	z-index: 101;
	background-color: #444;
	border: 1px solid black;
}

.errorModal[b-pyrgcbjj88] {
	position: absolute;
	top: 1rem;
	right: 1rem;
}
/* /FrontEnd/Components/Pages/Play/GameBrowser.razor.rz.scp.css */
.GameBrowser[b-gjj4crxm2t] {
}

	.GameBrowser row[b-gjj4crxm2t] {
		display: block;
		width: max-content;
	}

		.GameBrowser row.header[b-gjj4crxm2t] {
			display: grid;
			grid-template-columns: 18rem 5rem 5rem;
			gap: 1rem;
			margin-bottom: 0 !important;
		}

		.GameBrowser row:not(:last-of-type)[b-gjj4crxm2t] {
			margin-bottom: 1rem;
		}
/* /FrontEnd/Components/Pages/Play/GameBrowserEntry.razor.rz.scp.css */
gameBrowserEntry[b-0buug9sf5h] {
	position: relative;
	display: grid;
	grid-template-columns: 18rem 5rem 5rem;
	padding-left: 5px; /* Matches box shadow on hover */
	gap: 1rem;
	place-items: center start;
	cursor: pointer;
}

	gameBrowserEntry:hover[b-0buug9sf5h] {
		background-color: rgba(255, 255, 255, 0.1);
	}

	gameBrowserEntry[data-selected="true"][b-0buug9sf5h] {
		background-color: rgba(255, 255, 255, 0.2);
		box-shadow: inset 3px 0 0 0 var(--primary-color, #fff);
	}

modal[b-0buug9sf5h] {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

/* /FrontEnd/Components/Pages/Play/GamePiece.razor.rz.scp.css */
[b-x4nmeey95a] svg {
	max-width: 100%;
	height: auto;
}

.game-piece[b-x4nmeey95a] {
	overflow: hidden; /* Because SVGs have weird sizes. */
	position: relative;
}

.game-piece .counter[b-x4nmeey95a] {
	display: grid;
	place-content: center;
	position: absolute;
	top: 0;
	left: 0;
	padding: 2px;
	z-index: 100;
	background-color: white;
	border-radius: 9px;
	border: 1px solid #444;
	aspect-ratio: 1 / 1;
	width: 15px;
	height: 15px;
}
/* /FrontEnd/Components/Pages/SearchPage.razor.rz.scp.css */
.SearchPage[b-fn08j2ntzv] {
	padding: 0 0.5rem;
	display: grid;
	grid-template-columns: 100%;
	grid-template-rows: auto 1fr;
}

.search-content[b-fn08j2ntzv] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	align-items: start;
}

.preview-panel[b-fn08j2ntzv] {
	padding: 1rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	min-height: 300px;
}

.preview-panel .no-selection[b-fn08j2ntzv] {
	color: #888;
	font-style: italic;
}

.preview-actions[b-fn08j2ntzv] {
	display: flex;
	gap: 1rem;
	justify-content: center;
	margin-top: 1rem;
}

.preview-actions button[b-fn08j2ntzv] {
	padding: 0.5rem 1.5rem;
	font-size: 1rem;
}
/* /FrontEnd/Components/RotatingCogsSvg.razor.rz.scp.css */
.rotating-cogs[b-2n0xphtsru] {
	text-align: center;
}

.left[b-2n0xphtsru], right[b-2n0xphtsru] {
	position: relative;
	width: 32px;
}

.left[b-2n0xphtsru] {
	left: 2px;
}
.right[b-2n0xphtsru] {
	left: -2px;
}
/* /FrontEnd/Components/Stretch.razor.rz.scp.css */
div[b-rjkge8ccp2] {
	display: grid;
	place-content: stretch;
	min-height: 100%;
}
/* /FrontEnd/Components/TemporaryModal.razor.rz.scp.css */
/* Grid layout */
.TemporaryModal[b-0d1niarmij] {
	--timeToClose: 3s;
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: repeat(1fr, 3) auto;
	grid-template-areas:
		"content			close"
		"content			."
		"countdown		countdown"
		"helper-text	helper-text";
	gap: 0.5rem;
}

.content[b-0d1niarmij] {
	grid-area: content;
}

button.close[b-0d1niarmij] {
	grid-area: close;
}

.countdown[b-0d1niarmij] {
	grid-area: countdown;
}


.time-helper-text[b-0d1niarmij] {
	grid-area: helper-text;
}

/* Apperance */

.TemporaryModal[b-0d1niarmij] {
	position: fixed;
	bottom: 1.5rem;
	right: 1.5rem;
	max-width: 22rem;
	z-index: 1000;
	padding: 0.5rem;
}

.countdown .time-background[b-0d1niarmij] {
	background-color: beige;
	height: 1ch;
}

.countdown .time[b-0d1niarmij] {
	background-color: red;
	height: 100%;
	width: 100%;
	animation: countdown-b-0d1niarmij var(--timeToClose) ease-in-out;
	animation-fill-mode: both;
}

.countdown .time-helper-text[b-0d1niarmij] {
	font-size: 70%;
	text-align: center;
}

@keyframes countdown-b-0d1niarmij {
	0% {
		width: 100%;
	}

	100% {
		width: 0
	}
}
