@swiftwc/ui 0.0.0-dev.99 → 1.0.0-canary.1

package/generated/css/index.css

@@ -3,7 +3,7 @@
   inherits: false;
   initial-value: 16;
 }
-@layer sw-components {
+@layer sw.sw-components {
   :root {
     color-scheme: light dark;
     --safe-area-inset-top: env(safe-area-inset-top);
@@ -115,6 +115,20 @@
     --screen-box-shadow: 2px 0 6px oklch(0 0 0 / 48%), 6px 0 16px oklch(0 0 0 / 67%);
     --labeled-content-column-gap: 1rem;
     --labeled-content-row-gap: 0.5rem;
+    --toggle-inline-size: 3.4rem;
+    --toggle-block-size: 1.5rem;
+    --toggle-border-radius: var(--pill-border-radius);
+    --toggle-track-off-bg: var(--gray2);
+    --toggle-track-off-bg-dark: var(--gray2);
+    --toggle-track-on-bg: var(--green);
+    --toggle-track-on-bg-dark: var(--green);
+    --toggle-dot-bg: var(--control-clear-glass-bg);
+    --toggle-dot-bg-dark: var(--control-clear-glass-bg-dark);
+    --toggle-dot-focus-bg: var(--control-clear-glass-focus-bg);
+    --toggle-dot-focus-bg-dark: var(--control-clear-glass-focus-bg-dark);
+    --toggle-dot-active-bg: var(--control-clear-glass-active-bg);
+    --toggle-dot-active-bg-dark: var(--control-clear-glass-active-bg-dark);
+    --toggle-dot-box-shadow: var(--control-clear-glass-box-shadow);
     --label-footnote-font-size: 1rem;
     --label-footnote-line-height: 1.1875;
     --label-footnote-font-weight: 400;
@@ -290,6 +304,8 @@
       --list-item-padding-inline-end: 1rem;
       --form-item-padding-inline-start: 1rem;
       --form-item-padding-inline-end: 1rem;
+      --toggle-inline-size: 3.4rem;
+      --toggle-block-size: 1.3rem;
       --control-clear-glass-bg: var(--white);
       --control-clear-glass-bg-dark: oklch(0.2871 0.0029 17.33);
       --control-clear-glass-focus-bg: var(--gray5);
@@ -306,8 +322,10 @@
     color-scheme: light only;
   }
 }
-@layer sw-base, sw-components, sw-nav-components, sw-list-components, sw-tab-components, sw-utils, sw-colors, sw-actions, sw-transitions, sw-final;
-@layer sw-base {
+@layer sw {
+  @layer sw-base, sw-components, sw-nav-components, sw-list-components, sw-tab-components, sw-utils, sw-colors, sw-actions, sw-transitions, sw-final;
+}
+@layer sw.sw-base {
   :root {
     interpolate-size: allow-keywords;
     touch-action: manipulation;
@@ -411,7 +429,7 @@
     display: none;
   }
 }
-@layer sw-list-components {
+@layer sw.sw-list-components {
   :where(table-view:not(table-view table-view, list-view table-view, [is=form-view] table-view), [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]), list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)) {
     background-color: var(--list--host-background-color, );
     padding-inline: var(--list--host-padding-inline, );
@@ -831,7 +849,7 @@
     color: var(--accentColor);
   }
 }
-@layer sw-colors {
+@layer sw.sw-colors {
   :where(table-view:not(table-view table-view, list-view table-view, [is=form-view] table-view) > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]), [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]), list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view) > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]),
   table-view:not(table-view table-view, list-view table-view, [is=form-view] table-view) section-view > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]),
   [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) section-view > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]),
@@ -869,7 +887,7 @@
     --accentColorEffective: var(--itemtext);
   }
 }
-@layer sw-actions {
+@layer sw.sw-actions {
   :where(table-view:not(table-view table-view, list-view table-view, [is=form-view] table-view) > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]), [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]), list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view) > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]),
   table-view:not(table-view table-view, list-view table-view, [is=form-view] table-view) section-view > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]),
   [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) section-view > :not([slot], section-view, [is=disclosure-group], picker-view, menu-view, menu-view *, whatever-name):not(:disabled):not([readonly]),
@@ -925,7 +943,7 @@
     --accentColorEffective: var(--itemtext);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=glass-prominent-button], [is=glass-button], [is=bordered-prominent-button], [is=bordered-button], [is=borderless-button], [is=plain-button]) {
     place-items: center;
     place-content: center;
@@ -999,7 +1017,7 @@
     --label-font: caption;
   }
 }
-@layer sw-colors {
+@layer sw.sw-colors {
   :where([is=glass-prominent-button]:not(:disabled):not([readonly]), [is=glass-button]:not(:disabled):not([readonly]), [is=bordered-prominent-button]:not(:disabled):not([readonly]), [is=bordered-button]:not(:disabled):not([readonly]), [is=borderless-button]:not(:disabled):not([readonly]), [is=plain-button]:not(:disabled):not([readonly])):focus-visible {
     outline: none;
   }
@@ -1014,13 +1032,13 @@
     }
   }
 }
-@layer sw-actions {
+@layer sw.sw-actions {
   :where([is=glass-prominent-button]:not(:disabled):not([readonly]), [is=glass-button]:not(:disabled):not([readonly]), [is=bordered-prominent-button]:not(:disabled):not([readonly]), [is=bordered-button]:not(:disabled):not([readonly]), [is=borderless-button]:not(:disabled):not([readonly]), [is=plain-button]:not(:disabled):not([readonly])):active {
     --btnface: var(--btnactiveface,);
     --btntext: var(--btnactivetext,);
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where([is=glass-prominent-button], [is=glass-button], [is=bordered-prominent-button], [is=bordered-button], [is=borderless-button], [is=plain-button]) {
       transition: background-color 100ms ease-out allow-discrete, opacity 100ms ease-out allow-discrete, color 100ms ease-out allow-discrete;
@@ -1031,8 +1049,8 @@
     }
   }
 }
-@layer sw-components {
-  :where(body-view,
+@layer sw.sw-components {
+  :where(content-view,
   navigation-stack,
   navigation-split-view,
   [is=full-screen],
@@ -1042,7 +1060,7 @@
     grid-template-columns: minmax(0, 1fr);
     grid-template-rows: minmax(0, 1fr);
   }
-  :where(body-view > *:not([slot]),
+  :where(content-view > *:not([slot]),
   navigation-stack > *:not([slot]),
   navigation-split-view > *:not([slot]),
   [is=full-screen] > *:not([slot]),
@@ -1052,67 +1070,50 @@
   }
   :where(navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > scroll-view,
   navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > [is=sidebar-view] > scroll-view,
-  navigation-stack:has(> body-view) > scroll-view,
-  navigation-stack:has(> body-view) > [is=sidebar-view] > scroll-view,
-  navigation-split-view:has(> body-view) > scroll-view,
-  navigation-split-view:has(> body-view) > [is=sidebar-view] > scroll-view,
-  dialog:has(> body-view) > scroll-view,
-  dialog:has(> body-view) > [is=sidebar-view] > scroll-view,
-  body-view:has(> body-view) > scroll-view,
-  body-view:has(> body-view) > [is=sidebar-view] > scroll-view) {
+  navigation-stack:has(> content-view) > scroll-view,
+  navigation-stack:has(> content-view) > [is=sidebar-view] > scroll-view,
+  navigation-split-view:has(> content-view) > scroll-view,
+  navigation-split-view:has(> content-view) > [is=sidebar-view] > scroll-view,
+  dialog:has(> content-view) > scroll-view,
+  dialog:has(> content-view) > [is=sidebar-view] > scroll-view,
+  content-view:has(> content-view) > scroll-view,
+  content-view:has(> content-view) > [is=sidebar-view] > scroll-view) {
     --scroll-view-translate: translateX(var(--view-transition-leading-x));
   }
   :where(navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > tool-bar > tool-bar-item,
   navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > tool-bar > tool-bar-item-group,
   navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > [is=sidebar-view] > tool-bar > tool-bar-item,
   navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
-  navigation-stack:has(> body-view) > tool-bar > tool-bar-item,
-  navigation-stack:has(> body-view) > tool-bar > tool-bar-item-group,
-  navigation-stack:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
-  navigation-stack:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
-  navigation-split-view:has(> body-view) > tool-bar > tool-bar-item,
-  navigation-split-view:has(> body-view) > tool-bar > tool-bar-item-group,
-  navigation-split-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
-  navigation-split-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
-  dialog:has(> body-view) > tool-bar > tool-bar-item,
-  dialog:has(> body-view) > tool-bar > tool-bar-item-group,
-  dialog:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
-  dialog:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
-  body-view:has(> body-view) > tool-bar > tool-bar-item,
-  body-view:has(> body-view) > tool-bar > tool-bar-item-group,
-  body-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
-  body-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group) {
+  navigation-stack:has(> content-view) > tool-bar > tool-bar-item,
+  navigation-stack:has(> content-view) > tool-bar > tool-bar-item-group,
+  navigation-stack:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
+  navigation-stack:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
+  navigation-split-view:has(> content-view) > tool-bar > tool-bar-item,
+  navigation-split-view:has(> content-view) > tool-bar > tool-bar-item-group,
+  navigation-split-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
+  navigation-split-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
+  dialog:has(> content-view) > tool-bar > tool-bar-item,
+  dialog:has(> content-view) > tool-bar > tool-bar-item-group,
+  dialog:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
+  dialog:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
+  content-view:has(> content-view) > tool-bar > tool-bar-item,
+  content-view:has(> content-view) > tool-bar > tool-bar-item-group,
+  content-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
+  content-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group) {
     --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-offscreen-scale));
     --toolbar-cell-filter: blur(10px);
     --toolbar-cell-opacity: 0;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(navigation-stack:not([hidden]),
   navigation-split-view:not([hidden]),
   navigation-large-title:not([hidden]),
   navigation-title:not([hidden]),
   scroll-view:not([hidden]),
-  body-view:not([hidden]),
+  content-view:not([hidden]),
   tab-view:not([hidden]),
   image-view:not([hidden]),
-  [is=search-view]:not([hidden]),
-  [is=sidebar-view]:not([hidden]),
-  [is=tab-bar]:not([hidden]),
-  [is=full-screen]:not([hidden]),
-  [is=confirmation-dialog]:not([hidden]),
-  [is=alert-dialog]:not([hidden]),
-  [is=sheet-view]:not([hidden]),
-  [is=form-view]:not([hidden]),
-  [is=disclosure-group]:not([hidden]),
-  [is=table-row]:not([hidden]),
-  [is=table-column]:not([hidden]),
-  [is=borderless-button]:not([hidden]),
-  [is=bordered-button]:not([hidden]),
-  [is=bordered-prominent-button]:not([hidden]),
-  [is=plain-button]:not([hidden]),
-  [is=glass-button]:not([hidden]),
-  [is=glass-prominent-button]:not([hidden]),
   list-view:not([hidden]),
   table-view:not([hidden]),
   content-unavailable:not([hidden]),
@@ -1121,7 +1122,6 @@
   tool-bar-item-group:not([hidden]),
   fine-tooltip:not([hidden]),
   sidebar-toggle:not([hidden]),
-  [is=form-view]:not([hidden]),
   v-stack:not([hidden]),
   h-stack:not([hidden]),
   group-box:not([hidden]),
@@ -1134,7 +1134,121 @@
   text-field:not([hidden]),
   detail-placeholder:not([hidden]),
   sticky-container:not([hidden]),
-  picker-view:not([hidden])) {
+  picker-view:not([hidden]),
+  h-divider:not([hidden]),
+  v-divider:not([hidden])) {
+    display: grid;
+  }
+  :where(tab-view:has(navigation-stack:not(:defined),
+  navigation-split-view:not(:defined),
+  navigation-large-title:not(:defined),
+  navigation-title:not(:defined),
+  scroll-view:not(:defined),
+  content-view:not(:defined),
+  tab-view:not(:defined),
+  image-view:not(:defined),
+  list-view:not(:defined),
+  table-view:not(:defined),
+  content-unavailable:not(:defined),
+  progress-view:not(:defined),
+  tool-bar-item:not(:defined),
+  tool-bar-item-group:not(:defined),
+  fine-tooltip:not(:defined),
+  sidebar-toggle:not(:defined),
+  v-stack:not(:defined),
+  h-stack:not(:defined),
+  group-box:not(:defined),
+  tool-bar:not(:defined),
+  label-view:not(:defined),
+  text-view:not(:defined),
+  labeled-content:not(:defined),
+  menu-view:not(:defined),
+  section-view:not(:defined),
+  text-field:not(:defined),
+  detail-placeholder:not(:defined),
+  sticky-container:not(:defined),
+  picker-view:not(:defined),
+  h-divider:not(:defined),
+  v-divider:not(:defined)), navigation-split-view:has(navigation-stack:not(:defined),
+  navigation-split-view:not(:defined),
+  navigation-large-title:not(:defined),
+  navigation-title:not(:defined),
+  scroll-view:not(:defined),
+  content-view:not(:defined),
+  tab-view:not(:defined),
+  image-view:not(:defined),
+  list-view:not(:defined),
+  table-view:not(:defined),
+  content-unavailable:not(:defined),
+  progress-view:not(:defined),
+  tool-bar-item:not(:defined),
+  tool-bar-item-group:not(:defined),
+  fine-tooltip:not(:defined),
+  sidebar-toggle:not(:defined),
+  v-stack:not(:defined),
+  h-stack:not(:defined),
+  group-box:not(:defined),
+  tool-bar:not(:defined),
+  label-view:not(:defined),
+  text-view:not(:defined),
+  labeled-content:not(:defined),
+  menu-view:not(:defined),
+  section-view:not(:defined),
+  text-field:not(:defined),
+  detail-placeholder:not(:defined),
+  sticky-container:not(:defined),
+  picker-view:not(:defined),
+  h-divider:not(:defined),
+  v-divider:not(:defined)), navigation-stack:has(navigation-stack:not(:defined),
+  navigation-split-view:not(:defined),
+  navigation-large-title:not(:defined),
+  navigation-title:not(:defined),
+  scroll-view:not(:defined),
+  content-view:not(:defined),
+  tab-view:not(:defined),
+  image-view:not(:defined),
+  list-view:not(:defined),
+  table-view:not(:defined),
+  content-unavailable:not(:defined),
+  progress-view:not(:defined),
+  tool-bar-item:not(:defined),
+  tool-bar-item-group:not(:defined),
+  fine-tooltip:not(:defined),
+  sidebar-toggle:not(:defined),
+  v-stack:not(:defined),
+  h-stack:not(:defined),
+  group-box:not(:defined),
+  tool-bar:not(:defined),
+  label-view:not(:defined),
+  text-view:not(:defined),
+  labeled-content:not(:defined),
+  menu-view:not(:defined),
+  section-view:not(:defined),
+  text-field:not(:defined),
+  detail-placeholder:not(:defined),
+  sticky-container:not(:defined),
+  picker-view:not(:defined),
+  h-divider:not(:defined),
+  v-divider:not(:defined))) {
+    visibility: hidden;
+  }
+  :where([is=search-view]:not([hidden]),
+  [is=sidebar-view]:not([hidden]),
+  [is=tab-bar]:not([hidden]),
+  [is=full-screen]:not([hidden]),
+  [is=confirmation-dialog]:not([hidden]),
+  [is=alert-dialog]:not([hidden]),
+  [is=sheet-view]:not([hidden]),
+  [is=form-view]:not([hidden]),
+  [is=disclosure-group]:not([hidden]),
+  [is=table-row]:not([hidden]),
+  [is=table-column]:not([hidden]),
+  [is=borderless-button]:not([hidden]),
+  [is=bordered-button]:not([hidden]),
+  [is=bordered-prominent-button]:not([hidden]),
+  [is=plain-button]:not([hidden]),
+  [is=glass-button]:not([hidden]),
+  [is=glass-prominent-button]:not([hidden])) {
     display: grid;
   }
   :where(labeled-content)::part(labeled-content-container),
@@ -1174,7 +1288,6 @@
   :where(menu-view)::part(menu-scrollable),
   :where(picker-view)::part(picker-stack),
   :where(picker-view)::part(picker-label-stack),
-  :where(picker-view)::part(picker-input-stack),
   :where(tool-bar)::part(top-bar),
   :where(tool-bar)::part(bottom-bar),
   :where(label-view)::part(label-image-stack),
@@ -1215,7 +1328,7 @@
     border-radius: var(--toolbaritemradiustl,) var(--toolbaritemradiustr,) var(--toolbaritemradiusbr,) var(--toolbaritemradiusbl,);
   }
 }
-@layer sw-colors {
+@layer sw.sw-colors {
   :where(sidebar-toggle > button:not(:disabled):not([readonly]),
   tool-bar-item > button:not(:disabled):not([readonly]),
   tool-bar-item > input:not(:disabled):not([readonly]),
@@ -1245,7 +1358,7 @@
     }
   }
 }
-@layer sw-actions {
+@layer sw.sw-actions {
   :where(sidebar-toggle > button:not(:disabled):not([readonly]),
   tool-bar-item > button:not(:disabled):not([readonly]),
   tool-bar-item > input:not(:disabled):not([readonly]),
@@ -1256,7 +1369,7 @@
     --toolbaritemtext: var(--toolbaritemactivetext,);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(v-keyboard) {
     position: fixed;
     inset: 0lvh auto auto 0lvw;
@@ -1264,7 +1377,7 @@
     block-size: 100lvh;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=disclosure-group]) {
     overflow: clip;
     --disclosure--host-details-content-block-size: 0;
@@ -1360,7 +1473,7 @@
     }
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   @supports (x: attr(x type(*))) {
     :where([is=disclosure-group]) {
       --disclosure-style: attr(disclosure-style type(<custom-ident>), inherit);
@@ -1394,7 +1507,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(image-view) {
     --image--fontsize: calc(var(--label-image-size) * 1rem);
   }
@@ -1404,7 +1517,7 @@
     font-size: var(--image--fontsize);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(group-box) {
     background: var(--groupbox--background);
     padding-inline: var(--groupbox--padding-inline);
@@ -1420,21 +1533,21 @@
     --label-image-size: 5;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(h-divider) {
     inline-size: 100%;
     block-size: 1px;
     background-color: var(--separator);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(v-divider) {
     inline-size: 1px;
     block-size: 100%;
     background-color: var(--separator);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=full-screen]) {
     inset-inline: 0px;
     inset-block: 0px;
@@ -1456,7 +1569,7 @@
     block-size: var(--100lvh, 100lvh);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(detail-placeholder) {
     pointer-events: none;
     touch-action: none;
@@ -1532,20 +1645,20 @@
     }
   }
   @media (min-width: 43rem) {
-    :where(navigation-split-view:not(:has(> [is=sidebar-view])):has(> body-view) detail-placeholder) {
+    :where(navigation-split-view:not(:has(> [is=sidebar-view])):has(> content-view) detail-placeholder) {
       --nav-split-view--detail-placeholder-visibility: collapse;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content]:not(:has(> body-view)) detail-placeholder) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content]:not(:has(> content-view)) detail-placeholder) {
       --nav-split-view--detail-placeholder-visibility: collapse;
     }
   }
   @media (min-width: 43rem) and (min-width: 64rem) {
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):has(> body-view > body-view) detail-placeholder) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):has(> content-view > content-view) detail-placeholder) {
       --nav-split-view--detail-placeholder-visibility: collapse;
     }
   }
   @media (min-width: 43rem) {
-    :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column]:has(> body-view) detail-placeholder) {
+    :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column]:has(> content-view) detail-placeholder) {
       --nav-split-view--detail-placeholder-visibility: collapse;
     }
   }
