@wordpress/edit-site 6.37.0 → 6.37.1-next.ba3aee3a2.0

package/build-style/style.css

@@ -84,6 +84,10 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+/**
+ * Creates a checkerboard pattern background to indicate transparency.
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
+ */
 :root {
   --wp-block-synced-color: #7a00df;
   --wp-block-synced-color--rgb: 122, 0, 223;
@@ -188,6 +192,10 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+/**
+ * Creates a checkerboard pattern background to indicate transparency.
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
+ */
 .admin-ui-page {
   display: flex;
   height: 100%;
@@ -266,6 +274,211 @@
   line-height: inherit;
 }
 
+/* -------------------------------------------
+ *  Autogenerated by ⛋ Terrazzo. DO NOT EDIT!
+ * ------------------------------------------- */
+:root {
+  --wpds-border-radius-surface-lg: 8px; /* Large radius for surfaces */
+  --wpds-border-radius-surface-md: 4px; /* Medium radius for surfaces */
+  --wpds-border-radius-surface-sm: 2px; /* Small radius for surfaces */
+  --wpds-border-radius-surface-xs: 1px; /* Extra small radius for surfaces */
+  --wpds-border-width-interactive-focus: 2px; /* Border width for focus ring */
+  --wpds-border-width-surface-lg: 8px; /* Large width for surfaces */
+  --wpds-border-width-surface-md: 4px; /* Medium width for surfaces */
+  --wpds-border-width-surface-sm: 2px; /* Small width for surfaces */
+  --wpds-border-width-surface-xs: 1px; /* Extra small width for surfaces */
+  --wpds-color-bg-interactive-brand: #00000000; /* Background color for interactive elements with brand tone and normal emphasis. */
+  --wpds-color-bg-interactive-brand-active: #f6f8fd; /* Background color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-brand-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and normal emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-brand-strong: #3858e9; /* Background color for interactive elements with brand tone and strong emphasis. */
+  --wpds-color-bg-interactive-brand-strong-active: #2e49d9; /* Background color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-brand-strong-disabled: #d2d2d2; /* Background color for interactive elements with brand tone and strong emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-brand-weak: #00000000; /* Background color for interactive elements with brand tone and weak emphasis. */
+  --wpds-color-bg-interactive-brand-weak-active: #e6eaf4; /* Background color for interactive elements with brand tone and weak emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-brand-weak-disabled: #e2e2e2; /* Background color for interactive elements with brand tone and weak emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-error: #00000000; /* Background color for interactive elements with error tone and normal emphasis. */
+  --wpds-color-bg-interactive-error-active: #fff6f4; /* Background color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-error-disabled: #e2e2e2; /* Background color for interactive elements with error tone and normal emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-error-strong: #cc1818; /* Background color for interactive elements with error tone and strong emphasis. */
+  --wpds-color-bg-interactive-error-strong-active: #b90000; /* Background color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-error-strong-disabled: #d2d2d2; /* Background color for interactive elements with error tone and strong emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-error-weak: #00000000; /* Background color for interactive elements with error tone and weak emphasis. */
+  --wpds-color-bg-interactive-error-weak-active: #f6e6e3; /* Background color for interactive elements with error tone and weak emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-error-weak-disabled: #e2e2e2; /* Background color for interactive elements with error tone and weak emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-neutral: #00000000; /* Background color for interactive elements with neutral tone and normal emphasis. */
+  --wpds-color-bg-interactive-neutral-active: #eaeaea; /* Background color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-neutral-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-neutral-strong: #2d2d2d; /* Background color for interactive elements with neutral tone and strong emphasis. */
+  --wpds-color-bg-interactive-neutral-strong-active: #1e1e1e; /* Background color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-neutral-strong-disabled: #d2d2d2; /* Background color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
+  --wpds-color-bg-interactive-neutral-weak: #00000000; /* Background color for interactive elements with neutral tone and weak emphasis. */
+  --wpds-color-bg-interactive-neutral-weak-active: #eaeaea; /* Background color for interactive elements with neutral tone and weak emphasis that are hovered, focused, or active. */
+  --wpds-color-bg-interactive-neutral-weak-disabled: #e2e2e2; /* Background color for interactive elements with neutral tone and weak emphasis, in their disabled state. */
+  --wpds-color-bg-surface-brand: #ecf0f9; /* Background color for surfaces with brand tone and normal emphasis. */
+  --wpds-color-bg-surface-caution: #fee994; /* Background color for surfaces with caution tone and normal emphasis. */
+  --wpds-color-bg-surface-caution-weak: #fff9c9; /* Background color for surfaces with caution tone and weak emphasis. */
+  --wpds-color-bg-surface-error: #f6e6e3; /* Background color for surfaces with error tone and normal emphasis. */
+  --wpds-color-bg-surface-error-weak: #fff6f4; /* Background color for surfaces with error tone and weak emphasis. */
+  --wpds-color-bg-surface-info: #deebfa; /* Background color for surfaces with info tone and normal emphasis. */
+  --wpds-color-bg-surface-info-weak: #f3f9ff; /* Background color for surfaces with info tone and weak emphasis. */
+  --wpds-color-bg-surface-neutral: #f8f8f8; /* Background color for surfaces with normal emphasis. */
+  --wpds-color-bg-surface-neutral-strong: #ffffff; /* Background color for surfaces with strong emphasis. */
+  --wpds-color-bg-surface-neutral-weak: #f0f0f0; /* Background color for surfaces with weak emphasis. */
+  --wpds-color-bg-surface-success: #c5f7cc; /* Background color for surfaces with success tone and normal emphasis. */
+  --wpds-color-bg-surface-success-weak: #eaffed; /* Background color for surfaces with success tone and weak emphasis. */
+  --wpds-color-bg-surface-warning: #fde6bd; /* Background color for surfaces with warning tone and normal emphasis. */
+  --wpds-color-bg-surface-warning-weak: #fff7e0; /* Background color for surfaces with warning tone and weak emphasis. */
+  --wpds-color-bg-thumb-brand: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track). */
+  --wpds-color-bg-thumb-brand-active: #3858e9; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track) that are hovered, focused, or active. */
+  --wpds-color-bg-thumb-brand-disabled: #d8d8d8; /* Background color for thumbs with a brand tone and normal emphasis (eg. slider thumb and filled track), in their disabled state. */
+  --wpds-color-bg-thumb-neutral-weak: #8a8a8a; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb). */
+  --wpds-color-bg-thumb-neutral-weak-active: #6c6c6c; /* Background color for thumbs with a neutral tone and weak emphasis (eg. scrollbar thumb) that are hovered, focused, or active. */
+  --wpds-color-bg-track-neutral: #d8d8d8; /* Background color for tracks with a neutral tone and normal emphasis (eg. slider or progressbar track). */
+  --wpds-color-bg-track-neutral-weak: #e0e0e0; /* Background color for tracks with a neutral tone and weak emphasis (eg. scrollbar track). */
+  --wpds-color-fg-content-caution: #281d00; /* Foreground color for content like text with caution tone and normal emphasis. */
+  --wpds-color-fg-content-caution-weak: #826a00; /* Foreground color for content like text with caution tone and weak emphasis. */
+  --wpds-color-fg-content-error: #470000; /* Foreground color for content like text with error tone and normal emphasis. */
+  --wpds-color-fg-content-error-weak: #cc1818; /* Foreground color for content like text with error tone and weak emphasis. */
+  --wpds-color-fg-content-info: #001b4f; /* Foreground color for content like text with info tone and normal emphasis. */
+  --wpds-color-fg-content-info-weak: #006bd7; /* Foreground color for content like text with info tone and weak emphasis. */
+  --wpds-color-fg-content-neutral: #1e1e1e; /* Foreground color for content like text with normal emphasis. */
+  --wpds-color-fg-content-neutral-weak: #6d6d6d; /* Foreground color for content like text with weak emphasis. */
+  --wpds-color-fg-content-success: #002900; /* Foreground color for content like text with success tone and normal emphasis. */
+  --wpds-color-fg-content-success-weak: #007f30; /* Foreground color for content like text with success tone and weak emphasis. */
+  --wpds-color-fg-content-warning: #2e1900; /* Foreground color for content like text with warning tone and normal emphasis. */
+  --wpds-color-fg-content-warning-weak: #926300; /* Foreground color for content like text with warning tone and weak emphasis. */
+  --wpds-color-fg-interactive-brand: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis. */
+  --wpds-color-fg-interactive-brand-active: #3858e9; /* Foreground color for interactive elements with brand tone and normal emphasis that are hovered, focused, or active. */
+  --wpds-color-fg-interactive-brand-disabled: #8a8a8a; /* Foreground color for interactive elements with brand tone and normal emphasis, in their disabled state. */
+  --wpds-color-fg-interactive-brand-strong: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis. */
+  --wpds-color-fg-interactive-brand-strong-active: #eff0f2; /* Foreground color for interactive elements with brand tone and strong emphasis that are hovered, focused, or active. */
+  --wpds-color-fg-interactive-brand-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with brand tone and strong emphasis, in their disabled state. */
+  --wpds-color-fg-interactive-error: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis. */
+  --wpds-color-fg-interactive-error-active: #cc1818; /* Foreground color for interactive elements with error tone and normal emphasis that are hovered, focused, or active. */
+  --wpds-color-fg-interactive-error-disabled: #8a8a8a; /* Foreground color for interactive elements with error tone and normal emphasis, in their disabled state. */
+  --wpds-color-fg-interactive-error-strong: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis. */
+  --wpds-color-fg-interactive-error-strong-active: #f2efef; /* Foreground color for interactive elements with error tone and strong emphasis that are hovered, focused, or active. */
+  --wpds-color-fg-interactive-error-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with error tone and strong emphasis, in their disabled state. */
+  --wpds-color-fg-interactive-neutral: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis. */
+  --wpds-color-fg-interactive-neutral-active: #1e1e1e; /* Foreground color for interactive elements with neutral tone and normal emphasis that are hovered, focused, or active. */
+  --wpds-color-fg-interactive-neutral-disabled: #8a8a8a; /* Foreground color for interactive elements with neutral tone and normal emphasis, in their disabled state. */
+  --wpds-color-fg-interactive-neutral-strong: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis. */
+  --wpds-color-fg-interactive-neutral-strong-active: #f0f0f0; /* Foreground color for interactive elements with neutral tone and strong emphasis that are hovered, focused, or active. */
+  --wpds-color-fg-interactive-neutral-strong-disabled: #6d6d6d; /* Foreground color for interactive elements with neutral tone and strong emphasis, in their disabled state. */
+  --wpds-color-fg-interactive-neutral-weak: #6d6d6d; /* Foreground color for interactive elements with neutral tone and weak emphasis. */
+  --wpds-color-fg-interactive-neutral-weak-disabled: #8a8a8a; /* Foreground color for interactive elements with neutral tone and weak emphasis, in their disabled state. */
+  --wpds-color-stroke-focus-brand: #3858e9; /* Accessible stroke color applied to focus rings. */
+  --wpds-color-stroke-interactive-brand: #3858e9; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis. */
+  --wpds-color-stroke-interactive-brand-active: #2337c8; /* Accessible stroke color used for interactive brand-toned elements with normal emphasis that are hovered, focused, or active. */
+  --wpds-color-stroke-interactive-error: #cc1818; /* Accessible stroke color used for interactive error-toned elements with normal emphasis. */
+  --wpds-color-stroke-interactive-error-active: #9d0000; /* Accessible stroke color used for interactive error-toned elements with normal emphasis that are hovered, focused, or active. */
+  --wpds-color-stroke-interactive-error-strong: #cc1818; /* Accessible stroke color used for interactive error-toned elements with strong emphasis. */
+  --wpds-color-stroke-interactive-neutral: #8a8a8a; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis. */
+  --wpds-color-stroke-interactive-neutral-active: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis that are hovered, focused, or active. */
+  --wpds-color-stroke-interactive-neutral-disabled: #d8d8d8; /* Accessible stroke color used for interactive neutrally-toned elements with normal emphasis, in their disabled state. */
+  --wpds-color-stroke-interactive-neutral-strong: #6c6c6c; /* Accessible stroke color used for interactive neutrally-toned elements with strong emphasis. */
+  --wpds-color-stroke-surface-brand: #a3b1d4; /* Decorative stroke color used to define brand-toned surface boundaries with normal emphasis. */
+  --wpds-color-stroke-surface-brand-strong: #3858e9; /* Decorative stroke color used to define brand-toned surface boundaries with strong emphasis. */
+  --wpds-color-stroke-surface-error: #daa39b; /* Decorative stroke color used to define error-toned surface boundaries with normal emphasis. */
+  --wpds-color-stroke-surface-error-strong: #cc1818; /* Decorative stroke color used to define error-toned surface boundaries with strong emphasis. */
+  --wpds-color-stroke-surface-info: #9fbcdc; /* Decorative stroke color used to define info-toned surface boundaries with normal emphasis. */
+  --wpds-color-stroke-surface-info-strong: #006bd7; /* Decorative stroke color used to define info-toned surface boundaries with strong emphasis. */
+  --wpds-color-stroke-surface-neutral: #d8d8d8; /* Decorative stroke color used to define neutrally-toned surface boundaries with normal emphasis. */
+  --wpds-color-stroke-surface-neutral-strong: #8a8a8a; /* Decorative stroke color used to define neutrally-toned surface boundaries with strong emphasis. */
+  --wpds-color-stroke-surface-neutral-weak: #e0e0e0; /* Decorative stroke color used to define neutrally-toned surface boundaries with weak emphasis. */
+  --wpds-color-stroke-surface-success: #8ac894; /* Decorative stroke color used to define success-toned surface boundaries with normal emphasis. */
+  --wpds-color-stroke-surface-success-strong: #007f30; /* Decorative stroke color used to define success-toned surface boundaries with strong emphasis. */
+  --wpds-color-stroke-surface-warning: #d0b381; /* Decorative stroke color used to define warning-toned surface boundaries with normal emphasis. */
+  --wpds-color-stroke-surface-warning-strong: #926300; /* Decorative stroke color used to define warning-toned surface boundaries with strong emphasis. */
+  --wpds-dimension-base: 4px; /* Base dimension unit */
+  --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
+  --wpds-dimension-gap-lg: 24px; /* Large gap */
+  --wpds-dimension-gap-md: 16px; /* Medium gap */
+  --wpds-dimension-gap-sm: 12px; /* Small gap */
+  --wpds-dimension-gap-xl: 40px; /* Extra large gap */
+  --wpds-dimension-gap-xs: 8px; /* Extra small gap */
+  --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
+  --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
+  --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
+  --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
+  --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
+  --wpds-elevation-large: 0 5px 15px 0 #00000014, 0 15px 27px 0 #00000012,
+  	0 30px 36px 0 #0000000a, 0 50px 43px 0 #00000005; /* For components that confirm decisions or handle necessary interruptions. Example: Modals. */
+  --wpds-elevation-medium: 0 2px 3px 0 #0000000d, 0 4px 5px 0 #0000000a,
+  	0 12px 12px 0 #00000008, 0 16px 16px 0 #00000005; /* For components that offer additional actions. Example: Menus, Command Palette */
+  --wpds-elevation-small: 0 1px 2px 0 #0000000d, 0 2px 3px 0 #0000000a,
+  	0 6px 6px 0 #00000008, 0 8px 8px 0 #00000005; /* For components that provide contextual feedback without being intrusive. Generally non-interruptive. Example: Tooltips, Snackbar. */
+  --wpds-elevation-x-small: 0 1px 1px 0 #00000008, 0 1px 2px 0 #00000005,
+  	0 3px 3px 0 #00000005, 0 4px 4px 0 #00000003; /* For sections and containers that group related content and controls, which may overlap other content. Example: Preview Frame. */
+  --wpds-font-family-body: -apple-system, system-ui, "Segoe UI", "Roboto",
+  	"Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif; /* Body font family */
+  --wpds-font-family-heading: -apple-system, system-ui, "Segoe UI", "Roboto",
+  	"Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif; /* Headings font family */
+  --wpds-font-family-mono: "Menlo", "Consolas", monaco, monospace; /* Monospace font family */
+  --wpds-font-line-height-2xl: 40px; /* 2X large line height */
+  --wpds-font-line-height-lg: 28px; /* Large line height */
+  --wpds-font-line-height-md: 24px; /* Medium line height */
+  --wpds-font-line-height-sm: 20px; /* Small line height */
+  --wpds-font-line-height-xl: 32px; /* Extra large line height */
+  --wpds-font-line-height-xs: 16px; /* Extra small line height */
+  --wpds-font-size-2xl: 32px; /* 2X large font size */
+  --wpds-font-size-lg: 15px; /* Large font size */
+  --wpds-font-size-md: 13px; /* Medium font size */
+  --wpds-font-size-sm: 12px; /* Small font size */
+  --wpds-font-size-xl: 20px; /* Extra large font size */
+  --wpds-font-size-xs: 11px; /* Extra small font size */
+  --wpds-font-weight-medium: 499; /* Medium font weight for emphasis and headings */
+  --wpds-font-weight-regular: 400; /* Regular font weight for body text */
+}
+
+[data-wpds-theme-provider-id][data-wpds-density=default] {
+  --wpds-dimension-base: 4px; /* Base dimension unit */
+  --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
+  --wpds-dimension-gap-lg: 24px; /* Large gap */
+  --wpds-dimension-gap-md: 16px; /* Medium gap */
+  --wpds-dimension-gap-sm: 12px; /* Small gap */
+  --wpds-dimension-gap-xl: 40px; /* Extra large gap */
+  --wpds-dimension-gap-xs: 8px; /* Extra small gap */
+  --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
+  --wpds-dimension-padding-surface-lg: 32px; /* Large spacing for surfaces */
+  --wpds-dimension-padding-surface-md: 24px; /* Medium spacing for surfaces */
+  --wpds-dimension-padding-surface-sm: 16px; /* Small spacing for surfaces */
+  --wpds-dimension-padding-surface-xs: 8px; /* Extra small spacing for surfaces */
+}
+
+[data-wpds-theme-provider-id][data-wpds-density=compact] {
+  --wpds-dimension-gap-2xs: 4px; /* 2x extra small gap */
+  --wpds-dimension-gap-lg: 20px; /* Large gap */
+  --wpds-dimension-gap-md: 12px; /* Medium gap */
+  --wpds-dimension-gap-sm: 8px; /* Small gap */
+  --wpds-dimension-gap-xl: 32px; /* Extra large gap */
+  --wpds-dimension-gap-xs: 4px; /* Extra small gap */
+  --wpds-dimension-padding-surface-2xs: 4px; /* 2x extra small spacing for surfaces */
+  --wpds-dimension-padding-surface-lg: 24px; /* Large spacing for surfaces */
+  --wpds-dimension-padding-surface-md: 20px; /* Medium spacing for surfaces */
+  --wpds-dimension-padding-surface-sm: 12px; /* Small spacing for surfaces */
+  --wpds-dimension-padding-surface-xs: 4px; /* Extra small spacing for surfaces */
+}
+
+[data-wpds-theme-provider-id][data-wpds-density=comfortable] {
+  --wpds-dimension-gap-2xs: 8px; /* 2x extra small gap */
+  --wpds-dimension-gap-lg: 32px; /* Large gap */
+  --wpds-dimension-gap-md: 20px; /* Medium gap */
+  --wpds-dimension-gap-sm: 16px; /* Small gap */
+  --wpds-dimension-gap-xl: 48px; /* Extra large gap */
+  --wpds-dimension-gap-xs: 12px; /* Extra small gap */
+  --wpds-dimension-padding-surface-2xs: 8px; /* 2x extra small spacing for surfaces */
+  --wpds-dimension-padding-surface-lg: 40px; /* Large spacing for surfaces */
+  --wpds-dimension-padding-surface-md: 32px; /* Medium spacing for surfaces */
+  --wpds-dimension-padding-surface-sm: 20px; /* Small spacing for surfaces */
+  --wpds-dimension-padding-surface-xs: 12px; /* Extra small spacing for surfaces */
+}
+
+@media (min-resolution: 192dpi) {
+  :root {
+    --wpds-border-width-interactive-focus: 1.5px; /* Border width for focus ring */
+  }
+}
 /**
  * Colors
  */
