.inplaytracker-content {
	display: contents;
	
	.inplaytracker {
		grid-column: mainLeft / mainRight;
		display: flex;
        flex-direction: column;
        gap: 0.25rem;
		
		.profile-fact-title {
			position: relative;
			font-size: 1rem;
			font-weight: 500;
			text-transform: uppercase;
			color: var(--color-character-fact-title);
			
			&:after {
				content:"";
				position: absolute;
				left: 0;
				right: 0;
				bottom: 0rem;
				height: 0.1rem;
				background-color: var(--color-character-fact-title);
			}
		}
		
		.scene-wrapper {
			display: flex;
			flex-direction: column;
			gap: 0.75rem;
  			overflow: auto;
  			scrollbar-width: thin;
		}
	}
}

.scene {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 0.75rem;
	font-size: 0.75rem;
	text-transform: uppercase;
	background-color: var(--color-inplaytracker-scene);
	border-radius: 0.25rem;
	cursor: pointer;
	
	&:hover {
		background-color: var(--color-inplaytracker-scene--hover);
	}
	
	.details {
		display: flex;
		gap: 1.5rem;
	}

	.detail,
	.characters {
		display: flex;
		align-items: center;
		gap: 0.5rem;
	}
}

.players {
	display: flex;
	gap: 0.5rem;

	.player {
		display: inline-flex;
		gap: 0.5rem;

		&:after {
			content: "•";
		}

		&:last-child:after {
			display: none;
		}
	}
}