@@ -1555,7 +1668,7 @@
   inherits: false;
   initial-value: 0;
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(progress-view) {
     transition: --progress-view-style-index 1ms step-start;
     grid-template-columns: minmax(0, 1fr);
@@ -1628,7 +1741,7 @@
     --progress-view-style-index: 1;
   }
 }
-@layer sw-tab-components {
+@layer sw.sw-tab-components {
   :where(fine-tooltip) {
     color: var(--text, );
     pointer-events: none;
@@ -1690,7 +1803,7 @@
   inherits: false;
   initial-value: 0;
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(sticky-container) {
     container-type: scroll-state;
     position: sticky;
@@ -1715,7 +1828,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=sheet-view]) {
     inset-inline: 0px;
     inset-block: 0px;
@@ -1761,7 +1874,7 @@
       :where([is=sheet-view]:has([is=sheet-view]:not([open]))) {
         overflow: visible;
       }
-      :where([is=sheet-view]:has([is=sheet-view]:not([open])) scroll-view:has(~ body-view), [is=sheet-view]:has([is=sheet-view]:not([open])) scroll-view:has(~ body-view) ~ tool-bar) {
+      :where([is=sheet-view]:has([is=sheet-view]:not([open])) scroll-view:has(~ content-view), [is=sheet-view]:has([is=sheet-view]:not([open])) scroll-view:has(~ content-view) ~ tool-bar) {
         opacity: 0;
       }
       :where([is=sheet-view] [is=sheet-view]:not([open])) {
@@ -1771,7 +1884,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(content-unavailable) {
     place-content: center;
     place-items: center;
@@ -1801,7 +1914,7 @@
     display: none;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=confirmation-dialog]) {
     inset-inline: 0px;
     inset-block: 0px;
@@ -1876,7 +1989,7 @@
     --confirmation--inner-scale: scale3d(0, 0, 1);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=alert-dialog]) {
     inset-inline: 0px;
     inset-block: 0px;
@@ -1953,17 +2066,17 @@
     --alert--dialog-opacity: 0;
   }
 }
-@layer sw-components {
-  :where(navigation-stack > scroll-view:has(~ tool-bar > [slot^=top-bar]), navigation-stack > scroll-view:has(> [slot^=top-bar]), navigation-split-view > scroll-view:has(~ tool-bar > [slot^=top-bar]), navigation-split-view > scroll-view:has(> [slot^=top-bar]), [is=sidebar-view] > scroll-view:has(~ tool-bar > [slot^=top-bar]), [is=sidebar-view] > scroll-view:has(> [slot^=top-bar]), body-view > scroll-view:has(~ tool-bar > [slot^=top-bar]), body-view > scroll-view:has(> [slot^=top-bar]), [is=full-screen] > scroll-view:has(~ tool-bar > [slot^=top-bar]), [is=full-screen] > scroll-view:has(> [slot^=top-bar]), [is=sheet-view] > scroll-view:has(~ tool-bar > [slot^=top-bar]), [is=sheet-view] > scroll-view:has(> [slot^=top-bar])) {
+@layer sw.sw-components {
+  :where(navigation-stack > scroll-view:has(~ tool-bar > [slot^=top-bar]), navigation-stack > scroll-view:has(> [slot^=top-bar]), navigation-split-view > scroll-view:has(~ tool-bar > [slot^=top-bar]), navigation-split-view > scroll-view:has(> [slot^=top-bar]), [is=sidebar-view] > scroll-view:has(~ tool-bar > [slot^=top-bar]), [is=sidebar-view] > scroll-view:has(> [slot^=top-bar]), content-view > scroll-view:has(~ tool-bar > [slot^=top-bar]), content-view > scroll-view:has(> [slot^=top-bar]), [is=full-screen] > scroll-view:has(~ tool-bar > [slot^=top-bar]), [is=full-screen] > scroll-view:has(> [slot^=top-bar]), [is=sheet-view] > scroll-view:has(~ tool-bar > [slot^=top-bar]), [is=sheet-view] > scroll-view:has(> [slot^=top-bar])) {
     scroll-padding-top: var(--navigation-bar-block-size);
   }
-  :where(navigation-stack > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), navigation-stack > scroll-view:has(> [slot^=bottom-bar]), navigation-split-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), navigation-split-view > scroll-view:has(> [slot^=bottom-bar]), [is=sidebar-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), [is=sidebar-view] > scroll-view:has(> [slot^=bottom-bar]), body-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), body-view > scroll-view:has(> [slot^=bottom-bar]), [is=full-screen] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), [is=full-screen] > scroll-view:has(> [slot^=bottom-bar]), [is=sheet-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), [is=sheet-view] > scroll-view:has(> [slot^=bottom-bar])) {
+  :where(navigation-stack > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), navigation-stack > scroll-view:has(> [slot^=bottom-bar]), navigation-split-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), navigation-split-view > scroll-view:has(> [slot^=bottom-bar]), [is=sidebar-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), [is=sidebar-view] > scroll-view:has(> [slot^=bottom-bar]), content-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), content-view > scroll-view:has(> [slot^=bottom-bar]), [is=full-screen] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), [is=full-screen] > scroll-view:has(> [slot^=bottom-bar]), [is=sheet-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]), [is=sheet-view] > scroll-view:has(> [slot^=bottom-bar])) {
     scroll-padding-bottom: var(--tool-bar-block-size);
   }
-  :where(navigation-stack > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), navigation-stack > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), navigation-split-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), navigation-split-view > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), [is=sidebar-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), [is=sidebar-view] > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), body-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), body-view > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), [is=full-screen] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), [is=full-screen] > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), [is=sheet-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), [is=sheet-view] > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot])) {
+  :where(navigation-stack > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), navigation-stack > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), navigation-split-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), navigation-split-view > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), [is=sidebar-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), [is=sidebar-view] > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), content-view > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), content-view > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), [is=full-screen] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), [is=full-screen] > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot]), [is=sheet-view] > scroll-view:has(~ tool-bar > [slot^=bottom-bar]) > *:not([slot]), [is=sheet-view] > scroll-view:has(> [slot^=bottom-bar]) > *:not([slot])) {
     margin-block-end: var(--tool-bar-block-size);
   }
