.big-screen-wrapper {
	margin: 0;
	height: 100vh;
	width: 100vw;
	position: absolute;
	top: 0;
	left: 0;
	user-select: none;

	.role-reveal {
		width: 100%;
		height: 100%;
		font-size: 2em;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		gap: 0.5ch;
		align-items: stretch;

		.player {
			flex-grow: 1;
			height: auto;

			display: flex;
			flex-direction: column;
			flex-wrap: nowrap;
			align-items: center;
			justify-content: center;
			background-color: color.change($red1, $alpha: 0.1);
			border: 1px solid color.change($red1, $alpha: 0.6);

			&.ready {
				background-color: color.change($blue1, $alpha: 0.3);
				border: 1px solid $blue1;
			}
		}
	}
}