@@ -351,6 +564,10 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+/**
+ * Creates a checkerboard pattern background to indicate transparency.
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
+ */
 .dataviews-wrapper,
 .dataviews-picker-wrapper {
   height: 100%;
@@ -830,15 +1047,7 @@
   outline: 2px solid transparent;
 }
 
-.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-webkit-input-placeholder {
-  color: rgba(30, 30, 30, 0.62);
-}
-
-.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-moz-placeholder {
-  color: rgba(30, 30, 30, 0.62);
-}
-
-.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:-ms-input-placeholder {
+.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder {
   color: rgba(30, 30, 30, 0.62);
 }
 
@@ -852,10 +1061,6 @@
   border-color: var(--wp-admin-theme-color);
 }
 
-.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked::-ms-check {
-  opacity: 0;
-}
-
 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:checked::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-checked=mixed]::before {
   margin: -3px -5px;
   color: #fff;
@@ -973,15 +1178,7 @@
   outline: 2px solid transparent;
 }
 
-.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-input-placeholder {
-  color: rgba(30, 30, 30, 0.62);
-}
-
-.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
-  color: rgba(30, 30, 30, 0.62);
-}
-
-.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:-ms-input-placeholder {
+.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
   color: rgba(30, 30, 30, 0.62);
 }
 
