/*
 * One content width for the whole page.
 *
 * Body text, normal (not wide/full) blocks such as images and tables, and the
 * text inside heroes and covers all use --wp--style--global--content-size
 * (Design Studio: "コンテンツの幅（PC）"). At phone widths the same variable
 * switches to the mobile width ("コンテンツの幅（スマホ）"), so a single pair of
 * settings, e.g. 85vw / 95vw, lines everything up.
 *
 * Loaded unchanged on the front end and inside the editor canvas, so the
 * selectors list every place WordPress may declare the variable
 * (:root on the front end, the editor wrapper inside the canvas) with a
 * higher specificity than the generated global styles.
 */
@media (max-width: 781px) {
	html:root,
	html body,
	html .editor-styles-wrapper {
		--wp--style--global--content-size: var(--wp--custom--block--text-width-mobile, 92vw);
	}
}

/* A wide block is never narrower than a normal one. */
:root .is-layout-constrained > .alignwide {
	max-width: max(var(--wp--style--global--wide-size, 1200px), var(--wp--style--global--content-size, 760px));
}