-  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, body-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view) {
+  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, content-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view) {
     overflow: clip auto;
     -webkit-overflow-scrolling: touch;
     overscroll-behavior: contain;
@@ -1976,7 +2089,7 @@
     transform: var(--scroll-view-translate, );
     scrollbar-width: thin;
   }
-  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, body-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view)::before {
+  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, content-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view)::before {
     grid-column: 1/-1;
     grid-row: 1/-1;
     content: "";
@@ -1985,29 +2098,29 @@
     z-index: -1;
     pointer-events: none;
   }
-  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, body-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view)::before {
+  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, content-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view)::before {
     block-size: calc(100% + var(--safe-area-inset-bottom) + 1px);
   }
-  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, body-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view) {
+  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, content-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view) {
     grid-template-columns: minmax(0, 1fr);
     grid-template-rows: 0 minmax(max-content, 1fr);
     grid-template-areas: "toolbar" "main";
   }
-  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, body-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view) > *:not([slot]) {
+  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, content-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view) > *:not([slot]) {
     grid-area: main;
   }
-  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, body-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view):has(~ tool-bar > [slot^=top-bar],
+  :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, content-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view):has(~ tool-bar > [slot^=top-bar],
   ~ tool-bar > [slot=cancellation-action],
   ~ tool-bar > [slot=primary-action],
   ~ tool-bar > [slot=confirmation-action],
-  ~ tool-bar > [slot=destructive-action]), :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, body-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view):has(> [slot^=top-bar], > [slot=cancellation-action], > [slot=primary-action], > [slot=confirmation-action], > [slot=destructive-action]) {
+  ~ tool-bar > [slot=destructive-action]), :where(navigation-stack > scroll-view, navigation-split-view > scroll-view, [is=sidebar-view] > scroll-view, content-view > scroll-view, [is=full-screen] > scroll-view, [is=sheet-view] > scroll-view):has(> [slot^=top-bar], > [slot=cancellation-action], > [slot=primary-action], > [slot=confirmation-action], > [slot=destructive-action]) {
     grid-template-rows: var(--navigation-bar-block-size) minmax(max-content, 1fr);
   }
-  :where(navigation-stack > scroll-view[navigation-bar-title-display-mode=large], navigation-split-view > scroll-view[navigation-bar-title-display-mode=large], [is=sidebar-view] > scroll-view[navigation-bar-title-display-mode=large], body-view > scroll-view[navigation-bar-title-display-mode=large], [is=full-screen] > scroll-view[navigation-bar-title-display-mode=large], [is=sheet-view] > scroll-view[navigation-bar-title-display-mode=large]) > [slot=top-bar-principal] {
+  :where(navigation-stack > scroll-view[navigation-bar-title-display-mode=large], navigation-split-view > scroll-view[navigation-bar-title-display-mode=large], [is=sidebar-view] > scroll-view[navigation-bar-title-display-mode=large], content-view > scroll-view[navigation-bar-title-display-mode=large], [is=full-screen] > scroll-view[navigation-bar-title-display-mode=large], [is=sheet-view] > scroll-view[navigation-bar-title-display-mode=large]) > [slot=top-bar-principal] {
     opacity: 0;
     visibility: collapse;
   }
-  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, body-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):before, :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, body-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):after {
+  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, content-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):before, :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, content-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):after {
     backface-visibility: hidden;
     content: "";
     inset: 0 0 var(--navbar-backdrop-inset-block-end, 0) 0;
@@ -2015,23 +2128,23 @@
     pointer-events: none;
     z-index: -1;
   }
-  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, body-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):before {
+  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, content-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):before {
     backdrop-filter: blur(2px);
     mask-image: linear-gradient(to bottom, oklch(0% 0 0deg) 50%, oklch(0% 0 0deg / 0) 100%);
   }
-  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, body-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):after {
+  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, content-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):after {
     background-image: linear-gradient(to bottom, var(--face) 0, oklch(0% 0 0deg / 0) 100%);
   }
-  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, body-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):after {
+  :where(navigation-stack > scroll-view sticky-container, navigation-split-view > scroll-view sticky-container, [is=sidebar-view] > scroll-view sticky-container, content-view > scroll-view sticky-container, [is=full-screen] > scroll-view sticky-container, [is=sheet-view] > scroll-view sticky-container):after {
     display: none;
   }
   @supports (container-type: scroll-state) {
-    :where(navigation-stack > scroll-view:has(sticky-container[stuck]), navigation-split-view > scroll-view:has(sticky-container[stuck]), [is=sidebar-view] > scroll-view:has(sticky-container[stuck]), body-view > scroll-view:has(sticky-container[stuck]), [is=full-screen] > scroll-view:has(sticky-container[stuck]), [is=sheet-view] > scroll-view:has(sticky-container[stuck]))::part(scroll-view-navbar):before {
+    :where(navigation-stack > scroll-view:has(sticky-container[stuck]), navigation-split-view > scroll-view:has(sticky-container[stuck]), [is=sidebar-view] > scroll-view:has(sticky-container[stuck]), content-view > scroll-view:has(sticky-container[stuck]), [is=full-screen] > scroll-view:has(sticky-container[stuck]), [is=sheet-view] > scroll-view:has(sticky-container[stuck]))::part(scroll-view-navbar):before {
       mask-image: none !important;
     }
   }
   @supports not (container-type: scroll-state) {
-    :where(navigation-stack > scroll-view:has(sticky-container), navigation-split-view > scroll-view:has(sticky-container), [is=sidebar-view] > scroll-view:has(sticky-container), body-view > scroll-view:has(sticky-container), [is=full-screen] > scroll-view:has(sticky-container), [is=sheet-view] > scroll-view:has(sticky-container))::part(scroll-view-navbar):before {
+    :where(navigation-stack > scroll-view:has(sticky-container), navigation-split-view > scroll-view:has(sticky-container), [is=sidebar-view] > scroll-view:has(sticky-container), content-view > scroll-view:has(sticky-container), [is=full-screen] > scroll-view:has(sticky-container), [is=sheet-view] > scroll-view:has(sticky-container))::part(scroll-view-navbar):before {
       mask-image: none !important;
     }
   }
@@ -2044,7 +2157,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(scroll-view-proxy) {
     display: contents;
   }
@@ -2079,7 +2192,7 @@
     scroll-padding-inline: 1rem;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(h-stack) {
     grid-auto-flow: column;
     grid-template-rows: minmax(0, 1fr);
@@ -2232,7 +2345,7 @@
     grid-template-columns: auto minmax(0, 1fr) auto auto;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(v-stack) {
     grid-template-columns: minmax(0, 1fr);
     place-items: safe center;
@@ -2384,12 +2497,13 @@
     grid-template-rows: auto minmax(0, 1fr) auto auto;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(h-flex-stack) {
     display: flex;
     flex-flow: row nowrap;
     place-items: safe center;
     place-content: safe center;
+    gap: 1rem;
   }
   :where(h-flex-stack > *) {
     max-block-size: 100%;
@@ -2398,12 +2512,13 @@
     flex-grow: 1;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(v-flex-stack) {
     display: flex;
     flex-flow: column nowrap;
     place-items: center;
     place-content: center;
+    gap: 1rem;
   }
   :where(v-flex-stack > *) {
     max-inline-size: 100%;
@@ -2412,7 +2527,7 @@
     flex-grow: 1;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(scroll-view)::part(scroll-view-navbar), :where(scroll-view)::part(scroll-view-toolbar) {
     position: sticky;
     inline-size: 100%;
@@ -2510,7 +2625,7 @@
     inline-size: calc(var(--toolbar-padding-inline-end) + var(--toolbar-safe-area-inset-right, 0px) + var(--toolbar-col-gap, 0px));
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(tool-bar-item) {
     pointer-events: all;
     border-radius: var(--pill-border-radius);
@@ -2563,14 +2678,14 @@
     --label-padding-inline: 0.5rem;
   }
 }
-@layer sw-actions {
+@layer sw.sw-actions {
   :where(tool-bar-item[slot]:has(menu-view[open])),
   :where(tool-bar-item-group:has(> tool-bar-item menu-view[open])) {
     --toolbar-cell-scale: var(--menu-host-offscreen-transform);
     --toolbar-cell-filter: var(--menu-host-offscreen-filter);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(tool-bar-item-group) {
     grid-auto-flow: column;
     grid-template-columns: minmax(0, 1fr);
@@ -2585,13 +2700,13 @@
     min-inline-size: calc(var(--toolbar-cell-min-size) - var(--toolbar-cell-block-padding-start) - var(--toolbar-cell-block-padding-end));
   }
 }
-@layer sw-components {}
-@layer sw-utils {
+@layer sw.sw-components {}
+@layer sw.sw-utils {
   :where([is=plain-button]) {
     text-align: center;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=borderless-button]) {
     --btnpadistart: 0.1rem;
     --btnpadiend: 0.1rem;
@@ -2617,12 +2732,12 @@
     --accentColor5: var(--blue5);
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   :where([is=borderless-button]) {
     text-align: center;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=bordered-button]) {
     --btnpadistart: var(--regular-btn-padding);
     --btnpadiend: var(--regular-btn-padding);
@@ -2677,12 +2792,12 @@
     --accentColor5: var(--blue5);
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   :where([is=bordered-button]) {
     text-align: center;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=bordered-prominent-button]) {
     --btnpadistart: var(--regular-btn-padding);
     --btnpadiend: var(--regular-btn-padding);
@@ -2732,7 +2847,7 @@
     --accentColor5: var(--blue5);
   }
 }
-@layer sw-colors {
+@layer sw.sw-colors {
   :where([is=bordered-prominent-button] > *) {
     --secondary: var(--btntext);
     --blue: var(--btntext);
@@ -2744,12 +2859,12 @@
     --accentColorEffective: var(--btntext);
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   :where([is=bordered-prominent-button]) {
     text-align: center;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=glass-button]) {
     backdrop-filter: var(--liquid-glass-backdrop-filter);
     box-shadow: var(--toolbar-cell-box-shadow);
@@ -2802,12 +2917,12 @@
     --accentColor5: var(--blue5);
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   :where([is=glass-button]) {
     text-align: center;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=glass-prominent-button]) {
     backdrop-filter: var(--liquid-glass-backdrop-filter);
     box-shadow: var(--toolbar-cell-box-shadow);
@@ -2860,7 +2975,7 @@
     --accentColor5: var(--blue5);
   }
 }
-@layer sw-colors {
+@layer sw.sw-colors {
   :where([is=glass-prominent-button] > *) {
     --secondary: var(--btntext);
     --blue: var(--btntext);
@@ -2872,12 +2987,12 @@
     --accentColorEffective: var(--btntext);
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   :where([is=glass-prominent-button]) {
     text-align: center;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=search-view]) {
     height: 30px;
     backdrop-filter: var(--liquid-glass-backdrop-filter, );
@@ -2888,7 +3003,7 @@
     outline: none;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(tool-bar) {
     pointer-events: none;
     touch-action: none;
@@ -2971,7 +3086,7 @@
   inherits: false;
   initial-value: 0;
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(label-view) {
     padding-inline: var(--label-padding-inline);
     align-items: var(--label--host-align-items, );
@@ -3425,7 +3540,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(text-view[prose]) {
     container: text-view/inline-size;
     --text-view--p-margin-block-start: 1rem;
@@ -3437,19 +3552,19 @@
     font-size: clamp(1rem, var(--text-view--h1-font-size) + 0.5rem, 3rem);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(toggle-view) {
     grid-template-columns: minmax(0, 1fr);
     grid-template-rows: minmax(0, 1fr);
     --toggle--track-padding: 0.2rem;
-    --toggle--track-bg: lightgray;
-    --toggle--dot-size: 1.4rem;
+    --toggle--track-bg: var(--toggle--track-off-bg);
+    --toggle--track-inline-size: var(--toggle-inline-size);
+    --toggle--dot-size: var(--toggle-block-size);
     --toggle--dot-inset-inline-start: 0;
     --toggle--dot-inset-inline-end: 100%;
-    --toggle--dot-x: 0px;
+    --toggle--dot-translate-x: 0px;
     --toggle--dot-transition-duration: 200ms;
     --toggle--dot-scale: scale(1);
-    --toogle--track-brightness: brightness(1);
   }
   :where(toggle-view)::part(toggle-stack) {
     grid-template-columns: minmax(0, 1fr) auto;
@@ -3464,7 +3579,7 @@
     cursor: pointer;
     padding-inline: var(--toggle--track-padding);
     padding-block: var(--toggle--track-padding);
-    border-radius: var(--pill-border-radius);
+    border-radius: var(--toggle-border-radius);
     background: var(--toggle--track-bg);
     transition: background-color var(--toggle--dot-transition-duration) ease-out;
   }
@@ -3474,14 +3589,16 @@
     position: relative;
     outline: none;
     border-radius: var(--pill-border-radius);
-    inline-size: 4rem;
+    inline-size: var(--toggle--track-inline-size);
     block-size: var(--toggle--dot-size);
-    filter: var(--toogle--track-brightness, );
-    transition: background-color var(--toggle--dot-transition-duration) ease-out;
     touch-action: none;
+    transition: background-color var(--toggle--dot-transition-duration) ease-out;
   }
   :where(toggle-view)::part(toggle-track):focus {
-    --toogle--track-brightness: brightness(0.9);
+    --toggle--dot-bg: light-dark(var(--toggle-dot-focus-bg), var(--toggle-dot-focus-bg-dark));
+  }
+  :where(toggle-view)::part(toggle-track):active {
+    --toggle--dot-bg: light-dark(var(--toggle-dot-active-bg), var(--toggle-dot-active-bg-dark));
   }
   :where(toggle-view)::part(toggle-track)::before {
     content: "";
@@ -3490,11 +3607,12 @@
     inset: 0 var(--toggle--dot-inset-inline-end) auto var(--toggle--dot-inset-inline-start);
     inline-size: var(--toggle--dot-size);
     block-size: var(--toggle--dot-size);
-    border-radius: var(--pill-border-radius);
+    border-radius: var(--toggle-border-radius);
     backdrop-filter: var(--liquid-glass-backdrop-filter);
-    box-shadow: var(--liquid-glass-box-shadow);
-    transition: inset-inline-start var(--toggle--dot-transition-duration) ease-out, inset-inline-end var(--toggle--dot-transition-duration) ease-out, transform var(--toggle--dot-transition-duration) ease-out, scale var(--toggle--dot-press-duration) ease-out;
-    transform: translateX(var(--toggle--dot-x));
+    box-shadow: var(--toggle-dot-box-shadow);
+    background: var(--toggle--dot-bg);
+    transition: inset-inline-start var(--toggle--dot-transition-duration) ease-out, inset-inline-end var(--toggle--dot-transition-duration) ease-out, transform var(--toggle--dot-transition-duration) ease-out, scale var(--toggle--dot-press-duration, 200ms) ease-out;
+    transform: translateX(var(--toggle--dot-translate-x));
     scale: var(--toggle--dot-scale, );
     transform-origin: center;
   }
@@ -3502,10 +3620,16 @@
     color: var(--secondary);
   }
   :where(toggle-view[aria-checked=true]) {
-    --toggle--track-bg: green;
+    --toggle--track-bg: var(--toggle--track-on-bg);
     --toggle--dot-inset-inline-start: calc(100% - var(--toggle--dot-size));
     --toggle--dot-inset-inline-end: 0;
   }
+  :where(toggle-view[aria-checked=true])::window-inactive {
+    --toggle--track-bg: var(--toggle--track-off-bg);
+  }
+  :where(toggle-view[aria-checked=true][js-window-inactive]) {
+    --toggle--track-bg: var(--toggle--track-off-bg);
+  }
   :where(toggle-view > :nth-child(n+2 of [slot=label])) {
     --label-font: callout;
   }
@@ -3520,7 +3644,7 @@
     color: var(--secondary);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(labeled-content) {
     container: labeled-content/inline-size;
   }
@@ -3574,8 +3698,8 @@
     }
   }
 }
-@layer sw-components {}
-@layer sw-components {
+@layer sw.sw-components {}
+@layer sw.sw-components {
   :where(navigation-large-title) {
     transition: --navigation-bar-block-size 1ms step-start;
   }
@@ -3583,19 +3707,16 @@
   navigation-large-title :nth-child(1 of label-view)) {
     --label-image-size: 5;
   }
+  :where(navigation-large-title :nth-child(1 of image-view)) {
+    color: var(--accentColor);
+  }
   :where(scroll-view[navigation-bar-title-display-mode=inline]:has(navigation-large-title) navigation-large-title[navigation-bar-auto-hide]) {
     opacity: 0;
     visibility: collapse;
   }
-  :where(navigation-large-title[background-style=grouped]) {
-    background-color: var(--secondaryGroupedBackground);
-    border-radius: var(--insetlist-item-border-radius);
-    padding-inline: var(--list-item-padding-inline-start) var(--list-item-padding-inline-end);
-    padding-block: 1rem;
-  }
 }
-@layer sw-components {}
-@layer sw-components {
+@layer sw.sw-components {}
+@layer sw.sw-components {
   :where(tab-view:not([tab-view-style=tab-bar-only]) > sidebar-toggle, navigation-split-view > sidebar-toggle) {
     position: fixed;
     inset: max(env(safe-area-inset-top), var(--sidebar-block-spacing)) auto auto 0;
@@ -3668,7 +3789,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(menu-view)::part(menu-summary) {
     transform: var(--menu--summary-scale, );
     filter: var(--menu--summary-filter, );
@@ -3788,7 +3909,7 @@
     --disclosure-style: marker-trailing;
   }
 }
-@layer sw-colors {
+@layer sw.sw-colors {
   :where(menu-view:not(:disabled):not([readonly])):focus-visible {
     outline: none;
   }
@@ -3867,7 +3988,7 @@
     }
   }
 }
-@layer sw-actions {
+@layer sw.sw-actions {
   :where(menu-view:not(:disabled):not([readonly])):active::part(menu-summary) {
     --menusummaryface: var(--menusummaryactiveface,);
     --menusummarytext: var(--menusummaryactivetext,);
@@ -3883,7 +4004,7 @@
     --menuitemtext: var(--menuitemactivetext,);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=sidebar-view]) {
     inset-inline: 0px;
     inset-block: 0px;
@@ -3934,12 +4055,12 @@
     }
   }
 }
-@layer sw-final {
+@layer sw.sw-final {
   :where([is=sidebar-view][open]) {
     margin-inline-start: max(env(safe-area-inset-left), var(--sidebar-inline-spacing));
   }
 }
-@layer sw-list-components {
+@layer sw.sw-list-components {
   :where(list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)) {
     --list--section-gap: var(--list-row-gap);
     --list--host-background-color: var(--list-background-color, );
@@ -4177,7 +4298,7 @@
         --list--accessories-display: none;
         --list--rootsummary-marker-display: marker-trailing;
       }
-      :where(navigation-split-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style], navigation-split-view > body-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style]) {
+      :where(navigation-split-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style], navigation-split-view > content-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style]) {
         --list--item-color: var(--insetlist-item-color, );
         --list--item-background-color: var(--insetlist-item-background-color, );
         --list--highlighteditem-color: var(--insetlist-highlighteditem-color, );
@@ -4204,7 +4325,7 @@
       :where(navigation-split-view:has(> [is=sidebar-view]) > [is=sidebar-view] list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[list-style]) {
         --list-style: sidebar;
       }
-      :where(navigation-split-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style], navigation-split-view > body-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style]) {
+      :where(navigation-split-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style], navigation-split-view > content-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)[preferred-expanded-style]) {
         --list-style: inset;
       }
     }
@@ -4241,7 +4362,7 @@
         --itemactiveface: var(--accentColor);
       }
     }
-    :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > body-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)) {
+    :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > content-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)) {
       --list--accessories-size: 0rem;
       --list--accessories-display: none;
       --insetlist-highlighteditem-background-color: var(--accentColor);
@@ -4250,14 +4371,14 @@
       --insetgroupedlist-highlighteditem-color: var(--tintcontrast);
     }
     @container style(--list-style: inset) or style(--list-style: inset-grouped) {
-      :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > body-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view) button[list-item-tint]) {
+      :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > content-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view) button[list-item-tint]) {
         --itemhighlightface: var(--accentColor);
         --itemactiveface: var(--accentColor);
       }
     }
   }
   @media (min-width: 64rem) {
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)) {
       --list--accessories-size: 0rem;
       --list--accessories-display: none;
       --insetlist-highlighteditem-background-color: var(--accentColor);
@@ -4266,7 +4387,7 @@
       --insetgroupedlist-highlighteditem-color: var(--tintcontrast);
     }
     @container style(--list-style: inset) or style(--list-style: inset-grouped) {
-      :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view) button[list-item-tint]) {
+      :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view) button[list-item-tint]) {
         --itemhighlightface: var(--accentColor);
         --itemactiveface: var(--accentColor);
       }
