@swiftwc/ui 0.0.0-dev.114 → 0.0.0-dev.117

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (120) hide show
  1. package/generated/client/index.js +3 -3
  2. package/generated/components/content-unavailable.d.ts +1 -1
  3. package/generated/components/content-unavailable.js +1 -1
  4. package/generated/components/{body-view.d.ts → content-view.d.ts} +2 -2
  5. package/generated/components/{body-view.js → content-view.js} +3 -3
  6. package/generated/components/index.d.ts +1 -1
  7. package/generated/components/index.js +1 -1
  8. package/generated/components/labeled-content.d.ts +1 -1
  9. package/generated/components/labeled-content.js +1 -1
  10. package/generated/components/menu-view.d.ts +1 -1
  11. package/generated/components/menu-view.js +1 -1
  12. package/generated/components/picker-view.d.ts +1 -1
  13. package/generated/components/picker-view.js +12 -12
  14. package/generated/components/progress-view.d.ts +1 -1
  15. package/generated/components/progress-view.js +1 -1
  16. package/generated/components/scroll-view.d.ts +1 -1
  17. package/generated/components/scroll-view.js +1 -1
  18. package/generated/components/section-view.d.ts +1 -1
  19. package/generated/components/section-view.js +1 -1
  20. package/generated/components/tab-view.js +6 -1
  21. package/generated/components/table-view.d.ts +1 -1
  22. package/generated/components/table-view.js +1 -1
  23. package/generated/css/index.css +230 -228
  24. package/generated/internal/class/navigation-path.js +2 -2
  25. package/generated/internal/privateNamespace.d.ts +1 -1
  26. package/generated/internal/privateNamespace.js +3 -3
  27. package/generated/internal/utils/debug.js +2 -2
  28. package/html-data/en.json +18 -18
  29. package/package.json +4 -6
  30. package/scss/_components.scss +1 -1
  31. package/scss/_vars.scss +1 -0
  32. package/scss/base/_layout.scss +8 -8
  33. package/scss/base/_reboot.scss +4 -2
  34. package/scss/base/_root.scss +1 -1
  35. package/scss/colors/_index.scss +2 -2
  36. package/scss/components/_alert-dialog.scss +3 -3
  37. package/scss/components/_bordered-button.scss +2 -2
  38. package/scss/components/_bordered-prominent-button.scss +3 -3
  39. package/scss/components/_borderless-button.scss +2 -2
  40. package/scss/components/_confirmation-dialog.scss +1 -1
  41. package/scss/components/_content-unavailable.scss +1 -1
  42. package/scss/components/{_body-view.scss → _content-view.scss} +2 -2
  43. package/scss/components/_date-picker.scss +1 -1
  44. package/scss/components/_detail-placeholder.scss +5 -5
  45. package/scss/components/_disclosure-group.scss +2 -2
  46. package/scss/components/_fine-tooltip.scss +1 -1
  47. package/scss/components/_form-view.scss +3 -3
  48. package/scss/components/_full-screen.scss +1 -1
  49. package/scss/components/_glass-button.scss +2 -2
  50. package/scss/components/_glass-prominent-button.scss +3 -3
  51. package/scss/components/_group-box.scss +1 -1
  52. package/scss/components/_h-divider.scss +1 -1
  53. package/scss/components/_h-flex-stack.scss +1 -1
  54. package/scss/components/_h-stack.scss +1 -1
  55. package/scss/components/_image-view.scss +1 -1
  56. package/scss/components/_index.scss +4 -4
  57. package/scss/components/_label-view.scss +1 -1
  58. package/scss/components/_labeled-content.scss +1 -1
  59. package/scss/components/_list-view.scss +3 -3
  60. package/scss/components/_menu-view.scss +3 -3
  61. package/scss/components/_navigation-large-title.scss +1 -1
  62. package/scss/components/_navigation-split-view.scss +18 -18
  63. package/scss/components/_navigation-stack.scss +1 -1
  64. package/scss/components/_navigation-title.scss +1 -1
  65. package/scss/components/_picker-view.scss +2 -2
  66. package/scss/components/_plain-button.scss +2 -2
  67. package/scss/components/_progress-view.scss +1 -1
  68. package/scss/components/_scroll-view-proxy.scss +1 -1
  69. package/scss/components/_scroll-view-toolbars.scss +1 -1
  70. package/scss/components/_scroll-view.scss +2 -2
  71. package/scss/components/_search-view.scss +1 -1
  72. package/scss/components/_section-view.scss +1 -1
  73. package/scss/components/_sheet-view.scss +2 -2
  74. package/scss/components/_sidebar-toggle.scss +1 -1
  75. package/scss/components/_sidebar-view.scss +2 -2
  76. package/scss/components/_sticky-container.scss +1 -1
  77. package/scss/components/_tab-bar.scss +1 -1
  78. package/scss/components/_tab-item.scss +1 -1
  79. package/scss/components/_tab-view.scss +15 -15
  80. package/scss/components/_table-column.scss +1 -1
  81. package/scss/components/_table-row.scss +1 -1
  82. package/scss/components/_table-view.scss +1 -1
  83. package/scss/components/_text-field.scss +1 -1
  84. package/scss/components/_text-view.scss +1 -1
  85. package/scss/components/_toggle-view.scss +1 -1
  86. package/scss/components/_tool-bar-item-group.scss +1 -1
  87. package/scss/components/_tool-bar-item.scss +2 -2
  88. package/scss/components/_tool-bar.scss +2 -2
  89. package/scss/components/_v-divider.scss +1 -1
  90. package/scss/components/_v-flex-stack.scss +1 -1
  91. package/scss/components/_v-keyboard.scss +1 -1
  92. package/scss/components/_v-stack.scss +1 -1
  93. package/scss/final/_touch-glass.scss +1 -1
  94. package/scss/mixins/_index.scss +2 -2
  95. package/scss/placeholders/_buttons.scss +5 -5
  96. package/scss/placeholders/_lists.scss +3 -3
  97. package/scss/transitions/_alert-dialog.scss +1 -1
  98. package/scss/transitions/_bwd.navbar.scss +1 -1
  99. package/scss/transitions/_bwd.scss +3 -3
  100. package/scss/transitions/_confirmation-dialog.scss +1 -1
  101. package/scss/transitions/_disclosure-group.scss +1 -1
  102. package/scss/transitions/_fine-tooltip.scss +1 -1
  103. package/scss/transitions/_fwd.navbar.scss +1 -1
  104. package/scss/transitions/_fwd.scss +1 -1
  105. package/scss/transitions/_glass-button.scss +1 -1
  106. package/scss/transitions/_glass-prominent-button.scss +1 -1
  107. package/scss/transitions/_index.scss +1 -1
  108. package/scss/transitions/_menu-view.scss +1 -1
  109. package/scss/transitions/_navigation-split-view.scss +1 -1
  110. package/scss/transitions/_progress-view.scss +1 -1
  111. package/scss/transitions/_sheet-view.scss +1 -1
  112. package/scss/transitions/_sidebar-view.scss +1 -1
  113. package/scss/transitions/_tab-bar.scss +1 -1
  114. package/scss/utils/_background.scss +1 -1
  115. package/scss/utils/_frame.scss +2 -2
  116. package/scss/utils/_index.scss +1 -1
  117. package/scss/utils/_spacing.scss +1 -1
  118. package/scss/utils/_stacks.scss +2 -2
  119. /package/generated/internal/{flags.d.ts → dev-flags.d.ts} +0 -0
  120. /package/generated/internal/{flags.js → dev-flags.js} +0 -0
package/generated/css/index.css CHANGED
@@ -3,7 +3,7 @@
3
3
  inherits: false;
4
4
  initial-value: 16;
5
5
  }
6
- @layer sw-components {
6
+ @layer sw.sw-components {
7
7
  :root {
8
8
  color-scheme: light dark;
9
9
  --safe-area-inset-top: env(safe-area-inset-top);
@@ -322,8 +322,10 @@
322
322
  color-scheme: light only;
323
323
  }
324
324
  }
325
- @layer sw-base, sw-components, sw-nav-components, sw-list-components, sw-tab-components, sw-utils, sw-colors, sw-actions, sw-transitions, sw-final;
326
- @layer sw-base {
325
+ @layer sw {
326
+ @layer sw-base, sw-components, sw-nav-components, sw-list-components, sw-tab-components, sw-utils, sw-colors, sw-actions, sw-transitions, sw-final;
327
+ }
328
+ @layer sw.sw-base {
327
329
  :root {
328
330
  interpolate-size: allow-keywords;
329
331
  touch-action: manipulation;
@@ -427,7 +429,7 @@
427
429
  display: none;
428
430
  }
429
431
  }
430
- @layer sw-list-components {
432
+ @layer sw.sw-list-components {
431
433
  :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)) {
432
434
  background-color: var(--list--host-background-color, );
433
435
  padding-inline: var(--list--host-padding-inline, );
@@ -847,7 +849,7 @@
847
849
  color: var(--accentColor);
848
850
  }
849
851
  }
850
- @layer sw-colors {
852
+ @layer sw.sw-colors {
851
853
  :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]),
852
854
  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]),
853
855
  [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]),
@@ -885,7 +887,7 @@
885
887
  --accentColorEffective: var(--itemtext);
886
888
  }
887
889
  }
888
- @layer sw-actions {
890
+ @layer sw.sw-actions {
889
891
  :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]),
890
892
  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]),
891
893
  [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]),
@@ -941,7 +943,7 @@
941
943
  --accentColorEffective: var(--itemtext);
942
944
  }
943
945
  }