@@ -1121,15 +1318,6 @@
   z-index: 1000001;
 }
 
-.dataviews-picker-footer__bulk-selection {
-  align-self: flex-start;
-  height: 32px;
-}
-
-.dataviews-picker-footer__actions {
-  align-self: flex-end;
-}
-
 .dataviews-selection-checkbox {
   --checkbox-input-size: 24px;
 }
@@ -1517,29 +1705,35 @@ div.dataviews-view-list {
   border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
 }
 
-.dataviews-view-list div[role=row]:not(.is-selected) .dataviews-view-list__title-field,
-.dataviews-view-list div[role=article]:not(.is-selected) .dataviews-view-list__title-field {
-  color: #1e1e1e;
-}
-
 .dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within,
 .dataviews-view-list div[role=article]:not(.is-selected):hover,
 .dataviews-view-list div[role=article]:not(.is-selected).is-hovered,
 .dataviews-view-list div[role=article]:not(.is-selected):focus-within {
   color: var(--wp-admin-theme-color);
-  background-color: #f8f8f8;
-}
-
-.dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__fields, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__fields, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__fields,
-.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__title-field,
-.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__fields,
-.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__title-field,
-.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__fields,
-.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__title-field,
-.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__fields {
+  background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
+  border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
+}
+
+.dataviews-view-list div[role=row]:not(.is-selected):hover + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected):hover + div[role=article], .dataviews-view-list div[role=row]:not(.is-selected).is-hovered + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected).is-hovered + div[role=article], .dataviews-view-list div[role=row]:not(.is-selected):focus-within + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected):focus-within + div[role=article],
+.dataviews-view-list div[role=article]:not(.is-selected):hover + div[role=row],
+.dataviews-view-list div[role=article]:not(.is-selected):hover + div[role=article],
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered + div[role=row],
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered + div[role=article],
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within + div[role=row],
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within + div[role=article] {
+  border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
+}
+
+.dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-title-field,
+.dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-title-field,
+.dataviews-view-list div[role=row]:not(.is-selected).is-hovered .dataviews-view-list__field, .dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-title-field,
+.dataviews-view-list div[role=row]:not(.is-selected):focus-within .dataviews-view-list__field,
+.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-title-field,
+.dataviews-view-list div[role=article]:not(.is-selected):hover .dataviews-view-list__field,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-title-field,
+.dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__field,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-title-field,
+.dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__field {
   color: var(--wp-admin-theme-color);
 }
 