@@ -4313,7 +4434,7 @@
     display: none;
   }
 }
-@layer sw-list-components {
+@layer sw.sw-list-components {
   :where([is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])) {
     --list--section-gap: var(--form-gap);
     --list--host-background-color: var(--form-background-color, );
@@ -4550,7 +4671,7 @@
         --list--accessories-display: none;
         --list--rootsummary-marker-display: marker-trailing;
       }
-      :where(navigation-split-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style], navigation-split-view > body-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style]) {
+      :where(navigation-split-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style], navigation-split-view > content-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style]) {
         --list--host-background-color: var(--insetform-background-color, );
         --list--host-padding-inline: var(--insetform-padding-inline);
         --list--host-padding-block: var(--insetform-padding-block);
@@ -4577,7 +4698,7 @@
       :where(navigation-split-view:has(> [is=sidebar-view]) > [is=sidebar-view] [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[list-style]) {
         --form-style: sidebar;
       }
-      :where(navigation-split-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style], navigation-split-view > body-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style]) {
+      :where(navigation-split-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style], navigation-split-view > content-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])[preferred-expanded-style]) {
         --form-style: inset;
       }
     }
@@ -4614,7 +4735,7 @@
         --itemactiveface: var(--accentColor);
       }
     }
-    :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > body-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])) {
+    :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > content-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])) {
       --list--accessories-size: 0rem;
       --list--accessories-display: none;
       --insetform-highlighteditem-background-color: var(--accentColor);
@@ -4623,14 +4744,14 @@
       --insetgroupedform-highlighteditem-color: var(--tintcontrast);
     }
     @container style(--list-style: inset) or style(--list-style: inset-grouped) {
-      :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > body-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) button[list-item-tint]) {
+      :where(navigation-split-view:has(> [is=sidebar-view])[preferred-compact-column=content]:not([column-visibility=double-column]) > content-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) button[list-item-tint]) {
         --itemhighlightface: var(--accentColor);
         --itemactiveface: var(--accentColor);
       }
     }
   }
   @media (min-width: 64rem) {
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view])) {
       --list--accessories-size: 0rem;
       --list--accessories-display: none;
       --insetform-highlighteditem-background-color: var(--accentColor);
@@ -4639,7 +4760,7 @@
       --insetgroupedform-highlighteditem-color: var(--tintcontrast);
     }
     @container style(--list-style: inset) or style(--list-style: inset-grouped) {
-      :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) button[list-item-tint]) {
+      :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view [is=form-view]:not([is=form-view] [is=form-view], list-view [is=form-view], table-view [is=form-view], [is=tab-bar] > [is=form-view]) button[list-item-tint]) {
         --itemhighlightface: var(--accentColor);
         --itemactiveface: var(--accentColor);
       }
@@ -4650,7 +4771,7 @@
     --list--accessories-display: none;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(section-view) {
     grid-template-columns: minmax(0, 1fr);
     grid-template-rows: auto minmax(max-content, 1fr) auto;
@@ -4725,7 +4846,7 @@
   inherits: false;
   initial-value: 0;
 }