944
- @layer sw-components {
946
+ @layer sw.sw-components {
945
947
  :where([is=glass-prominent-button], [is=glass-button], [is=bordered-prominent-button], [is=bordered-button], [is=borderless-button], [is=plain-button]) {
946
948
  place-items: center;
947
949
  place-content: center;
@@ -1015,7 +1017,7 @@
1015
1017
  --label-font: caption;
1016
1018
  }
1017
1019
  }
1018
- @layer sw-colors {
1020
+ @layer sw.sw-colors {
1019
1021
  :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 {
1020
1022
  outline: none;
1021
1023
  }
@@ -1030,13 +1032,13 @@
1030
1032
  }
1031
1033
  }
1032
1034
  }
1033
- @layer sw-actions {
1035
+ @layer sw.sw-actions {
1034
1036
  :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 {
1035
1037
  --btnface: var(--btnactiveface,);
1036
1038
  --btntext: var(--btnactivetext,);
1037
1039
  }
1038
1040
  }
1039
- @layer sw-transitions {
1041
+ @layer sw.sw-transitions {
1040
1042
  @media (prefers-reduced-motion: no-preference) {
1041
1043
  :where([is=glass-prominent-button], [is=glass-button], [is=bordered-prominent-button], [is=bordered-button], [is=borderless-button], [is=plain-button]) {
1042
1044
  transition: background-color 100ms ease-out allow-discrete, opacity 100ms ease-out allow-discrete, color 100ms ease-out allow-discrete;
@@ -1047,8 +1049,8 @@
1047
1049
  }
1048
1050
  }
1049
1051
  }
1050
- @layer sw-components {
1051
- :where(body-view,
1052
+ @layer sw.sw-components {
1053
+ :where(content-view,
1052
1054
  navigation-stack,
1053
1055
  navigation-split-view,
1054
1056
  [is=full-screen],
@@ -1058,7 +1060,7 @@
1058
1060
  grid-template-columns: minmax(0, 1fr);
1059
1061
  grid-template-rows: minmax(0, 1fr);
1060
1062
  }
1061
- :where(body-view > *:not([slot]),
1063
+ :where(content-view > *:not([slot]),
1062
1064
  navigation-stack > *:not([slot]),
1063
1065
  navigation-split-view > *:not([slot]),
1064
1066
  [is=full-screen] > *:not([slot]),
@@ -1068,48 +1070,48 @@
1068
1070
  }
1069
1071
  :where(navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > scroll-view,
1070
1072
  navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > [is=sidebar-view] > scroll-view,
1071
- navigation-stack:has(> body-view) > scroll-view,
1072
- navigation-stack:has(> body-view) > [is=sidebar-view] > scroll-view,
1073
- navigation-split-view:has(> body-view) > scroll-view,
1074
- navigation-split-view:has(> body-view) > [is=sidebar-view] > scroll-view,
1075
- dialog:has(> body-view) > scroll-view,
1076
- dialog:has(> body-view) > [is=sidebar-view] > scroll-view,
1077
- body-view:has(> body-view) > scroll-view,
1078
- body-view:has(> body-view) > [is=sidebar-view] > scroll-view) {
1073
+ navigation-stack:has(> content-view) > scroll-view,
1074
+ navigation-stack:has(> content-view) > [is=sidebar-view] > scroll-view,
1075
+ navigation-split-view:has(> content-view) > scroll-view,
1076
+ navigation-split-view:has(> content-view) > [is=sidebar-view] > scroll-view,
1077
+ dialog:has(> content-view) > scroll-view,
1078
+ dialog:has(> content-view) > [is=sidebar-view] > scroll-view,
1079
+ content-view:has(> content-view) > scroll-view,
1080
+ content-view:has(> content-view) > [is=sidebar-view] > scroll-view) {
1079
1081
  --scroll-view-translate: translateX(var(--view-transition-leading-x));
1080
1082
  }
1081
1083
  :where(navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > tool-bar > tool-bar-item,
1082
1084
  navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > tool-bar > tool-bar-item-group,
1083
1085
  navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > [is=sidebar-view] > tool-bar > tool-bar-item,
1084
1086
  navigation-stack:has(> navigation-stack:not([hidden]), > navigation-split-view:not([hidden])) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
1085
- navigation-stack:has(> body-view) > tool-bar > tool-bar-item,
1086
- navigation-stack:has(> body-view) > tool-bar > tool-bar-item-group,
1087
- navigation-stack:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1088
- navigation-stack:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
1089
- navigation-split-view:has(> body-view) > tool-bar > tool-bar-item,
1090
- navigation-split-view:has(> body-view) > tool-bar > tool-bar-item-group,
1091
- navigation-split-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1092
- navigation-split-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
1093
- dialog:has(> body-view) > tool-bar > tool-bar-item,
1094
- dialog:has(> body-view) > tool-bar > tool-bar-item-group,
1095
- dialog:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1096
- dialog:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
1097
- body-view:has(> body-view) > tool-bar > tool-bar-item,
1098
- body-view:has(> body-view) > tool-bar > tool-bar-item-group,
1099
- body-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1100
- body-view:has(> body-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group) {
1087
+ navigation-stack:has(> content-view) > tool-bar > tool-bar-item,
1088
+ navigation-stack:has(> content-view) > tool-bar > tool-bar-item-group,
1089
+ navigation-stack:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1090
+ navigation-stack:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
1091
+ navigation-split-view:has(> content-view) > tool-bar > tool-bar-item,
1092
+ navigation-split-view:has(> content-view) > tool-bar > tool-bar-item-group,
1093
+ navigation-split-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1094
+ navigation-split-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
1095
+ dialog:has(> content-view) > tool-bar > tool-bar-item,
1096
+ dialog:has(> content-view) > tool-bar > tool-bar-item-group,
1097
+ dialog:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1098
+ dialog:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group,
1099
+ content-view:has(> content-view) > tool-bar > tool-bar-item,
1100
+ content-view:has(> content-view) > tool-bar > tool-bar-item-group,
1101
+ content-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item,
1102
+ content-view:has(> content-view) > [is=sidebar-view] > tool-bar > tool-bar-item-group) {
1101
1103
  --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-offscreen-scale));
1102
1104
  --toolbar-cell-filter: blur(10px);
1103
1105
  --toolbar-cell-opacity: 0;
1104
1106
  }
1105
1107
  }
1106
- @layer sw-components {
1108
+ @layer sw.sw-components {
1107
1109
  :where(navigation-stack:not([hidden]),
1108
1110
  navigation-split-view:not([hidden]),
1109
1111
  navigation-large-title:not([hidden]),
1110
1112
  navigation-title:not([hidden]),
1111
1113
  scroll-view:not([hidden]),
1112
- body-view:not([hidden]),
1114
+ content-view:not([hidden]),
1113
1115
  tab-view:not([hidden]),
1114
1116
  image-view:not([hidden]),
1115
1117
  list-view:not([hidden]),
@@ -1142,7 +1144,7 @@
1142
1144
  navigation-large-title:not(:defined),
1143
1145
  navigation-title:not(:defined),
1144
1146
  scroll-view:not(:defined),
1145
- body-view:not(:defined),
1147
+ content-view:not(:defined),
1146
1148
  tab-view:not(:defined),
1147
1149
  image-view:not(:defined),
1148
1150
  list-view:not(:defined),
@@ -1172,7 +1174,7 @@
1172
1174
  navigation-large-title:not(:defined),
1173
1175
  navigation-title:not(:defined),
1174
1176
  scroll-view:not(:defined),
1175
- body-view:not(:defined),
1177
+ content-view:not(:defined),
1176
1178
  tab-view:not(:defined),
1177
1179
  image-view:not(:defined),
1178
1180
  list-view:not(:defined),
@@ -1202,7 +1204,7 @@
1202
1204
  navigation-large-title:not(:defined),
1203
1205
  navigation-title:not(:defined),
1204
1206
  scroll-view:not(:defined),
1205
- body-view:not(:defined),
1207
+ content-view:not(:defined),
1206
1208
  tab-view:not(:defined),
1207
1209
  image-view:not(:defined),
1208
1210
  list-view:not(:defined),
@@ -1326,7 +1328,7 @@
1326
1328
  border-radius: var(--toolbaritemradiustl,) var(--toolbaritemradiustr,) var(--toolbaritemradiusbr,) var(--toolbaritemradiusbl,);
1327
1329
  }
1328
1330
  }
1329
- @layer sw-colors {
1331
+ @layer sw.sw-colors {
1330
1332
  :where(sidebar-toggle > button:not(:disabled):not([readonly]),
1331
1333
  tool-bar-item > button:not(:disabled):not([readonly]),
1332
1334
  tool-bar-item > input:not(:disabled):not([readonly]),
@@ -1356,7 +1358,7 @@
1356
1358
  }
1357
1359
  }
1358
1360
  }
1359
- @layer sw-actions {
1361
+ @layer sw.sw-actions {
1360
1362
  :where(sidebar-toggle > button:not(:disabled):not([readonly]),
1361
1363
  tool-bar-item > button:not(:disabled):not([readonly]),
1362
1364
  tool-bar-item > input:not(:disabled):not([readonly]),
@@ -1367,7 +1369,7 @@
1367
1369
  --toolbaritemtext: var(--toolbaritemactivetext,);
1368
1370
  }
1369
1371
  }
1370
- @layer sw-components {
1372
+ @layer sw.sw-components {
1371
1373
  :where(v-keyboard) {
1372
1374
  position: fixed;
1373
1375
  inset: 0lvh auto auto 0lvw;
@@ -1375,7 +1377,7 @@
1375
1377
  block-size: 100lvh;
1376
1378
  }
1377
1379
  }
1378
- @layer sw-components {
1380
+ @layer sw.sw-components {
1379
1381
  :where([is=disclosure-group]) {
1380
1382
  overflow: clip;
1381
1383
  --disclosure--host-details-content-block-size: 0;
@@ -1471,7 +1473,7 @@
1471
1473
  }
1472
1474
  }
1473
1475
  }
1474
- @layer sw-utils {
1476
+ @layer sw.sw-utils {
1475
1477
  @supports (x: attr(x type(*))) {
1476
1478
  :where([is=disclosure-group]) {
1477
1479
  --disclosure-style: attr(disclosure-style type(<custom-ident>), inherit);
@@ -1505,7 +1507,7 @@
1505
1507
  }
1506
1508
  }
1507
1509
  }
1508
- @layer sw-components {
1510
+ @layer sw.sw-components {
1509
1511
  :where(image-view) {
1510
1512
  --image--fontsize: calc(var(--label-image-size) * 1rem);
1511
1513
  }
@@ -1515,7 +1517,7 @@
1515
1517
  font-size: var(--image--fontsize);
1516
1518
  }
1517
1519
  }
1518
- @layer sw-components {
1520
+ @layer sw.sw-components {
1519
1521
  :where(group-box) {
1520
1522
  background: var(--groupbox--background);
1521
1523
  padding-inline: var(--groupbox--padding-inline);
@@ -1531,21 +1533,21 @@
1531
1533
  --label-image-size: 5;
1532
1534
  }
1533
1535
  }
1534
- @layer sw-components {
1536
+ @layer sw.sw-components {
1535
1537
  :where(h-divider) {
1536
1538
  inline-size: 100%;
1537
1539
  block-size: 1px;
1538
1540
  background-color: var(--separator);
1539
1541
  }
1540
1542
  }
1541
- @layer sw-components {
1543
+ @layer sw.sw-components {
1542
1544
  :where(v-divider) {
1543
1545
  inline-size: 1px;
1544
1546
  block-size: 100%;
1545
1547
  background-color: var(--separator);
1546
1548
  }
1547
1549
  }
1548
- @layer sw-components {
1550
+ @layer sw.sw-components {
1549
1551
  :where([is=full-screen]) {
1550
1552
  inset-inline: 0px;
1551
1553
  inset-block: 0px;
@@ -1567,7 +1569,7 @@
1567
1569
  block-size: var(--100lvh, 100lvh);
1568
1570
  }
1569
1571
  }
1570
- @layer sw-components {
1572
+ @layer sw.sw-components {
1571
1573
  :where(detail-placeholder) {
1572
1574
  pointer-events: none;
1573
1575
  touch-action: none;
@@ -1643,20 +1645,20 @@
1643
1645
  }
1644
1646
  }
1645
1647
  @media (min-width: 43rem) {
1646
- :where(navigation-split-view:not(:has(> [is=sidebar-view])):has(> body-view) detail-placeholder) {
1648
+ :where(navigation-split-view:not(:has(> [is=sidebar-view])):has(> content-view) detail-placeholder) {
1647
1649
  --nav-split-view--detail-placeholder-visibility: collapse;
1648
1650
  }
1649
- :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content]:not(:has(> body-view)) detail-placeholder) {
1651
+ :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content]:not(:has(> content-view)) detail-placeholder) {
1650
1652
  --nav-split-view--detail-placeholder-visibility: collapse;
1651
1653
  }
1652
1654
  }
1653
1655
  @media (min-width: 43rem) and (min-width: 64rem) {
1654
- :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):has(> body-view > body-view) detail-placeholder) {
1656
+ :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]):has(> content-view > content-view) detail-placeholder) {
1655
1657
  --nav-split-view--detail-placeholder-visibility: collapse;
1656
1658
  }
1657
1659
  }
1658
1660
  @media (min-width: 43rem) {
1659
- :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column]:has(> body-view) detail-placeholder) {
1661
+ :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column]:has(> content-view) detail-placeholder) {
1660
1662
  --nav-split-view--detail-placeholder-visibility: collapse;
1661
1663
  }
1662
1664
  }
@@ -1666,7 +1668,7 @@
1666
1668
  inherits: false;
1667
1669
  initial-value: 0;
1668
1670
  }
1669
- @layer sw-components {
1671
+ @layer sw.sw-components {
1670
1672
  :where(progress-view) {
1671
1673
  transition: --progress-view-style-index 1ms step-start;
1672
1674
  grid-template-columns: minmax(0, 1fr);
@@ -1739,7 +1741,7 @@
1739
1741
  --progress-view-style-index: 1;
1740
1742
  }
1741
1743
  }
1742
- @layer sw-tab-components {
1744
+ @layer sw.sw-tab-components {
1743
1745
  :where(fine-tooltip) {
1744
1746
  color: var(--text, );
1745
1747
  pointer-events: none;
@@ -1801,7 +1803,7 @@
1801
1803
  inherits: false;
1802
1804
  initial-value: 0;
1803
1805
  }
1804
- @layer sw-components {
1806
+ @layer sw.sw-components {
1805
1807
  :where(sticky-container) {
1806
1808
  container-type: scroll-state;
1807
1809
  position: sticky;
@@ -1826,7 +1828,7 @@
1826
1828
  }
1827
1829
  }
1828
1830
  }
1829
- @layer sw-components {
1831
+ @layer sw.sw-components {
1830
1832
  :where([is=sheet-view]) {
1831
1833
  inset-inline: 0px;
1832
1834
  inset-block: 0px;
@@ -1872,7 +1874,7 @@
1872
1874
  :where([is=sheet-view]:has([is=sheet-view]:not([open]))) {
1873
1875
  overflow: visible;
1874
1876
  }
1875
- :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) {
1877
+ :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) {
1876
1878
  opacity: 0;
1877
1879
  }
1878
1880
  :where([is=sheet-view] [is=sheet-view]:not([open])) {
@@ -1882,7 +1884,7 @@
1882
1884
  }
1883
1885
  }
1884
1886
  }
1885
- @layer sw-components {
1887
+ @layer sw.sw-components {
1886
1888
  :where(content-unavailable) {
1887
1889
  place-content: center;
1888
1890
  place-items: center;
@@ -1912,7 +1914,7 @@
1912
1914
  display: none;
1913
1915
  }
1914
1916
  }
1915
- @layer sw-components {
1917
+ @layer sw.sw-components {
1916
1918
  :where([is=confirmation-dialog]) {
1917
1919
  inset-inline: 0px;
1918
1920
  inset-block: 0px;
@@ -1987,7 +1989,7 @@
1987
1989
  --confirmation--inner-scale: scale3d(0, 0, 1);
1988
1990
  }
1989
1991
  }
1990
- @layer sw-components {
1992
+ @layer sw.sw-components {
1991
1993
  :where([is=alert-dialog]) {
1992
1994
  inset-inline: 0px;
1993
1995
  inset-block: 0px;
@@ -2064,17 +2066,17 @@
2064
2066
  --alert--dialog-opacity: 0;
2065
2067
  }
2066
2068
  }
2067
- @layer sw-components {
2068
- :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])) {
2069
+ @layer sw.sw-components {
2070
+ :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])) {
2069
2071
  scroll-padding-top: var(--navigation-bar-block-size);
2070
2072
  }
2071
- :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])) {
2073
+ :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])) {
2072
2074
  scroll-padding-bottom: var(--tool-bar-block-size);
2073
2075
  }
2074
- :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])) {
2076
+ :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])) {
2075
2077
  margin-block-end: var(--tool-bar-block-size);
2076
2078
  }