@@ -1547,19 +1741,19 @@ div.dataviews-view-list {
 .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper,
 .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper,
 .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper {
-  background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
+  background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
   color: #1e1e1e;
 }
 
-.dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
-.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
-.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
-.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
-.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__fields,
-.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__title-field,
-.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__fields {
-  color: var(--wp-admin-theme-color);
+.dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
+.dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
+.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
+.dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
+.dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
+.dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field {
+  color: #1e1e1e;
 }
 
 .dataviews-view-list .dataviews-view-list__item {
@@ -1630,8 +1824,11 @@ div.dataviews-view-list {
   flex-grow: 1;
 }
 
-.dataviews-view-list .dataviews-view-list__fields {
+.dataviews-view-list .dataviews-view-list__field {
   color: #757575;
+}
+
+.dataviews-view-list .dataviews-view-list__fields {
   display: flex;
   gap: 12px;
   row-gap: 4px;
@@ -1658,6 +1855,62 @@ div.dataviews-view-list {
   justify-content: space-between;
 }
 
+.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__item-wrapper {
+  padding: 8px 24px;
+}
+
+.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__title-field {
+  min-height: 16px;
+  line-height: 16px;
+}
+
+.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__media-wrapper {
+  width: 32px;
+  height: 32px;
+}
+
+.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__field-wrapper {
+  min-height: 32px;
+}
+
+.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields {
+  gap: 8px;
+  row-gap: 4px;
+}
+
+.dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
+  min-height: 16px;
+  line-height: 16px;
+}
+
+.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__item-wrapper {
+  padding: 24px 24px;
+}
+
+.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__title-field {
+  min-height: 32px;
+  line-height: 32px;
+}
+
+.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__media-wrapper {
+  width: 64px;
+  height: 64px;
+}
+
+.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__field-wrapper {
+  min-height: 64px;
+}
+
+.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields {
+  gap: 16px;
+  row-gap: 8px;
+}
+
+.dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
+  min-height: 32px;
+  line-height: 24px;
+}
+
 .dataviews-view-list__group-header {
   font-size: 15px;
   font-weight: 499;
@@ -1698,7 +1951,7 @@ div.dataviews-view-list {
 .dataviews-view-table th.dataviews-view-table__actions-column--sticky {
   position: sticky;
   right: 0;
-  background-color: inherit;
+  background-color: var(--wp-dataviews-color-background, #fff);
 }
 
 .dataviews-view-table td.dataviews-view-table__actions-column--stuck::after,
@@ -1743,10 +1996,6 @@ div.dataviews-view-list {
   border-bottom: 0;
 }
 
-.dataviews-view-table tr.is-hovered, .dataviews-view-table tr.is-hovered .dataviews-view-table__actions-column--sticky {
-  background-color: #f8f8f8;
-}
-
 .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
   opacity: 0;
 }
@@ -1765,27 +2014,20 @@ div.dataviews-view-list {
   border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
 }
 
-.dataviews-view-table tr.is-selected:hover {
-  background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 8%, #fff);
-}
-
 .dataviews-view-table tr.is-selected .dataviews-view-table__actions-column--sticky {
   background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
 }
 
-.dataviews-view-table tr.is-selected:hover .dataviews-view-table__actions-column--sticky {
-  background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 8%, #fff);
+.dataviews-view-table.has-bulk-actions tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table.has-bulk-actions tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
+  opacity: 1;
 }
 
-.dataviews-view-table.has-bulk-actions tr:not(.is-selected).is-hovered, .dataviews-view-table.has-bulk-actions tr:not(.is-selected).is-hovered .dataviews-view-table__actions-column--sticky {
-  background-color: #f8f8f8;
+.dataviews-view-table.has-bulk-actions tr:focus-within .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr:hover .dataviews-view-table__actions-column--sticky {
+  background-color: var(--wp-dataviews-color-background, #fff);
 }
 
-.dataviews-view-table.has-bulk-actions tr:focus-within .components-checkbox-control__input,
-.dataviews-view-table.has-bulk-actions tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table.has-bulk-actions tr.is-hovered .components-checkbox-control__input,
-.dataviews-view-table.has-bulk-actions tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table.has-bulk-actions tr:hover .components-checkbox-control__input,
-.dataviews-view-table.has-bulk-actions tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
-  opacity: 1;
+.dataviews-view-table.has-bulk-actions tr.is-selected .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr.is-selected:hover .dataviews-view-table__actions-column--sticky {
+  background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
 }
 
 .dataviews-view-table thead {
@@ -2009,6 +2251,7 @@ div.dataviews-view-list {
 .dataviews-view-picker-grid .dataviews-view-picker-grid__media {
   width: 100%;
   aspect-ratio: 1/1;
+  min-height: 0;
   background-color: #fff;
   border-radius: 4px;
   position: relative;
@@ -2115,6 +2358,10 @@ div.dataviews-view-list {
   background-color: inherit;
 }
 
+.dataviews-view-picker-table .dataviews-view-table__checkbox-column {
+  width: 48px;
+}
+
 .dataviews-view-picker-table tbody:focus-visible[aria-activedescendant] {
   outline: none;
 }
@@ -2343,6 +2590,15 @@ div.dataviews-view-list {
   justify-content: space-between;
 }
 
+.dataviews-picker-footer__bulk-selection {
+  align-self: flex-start;
+  height: 32px;
+}
+
+.dataviews-picker-footer__actions {
+  align-self: flex-end;
+}
+
 .dataviews-controls__datetime {
   border: none;
   padding: 0;
@@ -2359,6 +2615,10 @@ div.dataviews-view-list {
   -webkit-appearance: none;
 }
 
+.dataviews-controls__date-range-inputs > * {
+  min-width: 0;
+}
+
 .dataviews-controls__date-preset {
   border: 1px solid #ddd;
 }
@@ -2374,6 +2634,10 @@ div.dataviews-view-list {
   align-items: flex-start !important;
 }
 
+.dataforms-layouts-panel__field--label-position-none {
+  align-items: center !important;
+}
+
 .dataforms-layouts-panel__field-label {
   width: 38%;
   flex-shrink: 0;
@@ -2388,6 +2652,19 @@ div.dataviews-view-list {
   align-self: center;
 }
 
+.dataforms-layouts-panel__field-label.has-error {
+  color: #cc1818;
+}
+
+.dataforms-layouts-panel__field-label-error-content {
+  cursor: help;
+  fill: #cc1818;
+}
+
+.dataforms-layouts-panel__field-label-error-content svg {
+  fill: currentColor;
+}
+
 .dataforms-layouts-panel__field-control {
   flex-grow: 1;
   min-height: 32px;
@@ -2429,6 +2706,10 @@ div.dataviews-view-list {
   z-index: 159990;
 }
 
+.dataforms-layouts-panel__summary-button:empty {
+  min-width: 160px;
+}
+
 .dataforms-layouts-regular__field {
   width: 100%;
   min-height: 32px;
@@ -2581,6 +2862,10 @@ div.dataviews-view-list {
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+/**
+ * Creates a checkerboard pattern background to indicate transparency.
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
+ */
 :root {
   --wp-block-synced-color: #7a00df;
   --wp-block-synced-color--rgb: 122, 0, 223;
@@ -2683,114 +2968,259 @@ input[type=radio]:not(:checked):hover ~ .fields-create-template-part-modal__area
   color: inherit;
 }
 
-.fields-controls__slug {
+fieldset.fields__media-edit {
   border: 0;
   padding: 0;
   margin: 0;
+  width: 100%;
+  /* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
+  container-type: inline-size;
 }
 
-.fields-controls__slug .fields-controls__slug-external-icon {
-  margin-left: 5ch;
+fieldset.fields__media-edit .fields__media-edit-compact {
+  display: grid;
+  grid-template-columns: 1fr auto;
+  gap: 8px;
+  align-items: center;
 }
 
-.fields-controls__slug .fields-controls__slug-input input.components-input-control__input {
-  padding-inline-start: 0 !important;
+fieldset.fields__media-edit .fields__media-edit-compact .components-drop-zone .components-drop-zone__content-inner {
+  display: flex;
+  align-items: center;
+  gap: 8px;
 }
 
-.fields-controls__slug .fields-controls__slug-help-link {
-  word-break: break-word;
+fieldset.fields__media-edit .fields__media-edit-compact .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
+  margin: 0;
 }
 
-.fields-controls__slug .fields-controls__slug-help {
+fieldset.fields__media-edit .fields__media-edit-picker-button:has(.fields__media-edit-placeholder):not(.fields__media-edit-expanded *) .components-drop-zone .components-drop-zone__content-inner {
   display: flex;
-  flex-direction: column;
+  align-items: center;
+  gap: 8px;
 }
 
-.fields-controls__slug .fields-controls__slug-help .fields-controls__slug-help-slug {
-  font-weight: 600;
+fieldset.fields__media-edit .fields__media-edit-picker-button:has(.fields__media-edit-placeholder):not(.fields__media-edit-expanded *) .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
+  margin: 0;
+}
+
+fieldset.fields__media-edit .fields__media-edit-picker-button {
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  border: 1px dashed #949494;
+  border-radius: 1px;
+  padding: 7px;
+  cursor: pointer;
+  min-width: 0;
+}
+
+fieldset.fields__media-edit .fields__media-edit-picker-button:hover {
+  background-color: #f0f0f0;
 }
 
-.fields-controls__featured-image-placeholder {
+fieldset.fields__media-edit .fields__media-edit-picker-button:focus-visible {
+  box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
+  outline: none;
+}
+
+fieldset.fields__media-edit .fields__media-edit-picker-button[aria-disabled=true] {
+  opacity: 0.6;
+  cursor: default;
+}
+
+fieldset.fields__media-edit .fields__media-edit-picker-button .fields__media-edit-picker-button-spinner {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 1;
+}
+
+fieldset.fields__media-edit .fields__media-edit-filename,
+fieldset.fields__media-edit .fields__media-edit-placeholder {
+  flex: 1;
+  width: 100%;
+  min-width: 0;
+}
+
+fieldset.fields__media-edit .fields__media-edit-placeholder {
+  text-align: center;
+}
+
+fieldset.fields__media-edit .fields__media-edit-thumbnail {
+  width: 24px;
+  aspect-ratio: 1/1;
+  flex-shrink: 0;
   border-radius: 2px;
-  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
-  display: inline-block;
-  padding: 0;
-  background: #fff linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
 }
 
-.fields-controls__featured-image-title {
+fieldset.fields__media-edit .fields__media-edit-expanded {
+  display: grid;
+  gap: 8px;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded.is-empty .components-drop-zone .components-drop-zone__content-inner {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded.is-empty .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
+  margin: 0;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-preview {
+  position: relative;
   width: 100%;
-  color: #1e1e1e;
-  white-space: nowrap;
-  text-overflow: ellipsis;
+  aspect-ratio: 3/2;
+  border-radius: 2px;
+  padding: 4px;
   overflow: hidden;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
-.fields-controls__featured-image-image {
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-preview .fields__media-edit-expanded-preview-stack {
   width: 100%;
   height: 100%;
-  border-radius: 2px;
-  align-self: center;
 }
 
-.fields-controls__featured-image-container .fields-controls__featured-image-placeholder {
-  margin: 0;
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  opacity: 0;
+  pointer-events: none;
 }
 
-.fields-controls__featured-image-container span {
-  margin-right: auto;
+@media not (prefers-reduced-motion) {
+  fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-overlay {
+    transition: opacity 50ms ease-out;
+  }
+}
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-overlay * {
+  pointer-events: auto;
 }
 
-fieldset.fields-controls__featured-image {
-  border: 0;
-  padding: 0;
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-remove {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  border-radius: 1px;
+  backdrop-filter: blur(16px) saturate(180%);
+  background: rgba(255, 255, 255, 0.75);
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-title {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  margin: 8px;
+  padding: 4px;
+  text-align: center;
+  border-radius: 1px;
+  backdrop-filter: blur(16px) saturate(180%);
+  background: rgba(255, 255, 255, 0.75);
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item {
+  position: relative;
+  min-width: 0;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item:hover .fields__media-edit-expanded-overlay, fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item:focus-within .fields__media-edit-expanded-overlay {
+  opacity: 1;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-expanded-item:not(.has-preview-image) .fields__media-edit-expanded-preview-stack {
+  padding: 8px;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-thumbnail {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  object-position: 50% 50%;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-filename {
+  text-align: center;
+  flex: none;
+}
+
+fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-picker-button-spinner svg {
   margin: 0;
 }
 
-fieldset.fields-controls__featured-image .fields-controls__featured-image-container {
-  border: 1px solid #ddd;
-  border-radius: 2px;
-  padding: 8px 12px;
-  cursor: pointer;
+fieldset.fields__media-edit .fields__media-edit-expanded.is-single {
+  grid-template-columns: 1fr;
 }
 
-fieldset.fields-controls__featured-image .fields-controls__featured-image-container:hover {
-  background-color: #f0f0f0;
+fieldset.fields__media-edit .fields__media-edit-expanded.is-single .fields__media-edit-expanded-preview {
+  aspect-ratio: 2/1;
 }
 
-fieldset.fields-controls__featured-image .fields-controls__featured-image-placeholder {
-  width: 24px;
-  height: 24px;
+fieldset.fields__media-edit .fields__media-edit-expanded.is-multiple:not(.is-empty) {
+  grid-template-columns: repeat(3, 1fr);
+  /* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
 }
 
-fieldset.fields-controls__featured-image span {
-  align-self: center;
-  text-align: start;
-  white-space: nowrap;
+@container (max-width: 768px) {
+  fieldset.fields__media-edit .fields__media-edit-expanded.is-multiple:not(.is-empty) {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+fieldset.fields__media-edit .fields__media-edit-expanded.is-multiple:not(.is-empty) {
+  /* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
 }
 
-fieldset.fields-controls__featured-image .fields-controls__featured-image-upload-button {
+@container (max-width: 280px) {
+  fieldset.fields__media-edit .fields__media-edit-expanded.is-multiple:not(.is-empty) {
+    grid-template-columns: 1fr;
+  }
+}
+fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields__media-edit-picker-button {
   padding: 0;
-  height: fit-content;
 }
 
-fieldset.fields-controls__featured-image .fields-controls__featured-image-upload-button:hover, fieldset.fields-controls__featured-image .fields-controls__featured-image-upload-button:focus {
+fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields__media-edit-placeholder {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  aspect-ratio: 3/2;
+}
+
+.fields-controls__slug {
   border: 0;
-  color: unset;
+  padding: 0;
+  margin: 0;
 }
 
-fieldset.fields-controls__featured-image .fields-controls__featured-image-remove-button {
-  place-self: end;
+.fields-controls__slug .fields-controls__slug-external-icon {
+  margin-left: 5ch;
 }
 
-.dataforms-layouts-panel__field-control .fields-controls__featured-image-image {
-  width: 16px;
-  height: 16px;
+.fields-controls__slug .fields-controls__slug-input input.components-input-control__input {
+  padding-inline-start: 0 !important;
 }
 
-.dataforms-layouts-panel__field-control .fields-controls__featured-image-placeholder {
-  width: 16px;
-  height: 16px;
+.fields-controls__slug .fields-controls__slug-help-link {
+  word-break: break-word;
+}
+
+.fields-controls__slug .fields-controls__slug-help {
+  display: flex;
+  flex-direction: column;
+}
+
+.fields-controls__slug .fields-controls__slug-help .fields-controls__slug-help-slug {
+  font-weight: 600;
 }
 
 .dataviews-view-grid__media .fields-controls__featured-image-image,
@@ -2818,6 +3248,11 @@ fieldset.fields-controls__featured-image .fields-controls__featured-image-remove
   height: 32px;
 }
 
+.dataforms-layouts-panel__field-control .fields-controls__featured-image-image {
+  width: 16px;
+  height: 16px;
+}
+
 .fields-controls__parent {
   border: 0;
   padding: 0;
@@ -2958,6 +3393,10 @@ fieldset.fields-controls__featured-image .fields-controls__featured-image-remove
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+/**
+ * Creates a checkerboard pattern background to indicate transparency.
+ * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
+ */
 @media (min-width: 782px) {
   .font-library-modal.font-library-modal {
     width: 65vw;
@@ -3503,8 +3942,10 @@ button.font-library__upload-area {
   border: #ddd 1px solid;
   border-radius: 2px;
   overflow: auto;
-  background-image: repeating-linear-gradient(45deg, #f5f5f5 25%, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 75%, #f5f5f5 0, #f5f5f5), repeating-linear-gradient(45deg, #f5f5f5 25%, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 75%, #f5f5f5 0, #f5f5f5);
+  /*rtl:begin:ignore*/
+  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);
   background-position: 0 0, 8px 8px;
+  /*rtl:end:ignore*/
   background-size: 16px 16px;
 }
 
@@ -4936,8 +5377,8 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
 }
 body:has(.edit-site-resizable-frame__inner.is-resizing) {
   cursor: col-resize;
-  user-select: none;
   -webkit-user-select: none;
+          user-select: none;
 }
 
 .edit-site-resizable-frame__inner.is-resizing::before {
@@ -5114,124 +5555,4 @@ body.js.site-editor-php {
 }
 .edit-site .interface-interface-skeleton {
   top: 0;
-}
-
-body.admin-color-light {
-  --wp-admin-theme-color: #0085ba;
-  --wp-admin-theme-color--rgb: 0, 133, 186;
-  --wp-admin-theme-color-darker-10: rgb(0, 114.7661290323, 160.5);
-  --wp-admin-theme-color-darker-10--rgb: 0, 114.7661290323, 160.5;
-  --wp-admin-theme-color-darker-20: rgb(0, 96.5322580645, 135);
-  --wp-admin-theme-color-darker-20--rgb: 0, 96.5322580645, 135;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-light {
-    --wp-admin-border-width-focus: 1.5px;
-  }
-}
-
-body.admin-color-modern {
-  --wp-admin-theme-color: #3858e9;
-  --wp-admin-theme-color--rgb: 56, 88, 233;
-  --wp-admin-theme-color-darker-10: rgb(33.0384615385, 68.7307692308, 230.4615384615);
-  --wp-admin-theme-color-darker-10--rgb: 33.0384615385, 68.7307692308, 230.4615384615;
-  --wp-admin-theme-color-darker-20: rgb(23.6923076923, 58.1538461538, 214.3076923077);
-  --wp-admin-theme-color-darker-20--rgb: 23.6923076923, 58.1538461538, 214.3076923077;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-modern {
-    --wp-admin-border-width-focus: 1.5px;
-  }
-}
-
-body.admin-color-blue {
-  --wp-admin-theme-color: #096484;
-  --wp-admin-theme-color--rgb: 9, 100, 132;
-  --wp-admin-theme-color-darker-10: rgb(7.3723404255, 81.914893617, 108.1276595745);
-  --wp-admin-theme-color-darker-10--rgb: 7.3723404255, 81.914893617, 108.1276595745;
-  --wp-admin-theme-color-darker-20: rgb(5.7446808511, 63.829787234, 84.2553191489);
-  --wp-admin-theme-color-darker-20--rgb: 5.7446808511, 63.829787234, 84.2553191489;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-blue {
-    --wp-admin-border-width-focus: 1.5px;
-  }
-}
-
-body.admin-color-coffee {
-  --wp-admin-theme-color: #46403c;
-  --wp-admin-theme-color--rgb: 70, 64, 60;
-  --wp-admin-theme-color-darker-10: rgb(56.2692307692, 51.4461538462, 48.2307692308);
-  --wp-admin-theme-color-darker-10--rgb: 56.2692307692, 51.4461538462, 48.2307692308;
-  --wp-admin-theme-color-darker-20: rgb(42.5384615385, 38.8923076923, 36.4615384615);
-  --wp-admin-theme-color-darker-20--rgb: 42.5384615385, 38.8923076923, 36.4615384615;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-coffee {
-    --wp-admin-border-width-focus: 1.5px;
-  }
-}
-
-body.admin-color-ectoplasm {
-  --wp-admin-theme-color: #523f6d;
-  --wp-admin-theme-color--rgb: 82, 63, 109;
-  --wp-admin-theme-color-darker-10: rgb(69.8430232558, 53.6598837209, 92.8401162791);
-  --wp-admin-theme-color-darker-10--rgb: 69.8430232558, 53.6598837209, 92.8401162791;
-  --wp-admin-theme-color-darker-20: rgb(57.6860465116, 44.3197674419, 76.6802325581);
-  --wp-admin-theme-color-darker-20--rgb: 57.6860465116, 44.3197674419, 76.6802325581;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-ectoplasm {
-    --wp-admin-border-width-focus: 1.5px;
-  }
-}
-
-body.admin-color-midnight {
-  --wp-admin-theme-color: #e14d43;
-  --wp-admin-theme-color--rgb: 225, 77, 67;
-  --wp-admin-theme-color-darker-10: rgb(221.4908256881, 56.1788990826, 45.0091743119);
-  --wp-admin-theme-color-darker-10--rgb: 221.4908256881, 56.1788990826, 45.0091743119;
-  --wp-admin-theme-color-darker-20: rgb(207.8348623853, 44.2201834862, 33.1651376147);
-  --wp-admin-theme-color-darker-20--rgb: 207.8348623853, 44.2201834862, 33.1651376147;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-midnight {
-    --wp-admin-border-width-focus: 1.5px;
-  }
-}
-
-body.admin-color-ocean {
-  --wp-admin-theme-color: #627c83;
-  --wp-admin-theme-color--rgb: 98, 124, 131;
-  --wp-admin-theme-color-darker-10: rgb(87.0873362445, 110.192139738, 116.4126637555);
-  --wp-admin-theme-color-darker-10--rgb: 87.0873362445, 110.192139738, 116.4126637555;
-  --wp-admin-theme-color-darker-20: rgb(76.1746724891, 96.384279476, 101.8253275109);
-  --wp-admin-theme-color-darker-20--rgb: 76.1746724891, 96.384279476, 101.8253275109;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-ocean {
-    --wp-admin-border-width-focus: 1.5px;
-  }
-}
-
-body.admin-color-sunrise {
-  --wp-admin-theme-color: #dd823b;
-  --wp-admin-theme-color--rgb: 221, 130, 59;
-  --wp-admin-theme-color-darker-10: rgb(216.8782608696, 116.1847826087, 37.6217391304);
-  --wp-admin-theme-color-darker-10--rgb: 216.8782608696, 116.1847826087, 37.6217391304;
-  --wp-admin-theme-color-darker-20: rgb(195.147826087, 104.5434782609, 33.852173913);
-  --wp-admin-theme-color-darker-20--rgb: 195.147826087, 104.5434782609, 33.852173913;
-  --wp-admin-border-width-focus: 2px;
-}
-@media (min-resolution: 192dpi) {
-  body.admin-color-sunrise {
-    --wp-admin-border-width-focus: 1.5px;
-  }
 }