← All changes | build/styles/block-editor/style-rtl.css +642 -372 23.3.0 → trunk View file →

		@@ -67,8 +67,14 @@
67	67	/**
68	68	* Focus styles.
69	69	*/
70	70	/**
	71	+ * Standard focus rings for the WordPress Design System.
	72	+ *
	73	+ * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
	74	+ * e.g. `&:focus { @include outset-ring__focus(); }`.
	75	+ */
	76	+/**
71	77	* Applies editor left position to the selector passed as argument
72	78	*/
73	79	/**
74	80	* Styles that are reused verbatim in a few places
		@@ -157,11 +163,8 @@
157	163	}
158	164	.block-editor-global-styles-background-panel__image-tools-panel-item button.components-button:hover {
159	165	color: var(--wp-admin-theme-color);
160	166	}
161		-.block-editor-global-styles-background-panel__image-tools-panel-item button.components-button:focus {
162		- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
163		-}
164	167	.block-editor-global-styles-background-panel__image-tools-panel-item .block-editor-global-styles-background-panel__loading {
165	168	height: 100%;
166	169	position: absolute;
167	170	z-index: 1;
		@@ -193,12 +196,23 @@
193	196	.block-editor-global-styles-background-panel__reset {
194	197	transition: opacity 0.1s ease-in-out;
195	198	}
196	199	}
	200	+.block-editor-global-styles-background-panel__reset.has-local-override-from-global-styles__reset {
	201	+ position: absolute;
	202	+ display: inline-flex;
	203	+ align-items: center;
	204	+ justify-content: center;
	205	+ top: 50%;
	206	+ transform: translateY(-50%);
	207	+ margin-block: 0;
	208	+ margin-inline: 0 8px;
	209	+ opacity: 1;
	210	+}
197	211	.block-editor-global-styles-background-panel__reset.block-editor-global-styles-background-panel__reset {
198	212	border-radius: 2px;
199	213	}
200		-.block-editor-global-styles-background-panel__dropdown-toggle:hover + .block-editor-global-styles-background-panel__reset, .block-editor-global-styles-background-panel__reset:focus, .block-editor-global-styles-background-panel__reset:hover {
	214	+.block-editor-global-styles-background-panel__dropdown-toggle:hover + .block-editor-global-styles-background-panel__reset, .block-editor-global-styles-background-panel__reset:focus, .block-editor-global-styles-background-panel__reset:focus-within, .block-editor-global-styles-background-panel__reset:hover {
201	215	opacity: 1;
202	216	}
203	217	@media (hover: none) {
204	218	.block-editor-global-styles-background-panel__reset {
		@@ -243,11 +257,11 @@
243	257	z-index: 159890;
244	258	}
245	259
246	260	.block-editor-global-styles-background-panel__media-replace-popover .components-popover__content {
247		- width: 226px;
	261	+ width: auto;
248	262	}
249		-.block-editor-global-styles-background-panel__media-replace-popover .components-button {
	263	+.block-editor-global-styles-background-panel__media-replace-popover .components-menu-item__button.components-button {
250	264	padding: 0 8px;
251	265	}
252	266	.block-editor-global-styles-background-panel__media-replace-popover .components-button .components-menu-items__item-icon.has-icon-right {
253	267	margin-right: 16px;
		@@ -281,13 +295,8 @@
281	295	}
282	296	.block-editor-block-icon.has-colors svg {
283	297	fill: currentColor;
284	298	}
285		-@media (forced-colors: active) {
286		- .block-editor-block-icon.has-colors svg {
287		- fill: CanvasText;
288		- }
289		-}
290	299	.block-editor-block-icon svg {
291	300	min-width: 20px;
292	301	min-height: 20px;
293	302	max-width: 24px;
		@@ -330,8 +339,21 @@
330	339	padding: 32px 16px;
331	340	text-align: center;
332	341	}
333	342
	343	+.block-editor-block-inspector__state-badges {
	344	+ display: flex;
	345	+ align-items: center;
	346	+ flex-wrap: wrap;
	347	+ gap: 8px;
	348	+ padding: 8px 16px;
	349	+ margin-top: -16px;
	350	+}
	351	+
	352	+.block-editor-block-inspector__state-badges-text {
	353	+ white-space: nowrap;
	354	+}
	355	+
334	356	.block-editor-block-inspector__no-block-tools {
335	357	border-top: 1px solid #ddd;
336	358	}
337	359
		@@ -458,8 +480,14 @@
458	480	}
459	481	.show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar.has-parent {
460	482	margin-right: 0;
461	483	}
	484	+.components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar.has-parent:has(.block-editor-block-parent-selector__inserter) {
	485	+ margin-right: calc(48px + 24px + 12px + 8px + 2 * 1px);
	486	+}
	487	+.show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar.has-parent:has(.block-editor-block-parent-selector__inserter) {
	488	+ margin-right: 0;
	489	+}
462	490	.components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar {
463	491	overflow: visible;
464	492	}
465	493	.components-popover.block-editor-block-list__block-popover .block-editor-block-toolbar .components-toolbar-group,
		@@ -480,8 +508,67 @@
480	508	.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector {
481	509	position: absolute;
482	510	right: calc(-48px - 8px - 1px);
483	511	}
	512	+.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector:has(.block-editor-block-parent-selector__inserter) {
	513	+ right: calc(-48px - 24px - 12px - 8px - 3 * 1px);
	514	+ border: 1px solid #1e1e1e;
	515	+ border-radius: 2px;
	516	+ background-color: #fff;
	517	+}
	518	+.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector:has(.block-editor-block-parent-selector__inserter) > .components-toolbar-group:last-child {
	519	+ border-left: none;
	520	+}
	521	+.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector:has(.block-editor-block-parent-selector__inserter) .block-editor-block-parent-selector__button {
	522	+ border: none;
	523	+ background: none;
	524	+}
	525	+.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon {
	526	+ color: #fff;
	527	+ background: transparent;
	528	+}
	529	+.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon::after {
	530	+ content: "";
	531	+ position: absolute;
	532	+ z-index: -1;
	533	+ top: 50%;
	534	+ right: 50%;
	535	+ transform: translate(50%, -50%);
	536	+ width: 24px;
	537	+ height: 24px;
	538	+ border-radius: 2px;
	539	+ background: #1e1e1e;
	540	+}
	541	+.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover {
	542	+ color: #fff;
	543	+}
	544	+.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover::after {
	545	+ background: var(--wp-admin-theme-color);
	546	+}
	547	+.show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon {
	548	+ width: auto;
	549	+ padding: 0 12px;
	550	+ color: inherit;
	551	+}
	552	+.show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon svg {
	553	+ display: none;
	554	+}
	555	+.show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon::after {
	556	+ content: attr(aria-label);
	557	+ position: static;
	558	+ transform: none;
	559	+ width: auto;
	560	+ height: auto;
	561	+ border-radius: 0;
	562	+ background: none;
	563	+ white-space: nowrap;
	564	+}
	565	+.show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover {
	566	+ color: var(--wp-admin-theme-color);
	567	+}
	568	+.show-icon-labels .components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector .block-editor-block-parent-selector__inserter.components-button.has-icon:hover::after {
	569	+ background: none;
	570	+}
484	571	.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector::before {
485	572	content: "";
486	573	}
487	574	.components-popover.block-editor-block-list__block-popover .block-editor-block-parent-selector::after {
		@@ -547,9 +634,9 @@
547	634	.block-editor-block-lock-modal__options-all {
548	635	padding: 12px 0;
549	636	}
550	637	.block-editor-block-lock-modal__options-all .components-checkbox-control__label {
551		- font-weight: 600;
	638	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
552	639	}
553	640
554	641	.block-editor-block-lock-modal__checklist-item {
555	642	display: flex;
		@@ -561,9 +648,9 @@
561	648	}
562	649	.block-editor-block-lock-modal__checklist-item .block-editor-block-lock-modal__lock-icon {
563	650	flex-shrink: 0;
564	651	margin-left: 12px;
565		- fill: #1e1e1e;
	652	+ color: #1e1e1e;
566	653	}
567	654	.block-editor-block-lock-modal__checklist-item:hover {
568	655	background-color: #f0f0f0;
569	656	border-radius: 2px;
		@@ -666,13 +753,14 @@
666	753	height: auto !important;
667	754	}
668	755
669	756	.block-editor-block-card__title {
670		- font-weight: 499;
	757	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
671	758	display: flex;
672	759	align-items: center;
673	760	flex-wrap: wrap;
674	761	gap: 4px 8px;
	762	+ overflow-wrap: anywhere;
675	763	}
676	764	.block-editor-block-card__title.block-editor-block-card__title {
677	765	font-size: 13px;
678	766	line-height: 1.4;
		@@ -797,9 +885,9 @@
797	885	min-width: 18px;
798	886	min-height: 18px;
799	887	}
800	888	.block-editor-block-draggable-chip .components-flex__item {
801		- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	889	+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
802	890	font-size: 13px;
803	891	}
804	892
805	893	.block-editor-block-draggable-chip__disabled.block-editor-block-draggable-chip__disabled {
		@@ -853,9 +941,9 @@
853	941	background-color: #fff;
854	942	z-index: 1;
855	943	}
856	944	.block-editor-block-manager__category-title .components-checkbox-control__label {
857		- font-weight: 600;
	945	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
858	946	}
859	947
860	948	.block-editor-block-manager__checklist {
861	949	margin-top: 0;
		@@ -878,8 +966,9 @@
878	966	}
879	967	.block-editor-block-manager__checklist-item .block-editor-block-icon {
880	968	margin-left: 10px;
881	969	fill: #1e1e1e;
	970	+ color: #1e1e1e;
882	971	}
883	972
884	973	.block-editor-block-manager__results {
885	974	border-top: 1px solid #ddd;
		@@ -968,16 +1057,8 @@
968	1057	animation: components-button__appear-animation 0.1s ease;
969	1058	animation-fill-mode: forwards;
970	1059	}
971	1060	}
972		-.components-button.block-editor-block-mover-button:focus, .components-button.block-editor-block-mover-button:focus:enabled, .components-button.block-editor-block-mover-button:focus::before {
973		- box-shadow: none;
974		- outline: none;
975		-}
976		-.components-button.block-editor-block-mover-button:focus-visible::before {
977		- box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
978		- outline: 2px solid transparent;
979		-}
980	1061
981	1062	.block-editor-block-navigation__container {
982	1063	min-width: 280px;
983	1064	}
		@@ -986,9 +1067,9 @@
986	1067	margin: 0 0 12px;
987	1068	color: #757575;
988	1069	text-transform: uppercase;
989	1070	font-size: 11px;
990		- font-weight: 499;
	1071	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
991	1072	}
992	1073
993	1074	.block-editor-block-patterns-list__list-item {
994	1075	cursor: var(--wpds-cursor-control, pointer);
		@@ -1050,9 +1131,9 @@
1050	1131	min-width: 24px;
1051	1132	height: 24px;
1052	1133	}
1053	1134	.block-editor-block-patterns-list__item .block-editor-patterns__pattern-icon-wrapper .block-editor-patterns__pattern-icon {
1054		- fill: var(--wp-block-synced-color);
	1135	+ color: var(--wp-block-synced-color);
1055	1136	}
1056	1137
1057	1138	.block-editor-patterns__grid-pagination-wrapper .block-editor-patterns__grid-pagination {
1058	1139	border-top: 1px solid #2f2f2f;
		@@ -1139,9 +1220,9 @@
1139	1220	z-index: 1;
1140	1221	}
1141	1222
1142	1223	.block-editor-block-quick-navigation__item {
1143		- font-weight: 400;
	1224	+ font-weight: var(--wpds-typography-font-weight-default, 400);
1144	1225	}
1145	1226
1146	1227	.block-editor-block-rename-modal {
1147	1228	z-index: 1000001;
		@@ -1164,37 +1245,17 @@
1164	1245	grid-column: 1/-1;
1165	1246	}
1166	1247
1167	1248	.block-editor-block-styles__variants {
1168		- display: flex;
1169		- flex-wrap: wrap;
1170		- justify-content: space-between;
	1249	+ display: grid;
1171	1250	gap: 8px;
1172	1251	}
1173		-.block-editor-block-styles__variants button.components-button.block-editor-block-styles__item {
1174		- color: #1e1e1e;
1175		- box-shadow: inset 0 0 0 1px #ddd;
1176		- display: inline-block;
1177		- width: calc(50% - 4px);
	1252	+.block-editor-block-styles__variants .block-editor-block-styles__row {
	1253	+ display: grid;
	1254	+ grid-template-columns: repeat(2, minmax(0, 1fr));
	1255	+ gap: 8px;
1178	1256	}
1179		-.block-editor-block-styles__variants button.components-button.block-editor-block-styles__item:hover {
1180		- color: var(--wp-admin-theme-color);
1181		- box-shadow: inset 0 0 0 1px #ddd;
1182		-}
1183		-.block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active, .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active:hover {
1184		- background-color: #1e1e1e;
1185		- box-shadow: none;
1186		-}
1187		-.block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active .block-editor-block-styles__item-text, .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active:hover .block-editor-block-styles__item-text {
1188		- color: #fff;
1189		-}
1190		-.block-editor-block-styles__variants button.components-button.block-editor-block-styles__item:focus, .block-editor-block-styles__variants button.components-button.block-editor-block-styles__item.is-active:focus {
1191		- box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1192		- outline: 2px solid transparent;
1193		-}
1194	1257	.block-editor-block-styles__variants .block-editor-block-styles__item-text {
1195		- word-break: break-all;
1196		- white-space: normal;
1197	1258	text-align: start;
1198	1259	text-align-last: center;
1199	1260	}
1200	1261
		@@ -1280,9 +1341,8 @@
1280	1341	padding: 8px;
1281	1342	}
1282	1343
1283	1344	.block-editor-block-types-list > [role=presentation] {
1284		- overflow: hidden;
1285	1345	display: flex;
1286	1346	flex-wrap: wrap;
1287	1347	}
1288	1348
		@@ -1484,12 +1544,8 @@
1484	1544	margin: 0;
1485	1545	min-width: 0;
1486	1546	}
1487	1547
1488		-.block-editor-panel-color-gradient-settings.block-editor-panel-color-gradient-settings, .block-editor-panel-color-gradient-settings.block-editor-panel-color-gradient-settings > div:not(:first-of-type) {
1489		- display: block;
1490		-}
1491		-
1492	1548	@media screen and (min-width: 782px) {
1493	1549	.block-editor-panel-color-gradient-settings .components-circular-option-picker__swatches {
1494	1550	display: grid;
1495	1551	grid-template-columns: repeat(6, 28px);
		@@ -1497,8 +1553,18 @@
1497	1553	}
1498	1554	.block-editor-block-inspector .block-editor-panel-color-gradient-settings .components-base-control {
1499	1555	margin-bottom: inherit;
1500	1556	}
	1557	+.block-editor-panel-color-gradient-settings {
	1558	+ /* Increased specificity required to remove the slot wrapper's row gap */
	1559	+}
	1560	+.block-editor-panel-color-gradient-settings.block-editor-panel-color-gradient-settings .block-editor-panel-color-gradient-settings__inner-wrapper {
	1561	+ grid-column: 1/-1;
	1562	+ row-gap: 0;
	1563	+}
	1564	+.block-editor-panel-color-gradient-settings.block-editor-panel-color-gradient-settings .block-editor-panel-color-gradient-settings__inner-wrapper > * {
	1565	+ grid-column: 1/-1;
	1566	+}