2077
- :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) {
2079
+ :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) {
2078
2080
  overflow: clip auto;
2079
2081
  -webkit-overflow-scrolling: touch;
2080
2082
  overscroll-behavior: contain;
@@ -2087,7 +2089,7 @@
2087
2089
  transform: var(--scroll-view-translate, );
2088
2090
  scrollbar-width: thin;
2089
2091
  }
2090
- :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 {
2092
+ :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 {
2091
2093
  grid-column: 1/-1;
2092
2094
  grid-row: 1/-1;
2093
2095
  content: "";
@@ -2096,29 +2098,29 @@
2096
2098
  z-index: -1;
2097
2099
  pointer-events: none;
2098
2100
  }
2099
- :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 {
2101
+ :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 {
2100
2102
  block-size: calc(100% + var(--safe-area-inset-bottom) + 1px);
2101
2103
  }
2102
- :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) {
2104
+ :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) {
2103
2105
  grid-template-columns: minmax(0, 1fr);
2104
2106
  grid-template-rows: 0 minmax(max-content, 1fr);
2105
2107
  grid-template-areas: "toolbar" "main";
2106
2108
  }
2107
- :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]) {
2109
+ :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]) {
2108
2110
  grid-area: main;
2109
2111
  }
2110
- :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],
2112
+ :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],
2111
2113
  ~ tool-bar > [slot=cancellation-action],
2112
2114
  ~ tool-bar > [slot=primary-action],
2113
2115
  ~ tool-bar > [slot=confirmation-action],
2114
- ~ 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]) {
2116
+ ~ 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]) {
2115
2117
  grid-template-rows: var(--navigation-bar-block-size) minmax(max-content, 1fr);
2116
2118
  }
2117
- :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] {
2119
+ :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] {
2118
2120
  opacity: 0;
2119
2121
  visibility: collapse;
2120
2122
  }
