#root {
	--ffz-player-width: calc(100vw - var(--ffz-portrait-extra-width));
	--ffz-player-height: calc(calc(calc(var(--ffz-player-width) * 0.5625) + var(--ffz-portrait-extra-height)));
	--ffz-theater-height: calc(calc(100vw * 0.5625) + var(--ffz-portrait-extra-height));
	--ffz-chat-height: calc(100vh - var(--ffz-player-height));

	.chat-shell .ffz--chat-card {
		--width: max(30rem, min(50%, calc(1.5 * var(--ffz-chat-width))));
		width: var(--width);
		margin-left: min(2rem, calc(100% - calc(4rem + var(--width))));
	}

	& > div:first-child > div[class^="Layout-sc"] {
		.ffz--portrait-invert & {
			position: absolute;
			left: 0;
			right: 0;
			bottom: 0;
			top: var(--ffz-chat-height) !important;
		}

		height: var(--ffz-player-height) !important;
	}

	.channel-root__player--with-chat {
		max-height: var(--ffz-player-height) !important;
	}

	.persistent-player.persistent-player__border--mini {
		pointer-events: none;

		body:not(.ffz--portrait-invert) & {
			bottom: var(--ffz-chat-height) !important;
		}

		> * {
			pointer-events: auto;
		}
	}

	.picture-by-picture-player {
		position: absolute;
		z-index: 100;
		top: 0;
		right: 5rem;
		height: 20vh;
		width: calc(20vh * calc(16 / 9)) !important;
	}

	.persistent-player.persistent-player--theatre {
		.ffz--portrait-invert & {
			top: unset !important;
			bottom: 0 !important;
		}

		body:not(.ffz--portrait-invert) & {
			top: 0 !important;
			bottom: unset !important;
		}

		left: 0 !important;
		right: 0 !important;
		height: var(--ffz-theater-height) !important;
		width: 100% !important;
	}

	.whispers--theatre-mode {
		bottom: 0 !important;
		right: 0 !important;
	}

	.channel-root__right-column--expanded {
		min-height: unset !important;
	}

	.right-column {
		display: unset !important;
		position: fixed !important;
		z-index: 2000;
		bottom: 0 !important;
		left: 0 !important;
		right: 0 !important;
		height: var(--ffz-chat-height) !important;
		width: unset !important;

		body:not(.ffz--portrait-invert) & {
			top: unset !important;
			bottom: 0 !important;
			border-top: 1px solid var(--color-border-base);
		}

		.ffz--portrait-invert & {
			top: 0 !important;
			bottom: unset !important;
			border-bottom: 1px solid var(--color-border-base);
		}

		& > .tw-full-height {
			width: 100% !important;
		}

		.right-column__toggle-visibility {
			//position: fixed !important;

			/*body:not(.ffz--portrait-invert) & {
				top: 6.5rem;
			}

			.ffz--portrait-invert & {
				top: calc(var(--ffz-chat-height) + 6.5rem);
			}

			right: .5rem;
			left: unset !important;*/
			transform: rotate(90deg);
		}

		.emote-picker__nav-content-overflow,
		.emote-picker__tab-content {
			max-height: calc(var(--ffz-chat-height) - 26rem);
		}

		.emote-picker__nav-content-overflow {
			height: 100% !important;
		}

		&.right-column--theatre {
			.ffz--portrait-invert & {
				bottom: unset !important;
			}

			body:not(.ffz--portrait-invert) & {
				top: unset !important;
			}

			height: calc(100vh - var(--ffz-theater-height)) !important;

			.emote-picker__nav-content-overflow,
			.emote-picker__tab-content {
				max-height: calc(calc(100vh - var(--ffz-theater-height)) - 26rem);
			}
		}

		.video-chat {
			flex-basis: unset;
		}

		.video-watch-page__right-column,
		.clips-watch-page__right-column,
		.channel-videos__right-column,

		.channel-clips__sidebar,
		.channel-events__sidebar,
		.channel-follow-listing__right-column,
		.channel-root__right-column,
		.channel-page__right-column {
			width: 100% !important;

			& > div {
				border-left: none !important;
			}
		}
	}
}