1501	1567
1502	1568	.block-editor-panel-color-gradient-settings__dropdown-content {
1503	1569	min-height: 160px;
1504	1570	}
		@@ -1510,8 +1576,12 @@
1510	1576	.block-editor-panel-color-gradient-settings__color-indicator {
1511	1577	background: linear-gradient(45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
1512	1578	}
1513	1579
	1580	+.block-editor-panel-color-gradient-settings__contrast-notice {
	1581	+ margin-top: 16px;
	1582	+}
	1583	+
1514	1584	/**
1515	1585	* The following styles replicate the separated border of the
1516	1586	* `ItemGroup` component but allows for hidden items. This is because
1517	1587	* to maintain the order of `ToolsPanel` controls, each `ToolsPanelItem`
		@@ -1516,10 +1586,14 @@
1516	1586	* `ItemGroup` component but allows for hidden items. This is because
1517	1587	* to maintain the order of `ToolsPanel` controls, each `ToolsPanelItem`
1518	1588	* must at least render a placeholder which would otherwise interfere
1519	1589	* with the `:last-child` styles.
	1590	+*
	1591	+* Applied via the shared `block-editor-color-gradient-item` class on
	1592	+* color/gradient dropdown items across the Color, Background, and
	1593	+* Typography panels.
1520	1594	*/
1521		-.block-editor-tools-panel-color-gradient-settings__item {
	1595	+.block-editor-color-gradient-item {
1522	1596	padding: 0;
1523	1597	max-width: 100%;
1524	1598	position: relative;
1525	1599	border-right: 1px solid #ddd;
		@@ -1525,20 +1599,19 @@
1525	1599	border-right: 1px solid #ddd;
1526	1600	border-left: 1px solid #ddd;
1527	1601	border-bottom: 1px solid #ddd;
1528	1602	}
1529		-.block-editor-tools-panel-color-gradient-settings__item:nth-child(1 of .block-editor-tools-panel-color-gradient-settings__item) {
1530		- margin-top: 24px;
	1603	+.block-editor-color-gradient-item:nth-child(1 of .block-editor-color-gradient-item) {
1531	1604	border-top-right-radius: 2px;
1532	1605	border-top-left-radius: 2px;
1533	1606	border-top: 1px solid #ddd;
1534	1607	}
1535		-.block-editor-tools-panel-color-gradient-settings__item:nth-last-child(1 of .block-editor-tools-panel-color-gradient-settings__item) {
	1608	+.block-editor-color-gradient-item:nth-last-child(1 of .block-editor-color-gradient-item) {
1536	1609	border-bottom-right-radius: 2px;
1537	1610	border-bottom-left-radius: 2px;
1538	1611	}
1539		-.block-editor-tools-panel-color-gradient-settings__item > div,
1540		-.block-editor-tools-panel-color-gradient-settings__item > div > button {
	1612	+.block-editor-color-gradient-item > div,
	1613	+.block-editor-color-gradient-item > div > button {
1541	1614	border-radius: inherit;
1542	1615	}
1543	1616
1544	1617	.block-editor-tools-panel-color-gradient-settings__dropdown {
		@@ -1555,13 +1628,17 @@
1555	1628	background: #f0f0f0;
1556	1629	color: var(--wp-admin-theme-color);
1557	1630	}
1558	1631	.block-editor-tools-panel-color-gradient-settings__dropdown .block-editor-panel-color-gradient-settings__color-name {
	1632	+ min-width: 0;
1559	1633	white-space: nowrap;
1560	1634	overflow: hidden;
1561	1635	text-overflow: ellipsis;
1562	1636	max-width: calc(100% - 44px);
1563	1637	}
	1638	+.block-editor-tools-panel-color-gradient-settings__dropdown > button.has-contrast-warning .block-editor-panel-color-gradient-settings__color-name {
	1639	+ max-width: calc(100% - 72px);
	1640	+}
1564	1641
1565	1642	.block-editor-panel-color-gradient-settings__dropdown {
1566	1643	width: 100%;
1567	1644	}
		@@ -1568,8 +1645,21 @@
1568	1645	.block-editor-panel-color-gradient-settings__dropdown .component-color-indicator {
1569	1646	flex-shrink: 0;
1570	1647	}
1571	1648
	1649	+.block-editor-panel-color-gradient-settings__labeled-indicators {
	1650	+ width: 100%;
	1651	+ min-width: 0;
	1652	+}
	1653	+
	1654	+.block-editor-panel-color-gradient-settings__color-indicators {
	1655	+ display: flex;
	1656	+ flex-shrink: 0;
	1657	+}
	1658	+.block-editor-panel-color-gradient-settings__color-indicators > * + * {
	1659	+ margin-inline-start: -8px;
	1660	+}
	1661	+
1572	1662	.block-editor-panel-color-gradient-settings__reset {
1573	1663	position: absolute;
1574	1664	left: 0;
1575	1665	top: 8px;
		@@ -1591,9 +1681,22 @@
1591	1681	.block-editor-panel-color-gradient-settings__reset {
1592	1682	opacity: 1;
1593	1683	}
1594	1684	}
	1685	+.block-editor-panel-color-gradient-settings__dropdown.has-contrast-warning + .block-editor-panel-color-gradient-settings__reset {
	1686	+ left: 28px;
	1687	+}
1595	1688
	1689	+.block-editor-panel-color-gradient-settings__contrast-warning {
	1690	+ position: absolute;
	1691	+ left: 0;
	1692	+ top: 8px;
	1693	+ margin: auto 8px auto;
	1694	+}
	1695	+.block-editor-panel-color-gradient-settings__contrast-warning.block-editor-panel-color-gradient-settings__contrast-warning {
	1696	+ border-radius: 2px;
	1697	+}
	1698	+
1596	1699	.block-editor-date-format-picker {
1597	1700	margin: 0 0 16px;
1598	1701	padding: 0;
1599	1702	border: none;
		@@ -1602,8 +1705,14 @@
1602	1705	.block-editor-date-format-picker__custom-format-select-control__custom-option {
1603	1706	border-top: 1px solid #ddd;
1604	1707	}
1605	1708
	1709	+.block-editor-dimension-control {
	1710	+ border: 0;
	1711	+ margin: 0;
	1712	+ padding: 0;
	1713	+}
	1714	+
1606	1715	.block-editor-duotone-control__popover.components-popover > .components-popover__content {
1607	1716	padding: 8px;
1608	1717	width: 260px;
1609	1718	}
		@@ -1656,8 +1765,13 @@
1656	1765	.block-editor-global-styles-state-control__badges {
1657	1766	min-height: 24px;
1658	1767	}
1659	1768
	1769	+.block-editor-global-styles-state-control__badge-tooltip-trigger {
	1770	+ display: inline-flex;
	1771	+ max-width: 100%;
	1772	+}
	1773	+
1660	1774	.block-editor-global-styles-filters-panel__dropdown,
1661	1775	.block-editor-global-styles__shadow-dropdown {
1662	1776	display: block;
1663	1777	padding: 0;
		@@ -1675,8 +1789,17 @@
1675	1789	.block-editor-global-styles__shadow-dropdown-toggle.is-open {
1676	1790	background-color: #f0f0f0;
1677	1791	}
1678	1792
	1793	+.block-editor-panel-duotone-settings__label-row {
	1794	+ width: 100%;
	1795	+ min-width: 0;
	1796	+}
	1797	+
	1798	+.block-editor-panel-duotone-settings__label {
	1799	+ min-width: 0;
	1800	+}
	1801	+
1679	1802	.block-editor-global-styles__shadow-editor__remove-button {
1680	1803	position: absolute;
1681	1804	left: 0;
1682	1805	top: 8px;
		@@ -1758,8 +1881,187 @@
1758	1881	opacity: 1;
1759	1882	}
1760	1883	}
1761	1884
	1885	+.block-editor-global-styles__text-shadow {
	1886	+ width: 260px;
	1887	+ padding: 8px;
	1888	+}
	1889	+
	1890	+.block-editor-global-styles__text-shadow-preview {
	1891	+ display: flex;
	1892	+ align-items: center;
	1893	+ justify-content: center;
	1894	+ height: 80px;
	1895	+ border: #ddd 1px solid;
	1896	+ border-radius: 2px;
	1897	+ font-size: 24px;
	1898	+ margin-bottom: 16px;
	1899	+ background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
	1900	+ background-position: 0 0, 8px 8px;
	1901	+ background-size: 16px 16px;
	1902	+}
	1903	+
	1904	+.block-editor-global-styles__text-shadow-list-item {
	1905	+ justify-content: space-between;
	1906	+ gap: 8px;
	1907	+ width: 100%;
	1908	+}
	1909	+.block-editor-global-styles__text-shadow-list-item:not(.is-active) svg {
	1910	+ opacity: 0;
	1911	+}
	1912	+
	1913	+.block-editor-global-styles__text-shadow-dropdown {
	1914	+ display: block;
	1915	+ padding: 0;
	1916	+ position: relative;
	1917	+ border: 1px solid #ddd;
	1918	+ border-radius: 2px;
	1919	+}
	1920	+
	1921	+.block-editor-global-styles__text-shadow-dropdown-toggle {
	1922	+ width: 100%;
	1923	+ padding: 8px;
	1924	+}
	1925	+.block-editor-global-styles__text-shadow-dropdown-toggle.is-open {
	1926	+ background-color: #f0f0f0;
	1927	+}
	1928	+
	1929	+.block-editor-global-styles__text-shadow-remove-button {
	1930	+ position: absolute;
	1931	+ left: 8px;
	1932	+ top: 8px;
	1933	+ opacity: 0;
	1934	+}
	1935	+@media not (prefers-reduced-motion) {
	1936	+ .block-editor-global-styles__text-shadow-remove-button {
	1937	+ transition: opacity 0.1s ease-in-out;
	1938	+ }
	1939	+}
	1940	+.block-editor-global-styles__text-shadow-dropdown:hover .block-editor-global-styles__text-shadow-remove-button, .block-editor-global-styles__text-shadow-remove-button:focus, .block-editor-global-styles__text-shadow-remove-button:hover {
	1941	+ opacity: 1;
	1942	+}
	1943	+@media (hover: none) {
	1944	+ .block-editor-global-styles__text-shadow-remove-button {
	1945	+ opacity: 1;
	1946	+ }
	1947	+}
	1948	+
	1949	+.is-inherited-from-global-styles .components-base-control__label,
	1950	+.is-inherited-from-global-styles .components-input-control__label {
	1951	+ text-decoration-line: underline;
	1952	+ text-decoration-style: dotted;
	1953	+ text-decoration-thickness: 1px;
	1954	+ text-underline-offset: 0.2em;
	1955	+}
	1956	+.is-inherited-from-global-styles .block-editor-panel-color-gradient-settings__color-name,
	1957	+.is-inherited-from-global-styles .block-editor-global-styles-background-panel__inspector-media-replace-title,
	1958	+.is-inherited-from-global-styles .block-editor-panel-duotone-settings__label {
	1959	+ border-bottom: 1px dotted currentColor;
	1960	+}
	1961	+
	1962	+.has-local-override-from-global-styles {
	1963	+ position: relative;
	1964	+}
	1965	+
	1966	+.global-styles-inheritance-affordance {
	1967	+ position: absolute;
	1968	+ inset-block-start: 0;
	1969	+ inset-inline-end: 0;
	1970	+ z-index: 1;
	1971	+ display: flex;
	1972	+ align-items: center;
	1973	+ justify-content: center;
	1974	+ pointer-events: none;
	1975	+ height: 16px;
	1976	+}
	1977	+.global-styles-inheritance-affordance--offset-toggle {
	1978	+ inset-inline-end: 32px;
	1979	+}
	1980	+.global-styles-inheritance-affordance .has-local-override-from-global-styles__reset {
	1981	+ pointer-events: auto;
	1982	+ margin-inline-start: 0 !important;
	1983	+}
	1984	+
	1985	+.has-local-override-from-global-styles__reset {
	1986	+ display: inline-flex !important;
	1987	+ align-items: center;
	1988	+ justify-content: center;
	1989	+ vertical-align: middle;
	1990	+ position: relative;
	1991	+ margin-inline-start: 6px;
	1992	+ min-width: 14px !important;
	1993	+ width: 14px !important;
	1994	+ height: 14px !important;
	1995	+ padding: 0 !important;
	1996	+ border-radius: 50% !important;
	1997	+ background: transparent !important;
	1998	+ box-shadow: none !important;
	1999	+ overflow: hidden;
	2000	+ text-transform: none;
	2001	+ letter-spacing: normal;
	2002	+ cursor: var(--wpds-cursor-control, pointer);
	2003	+}
	2004	+.has-local-override-from-global-styles__reset:hover, .has-local-override-from-global-styles__reset:focus {
	2005	+ background: transparent !important;
	2006	+}
	2007	+.has-local-override-from-global-styles__reset:hover .has-local-override-from-global-styles__dot, .has-local-override-from-global-styles__reset:focus .has-local-override-from-global-styles__dot {
	2008	+ display: none;
	2009	+}
	2010	+.has-local-override-from-global-styles__reset:hover .has-local-override-from-global-styles__reset-icon, .has-local-override-from-global-styles__reset:focus .has-local-override-from-global-styles__reset-icon {
	2011	+ display: block;
	2012	+}
	2013	+.has-local-override-from-global-styles__reset:focus-visible {
	2014	+ outline: 1.5px solid var(--wp-admin-theme-color, #007cba);
	2015	+ outline-offset: 1px;
	2016	+}
	2017	+.has-local-override-from-global-styles__reset.block-editor-panel-color-gradient-settings__reset {
	2018	+ position: absolute;
	2019	+ justify-content: center;
	2020	+ top: 50%;
	2021	+ transform: translateY(-50%);
	2022	+ margin-block: 0;
	2023	+ margin-inline-start: 0;
	2024	+ opacity: 1;
	2025	+}
	2026	+.has-local-override-from-global-styles__reset.block-editor-global-styles__shadow-editor__remove-button {
	2027	+ position: absolute;
	2028	+ justify-content: center;
	2029	+ inset-inline-end: 8px;
	2030	+ top: 50%;
	2031	+ transform: translateY(-50%);
	2032	+ margin-block: 0;
	2033	+ margin-inline-start: 0;
	2034	+ opacity: 1;
	2035	+}
	2036	+.has-local-override-from-global-styles__reset.block-editor-panel-duotone-settings__reset {
	2037	+ position: absolute;
	2038	+ justify-content: center;
	2039	+ inset-inline-end: 8px;
	2040	+ top: 50%;
	2041	+ transform: translateY(-50%);
	2042	+ margin-block: 0;
	2043	+ margin-inline-start: 0;
	2044	+ opacity: 1;
	2045	+}
	2046	+
	2047	+.has-local-override-from-global-styles__dot {
	2048	+ display: block;
	2049	+ width: 8px;
	2050	+ height: 8px;
	2051	+ background-color: var(--wp-admin-theme-color, #007cba);
	2052	+ border-radius: 50%;
	2053	+}
	2054	+
	2055	+.has-local-override-from-global-styles__reset-icon {
	2056	+ display: none;
	2057	+ position: absolute;
	2058	+ top: 50%;
	2059	+ right: 50%;
	2060	+ transform: translate(50%, -50%);
	2061	+ color: var(--wp-admin-theme-color, #007cba);
	2062	+}
	2063	+
1762	2064	.block-editor-grid-visualizer.block-editor-grid-visualizer.block-editor-grid-visualizer {
1763	2065	z-index: 30;
1764	2066	}
1765	2067	.block-editor-grid-visualizer.block-editor-grid-visualizer.block-editor-grid-visualizer .components-popover__content * {
		@@ -1864,16 +2166,8 @@
1864	2166	animation: components-button__appear-animation 0.1s ease;
1865	2167	animation-fill-mode: forwards;
1866	2168	}
1867	2169	}
1868		-.block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button:focus, .block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button:focus:enabled, .block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button:focus::before {
1869		- box-shadow: none;
1870		- outline: none;
1871		-}
1872		-.block-editor-grid-item-mover__move-button-container .block-editor-grid-item-mover-button:focus-visible::before {
1873		- box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1874		- outline: 2px solid transparent;
1875		-}
1876	2170
1877	2171	.block-editor-grid-item-mover__move-vertical-button-container {
1878	2172	display: flex;
1879	2173	position: relative;
		@@ -1987,8 +2281,27 @@
1987	2281	position: absolute;
1988	2282	left: 0;
1989	2283	}
1990	2284
	2285	+.wp-block-image__crop-area {
	2286	+ position: relative;
	2287	+ max-width: 100%;
	2288	+ width: 100%;
	2289	+ overflow: hidden;
	2290	+}
	2291	+.wp-block-image__crop-area .reactEasyCrop_Container {
	2292	+ pointer-events: auto;
	2293	+}
	2294	+.wp-block-image__crop-area .reactEasyCrop_Container .reactEasyCrop_Image {
	2295	+ border: none;
	2296	+ border-radius: 0;
	2297	+}
	2298	+
	2299	+.wp-block-image__zoom .components-popover__content {
	2300	+ min-width: 260px;
	2301	+ overflow: visible !important;
	2302	+}
	2303	+
1991	2304	.block-editor-block-types-list__list-item {
1992	2305	display: block;
1993	2306	width: 33.33%;
1994	2307	padding: 0;
		@@ -2018,9 +2331,10 @@
2018	2331	align-items: stretch;
2019	2332	justify-content: center;
2020	2333	cursor: var(--wpds-cursor-control, pointer);
2021	2334	background: transparent;
2022		- word-break: break-word;
	2335	+ word-break: normal;
	2336	+ overflow-wrap: break-word;
2023	2337	}
2024	2338	@media not (prefers-reduced-motion) {
2025	2339	.components-button.block-editor-block-types-list__item {
2026	2340	transition: all 0.05s ease-in-out;
		@@ -2052,17 +2366,8 @@
2052	2366	opacity: 0.04;
2053	2367	background: var(--wp-admin-theme-color);
2054	2368	pointer-events: none;
2055	2369	}
2056		-.components-button.block-editor-block-types-list__item:not(:disabled, [aria-disabled=true]).is-active {
2057		- color: #fff;
2058		- background: #1e1e1e;
2059		- outline: 2px solid transparent;
2060		- outline-offset: -2px;
2061		-}
2062		-.components-button.block-editor-block-types-list__item:not(:disabled):focus {
2063		- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2064		-}
2065	2370
2066	2371	.block-editor-block-types-list__item-icon {
2067	2372	padding: 12px 20px;
2068	2373	color: #1e1e1e;
		@@ -2235,9 +2540,9 @@
2235	2540	display: inline-block;
2236	2541	width: 100%;
2237	2542	}
2238	2543	.block-editor-link-control__search-item .components-menu-item__item mark {
2239		- font-weight: 600;
	2544	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2240	2545	color: inherit;
2241	2546	background-color: transparent;
2242	2547	}
2243	2548	.block-editor-link-control__search-item .components-menu-item__shortcut {
		@@ -2284,9 +2589,9 @@
2284	2589	width: 32px;
2285	2590	max-height: 32px;
2286	2591	}
2287	2592	.block-editor-link-control__preview .block-editor-link-control__preview-title {
2288		- line-height: 1.1;
	2593	+ line-height: var(--wpds-typography-line-height-sm, 20px);
2289	2594	}
2290	2595	.block-editor-link-control__preview .block-editor-link-control__preview-title:focus {
2291	2596	box-shadow: none;
2292	2597	}
		@@ -2295,14 +2600,14 @@
2295	2600	outline: 2px solid transparent;
2296	2601	text-decoration: none;
2297	2602	}
2298	2603	.block-editor-link-control__preview .block-editor-link-control__preview-title mark {
2299		- font-weight: 600;
	2604	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2300	2605	color: inherit;
2301	2606	background-color: transparent;
2302	2607	}
2303	2608	.block-editor-link-control__preview .block-editor-link-control__preview-title span {
2304		- font-weight: normal;
	2609	+ font-weight: 400;
2305	2610	}
2306	2611	.block-editor-link-control__preview .block-editor-link-control__preview-title .components-external-link__icon {
2307	2612	position: absolute;
2308	2613	width: 1px;
		@@ -2309,9 +2614,9 @@
2309	2614	height: 1px;
2310	2615	padding: 0;
2311	2616	margin: -1px;
2312	2617	overflow: hidden;
2313		- clip: rect(0, 0, 0, 0);
	2618	+ clip-path: inset(50%);
2314	2619	border: 0;
2315	2620	}
2316	2621
2317	2622	.block-editor-link-control__preview.is-fetching .block-editor-link-control__preview-icon svg,
		@@ -2453,9 +2758,8 @@
2453	2758	.link-preview-button.components-button {
2454	2759	width: 100%;
2455	2760	height: auto;
2456	2761	padding: 12px;
2457		- box-shadow: inset 0 0 0 1px #949494;
2458	2762	border-color: #949494;
2459	2763	}
2460	2764
2461	2765	.link-preview-button__image-container {
		@@ -2493,9 +2797,9 @@
2493	2797	}
2494	2798
2495	2799	.link-preview-button__title {
2496	2800	margin-top: 4px;
2497		- font-weight: 500;
	2801	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2498	2802	color: #1e1e1e;
2499	2803	display: block;
2500	2804	}
2501	2805
		@@ -2530,8 +2834,11 @@
2530	2834	.block-editor-list-view-leaf {
2531	2835	position: relative;
2532	2836	transform: translateY(0);
2533	2837	}
	2838	+.block-editor-list-view-leaf:focus-within, .block-editor-list-view-leaf.is-nesting {
	2839	+ z-index: 1;
	2840	+}
2534	2841	.block-editor-list-view-leaf.is-draggable, .block-editor-list-view-leaf.is-draggable .block-editor-list-view-block-contents {
2535	2842	cursor: grab;
2536	2843	}
2537	2844	.block-editor-list-view-leaf .block-editor-list-view-block-select-button[aria-expanded=true] {
		@@ -2542,13 +2849,8 @@
2542	2849	}
2543	2850	.block-editor-list-view-leaf .block-editor-list-view-block-select-button svg {
2544	2851	fill: currentColor;
2545	2852	}
2546		-@media (forced-colors: active) {
2547		- .block-editor-list-view-leaf .block-editor-list-view-block-select-button svg {
2548		- fill: CanvasText;
2549		- }
2550		-}
2551	2853	.is-dragging-components-draggable .block-editor-list-view-leaf:not(.is-selected) .block-editor-list-view-block-select-button:hover {
2552	2854	color: inherit;
2553	2855	}
2554	2856	.block-editor-list-view-leaf.is-selected td {
		@@ -2560,23 +2862,45 @@
2560	2862	.block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block-contents:hover, .block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block-contents:focus,
2561	2863	.block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block-contents .block-editor-block-icon {
2562	2864	color: var(--wp-block-synced-color);
2563	2865	}
2564		-.block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block-contents:focus::after {
2565		- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-block-synced-color);
	2866	+.block-editor-list-view-leaf.is-synced .block-editor-list-view-block-contents:focus::after {
	2867	+ --focus-color: var(--wp-block-synced-color);
2566	2868	}
	2869	+.block-editor-list-view-leaf.is-synced:not(.is-selected) .block-editor-list-view-block__menu:focus {
	2870	+ --focus-color: var(--wp-block-synced-color);
	2871	+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--focus-color, var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9)));
	2872	+ outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
	2873	+}
2567	2874	.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon {
2568	2875	color: #fff;
2569	2876	}
2570		-.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus::after {
2571		- box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
	2877	+.block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
	2878	+ --focus-color: var(--wpds-color-foreground-interactive-brand-strong, #fff);
	2879	+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--focus-color, var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9)));
	2880	+ outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
	2881	+ outline-offset: calc(-1 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
2572	2882	}
2573		-.block-editor-list-view-leaf.is-selected.is-synced .block-editor-list-view-block-contents:focus::after {
2574		- box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-block-synced-color);
	2883	+@media (forced-colors: active) {
	2884	+ .block-editor-list-view-leaf.is-selected td, .block-editor-list-view-leaf.is-selected.is-synced td {
	2885	+ background: SelectedItem;
	2886	+ }
	2887	+ .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents, .block-editor-list-view-leaf.is-selected .components-button.has-icon {
	2888	+ color: SelectedItemText;
	2889	+ }
	2890	+ .block-editor-list-view-leaf.is-selected svg, .block-editor-list-view-leaf.is-selected .block-editor-block-icon.has-colors svg {
	2891	+ fill: SelectedItemText;
	2892	+ }
	2893	+ .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__title {
	2894	+ forced-color-adjust: none;
	2895	+ }
	2896	+ .block-editor-list-view-leaf.is-selected .block-editor-list-view-block-contents:focus::after {
	2897	+ --focus-color: CanvasText;
	2898	+ }
	2899	+ .block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
	2900	+ --focus-color: SelectedItemText;
	2901	+ }
2575	2902	}
2576		-.block-editor-list-view-leaf.is-selected .block-editor-list-view-block__menu:focus {
2577		- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #fff;
2578		-}
2579	2903	.block-editor-list-view-leaf.is-first-selected td:first-child {
2580	2904	border-top-right-radius: 2px;
2581	2905	}
2582	2906	.block-editor-list-view-leaf.is-first-selected td:last-child {
		@@ -2698,8 +3022,9 @@
2698	3022	}
2699	3023	.block-editor-list-view-leaf.is-nesting .block-editor-list-view-block-contents,
2700	3024	.block-editor-list-view-leaf .block-editor-list-view-block-contents:focus {
2701	3025	box-shadow: none;
	3026	+ outline: none;
2702	3027	}
2703	3028	.block-editor-list-view-leaf.is-nesting .block-editor-list-view-block-contents::after,
2704	3029	.block-editor-list-view-leaf .block-editor-list-view-block-contents:focus::after {
2705	3030	content: "";
		@@ -2704,13 +3029,16 @@
2704	3029	.block-editor-list-view-leaf .block-editor-list-view-block-contents:focus::after {
2705	3030	content: "";
2706	3031	position: absolute;
2707	3032	top: 0;
2708		- left: -29px;
	3033	+ left: -28px;
2709	3034	bottom: 0;
2710	3035	right: 0;
2711	3036	border-radius: inherit;
2712		- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
	3037	+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--focus-color, var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9)));
	3038	+ outline-offset: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
	3039	+ outline-offset: 1px;
	3040	+ box-shadow: 0 0 0 calc(var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) + 2px) var(--wpds-color-background-surface-neutral-strong, #fff);
2713	3041	z-index: 2;
2714	3042	pointer-events: none;
2715	3043	}
2716	3044	.block-editor-list-view-leaf.has-single-cell .block-editor-list-view-block-contents:focus::after {
		@@ -2715,13 +3043,8 @@
2715	3043	}
2716	3044	.block-editor-list-view-leaf.has-single-cell .block-editor-list-view-block-contents:focus::after {
2717	3045	left: 0;
2718	3046	}
2719		-.block-editor-list-view-leaf.is-nesting .block-editor-list-view__menu,
2720		-.block-editor-list-view-leaf .block-editor-list-view-block__menu:focus {
2721		- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2722		- z-index: 1;
2723		-}
2724	3047	.block-editor-list-view-leaf.is-visible .block-editor-list-view-block-contents {
2725	3048	opacity: 1;
2726	3049	}
2727	3050	@keyframes __wp-base-styles-fade-in {
		@@ -2791,14 +3114,8 @@
2791	3114	}
2792	3115	.block-editor-list-view-leaf .block-editor-block-mover-button.is-down-button svg {
2793	3116	top: -4px;
2794	3117	}
2795		-.block-editor-list-view-leaf .block-editor-block-mover-button::before {
2796		- height: 16px;
2797		- min-width: 100%;
2798		- right: 0;
2799		- left: 0;
2800		-}
2801	3118	.block-editor-list-view-leaf .block-editor-inserter__toggle {
2802	3119	background: #1e1e1e;
2803	3120	color: #fff;
2804	3121	height: 24px;
		@@ -2807,8 +3124,14 @@
2807	3124	}
2808	3125	.block-editor-list-view-leaf .block-editor-inserter__toggle:active {
2809	3126	color: #fff;
2810	3127	}
	3128	+.block-editor-list-view-leaf .block-editor-list-view-block-select-button__label-wrapper {
	3129	+ width: 100%;
	3130	+}
	3131	+.block-editor-list-view-leaf .block-editor-list-view-block-select-button__label-wrapper > * {
	3132	+ min-width: 0;
	3133	+}
2811	3134	.block-editor-list-view-leaf .block-editor-list-view-block-select-button__label-wrapper svg {
2812	3135	right: 2px;
2813	3136	position: relative;
2814	3137	}
		@@ -2829,8 +3152,19 @@
2829	3152	.block-editor-list-view-leaf .block-editor-list-view-block-select-button__anchor {
2830	3153	position: absolute;
2831	3154	left: 0;
2832	3155	transform: translateY(-50%);
	3156	+ box-sizing: border-box;
	3157	+ max-width: 100%;
	3158	+ padding: 2px 8px;
	3159	+ border-radius: 2px;
	3160	+ background: #f0f0f0;
	3161	+ color: #2f2f2f;
	3162	+ font-size: 12px;
	3163	+ line-height: 20px;
	3164	+ overflow: hidden;
	3165	+ text-overflow: ellipsis;
	3166	+ white-space: nowrap;
2833	3167	}
2834	3168	.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__anchor {
2835	3169	background: rgba(0, 0, 0, 0.3);
2836	3170	color: #fff;
		@@ -2857,8 +3191,25 @@
2857	3191	}
2858	3192	.block-editor-list-view-leaf.is-selected .block-editor-list-view-block-select-button__image:not(:only-child) {
2859	3193	box-shadow: 0 0 0 2px var(--wp-admin-theme-color);
2860	3194	}
	3195	+.block-editor-list-view-leaf.is-disabled {
	3196	+ opacity: 0.2;
	3197	+}
	3198	+@media not (prefers-reduced-motion) {
	3199	+ .block-editor-list-view-leaf.is-disabled {
	3200	+ transition: opacity 0.1s linear;
	3201	+ }
	3202	+}
	3203	+.block-editor-list-view-leaf.is-disabled:hover {
	3204	+ opacity: 0.2;
	3205	+}
	3206	+.block-editor-list-view-leaf.is-disabled .block-editor-list-view__expander {
	3207	+ cursor: default;
	3208	+}
	3209	+.block-editor-list-view-leaf.is-disabled .block-editor-list-view-block-select-button:hover {
	3210	+ color: inherit;
	3211	+}
2861	3212
2862	3213	.block-editor-list-view-draggable-chip {
2863	3214	opacity: 0.8;
2864	3215	}
		@@ -3055,11 +3406,15 @@
3055	3406	padding: 16px;
3056	3407	}
3057	3408
3058	3409	.block-editor-multi-selection-inspector__card-title {
3059		- font-weight: 499;
	3410	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3060	3411	}
3061	3412
	3413	+.block-editor-multi-selection-inspector__card-description {
	3414	+ color: #757575;
	3415	+}
	3416	+
3062	3417	.block-editor-multi-selection-inspector__card .block-editor-block-icon {
3063	3418	margin-right: -2px;
3064	3419	padding: 0 3px;
3065	3420	width: 36px;
		@@ -3065,8 +3420,13 @@
3065	3420	width: 36px;
3066	3421	height: 24px;
3067	3422	}
3068	3423
	3424	+.block-editor-plain-text {
	3425	+ width: 100%;
	3426	+ field-sizing: content;
	3427	+}
	3428	+
3069	3429	.block-editor-responsive-block-control {
3070	3430	margin-bottom: 28px;
3071	3431	border-bottom: 1px solid #ccc;
3072	3432	padding-bottom: 14px;
		@@ -3082,9 +3442,9 @@
3082	3442	margin-right: -3px;
3083	3443	}
3084	3444
3085	3445	.block-editor-responsive-block-control__label {
3086		- font-weight: 600;
	3446	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3087	3447	margin-bottom: 0.6em;
3088	3448	margin-right: -3px;
3089	3449	}
3090	3450
		@@ -3104,9 +3464,9 @@
3104	3464	overflow: hidden;
3105	3465	padding: 0;
3106	3466	position: absolute;
3107	3467	width: 1px;
3108		- word-wrap: normal !important;
	3468	+ overflow-wrap: normal !important;
3109	3469	word-break: normal !important;
3110	3470	}
3111	3471
3112	3472	.preset-input-control__wrapper > * {
		@@ -3161,9 +3521,9 @@
3161	3521	top: -9999em;
3162	3522	}
3163	3523	.block-editor-skip-to-selected-block:focus {
3164	3524	font-size: 14px;
3165		- font-weight: 600;
	3525	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3166	3526	background: #f1f1f1;
3167	3527	z-index: 100000;
3168	3528	}
3169	3529
		@@ -3359,8 +3719,13 @@