2121
- :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 {
2123
+ :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 {
2122
2124
  backface-visibility: hidden;
2123
2125
  content: "";
2124
2126
  inset: 0 0 var(--navbar-backdrop-inset-block-end, 0) 0;
@@ -2126,23 +2128,23 @@
2126
2128
  pointer-events: none;
2127
2129
  z-index: -1;
2128
2130
  }
2129
- :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 {
2131
+ :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 {
2130
2132
  backdrop-filter: blur(2px);
2131
2133
  mask-image: linear-gradient(to bottom, oklch(0% 0 0deg) 50%, oklch(0% 0 0deg / 0) 100%);
2132
2134
  }
2133
- :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 {
2135
+ :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 {
2134
2136
  background-image: linear-gradient(to bottom, var(--face) 0, oklch(0% 0 0deg / 0) 100%);
2135
2137
  }
2136
- :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 {
2138
+ :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 {
2137
2139
  display: none;
2138
2140
  }
2139
2141
  @supports (container-type: scroll-state) {
2140
- :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 {
2142
+ :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 {
2141
2143
  mask-image: none !important;
2142
2144
  }
2143
2145
  }
2144
2146
  @supports not (container-type: scroll-state) {
2145
- :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 {
2147
+ :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 {
2146
2148
  mask-image: none !important;
2147
2149
  }
2148
2150
  }
@@ -2155,7 +2157,7 @@
2155
2157
  }
2156
2158
  }
2157
2159
  }
2158
- @layer sw-components {
2160
+ @layer sw.sw-components {
2159
2161
  :where(scroll-view-proxy) {
2160
2162
  display: contents;
2161
2163
  }
@@ -2190,7 +2192,7 @@
2190
2192
  scroll-padding-inline: 1rem;
2191
2193
  }
2192
2194
  }
2193
- @layer sw-components {
2195
+ @layer sw.sw-components {
2194
2196
  :where(h-stack) {
2195
2197
  grid-auto-flow: column;
2196
2198
  grid-template-rows: minmax(0, 1fr);
@@ -2343,7 +2345,7 @@
2343
2345
  grid-template-columns: auto minmax(0, 1fr) auto auto;
2344
2346
  }
2345
2347
  }
2346
- @layer sw-components {
2348
+ @layer sw.sw-components {
2347
2349
  :where(v-stack) {
2348
2350
  grid-template-columns: minmax(0, 1fr);
2349
2351
  place-items: safe center;
@@ -2495,7 +2497,7 @@
2495
2497
  grid-template-rows: auto minmax(0, 1fr) auto auto;
2496
2498
  }
2497
2499
  }
2498
- @layer sw-components {
2500
+ @layer sw.sw-components {
2499
2501
  :where(h-flex-stack) {
2500
2502
  display: flex;
2501
2503
  flex-flow: row nowrap;
@@ -2510,7 +2512,7 @@
2510
2512
  flex-grow: 1;
2511
2513
  }
2512
2514
  }
2513
- @layer sw-components {
2515
+ @layer sw.sw-components {
2514
2516
  :where(v-flex-stack) {
2515
2517
  display: flex;
2516
2518
  flex-flow: column nowrap;
@@ -2525,7 +2527,7 @@
2525
2527
  flex-grow: 1;
2526
2528
  }
2527
2529
  }
2528
- @layer sw-components {
2530
+ @layer sw.sw-components {
2529
2531
  :where(scroll-view)::part(scroll-view-navbar), :where(scroll-view)::part(scroll-view-toolbar) {
2530
2532
  position: sticky;
2531
2533
  inline-size: 100%;
@@ -2623,7 +2625,7 @@
2623
2625
  inline-size: calc(var(--toolbar-padding-inline-end) + var(--toolbar-safe-area-inset-right, 0px) + var(--toolbar-col-gap, 0px));
2624
2626
  }
2625
2627
  }
2626
- @layer sw-components {
2628
+ @layer sw.sw-components {
2627
2629
  :where(tool-bar-item) {
2628
2630
  pointer-events: all;
2629
2631
  border-radius: var(--pill-border-radius);
@@ -2676,14 +2678,14 @@
2676
2678
  --label-padding-inline: 0.5rem;
2677
2679
  }
2678
2680
  }
2679
- @layer sw-actions {
2681
+ @layer sw.sw-actions {
2680
2682
  :where(tool-bar-item[slot]:has(menu-view[open])),
2681
2683
  :where(tool-bar-item-group:has(> tool-bar-item menu-view[open])) {
2682
2684
  --toolbar-cell-scale: var(--menu-host-offscreen-transform);
2683
2685
  --toolbar-cell-filter: var(--menu-host-offscreen-filter);
2684
2686
  }
2685
2687
  }
2686
- @layer sw-components {
2688
+ @layer sw.sw-components {
2687
2689
  :where(tool-bar-item-group) {
2688
2690
  grid-auto-flow: column;
2689
2691
  grid-template-columns: minmax(0, 1fr);
@@ -2698,13 +2700,13 @@
2698
2700
  min-inline-size: calc(var(--toolbar-cell-min-size) - var(--toolbar-cell-block-padding-start) - var(--toolbar-cell-block-padding-end));
2699
2701
  }
2700
2702
  }
2701
- @layer sw-components {}
2702
- @layer sw-utils {
2703
+ @layer sw.sw-components {}
2704
+ @layer sw.sw-utils {
2703
2705
  :where([is=plain-button]) {
2704
2706
  text-align: center;
2705
2707
  }
2706
2708
  }
2707
- @layer sw-components {
2709
+ @layer sw.sw-components {
2708
2710
  :where([is=borderless-button]) {
2709
2711
  --btnpadistart: 0.1rem;
2710
2712
  --btnpadiend: 0.1rem;
@@ -2730,12 +2732,12 @@
2730
2732
  --accentColor5: var(--blue5);
2731
2733
  }
2732
2734
  }
2733
- @layer sw-utils {
2735
+ @layer sw.sw-utils {
2734
2736
  :where([is=borderless-button]) {
2735
2737
  text-align: center;
2736
2738
  }
2737
2739
  }
2738
- @layer sw-components {
2740
+ @layer sw.sw-components {
2739
2741
  :where([is=bordered-button]) {
2740
2742
  --btnpadistart: var(--regular-btn-padding);
2741
2743
  --btnpadiend: var(--regular-btn-padding);
@@ -2790,12 +2792,12 @@
2790
2792
  --accentColor5: var(--blue5);
2791
2793
  }
2792
2794
  }
2793
- @layer sw-utils {
2795
+ @layer sw.sw-utils {
2794
2796
  :where([is=bordered-button]) {
2795
2797
  text-align: center;
2796
2798
  }
2797
2799
  }
2798
- @layer sw-components {
2800
+ @layer sw.sw-components {
2799
2801
  :where([is=bordered-prominent-button]) {
2800
2802
  --btnpadistart: var(--regular-btn-padding);
2801
2803
  --btnpadiend: var(--regular-btn-padding);
@@ -2845,7 +2847,7 @@
2845
2847
  --accentColor5: var(--blue5);
2846
2848
  }
2847
2849
  }
2848
- @layer sw-colors {
2850
+ @layer sw.sw-colors {
2849
2851
  :where([is=bordered-prominent-button] > *) {
2850
2852
  --secondary: var(--btntext);
2851
2853
  --blue: var(--btntext);
@@ -2857,12 +2859,12 @@
2857
2859
  --accentColorEffective: var(--btntext);
2858
2860
  }
2859
2861
  }
2860
- @layer sw-utils {
2862
+ @layer sw.sw-utils {
2861
2863
  :where([is=bordered-prominent-button]) {
2862
2864
  text-align: center;
2863
2865
  }
2864
2866
  }
2865
- @layer sw-components {
2867
+ @layer sw.sw-components {
2866
2868
  :where([is=glass-button]) {
2867
2869
  backdrop-filter: var(--liquid-glass-backdrop-filter);
2868
2870
  box-shadow: var(--toolbar-cell-box-shadow);
@@ -2915,12 +2917,12 @@
2915
2917
  --accentColor5: var(--blue5);
2916
2918
  }
2917
2919
  }
2918
- @layer sw-utils {
2920
+ @layer sw.sw-utils {
2919
2921
  :where([is=glass-button]) {
2920
2922
  text-align: center;
2921
2923
  }
2922
2924
  }
2923
- @layer sw-components {
2925
+ @layer sw.sw-components {
2924
2926
  :where([is=glass-prominent-button]) {
2925
2927
  backdrop-filter: var(--liquid-glass-backdrop-filter);
2926
2928
  box-shadow: var(--toolbar-cell-box-shadow);
@@ -2973,7 +2975,7 @@
2973
2975
  --accentColor5: var(--blue5);
2974
2976
  }
2975
2977
  }
2976
- @layer sw-colors {
2978
+ @layer sw.sw-colors {
2977
2979
  :where([is=glass-prominent-button] > *) {
2978
2980
  --secondary: var(--btntext);
2979
2981
  --blue: var(--btntext);
@@ -2985,12 +2987,12 @@
2985
2987
  --accentColorEffective: var(--btntext);
2986
2988
  }
2987
2989
  }
2988
- @layer sw-utils {
2990
+ @layer sw.sw-utils {
2989
2991
  :where([is=glass-prominent-button]) {
2990
2992
  text-align: center;
2991
2993
  }
2992
2994
  }
2993
- @layer sw-components {
2995
+ @layer sw.sw-components {
2994
2996
  :where([is=search-view]) {
2995
2997
  height: 30px;
2996
2998
  backdrop-filter: var(--liquid-glass-backdrop-filter, );
@@ -3001,7 +3003,7 @@
3001
3003
  outline: none;
3002
3004
  }
3003
3005
  }
3004
- @layer sw-components {
3006
+ @layer sw.sw-components {
3005
3007
  :where(tool-bar) {
3006
3008
  pointer-events: none;
3007
3009
  touch-action: none;
@@ -3084,7 +3086,7 @@
3084
3086
  inherits: false;
3085
3087
  initial-value: 0;
3086
3088
  }
3087
- @layer sw-components {
3089
+ @layer sw.sw-components {
3088
3090
  :where(label-view) {
3089
3091
  padding-inline: var(--label-padding-inline);
3090
3092
  align-items: var(--label--host-align-items, );
@@ -3538,7 +3540,7 @@
3538
3540
  }
3539
3541
  }
3540
3542
  }
3541
- @layer sw-components {
3543
+ @layer sw.sw-components {
3542
3544
  :where(text-view[prose]) {
3543
3545
  container: text-view/inline-size;
3544
3546
  --text-view--p-margin-block-start: 1rem;
@@ -3550,7 +3552,7 @@
3550
3552
  font-size: clamp(1rem, var(--text-view--h1-font-size) + 0.5rem, 3rem);
3551
3553
  }
3552
3554
  }
3553
- @layer sw-components {
3555
+ @layer sw.sw-components {
3554
3556
  :where(toggle-view) {
3555
3557
  grid-template-columns: minmax(0, 1fr);
3556
3558
  grid-template-rows: minmax(0, 1fr);
@@ -3642,7 +3644,7 @@
3642
3644
  color: var(--secondary);
3643
3645
  }
3644
3646
  }
3645
- @layer sw-components {
3647
+ @layer sw.sw-components {
3646
3648
  :where(labeled-content) {
3647
3649
  container: labeled-content/inline-size;
3648
3650
  }
@@ -3696,8 +3698,8 @@
3696
3698
  }
3697
3699
  }
3698
3700
  }
3699
- @layer sw-components {}
3700
- @layer sw-components {
3701
+ @layer sw.sw-components {}
3702
+ @layer sw.sw-components {
3701
3703
  :where(navigation-large-title) {
3702
3704
  transition: --navigation-bar-block-size 1ms step-start;
3703
3705
  }
@@ -3713,8 +3715,8 @@
3713
3715
  visibility: collapse;
3714
3716
  }
3715
3717
  }
3716
- @layer sw-components {}
3717
- @layer sw-components {
3718
+ @layer sw.sw-components {}
3719
+ @layer sw.sw-components {
3718
3720
  :where(tab-view:not([tab-view-style=tab-bar-only]) > sidebar-toggle, navigation-split-view > sidebar-toggle) {
3719
3721
  position: fixed;
3720
3722
  inset: max(env(safe-area-inset-top), var(--sidebar-block-spacing)) auto auto 0;
@@ -3787,7 +3789,7 @@
3787
3789
  }
3788
3790
  }
3789
3791
  }
3790
- @layer sw-components {
3792
+ @layer sw.sw-components {
3791
3793
  :where(menu-view)::part(menu-summary) {
3792
3794
  transform: var(--menu--summary-scale, );
3793
3795
  filter: var(--menu--summary-filter, );
@@ -3907,7 +3909,7 @@
3907
3909
  --disclosure-style: marker-trailing;
3908
3910
  }
3909
3911
  }
3910
- @layer sw-colors {
3912
+ @layer sw.sw-colors {
3911
3913
  :where(menu-view:not(:disabled):not([readonly])):focus-visible {
3912
3914
  outline: none;
3913
3915
  }
@@ -3986,7 +3988,7 @@
3986
3988
  }
3987
3989
  }
3988
3990
  }
3989
- @layer sw-actions {
3991
+ @layer sw.sw-actions {
3990
3992
  :where(menu-view:not(:disabled):not([readonly])):active::part(menu-summary) {
3991
3993
  --menusummaryface: var(--menusummaryactiveface,);
3992
3994
  --menusummarytext: var(--menusummaryactivetext,);
@@ -4002,7 +4004,7 @@
4002
4004
  --menuitemtext: var(--menuitemactivetext,);
4003
4005
  }
4004
4006
  }
4005
- @layer sw-components {
4007
+ @layer sw.sw-components {
4006
4008
  :where([is=sidebar-view]) {
4007
4009
  inset-inline: 0px;
4008
4010
  inset-block: 0px;
@@ -4053,12 +4055,12 @@
4053
4055
  }
4054
4056
  }
4055
4057
  }
4056
- @layer sw-final {
4058
+ @layer sw.sw-final {
4057
4059
  :where([is=sidebar-view][open]) {
4058
4060
  margin-inline-start: max(env(safe-area-inset-left), var(--sidebar-inline-spacing));
4059
4061
  }
4060
4062
  }
4061
- @layer sw-list-components {
4063
+ @layer sw.sw-list-components {
4062
4064
  :where(list-view:not(list-view list-view, [is=form-view] list-view, table-view list-view)) {
4063
4065
  --list--section-gap: var(--list-row-gap);
4064
4066
  --list--host-background-color: var(--list-background-color, );
@@ -4296,7 +4298,7 @@
4296
4298
  --list--accessories-display: none;
4297
4299
  --list--rootsummary-marker-display: marker-trailing;
4298
4300
  }
4299
- :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]) {
4301
+ :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]) {
4300
4302
  --list--item-color: var(--insetlist-item-color, );
4301
4303
  --list--item-background-color: var(--insetlist-item-background-color, );
4302
4304
  --list--highlighteditem-color: var(--insetlist-highlighteditem-color, );
@@ -4323,7 +4325,7 @@
4323
4325
  :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]) {
4324
4326
  --list-style: sidebar;
4325
4327
  }
4326
- :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]) {
4328
+ :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]) {
4327
4329
  --list-style: inset;
4328
4330
  }
4329
4331
  }
@@ -4360,7 +4362,7 @@
4360
4362
  --itemactiveface: var(--accentColor);
4361
4363
  }
4362
4364
  }
4363
- :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)) {
4365
+ :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)) {
4364
4366
  --list--accessories-size: 0rem;
4365
4367
  --list--accessories-display: none;
4366
4368
  --insetlist-highlighteditem-background-color: var(--accentColor);
@@ -4369,14 +4371,14 @@
4369
4371
  --insetgroupedlist-highlighteditem-color: var(--tintcontrast);
4370
4372
  }
4371
4373
  @container style(--list-style: inset) or style(--list-style: inset-grouped) {
4372
- :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]) {
4374
+ :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]) {
4373
4375
  --itemhighlightface: var(--accentColor);
4374
4376
  --itemactiveface: var(--accentColor);
4375
4377
  }
4376
4378
  }
4377
4379
  }
4378
4380
  @media (min-width: 64rem) {
4379
- :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)) {
4381
+ :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)) {
4380
4382
  --list--accessories-size: 0rem;
4381
4383
  --list--accessories-display: none;
4382
4384
  --insetlist-highlighteditem-background-color: var(--accentColor);
@@ -4385,7 +4387,7 @@
4385
4387
  --insetgroupedlist-highlighteditem-color: var(--tintcontrast);
4386
4388
  }
4387
4389
  @container style(--list-style: inset) or style(--list-style: inset-grouped) {
4388
- :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]) {
4390
+ :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]) {
4389
4391
  --itemhighlightface: var(--accentColor);
4390
4392
  --itemactiveface: var(--accentColor);
4391
4393
  }
@@ -4432,7 +4434,7 @@
4432
4434
  display: none;
4433
4435
  }
4434
4436
  }
4435
- @layer sw-list-components {
4437
+ @layer sw.sw-list-components {
4436
4438
  :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])) {
4437
4439
  --list--section-gap: var(--form-gap);
4438
4440
  --list--host-background-color: var(--form-background-color, );
@@ -4669,7 +4671,7 @@
4669
4671
  --list--accessories-display: none;
4670
4672
  --list--rootsummary-marker-display: marker-trailing;
4671
4673
  }
4672
- :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]) {
4674
+ :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]) {
4673
4675
  --list--host-background-color: var(--insetform-background-color, );
4674
4676
  --list--host-padding-inline: var(--insetform-padding-inline);
4675
4677
  --list--host-padding-block: var(--insetform-padding-block);
@@ -4696,7 +4698,7 @@
4696
4698
  :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]) {
4697
4699
  --form-style: sidebar;
4698
4700
  }
4699
- :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]) {
4701
+ :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]) {
4700
4702
  --form-style: inset;
4701
4703
  }
4702
4704
  }