-@layer sw-list-components {
+@layer sw.sw-list-components {
   :where(table-view:not(table-view table-view, list-view table-view, [is=form-view] table-view)) {
     container: table/inline-size;
   }
@@ -4889,7 +5010,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=table-row]) {
     row-gap: var(--table-row-gap);
     column-gap: var(--table-col-gap);
@@ -5047,7 +5168,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where([is=table-column]) {
     column-gap: var(--table-accessory-gap);
     grid-auto-flow: column;
@@ -5082,7 +5203,7 @@
     --tablecol--after-rotate: rotate(180deg);
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(text-field) {
     grid-template-columns: minmax(0, 1fr);
     grid-template-rows: minmax(0, 1fr);
@@ -5108,7 +5229,7 @@
     background-color: transparent;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(date-picker) {
     grid-template-columns: minmax(0, 1fr);
     grid-template-rows: minmax(0, 1fr);
@@ -5126,25 +5247,28 @@
     text-align: end;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(picker-view) {
     grid-template-columns: minmax(0, 1fr);
     grid-template-rows: minmax(0, 1fr);
-    padding-inline: var(--picker--stack-grid-padding-inline, );
-    padding-block: var(--picker--stack-grid-padding-block, );
-    background: var(--picker--stack-grid-background, );
-    border-radius: var(--picker--stack-grid-border-radius, );
-    border: var(--picker--stack-grid-border, );
-    color: var(--picker--stack-grid-color, );
+    padding-inline: var(--picker--host-grid-padding-inline, );
+    padding-block: var(--picker--host-grid-padding-block, );
+    background: var(--picker--host-grid-background, );
+    border-radius: var(--picker--host-grid-border-radius, );
+    border: var(--picker--host-grid-border, );
+    color: var(--picker--host-grid-color, );
   }
   :where(picker-view)::part(picker-stack) {
-    grid-template-columns: var(--picker--stack-grid-template-columns, );
-    grid-template-rows: var(--picker--stack-grid-template-rows, );
-    row-gap: var(--picker--stack-row-gap, );
-    column-gap: var(--picker--stack-column-gap, );
+    grid-template-columns: var(--picker--host-grid-template-columns, );
+    grid-template-rows: var(--picker--host-grid-template-rows, );
+    row-gap: var(--picker--host-row-gap, );
+    column-gap: var(--picker--host-column-gap, );
   }
   :where(picker-view)::part(picker-input-stack) {
-    text-align: var(--picker--input-stack-text-align, );
+    display: var(--picker--inputstack-display, grid);
+    text-align: var(--picker--inputstack-text-align, );
+    gap: var(--picker--inputstack-gap, );
+    flex-flow: var(--picker--inputstack-flex-flow, );
   }
   :where(picker-view)::part(picker-label-stack) {
     display: var(--picker--labelstack-display, none);
@@ -5155,8 +5279,8 @@
     color: var(--secondary);
   }
   :where(picker-view) {
-    --picker--stack-grid-template-columns: minmax(30%, 1fr) auto;
-    --picker--stack-grid-template-rows: minmax(0, 1fr);
+    --picker--host-grid-template-columns: minmax(30%, 1fr) auto;
+    --picker--host-grid-template-rows: minmax(0, 1fr);
   }
   @container not style(--picker-style) {
     :where(picker-view > list-view > section-view > :not(button):first-child) {
@@ -5166,121 +5290,133 @@
   }
   @supports (x: if(else:red)) {
     :where(form picker-view) {
-      --picker--labelstack-display: if(style(--picker-style: sheet): grid ; style(--picker-style: navigation-link): grid ; style(--picker-style: menu): grid ; else: none ;);
-      --picker--stack-display: if(style(--picker-style: sheet): flex ; style(--picker-style: navigation-link): flex ; style(--picker-style: menu): flex ;);
-      --picker--stack-justify-content: if(style(--picker-style: sheet): space-between ; style(--picker-style: navigation-link): space-between ; style(--picker-style: menu): space-between ;);
-      --picker--stack-row-gap: if(
-        style(--picker-style: sheet): var(--labeled-content-row-gap) ; style(--picker-style: navigation-link): var(--labeled-content-row-gap) ;
-          style(--picker-style: menu): var(--labeled-content-row-gap) ;
-      );
-      --picker--stack-column-gap: if(
-        style(--picker-style: sheet): var(--labeled-content-column-gap) ; style(--picker-style: navigation-link): var(--labeled-content-column-gap) ;
-          style(--picker-style: menu): var(--labeled-content-column-gap) ;
-      );
-      --picker--stack-grid-padding-inline: if(
-        style(--picker-style: sheet): var(--itempadistart,) var(--itempadiend,) ; style(--picker-style: navigation-link): var(--itempadistart,) var(--itempadiend,) ;
-          style(--picker-style: menu): var(--itempadistart,) var(--itempadiend,) ;
-      );
-      --picker--stack-grid-padding-block: if(
-        style(--picker-style: sheet): var(--itempadbstart,) var(--itempadbend,) ; style(--picker-style: navigation-link): var(--itempadbstart,) var(--itempadbend,) ;
-          style(--picker-style: menu): var(--itempadbstart,) var(--itempadbend,) ;
-      );
-      --picker--stack-grid-border-radius: if(
-        style(--picker-style: sheet): var(--itemradiustl,) var(--itemradiustr,) var(--itemradiusbr,) var(--itemradiusbl,) ; style(--picker-style: navigation-link): var(--itemradiustl,)
-          var(--itemradiustr,) var(--itemradiusbr,) var(--itemradiusbl,) ; style(--picker-style: menu): var(--itemradiustl,) var(--itemradiustr,) var(--itemradiusbr,) var(--itemradiusbl,) ;
-      );
-      --picker--stack-grid-background: if(
-        style(--picker-style: sheet): var(--itemface,) ; style(--picker-style: navigation-link): var(--itemface,) ; style(--picker-style: menu): var(--itemface,) ;
-      );
-      --picker--stack-grid-color: if(style(--picker-style: sheet): var(--itemtext,) ; style(--picker-style: navigation-link): var(--itemtext,) ; style(--picker-style: menu): var(--itemtext,) ;);
-      --picker--stack-grid-border: if(
-        style(--picker-style: sheet): var(--itemborder,) ; style(--picker-style: navigation-link): var(--itemborder,) ; style(--picker-style: menu): var(--itemborder,) ;
-      );
-      --picker--input-stack-text-align: if(style(--picker-style: sheet): end ; style(--picker-style: navigation-link): end ; style(--picker-style: menu): end ;);
+      --picker--labelstack-display: if(style(--picker-style: radio-group): grid; style(--picker-style: menu): grid; style(--picker-style: navigation-link): grid; style(--picker-style: sheet): grid; else: none ;);
+      --picker--inputstack-text-align: if(style(--picker-style: radio-group): start; style(--picker-style: menu): start; style(--picker-style: navigation-link): end; style(--picker-style: sheet): end; );
+      --picker--inputstack-gap: if(style(--picker-style: radio-group): 1rem; );
+      --picker--host-row-gap: if(style(--picker-style: radio-group): var(--labeled-content-row-gap); style(--picker-style: menu): var(--labeled-content-row-gap); style(--picker-style: navigation-link): var(--labeled-content-row-gap); style(--picker-style: sheet): var(--labeled-content-row-gap); );
+      --picker--host-column-gap: if(style(--picker-style: radio-group): var(--labeled-content-column-gap); style(--picker-style: menu): var(--labeled-content-column-gap); style(--picker-style: navigation-link): var(--labeled-content-column-gap); style(--picker-style: sheet): var(--labeled-content-column-gap); );
+      --picker--host-grid-padding-inline: if(style(--picker-style: radio-group): var(--itempadistart, ) var(--itempadiend, ); style(--picker-style: menu): var(--itempadistart, ) var(--itempadiend, ); style(--picker-style: navigation-link): var(--itempadistart, ) var(--itempadiend, ); style(--picker-style: sheet): var(--itempadistart, ) var(--itempadiend, ); );
+      --picker--host-grid-padding-block: if(style(--picker-style: radio-group): var(--itempadbstart, ) var(--itempadbend, ); style(--picker-style: menu): var(--itempadbstart, ) var(--itempadbend, ); style(--picker-style: navigation-link): var(--itempadbstart, ) var(--itempadbend, ); style(--picker-style: sheet): var(--itempadbstart, ) var(--itempadbend, ); );
+      --picker--host-grid-border-radius: if(style(--picker-style: radio-group): var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, ); style(--picker-style: menu): var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, ); style(--picker-style: navigation-link): var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, ); style(--picker-style: sheet): var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, ); );
+      --picker--host-grid-background: if(style(--picker-style: radio-group): var(--itemface, ); style(--picker-style: menu): var(--itemface, ); style(--picker-style: navigation-link): var(--itemface, ); style(--picker-style: sheet): var(--itemface, ); );
+      --picker--host-grid-color: if(style(--picker-style: radio-group): var(--itemtext, ); style(--picker-style: menu): var(--itemtext, ); style(--picker-style: navigation-link): var(--itemtext, ); style(--picker-style: sheet): var(--itemtext, ); );
+      --picker--host-grid-border: if(style(--picker-style: radio-group): var(--itemborder, ); style(--picker-style: menu): var(--itemborder, ); style(--picker-style: navigation-link): var(--itemborder, ); style(--picker-style: sheet): var(--itemborder, ); );
     }
   }
   @supports not (x: if(else:red)) {
     @container style(--picker-style: menu) {
       :where(picker-view:not([picker-style])) {
         --picker--labelstack-display: grid;
-        --picker--input-stack-text-align: end;
-        --picker--stack-row-gap: var(--labeled-content-row-gap);
-        --picker--stack-column-gap: var(--labeled-content-column-gap);
-        --picker--stack-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
-        --picker--stack-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
-        --picker--stack-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
-        --picker--stack-grid-background: var(--itemface, );
-        --picker--stack-grid-color: var(--itemtext, );
-        --picker--stack-grid-border: var(--itemborder, );
+        --picker--inputstack-text-align: start;
+        --picker--host-row-gap: var(--labeled-content-row-gap);
+        --picker--host-column-gap: var(--labeled-content-column-gap);
+        --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+        --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+        --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+        --picker--host-grid-background: var(--itemface, );
+        --picker--host-grid-color: var(--itemtext, );
+        --picker--host-grid-border: var(--itemborder, );
       }
     }
     @container style(--picker-style: navigation-link) {
       :where(picker-view:not([picker-style])) {
         --picker--labelstack-display: grid;
-        --picker--input-stack-text-align: end;
-        --picker--stack-row-gap: var(--labeled-content-row-gap);
-        --picker--stack-column-gap: var(--labeled-content-column-gap);
-        --picker--stack-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
-        --picker--stack-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
-        --picker--stack-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
-        --picker--stack-grid-background: var(--itemface, );
-        --picker--stack-grid-color: var(--itemtext, );
-        --picker--stack-grid-border: var(--itemborder, );
+        --picker--inputstack-text-align: end;
+        --picker--host-row-gap: var(--labeled-content-row-gap);
+        --picker--host-column-gap: var(--labeled-content-column-gap);
+        --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+        --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+        --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+        --picker--host-grid-background: var(--itemface, );
+        --picker--host-grid-color: var(--itemtext, );
+        --picker--host-grid-border: var(--itemborder, );
       }
     }
     @container style(--picker-style: sheet) {
       :where(picker-view:not([picker-style])) {
         --picker--labelstack-display: grid;
-        --picker--input-stack-text-align: end;
-        --picker--stack-row-gap: var(--labeled-content-row-gap);
-        --picker--stack-column-gap: var(--labeled-content-column-gap);
-        --picker--stack-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
-        --picker--stack-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
-        --picker--stack-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
-        --picker--stack-grid-background: var(--itemface, );
-        --picker--stack-grid-color: var(--itemtext, );
-        --picker--stack-grid-border: var(--itemborder, );
+        --picker--inputstack-text-align: end;
+        --picker--host-row-gap: var(--labeled-content-row-gap);
+        --picker--host-column-gap: var(--labeled-content-column-gap);
+        --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+        --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+        --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+        --picker--host-grid-background: var(--itemface, );
+        --picker--host-grid-color: var(--itemtext, );
+        --picker--host-grid-border: var(--itemborder, );
+      }
+    }
+    @container style(--picker-style: radio-group) {
+      :where(picker-view:not([picker-style])) {
+        --picker--labelstack-display: grid;
+        --picker--inputstack-text-align: start;
+        --picker--inputstack-gap: 1rem;
+        --picker--host-row-gap: var(--labeled-content-row-gap);
+        --picker--host-column-gap: var(--labeled-content-column-gap);
+        --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+        --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+        --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+        --picker--host-grid-background: var(--itemface, );
+        --picker--host-grid-color: var(--itemtext, );
+        --picker--host-grid-border: var(--itemborder, );
       }
     }
     :where(form picker-view[picker-style=menu]) {
       --picker--labelstack-display: grid;
-      --picker--input-stack-text-align: end;
-      --picker--stack-row-gap: var(--labeled-content-row-gap);
-      --picker--stack-column-gap: var(--labeled-content-column-gap);
-      --picker--stack-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
-      --picker--stack-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
-      --picker--stack-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
-      --picker--stack-grid-background: var(--itemface, );
-      --picker--stack-grid-color: var(--itemtext, );
-      --picker--stack-grid-border: var(--itemborder, );
+      --picker--inputstack-text-align: start;
+      --picker--host-row-gap: var(--labeled-content-row-gap);
+      --picker--host-column-gap: var(--labeled-content-column-gap);
+      --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+      --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+      --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+      --picker--host-grid-background: var(--itemface, );
+      --picker--host-grid-color: var(--itemtext, );
+      --picker--host-grid-border: var(--itemborder, );
     }
     :where(form picker-view[picker-style=navigation-link]) {
       --picker--labelstack-display: grid;
-      --picker--input-stack-text-align: end;
-      --picker--stack-row-gap: var(--labeled-content-row-gap);
-      --picker--stack-column-gap: var(--labeled-content-column-gap);
-      --picker--stack-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
-      --picker--stack-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
-      --picker--stack-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
-      --picker--stack-grid-background: var(--itemface, );
-      --picker--stack-grid-color: var(--itemtext, );
-      --picker--stack-grid-border: var(--itemborder, );
+      --picker--inputstack-text-align: end;
+      --picker--host-row-gap: var(--labeled-content-row-gap);
+      --picker--host-column-gap: var(--labeled-content-column-gap);
+      --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+      --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+      --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+      --picker--host-grid-background: var(--itemface, );
+      --picker--host-grid-color: var(--itemtext, );
+      --picker--host-grid-border: var(--itemborder, );
     }
     :where(form picker-view[picker-style=sheet]) {
       --picker--labelstack-display: grid;
-      --picker--input-stack-text-align: end;
-      --picker--stack-row-gap: var(--labeled-content-row-gap);
-      --picker--stack-column-gap: var(--labeled-content-column-gap);
-      --picker--stack-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
-      --picker--stack-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
-      --picker--stack-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
-      --picker--stack-grid-background: var(--itemface, );
-      --picker--stack-grid-color: var(--itemtext, );
-      --picker--stack-grid-border: var(--itemborder, );
+      --picker--inputstack-text-align: end;
+      --picker--host-row-gap: var(--labeled-content-row-gap);
+      --picker--host-column-gap: var(--labeled-content-column-gap);
+      --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+      --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+      --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+      --picker--host-grid-background: var(--itemface, );
+      --picker--host-grid-color: var(--itemtext, );
+      --picker--host-grid-border: var(--itemborder, );
+    }
+    :where(form picker-view[picker-style=radio-group]) {
+      --picker--labelstack-display: grid;
+      --picker--inputstack-text-align: start;
+      --picker--inputstack-gap: 1rem;
+      --picker--host-row-gap: var(--labeled-content-row-gap);
+      --picker--host-column-gap: var(--labeled-content-column-gap);
+      --picker--host-grid-padding-inline: var(--itempadistart, ) var(--itempadiend, );
+      --picker--host-grid-padding-block: var(--itempadbstart, ) var(--itempadbend, );
+      --picker--host-grid-border-radius: var(--itemradiustl, ) var(--itemradiustr, ) var(--itemradiusbr, ) var(--itemradiusbl, );
+      --picker--host-grid-background: var(--itemface, );
+      --picker--host-grid-color: var(--itemtext, );
+      --picker--host-grid-border: var(--itemborder, );
     }
   }
+  :where(picker-view[horizontal-radio-group-layout]) {
+    --picker--inputstack-display: flex;
+    --picker--inputstack-flex-flow: row wrap;
+  }
 }
