CSS Snippet to calculate the real available width of the WordPress block editor

wp-block-editor-get-canvas-width.css

.edit-post-layout:has(.interface-interface-skeleton__secondary-sidebar) {
	--overview-width: 350px;
}

.edit-post-layout.is-sidebar-opened {
	--settings-width: 280px;
}

.edit-post-layout {
	--scrollbar-width: 16px;
	--canvas-width: calc(100vw - var(--overview-width, 0px) - var(--settings-width, 0px) - var(--scrollbar-width));
}