@@ -4733,7 +4735,7 @@
4733
4735
  --itemactiveface: var(--accentColor);
4734
4736
  }
4735
4737
  }
4736
- :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])) {
4738
+ :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])) {
4737
4739
  --list--accessories-size: 0rem;
4738
4740
  --list--accessories-display: none;
4739
4741
  --insetform-highlighteditem-background-color: var(--accentColor);
@@ -4742,14 +4744,14 @@
4742
4744
  --insetgroupedform-highlighteditem-color: var(--tintcontrast);
4743
4745
  }
4744
4746
  @container style(--list-style: inset) or style(--list-style: inset-grouped) {
4745
- :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]) {
4747
+ :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]) {
4746
4748
  --itemhighlightface: var(--accentColor);
4747
4749
  --itemactiveface: var(--accentColor);
4748
4750
  }
4749
4751
  }
4750
4752
  }
4751
4753
  @media (min-width: 64rem) {
4752
- :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])) {
4754
+ :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])) {
4753
4755
  --list--accessories-size: 0rem;
4754
4756
  --list--accessories-display: none;
4755
4757
  --insetform-highlighteditem-background-color: var(--accentColor);
@@ -4758,7 +4760,7 @@
4758
4760
  --insetgroupedform-highlighteditem-color: var(--tintcontrast);
4759
4761
  }
4760
4762
  @container style(--list-style: inset) or style(--list-style: inset-grouped) {
4761
- :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]) {
4763
+ :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]) {
4762
4764
  --itemhighlightface: var(--accentColor);
4763
4765
  --itemactiveface: var(--accentColor);
4764
4766
  }
@@ -4769,7 +4771,7 @@
4769
4771
  --list--accessories-display: none;
4770
4772
  }
4771
4773
  }
