FrankerFaceZ/styles/dialog.scss

.ffz-dialog {
	&:not(.maximized) {
		position: absolute;
		top: 25%;
		left: 25%;

		z-index: 99999999;

		--width: #{"min(75vw, 128rem)"};
		--height: #{"min(75vh, calc(0.75 * var(--width)))"};

		top: #{"calc(calc(100vh - var(--height)) / 2)"};
		left: #{"calc(calc(100vw - var(--width)) / 2)"};

		min-width: 64rem;
		min-height: 30rem;

		max-width: 75vw;
		max-height: 75vh;

		width: 75vw;
		width: var(--width);

		height: 50vh;
		height: var(--height);

		> header {
			cursor: move;
		}

		&.faded {
			opacity: 0.5;

			&:hover {
				opacity: 0.75;
			}
		}
	}

	&.maximized {
		position: absolute;
		top: 0 !important;
		left: 0 !important;

		width: 100%;
		height: 100%;

		&, .tw-root--theme-dark & {
			border: none !important;
		}

		> header {
			cursor: default;
			padding: .9rem 3rem;
		}
	}

	&.exclusive {
		z-index: 1000;
	}

	.want-ps {
		overflow-y: auto;
	}

	> header {
		user-select: none;
		padding: .9rem 1rem .9rem 2rem;

		.tw-search-input {
			max-width: 40rem
		}
	}
}

.ffz-has-dialog {
	position: relative;

	& > :not(.ffz-dialog) {
		visibility: hidden;
	}
}