-@layer sw-final {
+@layer sw.sw-final {
   @supports not (x: attr(x type(*))) {
     @container style(--picker-label-value-placement: vertical) {
       :where(picker-view:not([label-value-placement])) {
@@ -5306,13 +5442,13 @@
     }
   }
 }
-@layer sw-nav-components {
+@layer sw.sw-nav-components {
   :where(navigation-stack) {
     touch-action: none;
     block-size: var(--100lvh, 100lvh);
   }
 }
-@layer sw-nav-components {
+@layer sw.sw-nav-components {
   :where(navigation-split-view) {
     touch-action: none;
     block-size: var(--100lvh, 100lvh);
@@ -5331,23 +5467,23 @@
     :where(scroll-view:has(~ navigation-split-view:not([hidden]))) {
       z-index: -1;
     }
-    :where(navigation-split-view > body-view ~ scroll-view, navigation-split-view > body-view ~ [is=sidebar-view]) {
+    :where(navigation-split-view > content-view ~ scroll-view, navigation-split-view > content-view ~ [is=sidebar-view]) {
       z-index: -1;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]) > body-view ~ [is=sidebar-view]) {
+    :where(navigation-split-view:has(> [is=sidebar-view]) > content-view ~ [is=sidebar-view]) {
       z-index: -2;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]) > body-view > body-view ~ scroll-view) {
+    :where(navigation-split-view:has(> [is=sidebar-view]) > content-view > content-view ~ scroll-view) {
       z-index: -1;
     }
   }
   @media (max-width: 63.9999rem) {
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([preferred-compact-column=content]) > body-view > body-view ~ scroll-view) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([preferred-compact-column=content]) > content-view > content-view ~ scroll-view) {
       z-index: -1;
     }
   }
   @media (min-width: 43rem) {
-    :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > body-view > body-view ~ scroll-view) {
+    :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > content-view > content-view ~ scroll-view) {
       z-index: -1;
     }
   }
@@ -5371,7 +5507,7 @@
     :where(navigation-split-view > scroll-view) {
       border-right: solid 1px var(--separator);
     }
-    :where(navigation-split-view > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(navigation-split-view > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       margin-inline-start: var(--nav-split-view--content-inline-size);
     }
     :where(navigation-split-view:has(> [is=sidebar-view]) > [is=sidebar-view]) {
@@ -5392,7 +5528,7 @@
       backdrop-filter: var(--liquid-glass-backdrop-filter);
       --scroll-view-box-shadow: var(--liquid-glass-box-shadow);
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(navigation-split-view:has(> [is=sidebar-view]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       margin-inline-start: 0px;
       --safe-area-inset-left: calc(var(--nav-split-view-sidebar-inline-size) + max(env(safe-area-inset-left), var(--sidebar-inline-spacing)));
       --safe-area-inset-top: max(env(safe-area-inset-top), var(--sidebar-block-spacing));
@@ -5405,78 +5541,78 @@
     navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > [is=sidebar-view]) {
       margin-inline-start: calc(var(--nav-split-view-sidebar-inline-size) * -1);
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       margin-inline-start: var(--nav-split-view--content-inline-size);
       --safe-area-inset-left: 0px;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view) {
       border-right: solid 1px var(--separator);
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view ~ tool-bar > tool-bar-item,
-    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view ~ tool-bar > tool-bar-item-group) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view ~ tool-bar > tool-bar-item,
+    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view ~ tool-bar > tool-bar-item-group) {
       --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-onscreen-scale));
       --toolbar-cell-filter: none;
       --toolbar-cell-opacity: 1;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       inline-size: var(--nav-split-view--content-inline-size);
       margin-inline-start: 0px;
       --safe-area-inset-left: env(safe-area-inset-left);
       --safe-area-inset-right: 0px;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
       --navbar-safe-area-inset-left: calc(var(--sidebar-toggle-padding-inline-start, 0px) - env(safe-area-inset-left));
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
       --safe-area-inset-left: max(env(safe-area-inset-left), var(--sidebar-inline-spacing));
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
       --safe-area-inset-left: var(--sidebar-toggle-padding-inline-start, 0px);
     }
   }
   @media (min-width: 43rem) and (min-width: 64rem) {
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view ~ tool-bar > tool-bar-item,
-    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view ~ tool-bar > tool-bar-item-group) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view ~ tool-bar > tool-bar-item,
+    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view ~ tool-bar > tool-bar-item-group) {
       --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-onscreen-scale));
       --toolbar-cell-filter: none;
       --toolbar-cell-opacity: 1;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view ~ tool-bar) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view ~ tool-bar) {
       inline-size: calc(var(--nav-split-view--content-inline-size) + var(--nav-split-view-sidebar-inline-size));
       --safe-area-inset-right: 0px;
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view) {
       border-right: solid 1px var(--separator);
     }
-    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       --safe-area-inset-left: 0px;
       margin-inline-start: calc(var(--nav-split-view-sidebar-inline-size) + var(--nav-split-view--content-inline-size));
     }
   }
 }
-@layer sw-final {
+@layer sw.sw-final {
   @media (min-width: 43rem) {
     navigation-split-view > scroll-view,
     navigation-split-view > [is=sidebar-view] > scroll-view {
       --scroll-view-translate: translateX(var(--view-transition-principal-x));
     }
-    navigation-split-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).bwd, navigation-split-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).fwdd, navigation-split-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .bwn, navigation-split-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .fwnn {
+    navigation-split-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).bwd, navigation-split-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).fwdd, navigation-split-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .bwn, navigation-split-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .fwnn {
       transition-duration: 0ms;
     }
   }
   @media (min-width: 43rem) and (max-width: 63.9999rem) {
-    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view {
+    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view {
       --scroll-view-translate: translateX(var(--view-transition-principal-x));
     }
-    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).bwd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).fwdd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .bwn, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .fwnn {
+    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).bwd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).fwdd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .bwn, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .fwnn {
       transition-duration: 0ms;
     }
   }
   @media (min-width: 43rem) and (min-width: 64rem) {
-    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view {
+    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view {
       --scroll-view-translate: translateX(var(--view-transition-principal-x));
     }
-    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).bwd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).fwdd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .bwn, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .fwnn {
+    navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).bwd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view).fwdd, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .bwn, navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar .fwnn {
       transition-duration: 0ms;
     }
   }
@@ -5486,7 +5622,7 @@
   inherits: false;
   initial-value: 0;
 }
-@layer sw-tab-components {
+@layer sw.sw-tab-components {
   :where(tab-view) {
     grid-template-columns: subgrid;
     grid-template-rows: subgrid;
@@ -5533,7 +5669,7 @@
       --adaptable-tab-bar-placement: bottom-bar;
       --adaptable-tab-bar-placement-index: 0;
     }
-    :where(tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       --safe-area-inset-bottom: max(env(safe-area-inset-bottom), var(--sidebar-block-spacing));
     }
   }
@@ -5543,7 +5679,7 @@
     }
   }
   @media (pointer: coarse) {
-    :where(tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view[tab-view-style=tab-bar-only] body-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))) {
+    :where(tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view[tab-view-style=tab-bar-only] content-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))) {
       --safe-area-inset-bottom: calc(max(env(safe-area-inset-bottom), var(--sidebar-block-spacing)) + var(--iphone-tabbar-block-size));
     }
   }
@@ -5553,7 +5689,7 @@
     }
   }
   @media (orientation: landscape) {
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       --safe-area-inset-top: max(env(safe-area-inset-top), var(--sidebar-block-spacing));
       --safe-area-inset-bottom: max(env(safe-area-inset-bottom), var(--sidebar-block-spacing));
     }
@@ -5569,7 +5705,7 @@
       --adaptable-tab-bar-placement: bottom-bar;
       --adaptable-tab-bar-placement-index: 0;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       --safe-area-inset-bottom: max(env(safe-area-inset-bottom), var(--sidebar-block-spacing));
     }
   }
@@ -5579,7 +5715,7 @@
     }
   }
   @media (max-width: 42.9999rem) and (orientation: portrait) {
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))), :where(tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(:has(~ tool-bar > [slot^=bottom-bar])):not(:has(> [slot^=bottom-bar]))) {
       --safe-area-inset-bottom: calc(max(env(safe-area-inset-bottom), var(--sidebar-block-spacing)) + var(--iphone-tabbar-block-size));
     }
   }
@@ -5629,55 +5765,55 @@
     }
   }
   @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) {
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
       --navbar-safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
       --safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
       --safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):not([preferred-compact-column=content]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):not([preferred-compact-column=content]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
       --navbar-safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):not([preferred-compact-column=content]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):not([preferred-compact-column=content]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
       --safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):not([preferred-compact-column=content]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):not([preferred-compact-column=content]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
       --safe-area-inset-left: revert;
     }
   }
   @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) and (max-width: 63.9999rem) {
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
       --navbar-safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
       --safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
       --safe-area-inset-left: revert;
     }
   }
   @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) and (min-width: 64rem) {
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
       --navbar-safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
       --safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
       --safe-area-inset-left: revert;
     }
   }
   @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) {
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view)) {
       --navbar-safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(bottom-bar) {
       --safe-area-inset-left: revert;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > body-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > content-view scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar)::part(top-bar) {
       --safe-area-inset-left: revert;
     }
   }
@@ -5689,22 +5825,22 @@
     tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) {
       --nav-split-view--content-inline-size: calc(var(--nav-split-view-content-inline-size) + var(--sidebar-inline-size, 0px));
     }
-    tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > body-view {
+    tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > content-view {
       --sidebar-inline-size: 0px;
       --sidebar-inline-spacing: 0px;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       --safe-area-inset-left: calc(max(env(safe-area-inset-left), var(--sidebar-inline-spacing)) + var(--sidebar-inline-size));
     }
   }
 }
-@layer sw-final {
+@layer sw.sw-final {
   @media (pointer: fine) {
     :where(tab-view[tab-view-style=tab-bar-only]) {
       --adaptable-tab-bar-placement: top-bar;
       --adaptable-tab-bar-placement-index: 1;
     }
-    :where(tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view[tab-view-style=tab-bar-only] content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view[tab-view-style=tab-bar-only] content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       --safe-area-inset-top: calc(max(env(safe-area-inset-top), var(--sidebar-block-spacing)) + var(--ipad-tabbar-block-size));
     }
     :where(tab-view[tab-view-style=tab-bar-only] navigation-split-view > [is=sidebar-view]) {
@@ -5716,7 +5852,7 @@
       --adaptable-tab-bar-placement: top-bar;
       --adaptable-tab-bar-placement-index: 1;
     }
-    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) body-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
+    :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-stack > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar, tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view), tab-view:not([tab-view-style=tab-bar-only]) content-view > scroll-view:not(dialog scroll-view):not(scroll-view scroll-view) ~ tool-bar) {
       --safe-area-inset-top: calc(max(env(safe-area-inset-top), var(--sidebar-block-spacing)) + var(--ipad-tabbar-block-size));
     }
     :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > [is=sidebar-view]) {
@@ -5724,7 +5860,7 @@
     }
   }
 }