4772
- @layer sw-components {
4774
+ @layer sw.sw-components {
4773
4775
  :where(section-view) {
4774
4776
  grid-template-columns: minmax(0, 1fr);
4775
4777
  grid-template-rows: auto minmax(max-content, 1fr) auto;
@@ -4844,7 +4846,7 @@
4844
4846
  inherits: false;
4845
4847
  initial-value: 0;
4846
4848
  }
4847
- @layer sw-list-components {
4849
+ @layer sw.sw-list-components {
4848
4850
  :where(table-view:not(table-view table-view, list-view table-view, [is=form-view] table-view)) {
4849
4851
  container: table/inline-size;
4850
4852
  }
@@ -5008,7 +5010,7 @@
5008
5010
  }
5009
5011
  }
5010
5012
  }
5011
- @layer sw-components {
5013
+ @layer sw.sw-components {
5012
5014
  :where([is=table-row]) {
5013
5015
  row-gap: var(--table-row-gap);
5014
5016
  column-gap: var(--table-col-gap);
@@ -5166,7 +5168,7 @@
5166
5168
  }
5167
5169
  }
5168
5170
  }
5169
- @layer sw-components {
5171
+ @layer sw.sw-components {
5170
5172
  :where([is=table-column]) {
5171
5173
  column-gap: var(--table-accessory-gap);
5172
5174
  grid-auto-flow: column;
@@ -5201,7 +5203,7 @@
5201
5203
  --tablecol--after-rotate: rotate(180deg);
5202
5204
  }
5203
5205
  }
5204
- @layer sw-components {
5206
+ @layer sw.sw-components {
5205
5207
  :where(text-field) {
5206
5208
  grid-template-columns: minmax(0, 1fr);
5207
5209
  grid-template-rows: minmax(0, 1fr);
@@ -5227,7 +5229,7 @@
5227
5229
  background-color: transparent;
5228
5230
  }
5229
5231
  }
5230
- @layer sw-components {
5232
+ @layer sw.sw-components {
5231
5233
  :where(date-picker) {
5232
5234
  grid-template-columns: minmax(0, 1fr);
5233
5235
  grid-template-rows: minmax(0, 1fr);
@@ -5245,7 +5247,7 @@
5245
5247
  text-align: end;
5246
5248
  }
5247
5249
  }
5248
- @layer sw-components {
5250
+ @layer sw.sw-components {
5249
5251
  :where(picker-view) {
5250
5252
  grid-template-columns: minmax(0, 1fr);
5251
5253
  grid-template-rows: minmax(0, 1fr);
@@ -5414,7 +5416,7 @@
5414
5416
  --picker--inputstack-flex-flow: row wrap;
5415
5417
  }
5416
5418
  }
5417
- @layer sw-final {
5419
+ @layer sw.sw-final {
5418
5420
  @supports not (x: attr(x type(*))) {
5419
5421
  @container style(--picker-label-value-placement: vertical) {
5420
5422
  :where(picker-view:not([label-value-placement])) {
@@ -5440,13 +5442,13 @@
5440
5442
  }
5441
5443
  }
5442
5444
  }
5443
- @layer sw-nav-components {
5445
+ @layer sw.sw-nav-components {
5444
5446
  :where(navigation-stack) {
5445
5447
  touch-action: none;
5446
5448
  block-size: var(--100lvh, 100lvh);
5447
5449
  }
5448
5450
  }
5449
- @layer sw-nav-components {
5451
+ @layer sw.sw-nav-components {
5450
5452
  :where(navigation-split-view) {
5451
5453
  touch-action: none;
5452
5454
  block-size: var(--100lvh, 100lvh);
@@ -5465,23 +5467,23 @@
5465
5467
  :where(scroll-view:has(~ navigation-split-view:not([hidden]))) {
5466
5468
  z-index: -1;
5467
5469
  }
5468
- :where(navigation-split-view > body-view ~ scroll-view, navigation-split-view > body-view ~ [is=sidebar-view]) {
5470
+ :where(navigation-split-view > content-view ~ scroll-view, navigation-split-view > content-view ~ [is=sidebar-view]) {
5469
5471
  z-index: -1;
5470
5472
  }
5471
- :where(navigation-split-view:has(> [is=sidebar-view]) > body-view ~ [is=sidebar-view]) {
5473
+ :where(navigation-split-view:has(> [is=sidebar-view]) > content-view ~ [is=sidebar-view]) {
5472
5474
  z-index: -2;
5473
5475
  }
5474
- :where(navigation-split-view:has(> [is=sidebar-view]) > body-view > body-view ~ scroll-view) {
5476
+ :where(navigation-split-view:has(> [is=sidebar-view]) > content-view > content-view ~ scroll-view) {
5475
5477
  z-index: -1;
5476
5478
  }
5477
5479
  }
5478
5480
  @media (max-width: 63.9999rem) {
5479
- :where(navigation-split-view:has(> [is=sidebar-view]):not([preferred-compact-column=content]) > body-view > body-view ~ scroll-view) {
5481
+ :where(navigation-split-view:has(> [is=sidebar-view]):not([preferred-compact-column=content]) > content-view > content-view ~ scroll-view) {
5480
5482
  z-index: -1;
5481
5483
  }
5482
5484
  }
5483
5485
  @media (min-width: 43rem) {
5484
- :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > body-view > body-view ~ scroll-view) {
5486
+ :where(navigation-split-view:has(> [is=sidebar-view])[column-visibility=double-column] > content-view > content-view ~ scroll-view) {
5485
5487
  z-index: -1;
5486
5488
  }
5487
5489
  }
@@ -5505,7 +5507,7 @@
5505
5507
  :where(navigation-split-view > scroll-view) {
5506
5508
  border-right: solid 1px var(--separator);
5507
5509
  }
5508
- :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) {
5510
+ :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) {
5509
5511
  margin-inline-start: var(--nav-split-view--content-inline-size);
5510
5512
  }
5511
5513
  :where(navigation-split-view:has(> [is=sidebar-view]) > [is=sidebar-view]) {
@@ -5526,7 +5528,7 @@
5526
5528
  backdrop-filter: var(--liquid-glass-backdrop-filter);
5527
5529
  --scroll-view-box-shadow: var(--liquid-glass-box-shadow);
5528
5530
  }
5529
- :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) {
5531
+ :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) {
5530
5532
  margin-inline-start: 0px;
5531
5533
  --safe-area-inset-left: calc(var(--nav-split-view-sidebar-inline-size) + max(env(safe-area-inset-left), var(--sidebar-inline-spacing)));
5532
5534
  --safe-area-inset-top: max(env(safe-area-inset-top), var(--sidebar-block-spacing));
@@ -5539,78 +5541,78 @@
5539
5541
  navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > [is=sidebar-view]) {
5540
5542
  margin-inline-start: calc(var(--nav-split-view-sidebar-inline-size) * -1);
5541
5543
  }
5542
- :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) {
5544
+ :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) {
5543
5545
  margin-inline-start: var(--nav-split-view--content-inline-size);
5544
5546
  --safe-area-inset-left: 0px;
5545
5547
  }
5546
- :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view) {
5548
+ :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view) {
5547
5549
  border-right: solid 1px var(--separator);
5548
5550
  }
5549
- :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,
5550
- 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) {
5551
+ :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,
5552
+ 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) {
5551
5553
  --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-onscreen-scale));
5552
5554
  --toolbar-cell-filter: none;
5553
5555
  --toolbar-cell-opacity: 1;
5554
5556
  }
5555
- :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) {
5557
+ :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) {
5556
5558
  inline-size: var(--nav-split-view--content-inline-size);
5557
5559
  margin-inline-start: 0px;
5558
5560
  --safe-area-inset-left: env(safe-area-inset-left);
5559
5561
  --safe-area-inset-right: 0px;
5560
5562
  }
5561
- :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)) {
5563
+ :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)) {
5562
5564
  --navbar-safe-area-inset-left: calc(var(--sidebar-toggle-padding-inline-start, 0px) - env(safe-area-inset-left));
5563
5565
  }
5564
- :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) {
5566
+ :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) {
5565
5567
  --safe-area-inset-left: max(env(safe-area-inset-left), var(--sidebar-inline-spacing));
5566
5568
  }
5567
- :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) {
5569
+ :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) {
5568
5570
  --safe-area-inset-left: var(--sidebar-toggle-padding-inline-start, 0px);
5569
5571
  }
5570
5572
  }
5571
5573
  @media (min-width: 43rem) and (min-width: 64rem) {
5572
- :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view ~ tool-bar > tool-bar-item,
5573
- navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view ~ tool-bar > tool-bar-item-group) {
5574
+ :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view ~ tool-bar > tool-bar-item,
5575
+ navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view ~ tool-bar > tool-bar-item-group) {
5574
5576
  --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-onscreen-scale));
5575
5577
  --toolbar-cell-filter: none;
5576
5578
  --toolbar-cell-opacity: 1;
5577
5579
  }
5578
- :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) {
5580
+ :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) {
5579
5581
  inline-size: calc(var(--nav-split-view--content-inline-size) + var(--nav-split-view-sidebar-inline-size));
5580
5582
  --safe-area-inset-right: 0px;
5581
5583
  }
5582
- :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view) {
5584
+ :where(navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view) {
5583
5585
  border-right: solid 1px var(--separator);
5584
5586
  }
5585
- :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) {
5587
+ :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) {
5586
5588
  --safe-area-inset-left: 0px;
5587
5589
  margin-inline-start: calc(var(--nav-split-view-sidebar-inline-size) + var(--nav-split-view--content-inline-size));
5588
5590
  }
5589
5591
  }
5590
5592
  }
