.rsz-dialog {
	position: fixed;
	inset: 0;
	display: none;
	box-sizing: border-box;
	place-items: center;
	width: 100vw;
	height: 100vh;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	overflow: visible;
	background: transparent;
	color: inherit;
}

.rsz-dialog[open] {
	display: grid;
}

.rsz-dialog::backdrop {
	background: rgb(0 0 0 / 55%);
}

.rsz-dialog__backdrop {
	position: fixed;
	z-index: 0;
	inset: 0;
	background: transparent;
	cursor: pointer;
}

.rsz-dialog__panel {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: var(--rsz-dialog-width, min(90vw, 50rem));
	height: auto;
	max-width: 95vw;
	max-height: 90vh;
	overflow: visible;
	background: #fff;
	color: #1e1e1e;
}

.rsz-dialog__body {
	box-sizing: border-box;
	width: 100%;
	height: var(--rsz-dialog-height, auto);
	max-height: 90vh;
	overflow: auto;
}

.rsz-dialog__body > .wp-block-group {
	box-sizing: border-box;
}

.rsz-dialog__close {
	position: absolute;
	z-index: 2;
	top: 16px;
	right: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid rgb(255 255 255 / 30%);
	border-radius: 50%;
	background: rgb(0 0 0 / 50%);
	color: #fff;
	cursor: pointer;
}

.rsz-dialog__close svg {
	display: block;
	width: 24px;
	height: 24px;
}

.rsz-dialog__close:hover,
.rsz-dialog__close:focus-visible {
	background: rgb(0 0 0 / 80%);
}

.rsz-dialog__close:focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: no-preference) {
	.rsz-dialog[open] {
		animation: rsz-dialog-appear 160ms ease-out;
	}
}

@keyframes rsz-dialog-appear {
	from {
		opacity: 0;
		transform: translateY(0.75rem);
	}
}