3359	3719	padding: 16px;
3360	3720	border-top: 1px solid #1e1e1e;
3361	3721	}
3362	3722
	3723	+.block-editor-url-popover__link-container-content {
	3724	+ display: flex;
	3725	+ align-items: center;
	3726	+}
	3727	+
3363	3728	.block-editor-url-popover__link-editor,
3364	3729	.block-editor-url-popover__link-viewer {
3365	3730	display: flex;
3366	3731	}
		@@ -3398,35 +3763,8 @@
3398	3763	color: #757575;
3399	3764	font-size: 12px;
3400	3765	}
3401	3766
3402		-/**
3403		- * ItemGroup-like border styles for the background panel's ToolsPanelItems.
3404		- * Replicates the separated border of the `ItemGroup` component while
3405		- * allowing for hidden placeholder items (same approach as the color panel).
3406		- */
3407		-.block-editor-background-panel__item {
3408		- padding: 0;
3409		- max-width: 100%;
3410		- position: relative;
3411		- border-right: 1px solid #ddd;
3412		- border-left: 1px solid #ddd;
3413		- border-bottom: 1px solid #ddd;
3414		-}
3415		-.block-editor-background-panel__item:nth-child(1 of .block-editor-background-panel__item) {
3416		- border-top-right-radius: 2px;
3417		- border-top-left-radius: 2px;
3418		- border-top: 1px solid #ddd;
3419		-}
3420		-.block-editor-background-panel__item:nth-last-child(1 of .block-editor-background-panel__item) {
3421		- border-bottom-right-radius: 2px;
3422		- border-bottom-left-radius: 2px;
3423		-}
3424		-.block-editor-background-panel__item > div,
3425		-.block-editor-background-panel__item > div > button {
3426		- border-radius: inherit;
3427		-}
3428		-
3429	3767	.background-block-support-panel {
3430	3768	/* Increased specificity required to remove the slot wrapper's row gap */
3431	3769	}
3432	3770	.background-block-support-panel.background-block-support-panel .background-block-support-panel__inner-wrapper {
		@@ -3432,173 +3770,8 @@
3432	3770	.background-block-support-panel.background-block-support-panel .background-block-support-panel__inner-wrapper {
3433	3771	row-gap: 0;
3434	3772	}
3435	3773
3436		-.block-editor-content-only-controls__link {
3437		- width: 100%;
3438		- box-shadow: inset 0 0 0 1px #ccc;
3439		-}
3440		-.block-editor-content-only-controls__link:focus:not(:disabled) {
3441		- box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
3442		-}
3443		-
3444		-.block-editor-content-only-controls__link-row {
3445		- align-items: center;
3446		-}
3447		-
3448		-.block-editor-content-only-controls__link-title {
3449		- width: 100%;
3450		- white-space: nowrap;
3451		- text-overflow: ellipsis;
3452		- overflow: hidden;
3453		-}
3454		-
3455		-.block-editor-content-only-controls__media {
3456		- width: 100%;
3457		- box-shadow: inset 0 0 0 1px #ccc;
3458		- padding-left: 32px;
3459		-}
3460		-.block-editor-content-only-controls__media:focus:not(:disabled) {
3461		- box-shadow: 0 0 0 currentColor inset, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
3462		-}
3463		-
3464		-.block-editor-content-only-controls__media-replace-flow {
3465		- display: block;
3466		-}
3467		-
3468		-.block-editor-content-only-controls__media-row {
3469		- align-items: center;
3470		-}
3471		-
3472		-.block-editor-content-only-controls__media-placeholder {
3473		- width: 24px;
3474		- height: 24px;
3475		- border-radius: 2px;
3476		- box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
3477		- display: inline-block;
3478		- padding: 0;
3479		- background: #fff linear-gradient(45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
3480		-}
3481		-
3482		-.block-editor-content-only-controls__media-title {
3483		- width: 100%;
3484		- white-space: nowrap;
3485		- text-overflow: ellipsis;
3486		- overflow: hidden;
3487		-}
3488		-
3489		-.block-editor-content-only-controls__media-thumbnail {
3490		- width: 20px;
3491		- height: 20px;
3492		- border-radius: 2px;
3493		- align-self: center;
3494		- overflow: hidden;
3495		-}
3496		-.block-editor-content-only-controls__media-thumbnail img {
3497		- width: 100% !important;
3498		- height: 100% !important;
3499		- object-fit: cover;
3500		-}
3501		-
3502		-.block-editor-content-only-controls {
3503		- position: relative;
3504		-}
3505		-
3506		-.block-editor-content-only-controls__media-reset {
3507		- position: absolute;
3508		- left: 0;
3509		- top: 8px;
3510		- margin: auto 8px auto;
3511		- opacity: 0;
3512		- border-radius: 2px;
3513		-}
3514		-@media not (prefers-reduced-motion) {
3515		- .block-editor-content-only-controls__media-reset {
3516		- transition: opacity 0.1s ease-in-out;
3517		- }
3518		-}
3519		-.block-editor-content-only-controls:hover .block-editor-content-only-controls__media-reset, .block-editor-content-only-controls__media-reset:focus, .block-editor-content-only-controls__media-reset:hover {
3520		- opacity: 1;
3521		-}
3522		-@media (hover: none) {
3523		- .block-editor-content-only-controls__media-reset {
3524		- opacity: 1;
3525		- }
3526		-}
3527		-
3528		-.block-editor-content-only-controls__rich-text {
3529		- width: 100%;
3530		- margin: 0;
3531		- background: #fff;
3532		- color: #1e1e1e;
3533		- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3534		- padding: 6px 8px;
3535		- /* Fonts smaller than 16px causes mobile safari to zoom. */
3536		- font-size: 16px;
3537		- /* Override core line-height. To be reviewed. */
3538		- line-height: normal;
3539		- box-shadow: 0 0 0 transparent;
3540		- border-radius: 2px;
3541		- border: 1px solid #949494;
3542		-}
3543		-@media not (prefers-reduced-motion) {
3544		- .block-editor-content-only-controls__rich-text {
3545		- transition: box-shadow 0.1s linear;
3546		- }
3547		-}
3548		-@media (min-width: 600px) {
3549		- .block-editor-content-only-controls__rich-text {
3550		- font-size: 13px;
3551		- /* Override core line-height. To be reviewed. */
3552		- line-height: normal;
3553		- }
3554		-}
3555		-.block-editor-content-only-controls__rich-text:focus {
3556		- border-color: var(--wp-admin-theme-color, #3858e9);
3557		- box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color, #3858e9);
3558		- outline: 2px solid transparent;
3559		-}
3560		-.block-editor-content-only-controls__rich-text::placeholder {
3561		- color: rgba(30, 30, 30, 0.62);
3562		-}
3563		-.block-editor-content-only-controls__rich-text {
3564		- border-color: #949494;
3565		-}
3566		-.block-editor-content-only-controls__rich-text::placeholder {
3567		- color: color-mix(in srgb, #1e1e1e, transparent 38%);
3568		-}
3569		-.block-editor-content-only-controls__rich-text {
3570		- min-height: 40px;
3571		- padding: 12px;
3572		-}
3573		-
3574		-.block-editor-block-fields__container {
3575		- padding: 0 16px 16px;
3576		-}
3577		-.block-editor-block-fields__container:first-of-type {
3578		- padding-block-start: 8px;
3579		- /*
3580		- * Add border for the entire content controls and remove the similar border
3581		- * for tools panel.
3582		- */
3583		- border-block-start: 1px solid #e0e0e0;
3584		-}
3585		-
3586		-.block-editor-block-fields__header {
3587		- padding: 8px 0;
3588		- margin-bottom: 4px;
3589		-}
3590		-
3591		-.block-editor-block-fields__header-icon {
3592		- flex: 0 0 24px;
3593		-}
3594		-
3595		-.block-editor-block-fields__header-title {
3596		- flex: 1;
3597		- /* Override the default margin on a h2 element. */
3598		- margin: 0 !important;
3599		-}
3600		-
3601	3774	.block-editor-hooks__block-hooks {
3602	3775	/**
3603	3776	* Un-reverse the flex direction for the toggle's label.
3604	3777	*/
		@@ -3632,17 +3805,14 @@
3632	3805	}
3633	3806	.color-block-support-panel.color-block-support-panel .color-block-support-panel__inner-wrapper {
3634	3807	row-gap: 0;
3635	3808	}
3636		-.color-block-support-panel {
3637		- /**
3638		- * After converting PanelColorGradientSettings to render as a ToolsPanel
3639		- * we need to remove the top margin when wrapping inner content due to
3640		- * rendering via SlotFills.
3641		- */
	3809	+
	3810	+.elements-block-support-panel {
	3811	+ /* Increased specificity required to remove the slot wrapper's row gap */
3642	3812	}
3643		-.color-block-support-panel .block-editor-tools-panel-color-gradient-settings__item.first {
3644		- margin-top: 0;
	3813	+.elements-block-support-panel.elements-block-support-panel .elements-block-support-panel__inner-wrapper {
	3814	+ row-gap: 0;
3645	3815	}
3646	3816
3647	3817	.dimensions-block-support-panel .single-column {
3648	3818	grid-column: span 1;
		@@ -3935,9 +4105,9 @@
3935	4105	}
3936	4106	.block-editor-block-toolbar-change-design-content-wrapper .block-editor-block-patterns-list {
3937	4107	display: grid;
3938	4108	grid-template-columns: 1fr 1fr;
3939		- grid-gap: 12px;
	4109	+ gap: 12px;
3940	4110	}
3941	4111	.block-editor-block-toolbar-change-design-content-wrapper .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
3942	4112	margin-bottom: 0;
3943	4113	}
		@@ -3949,9 +4119,9 @@
3949	4119	display: inline-block;
3950	4120	background: none;
3951	4121	border: none;
3952	4122	padding: 0;
3953		- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	4123	+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3954	4124	font-size: 13px;
3955	4125	line-height: 0;
3956	4126	}
3957	4127	@media (min-width: 782px) {
		@@ -4085,9 +4255,9 @@
4085	4255	margin: 0 0 0 12px;
4086	4256	color: #757575;
4087	4257	text-transform: uppercase;
4088	4258	font-size: 11px;
4089		- font-weight: 499;
	4259	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4090	4260	}
4091	4261
4092	4262	.block-editor-inserter__panel-dropdown select.components-select-control__input.components-select-control__input.components-select-control__input {
4093	4263	height: 36px;
		@@ -4123,12 +4293,8 @@
4123	4293	.block-editor-inserter__parent-block-header .block-editor-block-icon {
4124	4294	margin-left: 8px;
4125	4295	}
4126	4296
4127		-.block-editor-inserter__preview-container__popover {
4128		- top: 16px !important;
4129		-}
4130		-
4131	4297	.block-editor-inserter__preview-container {
4132	4298	display: none;
4133	4299	width: 280px;
4134	4300	padding: 16px;
		@@ -4269,9 +4435,9 @@
4269	4435
4270	4436	.block-editor-inserter__quick-inserter-patterns .block-editor-block-patterns-list {
4271	4437	display: grid;
4272	4438	grid-template-columns: 1fr 1fr;
4273		- grid-gap: 8px;
	4439	+ gap: 8px;
4274	4440	}
4275	4441	.block-editor-inserter__quick-inserter-patterns .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
4276	4442	margin-bottom: 0;
4277	4443	}
		@@ -4286,59 +4452,54 @@
4286	4452	.block-editor-inserter__popover.is-quick > .components-popover__content {
4287	4453	padding: 0;
4288	4454	}
4289	4455
4290		-.block-editor-inserter__quick-inserter-expand.components-button {
4291		- display: block;
4292		- background: #1e1e1e;
4293		- color: #fff;
	4456	+.block-editor-inserter__quick-inserter-expand {
	4457	+ padding: 0 16px 16px;
	4458	+}
	4459	+
	4460	+.block-editor-inserter__quick-inserter-expand-toggle {
4294	4461	width: 100%;
4295		- border-radius: 0;
	4462	+ justify-content: center;
4296	4463	}
4297		-.block-editor-inserter__quick-inserter-expand.components-button:hover {
4298		- color: #fff;
4299		-}
4300		-.block-editor-inserter__quick-inserter-expand.components-button:active {
4301		- color: #ccc;
4302		-}
4303		-.block-editor-inserter__quick-inserter-expand.components-button.components-button:focus:not(:disabled) {
4304		- box-shadow: none;
4305		- background: var(--wp-admin-theme-color);
4306		- border-color: var(--wp-admin-theme-color);
4307		-}
4308	4464
4309	4465	.block-editor-block-patterns-explorer__sidebar {
4310		- position: absolute;
4311		- top: 72px;
4312		- right: 0;
4313		- bottom: 0;
4314		- width: 280px;
4315		- padding: 24px 24px 24px;
4316		- overflow-x: visible;
4317		- overflow-y: auto;
	4466	+ padding-bottom: 24px;
4318	4467	}
4319		-.block-editor-block-patterns-explorer__sidebar__categories-list__item {
4320		- display: block;
4321		- width: 100%;
4322		- height: 48px;
4323		- text-align: right;
	4468	+@media (min-width: 782px) {
	4469	+ .block-editor-block-patterns-explorer__sidebar {
	4470	+ position: absolute;
	4471	+ top: 72px;
	4472	+ right: 0;
	4473	+ bottom: 0;
	4474	+ width: 280px;
	4475	+ padding: 24px;
	4476	+ overflow-x: visible;
	4477	+ overflow-y: auto;
	4478	+ }
4324	4479	}
4325		-.block-editor-block-patterns-explorer__search {
4326		- margin-bottom: 32px;
	4480	+
	4481	+@media (min-width: 782px) {
	4482	+ .block-editor-block-patterns-explorer__panel {
	4483	+ margin-inline-start: 280px;
	4484	+ }
4327	4485	}
4328		-.block-editor-block-patterns-explorer__search-results-count {
4329		- padding-bottom: 32px;
	4486	+
	4487	+.block-editor-block-patterns-explorer__no-results {
	4488	+ padding: 32px;
	4489	+ text-align: center;
4330	4490	}
	4491	+
4331	4492	.block-editor-block-patterns-explorer__list {
4332		- margin-right: 280px;
4333	4493	padding: 24px 0 32px;
4334	4494	}
4335	4495	.block-editor-block-patterns-explorer__list .block-editor-patterns__sync-status-filter .components-input-control__container {
4336	4496	width: 380px;
4337	4497	}
	4498	+
4338	4499	.block-editor-block-patterns-explorer .block-editor-block-patterns-list {
4339	4500	display: grid;
4340		- grid-gap: 32px;
	4501	+ gap: 32px;
4341	4502	grid-template-columns: repeat(1, 1fr);
4342	4503	margin-bottom: 16px;
4343	4504	}
4344	4505	@media (min-width: 1080px) {
		@@ -4360,9 +4521,9 @@
4360	4521	max-height: 800px;
4361	4522	}
4362	4523
4363	4524	.components-heading.block-editor-inserter__patterns-category-panel-title {
4364		- font-weight: 499;
	4525	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4365	4526	}
4366	4527
4367	4528	.block-editor-inserter__patterns-explore-button.components-button,
4368	4529	.block-editor-inserter__media-library-button.components-button {
		@@ -4371,17 +4532,26 @@
4371	4532	margin-top: 16px;
4372	4533	width: 100%;
4373	4534	}
4374	4535
	4536	+.block-editor-inserter__media-mobile-screen {
	4537	+ display: flex;
	4538	+ flex-direction: column;
	4539	+ align-self: stretch;
	4540	+}
	4541	+
4375	4542	.block-editor-inserter__media-panel {
4376		- min-height: 100%;
4377	4543	padding: 0 16px;
4378	4544	display: flex;
4379	4545	flex-direction: column;
	4546	+ flex: 1;
	4547	+ min-height: 0;
4380	4548	}
4381	4549	@media (min-width: 782px) {
4382	4550	.block-editor-inserter__media-panel {
4383	4551	padding: 0;
	4552	+ flex: 0 1 auto;
	4553	+ min-height: 100%;
4384	4554	}
4385	4555	}
4386	4556	.block-editor-inserter__media-panel .block-editor-inserter__media-panel-spinner {
4387	4557	height: 100%;
		@@ -4398,9 +4568,68 @@
4398	4568	margin-bottom: 0;
4399	4569	padding: 16px 24px 16px;
4400	4570	}
4401	4571	}
	4572	+.block-editor-inserter__media-panel .block-editor-inserter__no-results {
	4573	+ flex-grow: 1;
	4574	+}
	4575	+.block-editor-inserter__media-panel .block-editor-inserter__media-panel-footer {
	4576	+ flex-shrink: 0;
	4577	+ padding-top: 16px;
	4578	+ padding-bottom: 16px;
	4579	+}
	4580	+@media (min-width: 782px) {
	4581	+ .block-editor-inserter__media-panel .block-editor-inserter__media-panel-footer {
	4582	+ padding-right: 24px;
	4583	+ padding-left: 24px;
	4584	+ }
	4585	+}
	4586	+.block-editor-inserter__media-panel .block-editor-inserter__media-panel-attach.components-button {
	4587	+ justify-content: center;
	4588	+ padding: 16px;
	4589	+}
	4590	+.block-editor-inserter__media-panel .block-editor-inserter__media-panel-results {
	4591	+ display: flex;
	4592	+ flex-direction: column;
	4593	+ flex-grow: 1;
	4594	+ min-height: 0;
	4595	+}
	4596	+.block-editor-inserter__media-panel .block-editor-inserter__media-panel-results.is-loading .block-editor-inserter__media-list {
	4597	+ opacity: 0.5;
	4598	+ pointer-events: none;
	4599	+}
	4600	+@media not (prefers-reduced-motion) {
	4601	+ .block-editor-inserter__media-panel .block-editor-inserter__media-panel-results.is-loading .block-editor-inserter__media-list {
	4602	+ opacity: 1;
	4603	+ animation: inserter-media-panel-pulse 1s ease-in-out infinite;
	4604	+ }
	4605	+}
	4606	+.block-editor-inserter__media-panel.has-footer .block-editor-inserter__media-list {
	4607	+ padding-bottom: 0;
	4608	+}
4402	4609
	4610	+@keyframes inserter-media-panel-pulse {
	4611	+ 0%, 100% {
	4612	+ opacity: 1;
	4613	+ }
	4614	+ 50% {
	4615	+ opacity: 0.5;
	4616	+ }
	4617	+}
	4618	+.block-editor-inserter__media-panel-detach-modal {
	4619	+ z-index: 1000001;
	4620	+}
	4621	+.block-editor-inserter__media-panel-detach-modal p {
	4622	+ margin-top: 0;
	4623	+}
	4624	+
	4625	+.block-editor-inserter__media-panel-detach-actions {
	4626	+ display: flex;
	4627	+ justify-content: flex-end;
	4628	+ gap: 8px;
	4629	+ margin-top: 16px;
	4630	+}
	4631	+
4403	4632	.block-editor-inserter__media-list__list-item {
4404	4633	position: relative;
4405	4634	cursor: var(--wpds-cursor-control, pointer);
4406	4635	margin-bottom: 24px;
		@@ -4413,9 +4642,9 @@
4413	4642	}
4414	4643	.block-editor-inserter__media-list__list-item.is-hovered .block-editor-inserter__media-list__item-preview > * {
4415	4644	outline-color: rgba(0, 0, 0, 0.3);
4416	4645	}
4417		-.block-editor-inserter__media-list__list-item.is-hovered .block-editor-inserter__media-list__item-preview-options > button {
	4646	+.block-editor-inserter__media-list__list-item.is-hovered .block-editor-inserter__media-list__item-preview-options > button, .block-editor-inserter__media-list__list-item:focus-within .block-editor-inserter__media-list__item-preview-options > button {
4418	4647	display: block;
4419	4648	}
4420	4649	.block-editor-inserter__media-list__list-item .block-editor-inserter__media-list__item-preview-options {
4421	4650	position: absolute;
		@@ -4597,12 +4826,12 @@
4597	4826	flex-direction: column;
4598	4827	align-items: start;
4599	4828	}
4600	4829	.block-editor-block-visibility-modal__options-checkbox--everywhere {
4601		- font-weight: 600;
	4830	+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4602	4831	}
4603	4832	.block-editor-block-visibility-modal__options-icon--checked {
4604		- fill: #ddd;
	4833	+ color: #ddd;
4605	4834	}
4606	4835	.block-editor-block-visibility-modal__sub-options {
4607	4836	width: 100%;
4608	4837	padding-inline-start: 12px;
		@@ -4612,11 +4841,52 @@
4612	4841	color: #757575;
4613	4842	}
4614	4843
4615	4844	.block-editor-block-visibility-info {
4616		- padding-top: 4px;
4617		- padding-bottom: 4px;
4618	4845	margin: 0 16px 16px;
4619		- display: flex;
4620		- align-items: center;
4621		- justify-content: start;
	4846	+}
	4847	+
	4848	+/* The stop element is invisible, so its focus indication is drawn around the
	4849	+ canvas it stands for. For the iframed canvas it is an overlay instead of
	4850	+ an outline, because Safari paints an outline on an iframe element
	4851	+ underneath the iframe's content. */
	4852	+.block-editor-iframe__scale-container > .block-editor-writing-flow__canvas-stop:focus::after {
	4853	+ content: "";
	4854	+ position: absolute;
	4855	+ inset: 0;
	4856	+ z-index: 1;
	4857	+ pointer-events: none;
	4858	+ border: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
	4859	+}
	4860	+
	4861	+.block-editor-writing-flow__canvas-stop:focus + .block-editor-writing-flow {
	4862	+ outline: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
	4863	+ outline-offset: calc(-1 * var(--wp-admin-border-width-focus));
	4864	+}
	4865	+
	4866	+/* Looks like a tooltip. Shown at the top of the canvas while the stop is
	4867	+ focused. Sticky, because on the widgets screen the stop spans scrolling
	4868	+ content and the hint must stay in view; anywhere else there is nothing
	4869	+ to scroll and it stays at the top of the canvas. */
	4870	+.block-editor-writing-flow__canvas-stop-hint {
	4871	+ display: none;
	4872	+ position: sticky;
	4873	+ top: 16px;
	4874	+ margin-inline: auto;
	4875	+ width: fit-content;
	4876	+ z-index: 2;
	4877	+ background: #000;
	4878	+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	4879	+ border-radius: 4px;
	4880	+ color: #f0f0f0;
	4881	+ text-align: center;
	4882	+ line-height: 1.4;
	4883	+ font-size: 12px;
	4884	+ padding: 4px 8px;
	4885	+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 3px rgba(0, 0, 0, 0.04), 0 6px 6px rgba(0, 0, 0, 0.03), 0 8px 8px rgba(0, 0, 0, 0.02);
	4886	+ white-space: nowrap;
	4887	+ pointer-events: none;
	4888	+}
	4889	+
	4890	+.block-editor-writing-flow__canvas-stop:focus > .block-editor-writing-flow__canvas-stop-hint {
	4891	+ display: block;
4622	4892	}