5591
- @layer sw-final {
5593
+ @layer sw.sw-final {
5592
5594
  @media (min-width: 43rem) {
5593
5595
  navigation-split-view > scroll-view,
5594
5596
  navigation-split-view > [is=sidebar-view] > scroll-view {
5595
5597
  --scroll-view-translate: translateX(var(--view-transition-principal-x));
5596
5598
  }
5597
- 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 {
5599
+ 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 {
5598
5600
  transition-duration: 0ms;
5599
5601
  }
5600
5602
  }
5601
5603
  @media (min-width: 43rem) and (max-width: 63.9999rem) {
5602
- navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > body-view > scroll-view {
5604
+ navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column])[preferred-compact-column=content] > content-view > scroll-view {
5603
5605
  --scroll-view-translate: translateX(var(--view-transition-principal-x));
5604
5606
  }
5605
- 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 {
5607
+ 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 {
5606
5608
  transition-duration: 0ms;
5607
5609
  }
5608
5610
  }
5609
5611
  @media (min-width: 43rem) and (min-width: 64rem) {
5610
- navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > body-view > scroll-view {
5612
+ navigation-split-view:has(> [is=sidebar-view]):not([column-visibility=double-column]) > content-view > scroll-view {
5611
5613
  --scroll-view-translate: translateX(var(--view-transition-principal-x));
5612
5614
  }
5613
- 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 {
5615
+ 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 {
5614
5616
  transition-duration: 0ms;
5615
5617
  }
5616
5618
  }
@@ -5620,7 +5622,7 @@
5620
5622
  inherits: false;
5621
5623
  initial-value: 0;
5622
5624
  }
5623
- @layer sw-tab-components {
5625
+ @layer sw.sw-tab-components {
5624
5626
  :where(tab-view) {
5625
5627
  grid-template-columns: subgrid;
5626
5628
  grid-template-rows: subgrid;
@@ -5667,7 +5669,7 @@
5667
5669
  --adaptable-tab-bar-placement: bottom-bar;
5668
5670
  --adaptable-tab-bar-placement-index: 0;
5669
5671
  }
5670
- :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) {
5672
+ :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) {
5671
5673
  --safe-area-inset-bottom: max(env(safe-area-inset-bottom), var(--sidebar-block-spacing));
5672
5674
  }
5673
5675
  }
@@ -5677,7 +5679,7 @@
5677
5679
  }
5678
5680
  }
5679
5681
  @media (pointer: coarse) {
5680
- :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]))) {
5682
+ :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]))) {
5681
5683
  --safe-area-inset-bottom: calc(max(env(safe-area-inset-bottom), var(--sidebar-block-spacing)) + var(--iphone-tabbar-block-size));
5682
5684
  }
5683
5685
  }
@@ -5687,7 +5689,7 @@
5687
5689
  }
5688
5690
  }
5689
5691
  @media (orientation: landscape) {
5690
- :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) {
5692
+ :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) {
5691
5693
  --safe-area-inset-top: max(env(safe-area-inset-top), var(--sidebar-block-spacing));
5692
5694
  --safe-area-inset-bottom: max(env(safe-area-inset-bottom), var(--sidebar-block-spacing));
5693
5695
  }
@@ -5703,7 +5705,7 @@
5703
5705
  --adaptable-tab-bar-placement: bottom-bar;
5704
5706
  --adaptable-tab-bar-placement-index: 0;
5705
5707
  }
5706
- :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) {
5708
+ :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) {
5707
5709
  --safe-area-inset-bottom: max(env(safe-area-inset-bottom), var(--sidebar-block-spacing));
5708
5710
  }
5709
5711
  }
@@ -5713,7 +5715,7 @@
5713
5715
  }
5714
5716
  }
5715
5717
  @media (max-width: 42.9999rem) and (orientation: portrait) {
5716
- :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]))) {
5718
+ :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]))) {
5717
5719
  --safe-area-inset-bottom: calc(max(env(safe-area-inset-bottom), var(--sidebar-block-spacing)) + var(--iphone-tabbar-block-size));
5718
5720
  }
5719
5721
  }
@@ -5763,55 +5765,55 @@
5763
5765
  }
5764
5766
  }
5765
5767
  @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) {
5766
- :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)) {
5768
+ :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)) {
5767
5769
  --navbar-safe-area-inset-left: revert;
5768
5770
  }
5769
- :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) {
5771
+ :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) {
5770
5772
  --safe-area-inset-left: revert;
5771
5773
  }
5772
- :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) {
5774
+ :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) {
5773
5775
  --safe-area-inset-left: revert;
5774
5776
  }
5775
- :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)) {
5777
+ :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)) {
5776
5778
  --navbar-safe-area-inset-left: revert;
5777
5779
  }
5778
- :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) {
5780
+ :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) {
5779
5781
  --safe-area-inset-left: revert;
5780
5782
  }
5781
- :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) {
5783
+ :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) {
5782
5784
  --safe-area-inset-left: revert;
5783
5785
  }
5784
5786
  }
5785
5787
  @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) and (max-width: 63.9999rem) {
5786
- :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)) {
5788
+ :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)) {
5787
5789
  --navbar-safe-area-inset-left: revert;
5788
5790
  }
5789
- :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) {
5791
+ :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) {
5790
5792
  --safe-area-inset-left: revert;
5791
5793
  }
5792
- :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) {
5794
+ :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) {
5793
5795
  --safe-area-inset-left: revert;
5794
5796
  }
5795
5797
  }
5796
5798
  @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) and (min-width: 64rem) {
5797
- :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)) {
5799
+ :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)) {
5798
5800
  --navbar-safe-area-inset-left: revert;
5799
5801
  }
5800
- :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) {
5802
+ :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) {
5801
5803
  --safe-area-inset-left: revert;
5802
5804
  }
5803
- :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) {
5805
+ :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) {
5804
5806
  --safe-area-inset-left: revert;
5805
5807
  }
5806
5808
  }
5807
5809
  @media (max-width: 67.9999rem) and (orientation: landscape) and (min-width: 43rem) {
5808
- :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)) {
5810
+ :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)) {
5809
5811
  --navbar-safe-area-inset-left: revert;
5810
5812
  }
5811
- :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) {
5813
+ :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) {
5812
5814
  --safe-area-inset-left: revert;
5813
5815
  }
5814
- :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) {
5816
+ :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) {
5815
5817
  --safe-area-inset-left: revert;
5816
5818
  }
5817
5819
  }
@@ -5823,22 +5825,22 @@
5823
5825
  tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) {
5824
5826
  --nav-split-view--content-inline-size: calc(var(--nav-split-view-content-inline-size) + var(--sidebar-inline-size, 0px));
5825
5827
  }
5826
- tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > body-view {
5828
+ tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view:not(:has(> [is=sidebar-view])) > content-view {
5827
5829
  --sidebar-inline-size: 0px;
5828
5830
  --sidebar-inline-spacing: 0px;
5829
5831
  }
5830
- :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) {
5832
+ :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) {
5831
5833
  --safe-area-inset-left: calc(max(env(safe-area-inset-left), var(--sidebar-inline-spacing)) + var(--sidebar-inline-size));
5832
5834
  }
5833
5835
  }
5834
5836
  }
5835
- @layer sw-final {
5837
+ @layer sw.sw-final {
5836
5838
  @media (pointer: fine) {
5837
5839
  :where(tab-view[tab-view-style=tab-bar-only]) {
5838
5840
  --adaptable-tab-bar-placement: top-bar;
5839
5841
  --adaptable-tab-bar-placement-index: 1;
5840
5842
  }
5841
- :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) {
5843
+ :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) {
5842
5844
  --safe-area-inset-top: calc(max(env(safe-area-inset-top), var(--sidebar-block-spacing)) + var(--ipad-tabbar-block-size));
5843
5845
  }
5844
5846
  :where(tab-view[tab-view-style=tab-bar-only] navigation-split-view > [is=sidebar-view]) {
@@ -5850,7 +5852,7 @@
5850
5852
  --adaptable-tab-bar-placement: top-bar;
5851
5853
  --adaptable-tab-bar-placement-index: 1;
5852
5854
  }
5853
- :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) {
5855
+ :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) {
5854
5856
  --safe-area-inset-top: calc(max(env(safe-area-inset-top), var(--sidebar-block-spacing)) + var(--ipad-tabbar-block-size));
5855
5857
  }
5856
5858
  :where(tab-view:not([tab-view-style=tab-bar-only]) navigation-split-view > [is=sidebar-view]) {
@@ -5858,7 +5860,7 @@
5858
5860
  }
5859
5861
  }
5860
5862
  }
5861
- @layer sw-tab-components {
5863
+ @layer sw.sw-tab-components {
5862
5864
  :where([is=tab-bar]) {
5863
5865
  inset-inline: 0px;
5864
5866
  inset-block: 0px;
@@ -6104,7 +6106,7 @@
6104
6106
  }
6105
6107
  }
6106
6108
  }
6107
- @layer sw-tab-components {
6109
+ @layer sw.sw-tab-components {
6108
6110
  :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) {
6109
6111
  anchor-name: --tab-view-sidebar-selection;
6110
6112
  }
@@ -6112,7 +6114,7 @@
6112
6114
  anchor-name: --tab-view-tabbar-selection;
6113
6115
  }
6114
6116
  }
6115
- @layer sw-utils {
6117
+ @layer sw.sw-utils {
6116
6118
  :where([background-style=initial]) {
6117
6119
  --background: initial;
6118
6120
  --secondaryBackground: initial;
@@ -6267,7 +6269,7 @@
6267
6269
  --accentColor5: var(--purple5);
6268
6270
  }
6269
6271
  }
6270
- @layer sw-utils {
6272
+ @layer sw.sw-utils {
6271
6273
  :where([frame\:width=infinity]) {
6272
6274
  inline-size: 100%;
6273
6275
  }
@@ -7566,7 +7568,7 @@
7566
7568
  }
7567
7569
  }
7568
7570
  }