-@layer sw-tab-components {
+@layer sw.sw-tab-components {
   :where([is=tab-bar]) {
     inset-inline: 0px;
     inset-block: 0px;
@@ -5970,7 +6106,7 @@
     }
   }
 }
-@layer sw-tab-components {
+@layer sw.sw-tab-components {
   :where([is=sidebar-view] [is=tab-item][aria-selected=true]:not([is=disclosure-group]:not([open]) [is=tab-item]), [is=sidebar-view] [is=disclosure-group]:not([open]):has(> [is=tab-item][aria-selected=true]) > summary) {
     anchor-name: --tab-view-sidebar-selection;
   }
@@ -5978,13 +6114,19 @@
     anchor-name: --tab-view-tabbar-selection;
   }
 }
-@layer sw-utils {
-  :where([background-style=grouped]) {
-    --background: var(--groupedBackground);
-    --secondaryBackground: var(--secondaryGroupedBackground);
-    --tertiaryBackground: var(--tertiaryGroupedBackground);
+@layer sw.sw-utils {
+  :where([background-style=initial]) {
+    --background: initial;
+    --secondaryBackground: initial;
+    --tertiaryBackground: initial;
     --face: var(--background);
   }
+  :where([foreground=black]) {
+    color: var(--black);
+  }
+  :where([foreground=white]) {
+    color: var(--white);
+  }
   :where([foreground=primary]) {
     color: var(--primary);
   }
@@ -6127,7 +6269,7 @@
     --accentColor5: var(--purple5);
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   :where([frame\:width=infinity]) {
     inline-size: 100%;
   }
@@ -7426,7 +7568,7 @@
     }
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(v-stack[readable]) {
     inline-size: 100%;
     justify-self: center;
@@ -8038,7 +8180,7 @@
     max-inline-size: 100cqi;
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   h-stack[distribution=leading],
   v-flex-stack[distribution=leading] {
     justify-items: start  ;
@@ -8198,207 +8340,309 @@
     justify-content: stretch  ;
   }
   :where(v-stack[spacing="0"],
-  h-stack[spacing="0"]) {
+  h-stack[spacing="0"],
+  h-flex-stack[spacing="0"],
+  v-flex-stack[spacing="0"]) {
     gap: 0rem;
   }
   :where(v-stack[spacing="1"],
-  h-stack[spacing="1"]) {
+  h-stack[spacing="1"],
+  h-flex-stack[spacing="1"],
+  v-flex-stack[spacing="1"]) {
     gap: 0.1rem;
   }
   :where(v-stack[spacing="2"],
-  h-stack[spacing="2"]) {
+  h-stack[spacing="2"],
+  h-flex-stack[spacing="2"],
+  v-flex-stack[spacing="2"]) {
     gap: 0.2rem;
   }
   :where(v-stack[spacing="3"],
-  h-stack[spacing="3"]) {
+  h-stack[spacing="3"],
+  h-flex-stack[spacing="3"],
+  v-flex-stack[spacing="3"]) {
     gap: 0.3rem;
   }
   :where(v-stack[spacing="4"],
-  h-stack[spacing="4"]) {
+  h-stack[spacing="4"],
+  h-flex-stack[spacing="4"],
+  v-flex-stack[spacing="4"]) {
     gap: 0.4rem;
   }
   :where(v-stack[spacing="5"],
-  h-stack[spacing="5"]) {
+  h-stack[spacing="5"],
+  h-flex-stack[spacing="5"],
+  v-flex-stack[spacing="5"]) {
     gap: 0.5rem;
   }
   :where(v-stack[spacing="6"],
-  h-stack[spacing="6"]) {
+  h-stack[spacing="6"],
+  h-flex-stack[spacing="6"],
+  v-flex-stack[spacing="6"]) {
     gap: 0.6rem;
   }
   :where(v-stack[spacing="7"],
-  h-stack[spacing="7"]) {
+  h-stack[spacing="7"],
+  h-flex-stack[spacing="7"],
+  v-flex-stack[spacing="7"]) {
     gap: 0.7rem;
   }
   :where(v-stack[spacing="8"],
-  h-stack[spacing="8"]) {
+  h-stack[spacing="8"],
+  h-flex-stack[spacing="8"],
+  v-flex-stack[spacing="8"]) {
     gap: 0.8rem;
   }
   :where(v-stack[spacing="9"],
-  h-stack[spacing="9"]) {
+  h-stack[spacing="9"],
+  h-flex-stack[spacing="9"],
+  v-flex-stack[spacing="9"]) {
     gap: 0.9rem;
   }
   :where(v-stack[spacing="10"],
-  h-stack[spacing="10"]) {
+  h-stack[spacing="10"],
+  h-flex-stack[spacing="10"],
+  v-flex-stack[spacing="10"]) {
     gap: 1rem;
   }
   :where(v-stack[spacing="11"],
-  h-stack[spacing="11"]) {
+  h-stack[spacing="11"],
+  h-flex-stack[spacing="11"],
+  v-flex-stack[spacing="11"]) {
     gap: 1.1rem;
   }
   :where(v-stack[spacing="12"],
-  h-stack[spacing="12"]) {
+  h-stack[spacing="12"],
+  h-flex-stack[spacing="12"],
+  v-flex-stack[spacing="12"]) {
     gap: 1.2rem;
   }
   :where(v-stack[spacing="13"],
-  h-stack[spacing="13"]) {
+  h-stack[spacing="13"],
+  h-flex-stack[spacing="13"],
+  v-flex-stack[spacing="13"]) {
     gap: 1.3rem;
   }
   :where(v-stack[spacing="14"],
-  h-stack[spacing="14"]) {
+  h-stack[spacing="14"],
+  h-flex-stack[spacing="14"],
+  v-flex-stack[spacing="14"]) {
     gap: 1.4rem;
   }
   :where(v-stack[spacing="15"],
-  h-stack[spacing="15"]) {
+  h-stack[spacing="15"],
+  h-flex-stack[spacing="15"],
+  v-flex-stack[spacing="15"]) {
     gap: 1.5rem;
   }
   :where(v-stack[spacing="16"],
-  h-stack[spacing="16"]) {
+  h-stack[spacing="16"],
+  h-flex-stack[spacing="16"],
+  v-flex-stack[spacing="16"]) {
     gap: 1.6rem;
   }
   :where(v-stack[spacing="17"],
-  h-stack[spacing="17"]) {
+  h-stack[spacing="17"],
+  h-flex-stack[spacing="17"],
+  v-flex-stack[spacing="17"]) {
     gap: 1.7rem;
   }
   :where(v-stack[spacing="18"],
-  h-stack[spacing="18"]) {
+  h-stack[spacing="18"],
+  h-flex-stack[spacing="18"],
+  v-flex-stack[spacing="18"]) {
     gap: 1.8rem;
   }
   :where(v-stack[spacing="19"],
-  h-stack[spacing="19"]) {
+  h-stack[spacing="19"],
+  h-flex-stack[spacing="19"],
+  v-flex-stack[spacing="19"]) {
     gap: 1.9rem;
   }
   :where(v-stack[spacing="20"],
-  h-stack[spacing="20"]) {
+  h-stack[spacing="20"],
+  h-flex-stack[spacing="20"],
+  v-flex-stack[spacing="20"]) {
     gap: 2rem;
   }
   :where(v-stack[spacing="21"],
-  h-stack[spacing="21"]) {
+  h-stack[spacing="21"],
+  h-flex-stack[spacing="21"],
+  v-flex-stack[spacing="21"]) {
     gap: 2.1rem;
   }
   :where(v-stack[spacing="22"],
-  h-stack[spacing="22"]) {
+  h-stack[spacing="22"],
+  h-flex-stack[spacing="22"],
+  v-flex-stack[spacing="22"]) {
     gap: 2.2rem;
   }
   :where(v-stack[spacing="23"],
-  h-stack[spacing="23"]) {
+  h-stack[spacing="23"],
+  h-flex-stack[spacing="23"],
+  v-flex-stack[spacing="23"]) {
     gap: 2.3rem;
   }
   :where(v-stack[spacing="24"],
-  h-stack[spacing="24"]) {
+  h-stack[spacing="24"],
+  h-flex-stack[spacing="24"],
+  v-flex-stack[spacing="24"]) {
     gap: 2.4rem;
   }
   :where(v-stack[spacing="25"],
-  h-stack[spacing="25"]) {
+  h-stack[spacing="25"],
+  h-flex-stack[spacing="25"],
+  v-flex-stack[spacing="25"]) {
     gap: 2.5rem;
   }
   :where(v-stack[spacing="26"],
-  h-stack[spacing="26"]) {
+  h-stack[spacing="26"],
+  h-flex-stack[spacing="26"],
+  v-flex-stack[spacing="26"]) {
     gap: 2.6rem;
   }
   :where(v-stack[spacing="27"],
-  h-stack[spacing="27"]) {
+  h-stack[spacing="27"],
+  h-flex-stack[spacing="27"],
+  v-flex-stack[spacing="27"]) {
     gap: 2.7rem;
   }
   :where(v-stack[spacing="28"],
-  h-stack[spacing="28"]) {
+  h-stack[spacing="28"],
+  h-flex-stack[spacing="28"],
+  v-flex-stack[spacing="28"]) {
     gap: 2.8rem;
   }
   :where(v-stack[spacing="29"],
-  h-stack[spacing="29"]) {
+  h-stack[spacing="29"],
+  h-flex-stack[spacing="29"],
+  v-flex-stack[spacing="29"]) {
     gap: 2.9rem;
   }
   :where(v-stack[spacing="30"],
-  h-stack[spacing="30"]) {
+  h-stack[spacing="30"],
+  h-flex-stack[spacing="30"],
+  v-flex-stack[spacing="30"]) {
     gap: 3rem;
   }
   :where(v-stack[spacing="31"],
-  h-stack[spacing="31"]) {
+  h-stack[spacing="31"],
+  h-flex-stack[spacing="31"],
+  v-flex-stack[spacing="31"]) {
     gap: 3.1rem;
   }
   :where(v-stack[spacing="32"],
-  h-stack[spacing="32"]) {
+  h-stack[spacing="32"],
+  h-flex-stack[spacing="32"],
+  v-flex-stack[spacing="32"]) {
     gap: 3.2rem;
   }
   :where(v-stack[spacing="33"],
-  h-stack[spacing="33"]) {
+  h-stack[spacing="33"],
+  h-flex-stack[spacing="33"],
+  v-flex-stack[spacing="33"]) {
     gap: 3.3rem;
   }
   :where(v-stack[spacing="34"],
-  h-stack[spacing="34"]) {
+  h-stack[spacing="34"],
+  h-flex-stack[spacing="34"],
+  v-flex-stack[spacing="34"]) {
     gap: 3.4rem;
   }
   :where(v-stack[spacing="35"],
-  h-stack[spacing="35"]) {
+  h-stack[spacing="35"],
+  h-flex-stack[spacing="35"],
+  v-flex-stack[spacing="35"]) {
     gap: 3.5rem;
   }
   :where(v-stack[spacing="36"],
-  h-stack[spacing="36"]) {
+  h-stack[spacing="36"],
+  h-flex-stack[spacing="36"],
+  v-flex-stack[spacing="36"]) {
     gap: 3.6rem;
   }
   :where(v-stack[spacing="37"],
-  h-stack[spacing="37"]) {
+  h-stack[spacing="37"],
+  h-flex-stack[spacing="37"],
+  v-flex-stack[spacing="37"]) {
     gap: 3.7rem;
   }
   :where(v-stack[spacing="38"],
-  h-stack[spacing="38"]) {
+  h-stack[spacing="38"],
+  h-flex-stack[spacing="38"],
+  v-flex-stack[spacing="38"]) {
     gap: 3.8rem;
   }
   :where(v-stack[spacing="39"],
-  h-stack[spacing="39"]) {
+  h-stack[spacing="39"],
+  h-flex-stack[spacing="39"],
+  v-flex-stack[spacing="39"]) {
     gap: 3.9rem;
   }
   :where(v-stack[spacing="40"],
-  h-stack[spacing="40"]) {
+  h-stack[spacing="40"],
+  h-flex-stack[spacing="40"],
+  v-flex-stack[spacing="40"]) {
     gap: 4rem;
   }
   :where(v-stack[spacing="41"],
-  h-stack[spacing="41"]) {
+  h-stack[spacing="41"],
+  h-flex-stack[spacing="41"],
+  v-flex-stack[spacing="41"]) {
     gap: 4.1rem;
   }
   :where(v-stack[spacing="42"],
-  h-stack[spacing="42"]) {
+  h-stack[spacing="42"],
+  h-flex-stack[spacing="42"],
+  v-flex-stack[spacing="42"]) {
     gap: 4.2rem;
   }
   :where(v-stack[spacing="43"],
-  h-stack[spacing="43"]) {
+  h-stack[spacing="43"],
+  h-flex-stack[spacing="43"],
+  v-flex-stack[spacing="43"]) {
     gap: 4.3rem;
   }
   :where(v-stack[spacing="44"],
-  h-stack[spacing="44"]) {
+  h-stack[spacing="44"],
+  h-flex-stack[spacing="44"],
+  v-flex-stack[spacing="44"]) {
     gap: 4.4rem;
   }
   :where(v-stack[spacing="45"],
-  h-stack[spacing="45"]) {
+  h-stack[spacing="45"],
+  h-flex-stack[spacing="45"],
+  v-flex-stack[spacing="45"]) {
     gap: 4.5rem;
   }
   :where(v-stack[spacing="46"],
-  h-stack[spacing="46"]) {
+  h-stack[spacing="46"],
+  h-flex-stack[spacing="46"],
+  v-flex-stack[spacing="46"]) {
     gap: 4.6rem;
   }
   :where(v-stack[spacing="47"],
-  h-stack[spacing="47"]) {
+  h-stack[spacing="47"],
+  h-flex-stack[spacing="47"],
+  v-flex-stack[spacing="47"]) {
     gap: 4.7rem;
   }
   :where(v-stack[spacing="48"],
-  h-stack[spacing="48"]) {
+  h-stack[spacing="48"],
+  h-flex-stack[spacing="48"],
+  v-flex-stack[spacing="48"]) {
     gap: 4.8rem;
   }
   :where(v-stack[spacing="49"],
-  h-stack[spacing="49"]) {
+  h-stack[spacing="49"],
+  h-flex-stack[spacing="49"],
+  v-flex-stack[spacing="49"]) {
     gap: 4.9rem;
   }
   :where(v-stack[spacing="50"],
-  h-stack[spacing="50"]) {
+  h-stack[spacing="50"],
+  h-flex-stack[spacing="50"],
+  v-flex-stack[spacing="50"]) {
     gap: 5rem;
   }
   :where(v-stack[padding],
@@ -8441,13 +8685,13 @@
     padding-inline: 1rem;
   }
 }
-@layer sw-components {
+@layer sw.sw-components {
   :where(v-stack[readable]) {
     place-items: start stretch  ;
     place-content: start stretch  ;
   }
 }
-@layer sw-utils {
+@layer sw.sw-utils {
   :where([padding-horizontal="0"]) {
     padding-inline: 0rem;
   }
@@ -9061,8 +9305,51 @@
     margin-block: 5rem;
   }
 }
-@layer sw-utils {}
-@layer sw-transitions {
+@layer sw.sw-utils {
+  :where(list-view[background=system-background],
+  [is=form-view][background=system-background]) {
+    --list--host-background-color: var(--background);
+  }
+  :where(list-view[list-row-background=system-tertiary-grouped-background],
+  [is=form-view][list-row-background=system-tertiary-grouped-background]) {
+    --list--item-background-color: var(--tertiaryGroupedBackground);
+  }
+  :where(list-view[list-row-background=system-quaternary-grouped-background],
+  [is=form-view][list-row-background=system-quaternary-grouped-background]) {
+    --list--item-background-color: var(--quaternaryGroupedBackground);
+  }
+  :where([is=sheet-view] list-view[background=system-background],
+  [is=sheet-view] [is=form-view][background=system-background],
+  [is=full-screen] list-view[background=system-background],
+  [is=full-screen] [is=form-view][background=system-background],
+  [is=confirmation-dialog] list-view[background=system-background],
+  [is=confirmation-dialog] [is=form-view][background=system-background],
+  [is=alert-dialog] list-view[background=system-background],
+  [is=alert-dialog] [is=form-view][background=system-background]) {
+    --list--host-background-color: var(--secondaryBackground);
+  }
+  :where([is=sheet-view] list-view[list-row-background=system-tertiary-grouped-background],
+  [is=sheet-view] [is=form-view][list-row-background=system-tertiary-grouped-background],
+  [is=full-screen] list-view[list-row-background=system-tertiary-grouped-background],
+  [is=full-screen] [is=form-view][list-row-background=system-tertiary-grouped-background],
+  [is=confirmation-dialog] list-view[list-row-background=system-tertiary-grouped-background],
+  [is=confirmation-dialog] [is=form-view][list-row-background=system-tertiary-grouped-background],
+  [is=alert-dialog] list-view[list-row-background=system-tertiary-grouped-background],
+  [is=alert-dialog] [is=form-view][list-row-background=system-tertiary-grouped-background]) {
+    --list--item-background-color: var(--quaternaryGroupedBackground);
+  }
+  :where([is=sheet-view] list-view[list-row-background=system-quaternary-grouped-background],
+  [is=sheet-view] [is=form-view][list-row-background=system-quaternary-grouped-background],
+  [is=full-screen] list-view[list-row-background=system-quaternary-grouped-background],
+  [is=full-screen] [is=form-view][list-row-background=system-quaternary-grouped-background],
+  [is=confirmation-dialog] list-view[list-row-background=system-quaternary-grouped-background],
+  [is=confirmation-dialog] [is=form-view][list-row-background=system-quaternary-grouped-background],
+  [is=alert-dialog] list-view[list-row-background=system-quaternary-grouped-background],
+  [is=alert-dialog] [is=form-view][list-row-background=system-quaternary-grouped-background]) {
+    --list--item-background-color: var(--quaintaryGroupedBackground);
+  }
+}
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     scroll-view.fwd, scroll-view.fwdd, scroll-view.bwd, scroll-view.bwdd {
       transition: transform var(--view-transition-duration) ease-out allow-discrete, padding-inline-start var(--sidebar-transition-duration) ease-out allow-discrete, margin-inline-start var(--sidebar-transition-duration) ease-out allow-discrete;
@@ -9093,7 +9380,7 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   scroll-view.fwd {
     pointer-events: none;
   }
@@ -9110,12 +9397,12 @@
     --scroll-view-translate: translateX(var(--view-transition-leading-x));
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   scroll-view.bwd {
     --scroll-view-translate: translateX(var(--view-transition-trailing-x));
     --scroll-view-box-shadow: var(--screen-box-shadow);
   }
-  scroll-view.bwdd ~ body-view,
+  scroll-view.bwdd ~ content-view,
   scroll-view.bwdd ~ navigation-stack,
   scroll-view.bwdd ~ navigation-split-view {
     pointer-events: none;
@@ -9126,11 +9413,11 @@
   scroll-view.bwdd.bwd {
     --scroll-view-translate: translateX(var(--view-transition-trailing-x));
   }
-  navigation-split-view > body-view:has(~ .bwdd) {
+  navigation-split-view > content-view:has(~ .bwdd) {
     pointer-events: none;
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   tool-bar-item.fwnn,
   tool-bar-item-group.fwnn {
     --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-onscreen-scale));
@@ -9152,7 +9439,7 @@
     --toolbar-cell-opacity: 0;
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   tool-bar-item.bwn,
   tool-bar-item-group.bwn {
     --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-offscreen-scale));
@@ -9172,7 +9459,7 @@
     --toolbar-cell-opacity: 0;
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   [is=sheet-view]:not([open]) {
     z-index: var(--top-layer-polyfill-z-index);
   }
@@ -9198,7 +9485,7 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where(fine-tooltip) {
       transition: opacity 150ms allow-discrete ease-out, transform 150ms allow-discrete ease-out;
@@ -9211,7 +9498,7 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where(menu-view)::part(menu-summary) {
       transition: transform var(--touchglass-transition-duration) allow-discrete ease-out, filter var(--touchglass-transition-duration) allow-discrete ease-out;
@@ -9222,7 +9509,7 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @keyframes progressViewCircular {
     0% {
       opacity: 0.85;
@@ -9235,21 +9522,21 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where([is=glass-button]) {
       transition: all var(--touchglass-transition-duration) allow-discrete ease-out;
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where([is=glass-prominent-button]) {
       transition: all var(--touchglass-transition-duration) allow-discrete ease-out;
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where([is=confirmation-dialog]) {
       transition: all var(--touchglass-transition-duration) allow-discrete ease-out;
@@ -9260,7 +9547,7 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where([is=alert-dialog]) {
       transition: display var(--touchglass-transition-duration) allow-discrete ease-out, overlay var(--touchglass-transition-duration) allow-discrete ease-out, transform var(--touchglass-transition-duration) allow-discrete ease-out, opacity var(--touchglass-transition-duration) allow-discrete ease-out;
@@ -9268,8 +9555,8 @@
     }
   }
 }
-@layer sw-transitions {}
-@layer sw-transitions {
+@layer sw.sw-transitions {}
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where([is=disclosure-group])::details-content {
       transition: block-size var(--disclosure-group-animation-duration) allow-discrete var(--disclosure-group-animation-easing), content-visibility var(--disclosure-group-animation-duration) allow-discrete var(--disclosure-group-animation-easing);
@@ -9287,7 +9574,7 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) and (min-width: 43rem) {
     :where(navigation-split-view:has(> [is=sidebar-view]) [is=sidebar-view]) {
       transition: filter var(--touchglass-transition-duration) ease-out allow-discrete, transform var(--touchglass-transition-duration) ease-out allow-discrete;
@@ -9307,7 +9594,7 @@
     }
   }
 }
-@layer sw-transitions {
+@layer sw.sw-transitions {
   @media (prefers-reduced-motion: no-preference) {
     :where([is=tab-bar] > [is=form-view]) {
       transition: transform var(--sidebar-transition-duration) ease-out allow-discrete;
@@ -10066,6 +10353,18 @@
     inherits: true;
   }
 }
+@property --quaternaryGroupedBackground {
+  syntax: "<color>";
+  initial-value: oklch(97.61% 0 0deg);
+  inherits: true;
+}
+@media (prefers-color-scheme: dark) {
+  @property --quaternaryGroupedBackground {
+    syntax: "<color>";
+    initial-value: oklch(27.51% 0.0039 128.62deg);
+    inherits: true;
+  }
+}
 @property --separator {
   syntax: "<color>";
   initial-value: oklch(94.31% 0 0deg);
@@ -10383,7 +10682,7 @@
   initial-value: oklch(0% 0 0deg / 0);
   inherits: true;
 }
-@layer sw-colors {
+@layer sw.sw-colors {
   :root {
     --face: var(--background);
     --text: var(--primary);
@@ -10392,6 +10691,46 @@
     --face: var(--background);
     --background: var(--secondaryBackground);
   }
+  :where([is=sheet-view]:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])),
+  [is=full-screen]:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])),
+  [is=confirmation-dialog]:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])),
+  [is=alert-dialog]:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])),
+  content-view:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])),
+  navigation-split-view:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])),
+  navigation-split-view > [is=sidebar-view]:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])),
+  navigation-stack:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background]))) {
+    --background: var(--groupedBackground);
+    --secondaryBackground: var(--secondaryGroupedBackground);
+    --tertiaryBackground: var(--tertiaryGroupedBackground);
+    --face: var(--background);
+  }
+  :where(navigation-stack > navigation-stack:not(:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background]))),
+  navigation-stack > navigation-split-view:not(:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
+  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
+  > scroll-view table-view[table-style=inset]:not([slot], [background])))) {
+    --background: initial;
+    --secondaryBackground: initial;
+    --tertiaryBackground: initial;
+    --face: var(--background);
+  }
   @media (min-width: 43rem) {
     :where(navigation-split-view > [is=sidebar-view]) {
       --face: light-dark(var(--liquid-glass-bg), var(--liquid-glass-bg-dark));
@@ -10532,6 +10871,11 @@
     --btnactiveface: light-dark(oklch(from var(--accentColor) min(calc(l * 1.2), 1) min(calc(c * 1.1), c) h), oklch(from var(--accentColor) min(calc(l * 1.2), 1) min(calc(c * 1.1), c) h));
     --btnactivetext: light-dark(oklch(from var(--accentColor) clamp(0, (0.7 - l) * 999, 1) none none), oklch(from var(--accentColor) clamp(0, (0.7 - l) * 999, 1) none none));
   }
+  :where(toggle-view) {
+    --toggle--track-off-bg: light-dark(var(--toggle-track-off-bg), var(--toggle-track-off-bg-dark));
+    --toggle--track-on-bg: light-dark(var(--toggle-track-on-bg), var(--toggle-track-on-bg-dark));
+    --toggle--dot-bg: light-dark(var(--toggle-dot-bg), var(--toggle-dot-bg-dark));
+  }
   /* list-view {
     :where(&) {
       // --toolbaritemface: ;
@@ -10551,8 +10895,8 @@
     }
   } */
 }
-@layer sw-final {
-  :where(toggle-view[touch-glass]) {
+@layer sw.sw-final {
+  :where(toggle-view[touch-glass])::part(toggle-track) {
     --toggle--dot-scale: 1.22;
     --toggle--dot-press-duration: 100ms;
   }