.wbbPost .messageSidebar {
	--fp-bg: var(--wcfHeaderBackground, #4a96d0);
	--fp-bg-light: color-mix(in srgb, var(--fp-bg) 70%, var(--wcfHeaderText, #ffffff));
	--fp-bg-dark: color-mix(in srgb, var(--fp-bg) 72%, #000000);
	--fp-text: var(--wcfHeaderText, #ffffff);
	--fp-rank: var(--wcfButtonPrimaryBackground, #1f9a24);
	--fp-rank-text: var(--wcfButtonPrimaryText, #ffffff);
	--fp-box: color-mix(in srgb, var(--fp-bg) 76%, #ffffff);
	--fp-ring: var(--wcfContentContainerBackground, #ffffff);
	display: flex !important;
	flex: 0 0 320px !important;
	flex-direction: column !important;
	align-items: stretch !important;
	align-self: flex-start !important;
	width: 320px !important;
	max-width: 320px !important;
	margin: 0 !important;
	padding: 22px 16px 16px !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-sizing: border-box !important;
	color: var(--fp-text, #ffffff) !important;
	text-align: center !important;
	background-color: var(--fp-bg, #4a96d0) !important;
	background-image:
		linear-gradient(118deg, var(--fp-bg-light, #68b4e4) 0 22%, transparent 22%),
		linear-gradient(250deg, var(--fp-bg-dark, #2f72ae) 0 28%, transparent 28%),
		linear-gradient(28deg, transparent 0 48%, var(--fp-bg-light, #68b4e4) 48% 70%, transparent 70%),
		linear-gradient(198deg, transparent 0 36%, var(--fp-bg-dark, #2f72ae) 36% 58%, transparent 58%) !important;
	background-size: 180px 180px !important;
}

.wbbPost .messageSidebar::before {
	display: none !important;
	content: none !important;
}

.wbbPost .messageSidebar .coverphoto {
	display: block !important;
	align-self: stretch !important;
	position: relative !important;
	z-index: 0 !important;
	width: calc(100% + 32px) !important;
	max-width: none !important;
	height: 120px !important;
	margin: -22px -16px -58px !important;
	padding: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	border-radius: 0 !important;
	background-color: transparent !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
}

.wbbPost .messageSidebar:has(.forumProfilCover) .coverphoto:not(.forumProfilCover) {
	display: none !important;
}

.wbbPost .messageSidebar .coverphoto img {
	display: block !important;
	width: 100% !important;
	height: 120px !important;
	object-fit: cover !important;
	border: 0 !important;
	border-radius: 0 !important;
}

.wbbPost .messageSidebar + .messageContent {
	flex-basis: calc(100% - 336px) !important;
	max-width: calc(100% - 336px) !important;
	margin-left: 16px !important;
}

.wbbPost .messageSidebar .messageAuthor {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	position: static !important;
	min-height: 0 !important;
	width: 100% !important;
}

.wbbPost .messageSidebar .userAvatar {
	display: block !important;
	position: relative !important;
	top: auto !important;
	left: auto !important;
	transform: none !important;
	width: 156px !important;
	height: 156px !important;
	margin: 4px auto 12px !important;
	border: 6px solid var(--fp-ring, #ffffff) !important;
	border-radius: 50% !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
	background: #d7e7f4 !important;
	position: relative !important;
	z-index: 1 !important;
}

.wbbPost .messageSidebar .userAvatar > a,
.wbbPost .messageSidebar .userAvatar > span {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
}

.wbbPost .messageSidebar .userAvatar .userAvatarImage,
.wbbPost .messageSidebar .userAvatar img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	border: 0 !important;
	border-radius: 50% !important;
	object-fit: cover !important;
}

.wbbPost .messageSidebar .badgeOnline {
	position: absolute !important;
	right: 12px !important;
	bottom: 10px !important;
	left: auto !important;
	top: auto !important;
	width: 16px !important;
	height: 16px !important;
	padding: 0 !important;
	color: transparent !important;
}

.wbbPost .messageSidebar .badgeOnline::before {
	left: 0 !important;
	top: 0 !important;
	width: 16px !important;
	height: 16px !important;
}

.wbbPost .messageSidebar .messageAuthorContainer,
.wbbPost .messageSidebar .userTitle,
.wbbPost .messageSidebar .userRank,
.wbbPost .messageSidebar .specialTrophyContainer {
	position: static !important;
	display: block !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 0 10px !important;
	text-align: center !important;
}

.wbbPost .messageSidebar .username,
.wbbPost .messageSidebar .username span {
	display: block !important;
	color: var(--fp-text, #ffffff) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-decoration: none !important;
}

.wbbPost .messageSidebar .userTitle {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 0 12px !important;
	padding: 0 !important;
	overflow: visible !important;
	text-align: center !important;
}

.wbbPost .messageSidebar .userTitle .badge,
.wbbPost .messageSidebar .userTitle .userTitleBadge,
.wbbPost .messageSidebar .userTitleBadge {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative !important;
	width: 86% !important;
	max-width: none !important;
	min-height: 32px !important;
	box-sizing: border-box !important;
	margin: 0 auto !important;
	padding: 6px 12px !important;
	overflow: visible !important;
	border: 0 !important;
	border-radius: 8px !important;
	background: color-mix(in srgb, var(--fp-rank, #1f9a24) 70%, var(--fp-bg, #4a96d0)) !important;
	box-shadow: 0 3px 8px rgba(0, 0, 0, 0.16) !important;
	color: var(--fp-rank-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-rank-text, #ffffff) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	letter-spacing: 0.01em !important;
	text-align: center !important;
	text-overflow: clip !important;
	text-shadow: none !important;
	white-space: normal !important;
	word-break: break-word !important;
}

.wbbPost .messageSidebar .userTitleBadge::before {
	content: none !important;
	display: none !important;
}

.wbbPost .messageSidebar .userTitleBadge,
.wbbPost .messageSidebar .userTitleBadge * {
	color: var(--fp-rank-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-rank-text, #ffffff) !important;
}

.wbbPost .messageSidebar .userRank img {
	display: block !important;
	width: 86% !important;
	max-width: 300px !important;
	height: auto !important;
	margin: 4px auto 0 !important;
}

.wbbPost .messageSidebar .specialTrophyContainer ul {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	gap: 6px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.wbbPost .messageSidebar .userCredits {
	display: block !important;
	width: 100% !important;
	margin: 4px 0 0 !important;
	padding: 0 !important;
}

.wbbPost .messageSidebar .userCredits .dataList,
.wbbPost .messageSidebar .userCredits dl {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: stretch !important;
	gap: 8px !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	font-size: 14px !important;
	text-align: left !important;
}

.wbbPost .messageSidebar .userCredits dl > dt,
.wbbPost .messageSidebar .userCredits dl > dd {
	flex: 1 1 calc(50% - 8px) !important;
	min-height: 36px !important;
	padding: 6px 14px !important;
	box-sizing: border-box !important;
	border: 4px solid transparent !important;
	border-radius: 999px !important;
	background-image:
		linear-gradient(100deg, #2a2a2a 0%, color-mix(in srgb, var(--fp-box, #2a6eae) 42%, #1a1a1a) 38%, var(--fp-box, #2a6eae) 100%),
		linear-gradient(180deg, #d4d4d4 0%, #8d8d8d 100%) !important;
	background-origin: padding-box, border-box !important;
	background-clip: padding-box, border-box !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

.wbbPost .messageSidebar .userCredits dl > dd {
	text-align: right !important;
}

.wbbPost .messageSidebar .userCredits .dataList::before,
.wbbPost .messageSidebar .userCredits dl::before {
	display: none !important;
	content: none !important;
}

.wbbPost .messageSidebar .userCredits .fpCreditRow {
	display: flex !important;
	flex: 1 0 100% !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: 32px !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 18px 0 12px !important;
	background: linear-gradient(90deg, var(--fp-bg-dark, #1a1a1a) 0%, var(--fp-bg, #4a96d0) 46%, var(--fp-rank, #1f9a24) 100%) !important;
	clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%) !important;
	box-shadow: none !important;
}

.wbbPost .messageSidebar .userCredits dt,
.wbbPost .messageSidebar .userCredits dd {
	display: block !important;
	position: static !important;
	float: none !important;
	clear: none !important;
	width: auto !important;
	max-width: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	color: var(--fp-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-text, #ffffff) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45) !important;
	overflow-wrap: normal !important;
	word-break: keep-all !important;
	hyphens: none !important;
}

.wbbPost .messageSidebar .userCredits .fpCreditRow dt,
.wbbPost .messageSidebar .userCredits .fpCreditRow dd {
	display: flex !important;
	align-items: center !important;
	min-height: 32px !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	font-size: 11px !important;
	line-height: 1.1 !important;
}

.wbbPost .messageSidebar .userCredits .fpCreditRow dt {
	flex: 0 1 auto !important;
	max-width: 48% !important;
	padding: 0 8px 0 0 !important;
	background: none !important;
	clip-path: none !important;
	text-align: left !important;
	color: var(--fp-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-text, #ffffff) !important;
}

.wbbPost .messageSidebar .userCredits .fpCreditRow dd {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	clip-path: none !important;
	justify-content: flex-end !important;
	text-align: right !important;
	color: var(--fp-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-text, #ffffff) !important;
}

.wbbPost .messageSidebar .userCredits .fpCreditRow dd,
.wbbPost .messageSidebar .userCredits .fpCreditRow dd * {
	color: var(--fp-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-text, #ffffff) !important;
}

.wbbPost .messageSidebar .userCredits dd > * {
	display: inline !important;
	color: var(--fp-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-text, #ffffff) !important;
}

.wbbPost .messageSidebar .userCredits a,
.wbbPost .messageSidebar .userCredits dt,
.wbbPost .messageSidebar .userCredits dd,
.wbbPost .messageSidebar .userCredits span {
	color: var(--fp-text, #ffffff) !important;
	-webkit-text-fill-color: var(--fp-text, #ffffff) !important;
	text-decoration: none !important;
}

.wbbPost .messageSidebar .userCredits a:hover {
	text-decoration: underline !important;
}

@media screen and (max-width: 800px) {
	.wbbPost.message,
	.wbbPost.messageSidebarOrientationLeft {
		display: flex !important;
		flex-direction: column !important;
	}

	.wbbPost .messageSidebar,
	.wbbPost .messageSidebar + .messageContent {
		flex: 1 1 auto !important;
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.wbbPost .messageSidebar + .messageContent {
		margin-top: 12px !important;
	}
}