7569
- @layer sw-components {
7571
+ @layer sw.sw-components {
7570
7572
  :where(v-stack[readable]) {
7571
7573
  inline-size: 100%;
7572
7574
  justify-self: center;
@@ -8178,7 +8180,7 @@
8178
8180
  max-inline-size: 100cqi;
8179
8181
  }
8180
8182
  }
8181
- @layer sw-utils {
8183
+ @layer sw.sw-utils {
8182
8184
  h-stack[distribution=leading],
8183
8185
  v-flex-stack[distribution=leading] {
8184
8186
  justify-items: start ;
@@ -8683,13 +8685,13 @@
8683
8685
  padding-inline: 1rem;
8684
8686
  }
8685
8687
  }
8686
- @layer sw-components {
8688
+ @layer sw.sw-components {
8687
8689
  :where(v-stack[readable]) {
8688
8690
  place-items: start stretch ;
8689
8691
  place-content: start stretch ;
8690
8692
  }
8691
8693
  }
8692
- @layer sw-utils {
8694
+ @layer sw.sw-utils {
8693
8695
  :where([padding-horizontal="0"]) {
8694
8696
  padding-inline: 0rem;
8695
8697
  }
@@ -9303,7 +9305,7 @@
9303
9305
  margin-block: 5rem;
9304
9306
  }
9305
9307
  }
9306
- @layer sw-utils {
9308
+ @layer sw.sw-utils {
9307
9309
  :where(list-view[background=system-background],
9308
9310
  [is=form-view][background=system-background]) {
9309
9311
  --list--host-background-color: var(--background);
@@ -9347,7 +9349,7 @@
9347
9349
  --list--item-background-color: var(--quaintaryGroupedBackground);
9348
9350
  }
9349
9351
  }
9350
- @layer sw-transitions {
9352
+ @layer sw.sw-transitions {
9351
9353
  @media (prefers-reduced-motion: no-preference) {
9352
9354
  scroll-view.fwd, scroll-view.fwdd, scroll-view.bwd, scroll-view.bwdd {
9353
9355
  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;
@@ -9378,7 +9380,7 @@
9378
9380
  }
9379
9381
  }
9380
9382
  }
9381
- @layer sw-transitions {
9383
+ @layer sw.sw-transitions {
9382
9384
  scroll-view.fwd {
9383
9385
  pointer-events: none;
9384
9386
  }
@@ -9395,12 +9397,12 @@
9395
9397
  --scroll-view-translate: translateX(var(--view-transition-leading-x));
9396
9398
  }
9397
9399
  }
9398
- @layer sw-transitions {
9400
+ @layer sw.sw-transitions {
9399
9401
  scroll-view.bwd {
9400
9402
  --scroll-view-translate: translateX(var(--view-transition-trailing-x));
9401
9403
  --scroll-view-box-shadow: var(--screen-box-shadow);
9402
9404
  }
9403
- scroll-view.bwdd ~ body-view,
9405
+ scroll-view.bwdd ~ content-view,
9404
9406
  scroll-view.bwdd ~ navigation-stack,
9405
9407
  scroll-view.bwdd ~ navigation-split-view {
9406
9408
  pointer-events: none;
@@ -9411,11 +9413,11 @@
9411
9413
  scroll-view.bwdd.bwd {
9412
9414
  --scroll-view-translate: translateX(var(--view-transition-trailing-x));
9413
9415
  }
9414
- navigation-split-view > body-view:has(~ .bwdd) {
9416
+ navigation-split-view > content-view:has(~ .bwdd) {
9415
9417
  pointer-events: none;
9416
9418
  }
9417
9419
  }
9418
- @layer sw-transitions {
9420
+ @layer sw.sw-transitions {
9419
9421
  tool-bar-item.fwnn,
9420
9422
  tool-bar-item-group.fwnn {
9421
9423
  --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-onscreen-scale));
@@ -9437,7 +9439,7 @@
9437
9439
  --toolbar-cell-opacity: 0;
9438
9440
  }
9439
9441
  }
9440
- @layer sw-transitions {
9442
+ @layer sw.sw-transitions {
9441
9443
  tool-bar-item.bwn,
9442
9444
  tool-bar-item-group.bwn {
9443
9445
  --toolbar-cell-scale: scale(var(--view-transition-toolbar-cell-offscreen-scale));
@@ -9457,7 +9459,7 @@
9457
9459
  --toolbar-cell-opacity: 0;
9458
9460
  }
9459
9461
  }
9460
- @layer sw-transitions {
9462
+ @layer sw.sw-transitions {
9461
9463
  [is=sheet-view]:not([open]) {
9462
9464
  z-index: var(--top-layer-polyfill-z-index);
9463
9465
  }
@@ -9483,7 +9485,7 @@
9483
9485
  }
9484
9486
  }
9485
9487
  }
9486
- @layer sw-transitions {
9488
+ @layer sw.sw-transitions {
9487
9489
  @media (prefers-reduced-motion: no-preference) {
9488
9490
  :where(fine-tooltip) {
9489
9491
  transition: opacity 150ms allow-discrete ease-out, transform 150ms allow-discrete ease-out;
@@ -9496,7 +9498,7 @@
9496
9498
  }
9497
9499
  }
9498
9500
  }
9499
- @layer sw-transitions {
9501
+ @layer sw.sw-transitions {
9500
9502
  @media (prefers-reduced-motion: no-preference) {
9501
9503
  :where(menu-view)::part(menu-summary) {
9502
9504
  transition: transform var(--touchglass-transition-duration) allow-discrete ease-out, filter var(--touchglass-transition-duration) allow-discrete ease-out;
@@ -9507,7 +9509,7 @@
9507
9509
  }
9508
9510
  }
9509
9511
  }
9510
- @layer sw-transitions {
9512
+ @layer sw.sw-transitions {
9511
9513
  @keyframes progressViewCircular {
9512
9514
  0% {
9513
9515
  opacity: 0.85;
@@ -9520,21 +9522,21 @@
9520
9522
  }
9521
9523
  }
9522
9524
  }
9523
- @layer sw-transitions {
9525
+ @layer sw.sw-transitions {
9524
9526
  @media (prefers-reduced-motion: no-preference) {
9525
9527
  :where([is=glass-button]) {
9526
9528
  transition: all var(--touchglass-transition-duration) allow-discrete ease-out;
9527
9529
  }
9528
9530
  }
9529
9531
  }
9530
- @layer sw-transitions {
9532
+ @layer sw.sw-transitions {
9531
9533
  @media (prefers-reduced-motion: no-preference) {
9532
9534
  :where([is=glass-prominent-button]) {
9533
9535
  transition: all var(--touchglass-transition-duration) allow-discrete ease-out;
9534
9536
  }
9535
9537
  }
9536
9538
  }
9537
- @layer sw-transitions {
9539
+ @layer sw.sw-transitions {
9538
9540
  @media (prefers-reduced-motion: no-preference) {
9539
9541
  :where([is=confirmation-dialog]) {
9540
9542
  transition: all var(--touchglass-transition-duration) allow-discrete ease-out;
@@ -9545,7 +9547,7 @@
9545
9547
  }
9546
9548
  }
9547
9549
  }
9548
- @layer sw-transitions {
9550
+ @layer sw.sw-transitions {
9549
9551
  @media (prefers-reduced-motion: no-preference) {
9550
9552
  :where([is=alert-dialog]) {
9551
9553
  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;
@@ -9553,8 +9555,8 @@
9553
9555
  }
9554
9556
  }
9555
9557
  }
9556
- @layer sw-transitions {}
9557
- @layer sw-transitions {
9558
+ @layer sw.sw-transitions {}
9559
+ @layer sw.sw-transitions {
9558
9560
  @media (prefers-reduced-motion: no-preference) {
9559
9561
  :where([is=disclosure-group])::details-content {
9560
9562
  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);
@@ -9572,7 +9574,7 @@
9572
9574
  }
9573
9575
  }
9574
9576
  }
9575
- @layer sw-transitions {
9577
+ @layer sw.sw-transitions {
9576
9578
  @media (prefers-reduced-motion: no-preference) and (min-width: 43rem) {
9577
9579
  :where(navigation-split-view:has(> [is=sidebar-view]) [is=sidebar-view]) {
9578
9580
  transition: filter var(--touchglass-transition-duration) ease-out allow-discrete, transform var(--touchglass-transition-duration) ease-out allow-discrete;
@@ -9592,7 +9594,7 @@
9592
9594
  }
9593
9595
  }
9594
9596
  }
9595
- @layer sw-transitions {
9597
+ @layer sw.sw-transitions {
9596
9598
  @media (prefers-reduced-motion: no-preference) {
9597
9599
  :where([is=tab-bar] > [is=form-view]) {
9598
9600
  transition: transform var(--sidebar-transition-duration) ease-out allow-discrete;
@@ -10680,7 +10682,7 @@
10680
10682
  initial-value: oklch(0% 0 0deg / 0);
10681
10683
  inherits: true;
10682
10684
  }
10683
- @layer sw-colors {
10685
+ @layer sw.sw-colors {
10684
10686
  :root {
10685
10687
  --face: var(--background);
10686
10688
  --text: var(--primary);
@@ -10701,7 +10703,7 @@
10701
10703
  [is=alert-dialog]:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
10702
10704
  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
10703
10705
  > scroll-view table-view[table-style=inset]:not([slot], [background])),
10704
- body-view:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
10706
+ content-view:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
10705
10707
  > scroll-view [is=form-view][form-style=inset-grouped]:not([slot], [background]),
10706
10708
  > scroll-view table-view[table-style=inset]:not([slot], [background])),
10707
10709
  navigation-split-view:has(> scroll-view list-view[list-style=inset-grouped]:not([slot], [background]),
@@ -10893,7 +10895,7 @@
10893
10895
  }
10894
10896
  } */
10895
10897
  }
10896
- @layer sw-final {
10898
+ @layer sw.sw-final {
10897
10899
  :where(toggle-view[touch-glass])::part(toggle-track) {
10898
10900
  --toggle--dot-scale: 1.22;
10899
10901
  --toggle--dot-press-duration: 100ms;