@gjsify/adwaita-web 0.56.0 → 0.57.0

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 (69) hide show
  1. package/dist/adwaita-web.css +8 -2
  2. package/dist/adwaita-web.css.map +1 -1
  3. package/lib/types/application.d.ts +24 -0
  4. package/lib/types/application.spec.d.ts +1 -0
  5. package/lib/types/elements/adw-application-window.d.ts +2 -0
  6. package/lib/types/elements/adw-view-stack.d.ts +3 -0
  7. package/lib/types/elements/checks.d.ts +6 -0
  8. package/lib/types/elements/gtk-application-window.d.ts +2 -0
  9. package/lib/types/elements/gtk-drop-down.d.ts +3 -0
  10. package/lib/types/elements/gtk-entry.d.ts +10 -0
  11. package/lib/types/elements/gtk-menu-button.d.ts +2 -0
  12. package/lib/types/elements/gtk-scrolled-window.d.ts +16 -0
  13. package/lib/types/elements/gtk-stack.d.ts +3 -0
  14. package/lib/types/elements/gtk-switch.d.ts +3 -0
  15. package/lib/types/glib.spec.d.ts +1 -0
  16. package/lib/types/gobject-door.d.ts +4 -0
  17. package/lib/types/gobject-door.spec.d.ts +1 -0
  18. package/lib/types/gobject-elements.d.ts +17 -0
  19. package/lib/types/gtksource/gtk-source-view.d.ts +77 -0
  20. package/lib/types/gtksource/gtk-source-view.spec.d.ts +2 -0
  21. package/lib/types/gtksource/web-editor-driver.d.ts +44 -0
  22. package/lib/types/index.d.ts +3 -0
  23. package/lib/types/menu-actions.spec.d.ts +1 -0
  24. package/lib/types/namespace/adw.d.ts +1 -0
  25. package/lib/types/namespace/gio.d.ts +2 -0
  26. package/lib/types/namespace/glib.d.ts +10 -0
  27. package/lib/types/namespace/gobject.d.ts +27 -0
  28. package/lib/types/namespace/gtk-enums.d.ts +22 -0
  29. package/lib/types/namespace/gtk.d.ts +2 -0
  30. package/lib/types/namespace/gtksource.d.ts +2 -0
  31. package/lib/types/shared-tree-builder.d.ts +20 -1
  32. package/lib/types/styles.generated.d.ts +1 -1
  33. package/package.json +11 -9
  34. package/scss/_reset.scss +1 -1
  35. package/src/application.spec.ts +75 -0
  36. package/src/application.ts +92 -0
  37. package/src/construct-vectors.spec.ts +155 -0
  38. package/src/elements/adw-application-window.ts +5 -0
  39. package/src/elements/adw-split-button.ts +5 -1
  40. package/src/elements/adw-view-stack.ts +14 -0
  41. package/src/elements/checks.ts +25 -1
  42. package/src/elements/gtk-application-window.ts +5 -0
  43. package/src/elements/gtk-drop-down.ts +16 -0
  44. package/src/elements/gtk-entry.ts +45 -7
  45. package/src/elements/gtk-menu-button.ts +12 -1
  46. package/src/elements/gtk-popover-menu.ts +7 -2
  47. package/src/elements/gtk-scrolled-window.ts +58 -0
  48. package/src/elements/gtk-stack.ts +8 -0
  49. package/src/elements/gtk-switch.ts +8 -0
  50. package/src/glib.spec.ts +34 -0
  51. package/src/gobject-door.spec.ts +119 -0
  52. package/src/gobject-door.ts +137 -0
  53. package/src/gobject-elements.ts +172 -0
  54. package/src/gtksource/gtk-source-view.spec.ts +69 -0
  55. package/src/gtksource/gtk-source-view.ts +379 -0
  56. package/src/gtksource/web-editor-driver.ts +260 -0
  57. package/src/index.ts +10 -0
  58. package/src/menu-actions.spec.ts +47 -0
  59. package/src/namespace/adw.ts +1 -0
  60. package/src/namespace/gio.ts +2 -0
  61. package/src/namespace/glib.ts +22 -0
  62. package/src/namespace/gobject.ts +37 -0
  63. package/src/namespace/gtk-enums.ts +15 -0
  64. package/src/namespace/gtk.ts +2 -0
  65. package/src/namespace/gtksource.ts +9 -0
  66. package/src/shared-tree-builder.ts +142 -7
  67. package/src/split-button.spec.ts +2 -0
  68. package/src/styles.generated.ts +1 -1
  69. package/src/test.browser.mts +10 -0
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_icons.generated.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_variables.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_theme.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_root.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_reset.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_icon.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_labels.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_frame.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_aspect_frame.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_center_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_grid.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_fixed.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_style_classes.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_window.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_application_window.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_headerbar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_action_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_window_title.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_link.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scale_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_color_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_font_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_button_content.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_popover.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_popover_menu_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_popover_bin.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_split_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_menu_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_drop_down.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_toggle_group.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_switch.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_entry.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_search_entry.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_password_entry.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_separator.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_text.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_search_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_drawing.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_drag_icon.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_overlay.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_revealer.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_paned.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_expander.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_checks.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_spin_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scale.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_progress_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_level_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_list_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_grid_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_column_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tree_expander.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_picture.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_inscription.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_video.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_media_controls.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_list_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_flow_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_calendar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_preferences.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_preferences_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_card.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_data_grid.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_bin.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_clamp.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_stack.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_clamp_scrollable.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_spinner.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_shortcut_label.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_avatar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_banner.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_status_page.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_action_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_entry_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_switch_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_combo_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_spin_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_button_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_expander_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_password_entry_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_toast.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_toolbar_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scrollbar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_viewport.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scrolled_window.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_window_handle.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scrolling.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_wrap_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_panes.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_overlay_split_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_navigation_split_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_carousel.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_switcher.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_inline_view_switcher.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_stack.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_switcher_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_overview.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_switcher_sidebar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_navigation_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_bottom_sheet.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_sidebar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_gtk_about_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_emoji_chooser.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_print_dialogs.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_about_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_alert_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_preferences_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_shortcuts_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_widget.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/adwaita-skin.scss"],"names":[],"mappings":";AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;ACxNF;EAxNE;EACA;EAGA;EACA;EAGA;EACA;EACA;EAKA;EAOA;EAMA;EACA;EACA;EACA;EACA;EAMA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAIA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EASA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EAgCA;EACA;EACA;EACA;EACA;EAaA;EACA;EACA;EA8CA;EACA;EACA;EACA;;;AAaF;EACE;IACE;IACA;IACA;;;AClKJ;EACE;IA/DA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAKA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAUA;;;AAkBF;EA5EE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAUA;;;AAyBF;EDrFE;EACA;EAGA;EACA;EAGA;EACA;EACA;EAKA;EAOA;EAMA;EACA;EACA;EACA;EACA;EAMA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAIA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EASA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EAgCA;EACA;EACA;EACA;EACA;EAaA;EACA;EACA;EA8CA;EACA;EACA;EACA;;;AE3MF;EACE;EACA;EACA;EACA;EACA;;;ACqCF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAcF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOA;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;ACnFJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAQA;;AAKA;EACE;;;AA+BJ;EACE;EACA;;;AAcF;EACE;;;ACzBF;EACE;EACA;EACA;EACA;EAEA;;AAEA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AASF;EACE;EAGA;;AAWF;EACE;;AAGF;EACE;;AAiBF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AASJ;EACE;;;AAIF;EACE;;;AAOA;EACE;EAEA;EACA;EACA;;;AALF;EACE;EAEA;EACA;EACA;;;AALF;EACE;EAEA;EACA;EACA;;;AAIJ;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAIF;EACE;;;AAIF;EACE;EACA;;;AAIF;EACE;EACA;;;AAIF;EACE;EACA;EACA;;;AAIF;EACE;EACA;EACA;;;AAIF;EACE;EACA;;;AAIF;EACE;;;ACzOF;EACE;EACA;EACA;;;AAGF;EACE;;;ACAF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;;AAIF;EACE;;;ACrBJ;EACE;EAIA;EACA;;;ACLF;EACE;EACA;EAGA;;;ACRF;EACE;EACA;;;ACCF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;;ACQJ;AAAA;AAAA;AAKA;EACE;EACA;;;AAOF;EACE;EACA;;AAEA;EAEE;EACA;;AAGF;EACE;EACA;;;AAMJ;EACE;;;AAGF;AAAA;AAAA;AAOA;AAAA;EACE;EACA;EACA;EACA,YACE;;AAIF;EATF;AAAA;IAUI,YACE;;;;AAcJ;EACE,YACE;;AAGF;EACE;;AAMF;EACE;;AASJ;EAEE;EACA;EACA;;AAEA;EANF;IAOI;;;;AAKN;AAAA;AAAA;AASA;EAGE;EACA;EAKA;;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAEA;EAGE;EAGA;;;AAIJ;AAAA;AAAA;AAeA;EACE;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EAIE;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;AASF;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;;AAON;EACE;EACA;;;AAMJ;EACE;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;;AAIJ;AAAA;AAAA;AAUA;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAkBA;AAAA;EAEE;;AAII;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;AATF;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;AAKN;AAAA;EACE;;AAII;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;AATF;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;;AAOV;AAAA;AAAA;AAQA;EACE;;;AAIF;EACE;;;AAKF;AAAA;AAAA;AA+BA;EACE;;;AAGF;EACE;;;AAIA;EACE;;AAGF;EACE;;;AAKF;EACE;;AAGF;EACE;;;ACtZJ;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;EACA;EACA;;AAKA;AAAA;AAAA;EAEE;EACA;EACA;;;AAMJ;EACE;EACA;EACA;EACA;EACA;;;AAMF;EACE;EACA;;;AAkBF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;;AAIA;AAAA;AAAA;EAEE;EACA;EACA;;AAMF;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;AAAA;EACE;;AAIJ;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;AAAA;EACE;EACA;EACA;EACA;EACA;;;AC3IJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;;AAEA;EACE;;;ACFJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;;AAEA;EAgBE;EACA;EAIA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EAGA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;AAiBN;AAAA;AAAA;EAGE,kBACE;;;AAQJ;AAAA;AAAA;AAmBA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EAGA;;AAEA;EACE;EACA;EACA;EACA;EAEA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIJ;AAAA;AAAA;AASA;EACE;EACA;EAEA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA,YACE;;AAGF;EATF;IAUI;;;AAIJ;EACE;;AAGF;EACE;;AAIF;EACE;;;ACpPN;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;AAAA;EAEI;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;;AC3CR;EACE;EACA;EACA;EACA;EACA;EACA;;AAKA;AAAA;EAEE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AChCJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAKJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AASJ;EACE;EACA;EACA;EAEA;EACA;;AAEA;EACE;;AAGF;EACE;;AAQJ;EACE;EACA;;AAIF;EACE;EACA;;AAIF;EACE;EACA;EACA;;AAQF;EACE;EACA;EACA;;AAOF;EACE;;AAEA;EACE;;AAGF;EACE;;AAUJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AASJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;;AC1LN;AAAA;EAEE,OANW;EAOX;EACA;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE,OAfS;;AAkBX;AAAA;EACE;;AAGF;AAAA;EACE,OAtBiB;;AA0BnB;AAAA;EACE,OA1Ba;;AA4Bb;AAAA;AAAA;EAEE;;AAGF;AAAA;EACE,OAlCW;;AAyCf;AAAA;AAAA;AAAA;AAAA;AAAA;EAKE;;;ACpDJ;AAWA;EACE;EACA;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAKA;EACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA,kBAnDW;EAoDX;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBA5DW;EA6DX;;AAGF;EACE;EACA;EACA,kBArEW;EAsEX;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA,kBAlFW;EAmFX;;AAGF;EAEE,kBAzFiB;;AA4FnB;EAEE,kBA9FiB;;AAiGnB;EACE;;AAOF;EACE;EACA;EACA;EACA,QAnHS;EAoHT;;AAEA;EACE;EACA,QAxHO;;AA2HT;EACE;;AAGF;EACE;EACA,QAjIO;;AAqIX;EACE;EACA,OAvIS;EAwIT;;;ACvIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE,kBACE;EAIF,qBACE;EAIF;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC3CF;EACE;EACA;;;AAGF;EACE;EACA;;;AAKF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAOA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AC9BJ;EACE;EACA;;;AAKF;EACE;EACA;;;AAGF;EACE;EACA;EAEA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAGE;EACA;EACA;;AAMA;EACE;;AAGF;EACE;EACA;EACA;EACA;;;ACrCN;EAIE;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAIA,YACE;;AAOF;EA3BF;IA4BI,YACE;;;AAYJ;EAEE;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAOA;EACE;;AAGF;EACE;;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EAGE;;AAGF;EACE;;AAIF;EACE;IAIE;;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;;AAWJ;EACE;EACA;EACA;;;AAeF;EACE;EACA;EACA;;;AAMF;EACE;;;AAOF;EACE;EACA;EACA;EACA;;;AAYF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;EACA;EACA;;;AAKF;EACE;;;ACzPF;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EAGE;;AAGF;EACE;;AAGF;EACE;IAIE;;;AAIJ;EACE;EACA;;AAOJ;EACE;;;ACnEJ;EACE;;;AAOF;EACE;;;AAMF;AAAA;EAEE;;;ACzCF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EAEE;;AAIF;EACE;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EAEE;;AAYJ;EACE;EACA;;AAEA;EACE;;AAGF;AAAA;EAEE;;AAGF;AAAA;EAEE;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;;AAGF;AAAA;EAEE;;AAGF;AAAA;EAEE;;AAKJ;EACE;;AAIF;EACE;EACA;;AAEA;AAAA;EAEE;EACA;;;ACtKN;EACI;EACA;EACA;EACA;;AAGA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKR;EACI;;AAIJ;EACI;;AAIJ;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAUR;EACI;EACA;EACA;;;AC7ER;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAWF;EACE;EACA;EACA;;AAKF;EACE;;AAIF;EACE;EACA;EACA;EACA;;AAMF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACjIJ;EACE;EACA;;;AAGF;EAGE;EAEA;EACA;EACA;EACA;EACA;;AAKA;EACE;;AAGF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAOF;EACE;EACA;;AAEA;EAEE;;AAKJ;EACE;EACA;EACA,YACE;;AAGF;EACE;;AAMF;EACE;;AAMN;EACE;;AAEA;EACE;EACA;EACA;;AAMJ;EACE;EAEA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAKN;EACE;;;ACxHN;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;EACE;;;AASF;EACE;;;AAGF;EACE;EACA;;;AAOF;EACE;;AAEA;EACE;;;AC1FJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAOA;;AAEA;EACE;EACA;;AAGF;EAEE;EACA;;AAIF;EACE;EACA;;AAGF;EArCF;IAsCI;;EAEA;IACE;;;;ACrCN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAbF;IAcI;;;AAMF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAKJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAGF;EACE;;AAGF;EACE;;;ACpEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAbF;IAcI;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;;;AAMJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAGF;EACE;;AAGF;EACE;;;AClEN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAEA;EACE;;AAKF;EACE;EACA;;;ACPN;EACE;EACA;EACA;;AAKA;EACE;EACA;;AAGF;EACE;EACA;EAEA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAGF;EAEE;EACA;;AAGF;EA5BF;IA6BI;;;;AASN;EACE;EACA;EACA;;AAIA;EACE;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;;AAGF;EA7BF;IA8BI;;;AAOJ;EACE;EACA;;;AAOJ;EACE;EACA;EACA;EAGA;;AAEA;EACE;EACA;;AAGF;EAGE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAMJ;EACE;;;AC3JJ;EACE;EAGA;EACA;;AAEA;EACE;;AAGF;EAXF;IAYI;;;AAGF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAbF;IAcI;;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAKJ;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;;;AC/FJ;EACE;EAGA;EACA;EAEA;EACA;;AAKA;EACE;EACA;EACA;;;AAQJ;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAQF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOJ;EACE;EACA;;AAIA;EACE;EACA;EACA;;;AC7DJ;EAGE;EAGA;EAIA;EACA;EACA;EAGA;EAIA;EACA;;AAOA;EACE;EACA;EACA;EACA;;;ACbJ;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAGE;;AAIF;EACE;;;AC7CJ;EACE;EAMA;EACA;EACA;;;AAKF;EACE;;;ACDF;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EAGA;EACA;EAGA;;AAEA;EACE;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;EACA;;;AAKF;EACE;;AAGF;EACE;;AAIA;EACE,YACE;;AAIJ;EACE,YACE;;;AAMR;EACE;;AAEA;EACE,YACE;;;AAON;EACE;;;AAGF;EACE;;;AC7FF;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAIF;EACE;EACA;;AAGF;EACE;;AAGF;EAEE;;AAIJ;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EAIA;EACA;;AAEA;EACE;;AAIF;EACE;EACA;;;AAIJ;EAKE;EACA;;;AC1DF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;AAAA;EACE;EACA;EACA;EACA;EACA;;AAIF;AAAA;EAME;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EAhBF;AAAA;IAoBI;;;AAKF;AAAA;EACE;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;;AAQF;AAAA;EACE;;AAEA;EAHF;AAAA;IAII;;;AAIJ;AAAA;EACE;EACA;;AAEA;EAJF;AAAA;IAKI;;;AAON;AAAA;AAAA;EAEE;EACA;EACA;;AAQA;AAAA;AAAA;EACE;;AAMF;AAAA;AAAA;EACE;;AAKJ;AAAA;EACE;EACA;;AAKF;AAAA;EACE;EACA;;;AAKJ;EACE;;;AAIF;EACE;;;AAIF;EACE;EACA,YAlJY;EAmJZ,oBAnJY;;;AAsJd;EACE;EACA,YAtJa;EAuJb,oBAvJa;;;AA+Jf;AAAA;EAEE;EACA,YAhKW;EAiKX,oBAjKW;;;AAsKb;AAAA;EAEE;;AAEA;AAAA;EACE;EACA;;AAKF;AAAA;EACE;;;ACzMJ;EAKE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAjBF;IAkBI;;;AAIF;EACE;;AAIF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAUJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAhBF;IAiBI;;;AAGF;EACE;;AAGF;EACE;;AAMF;EACE;EACA;;AAKF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;;AAGF;EACE;;AAKN;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAMA;EACE;EACA;;AAGF;EACE;EACA;;;ACrHR;EACE;EACA;EACA;EACA;EACA;;AAmBA;EAEE;EACA;;AAMA;EACE;;AAIJ;EACE;;AAGF;EAEE;EAIA;;AAEA;EACE;;AAIJ;EACE;;AAYA;EACE;;AAQF;EACE;;AAIJ;EAEE;EACA;EACA;EACA;EACA,YACE;;AAGF;EAVF;IAWI;;;AAKJ;EACE;EACA;EACA;EACA;EACA,YACE;;AAMJ;EACE;EACA;EACA;;AAEA;EALF;IAMI;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAEF;;AAOA;EACE;EACA;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;EACA;;AAKF;EACE;EACA;EAGA;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;EACA;;AAQF;EACE;;AAEA;EAHF;IAII;;;AAIJ;EACE;;AAGF;EACE;;AAKJ;EACE;;AAEA;EACE,YACE;;AAeJ;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAOJ;EACE;;AAEA;EACE;EACA;;;AC7PN;EACE;EACA;EACA;EAGA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAVF;IAYI;;;AAIJ;EAEE;EACA;EACA;EACA;EACA,YACE;;AAOJ;EAIE;;AAIF;EACE;;AAKF;EACE;;AAKF;EACE;;AASF;EAEE;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAOJ;EACE;EACA;EACA;EACA;;AAIA;EARF;IASI;IACA;IACA;;;;AASN;EACE;IACE;IACA;;EAGF;IACE;IACA;;EAGF;IACE;IACA;;;AChIJ;EACE;;AAGA;EACE;;AAGF;EAGE;EACA;EACA;EAIA;EACA;;AAGF;EACE;EACA,eAzBc;;AA+BhB;EACE;EACA;;AAEA;EAJF;IAKI;IACA;;;AAQF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAMF;EACE,QAnEU;;AAsEZ;EACE,YAvEU;;AA0EZ;EACE;EACA;EAEA;;AAIF;EACE;EACA;;AAMF;EACE;;AAGF;EACE,WA/FU;;AAkGZ;EACE;EACA;EACA;;AAIF;EACE;EACA;;AASF;EACE;EACA;EACA;EACA;;AAIA;EACE;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;AAMJ;EACE;EACA;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;;AC3IV;EACE;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EAvDA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAuCF;EAIE;EACA;;AAKF;EACE;;AAGF;EACE;;;ACzEJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EAGA;EACA;;AAGF;EDZA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;ACJF;EAIE;EACA;EACA;EACA;EACA;;;ACtBJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAKF;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAMF;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;AAGF;EFzEA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AEyDF;EAIE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AAKF;AAAA;EAEE;;AAIJ;EACE;;;ACvGJ;EACE;EACA;EAEA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EAEA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAGF;EACE;;AAIJ;EACE;;;AChBJ;EACE;EAGA;EAIA;EAMA;;AAEA;EAGE;EACA;;AAOF;EACE;EAKA;EACA;;;ACNJ;EACE;EAMA;EACA;EACA;EACA;EAIA;EAIA;EAEA;EACA;;AAGA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AApCJ;EA0CE;;AAEA;EACE;;AAKF;EACE;;;AC/DJ;EACE;EACA;EACA;;AAIA;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAOJ;EACE;EACA;EACA;EAKA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;;AAMA;EACE;;AAOJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAMF;EACE;;AAOJ;EACE;;;ACvFJ;EACE;EACA;EACA;EAGA;;AAIA;EAEE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAMF;EACE;;AAIF;EACE;EACA;EACA;EACA;;AAKF;AAAA;EAKE;EAGA;EACA;;AAIF;EACE;EACA;EACA;;AAMF;EACE;;AAQF;EACE;EACA;EAIA;;AAGF;EACE;EACA;;;AClHJ;EACE;EACA;EACA;EACA;EACA;EAQA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EAEA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;;AAQJ;EACE;;;AC1DF;EACE;EACA;EACA;EACA;EAIA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;AAIJ;ET1BE;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;ASUJ;EAGE;EACA;EAGA;EACA;EASA;EAIA;EAIA;;;AAGF;EAEE;EAIA;EACA;EAIA;;;AAGF;EACE;;;ACpEF;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EAEA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EAGE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EAEA;;AAEA;EACE;;;AAIJ;EACE;EAGA;EAEA;;;AAGF;AAAA;AAAA;EAIE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAIE;;;AAGF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EAIE;EACA;;AAKF;EACE;EACA;;AAKF;EACE;EACA;EACA;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AAGF;EAGE;EACA;;;ACpKJ;EACE;;AAMA;EACE;;AAKF;EACE;EACA;EACA;EACA;;AAKA;EACE;;AASF;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAMF;EAGE;;;ACpEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAIA;;AAKA;EACE;;AAOA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;;AC1CJ;AAAA;EAIE;EACA;EACA;;;ACAF;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;;AAMF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAgBF;EAGE;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;;AAKJ;EACE;;AAEA;EACE;;AAMJ;EACE;EACA;;AAEA;EACE;EACA;;AAOJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;;ACrIN;EACE;;AAMA;EACE;;;ACVJ;EACE;EACA;;;ACSF;EACI;EACA;EACA;EACA;EACA;;AAOA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAMJ;EAEI;EACA;EACA;EACA;;AAQR;EACI;EACA;EACA;;AAGJ;EACI;EACA;;AAQJ;EACI;EACA;EACA;;;AAeJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,SAkDqB;;EA9C7B;IAEQ,SA4CmC;;;AAvC/C;EACI;IAEQ,SAoCiD;;EAhCzD;IAEQ,SA8B+D;;;AAjE3E;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAyDZ;;EArDI;IAEQ,WAoDZ;;;AA/CA;EACI;IAEQ,WA6CZ;;EAzCI;IAEQ,WAwCZ;;;AA3EA;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAgEZ;;EA5DI;IAEQ,WA2DZ;;;AAtDA;EACI;IAEQ,WAoDZ;;EAhDI;IAEQ,WA+CZ;;;AAlFA;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAuEZ;;EAnEI;IAEQ,WAkEZ;;;AA7DA;EACI;IAEQ,WA2DZ;;EAvDI;IAEQ,WAsDZ;;;AAzFA;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA8EZ;;EA1EI;IAEQ,WAyEZ;;;AApEA;EACI;IAEQ,WAkEZ;;EA9DI;IAEQ,WA6DZ;;;AAtDA;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA0D2B;;EAtDnC;IAEQ,WAoD0D;;;AAnEtE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA2D6B;;EAvDrC;IAEQ,WAqD6D;;;AApEzE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA4D6B;;EAxDrC;IAEQ,WAsD4D;;;AArExE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA6D8B;;EAzDtC;IAEQ,WAuD8D;;;AAtE1E;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAiE4B;;EA7DpC;IAEQ,WA2D2D;;;AA1EvE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAkE8B;;EA9DtC;IAEQ,WA4D8D;;;AA3E1E;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAmE8B;;EA/DtC;IAEQ,WA6D6D;;;AA5EzE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAoE+B;;EAhEvC;IAEQ,WA8D+D;;;AAK/E;EACI;;;AAGJ;EACI;;;AAvFA;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAqFZ;;EAjFI;IAEQ,WAgFZ;;;AA/FA;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA0FZ;;EAtFI;IAEQ,WAqFZ;;;AAWJ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAQJ;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAOR;EACI;;AAGJ;EACI;;AAMJ;EACI;;AAEA;EACI;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;;;AAahB;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EAGA;;AAMJ;EACI;EACA;EACA;EACA;;;AAkCR;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAlBJ;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAlBJ;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAlBJ;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;AAMA;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EAKA;EACA;EACA;EACA;;AAGA;EACI;;AAOR;EACI;EACA;EACA;EACA;EAIA;EACA;EACA;;AAEA;EACI;;AAMR;EAEI;EACA;EACA;EACA;;AAMJ;EAEI;;AAGJ;EACI;EACA;EACA;EAIA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAKA;;AAEA;EACI;EACA;;AAKJ;EAEI;;AAMJ;EACI;;AAKJ;EACI;EACA;;AAMJ;EACI;;AAKR;EAEI;;AAGJ;EACI;;AAMJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAMR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEI;;;AC7rBZ;EACE;EACA;;;ACCF;EAIE;EACA;EACA;EACA;EACA;EACA;EAIA;;AAEA;EACE;EAGA;;;AASJ;EACE;EACA;EACA;EACA;EAGA;EACA;EACA;;AAIA;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAKF;AAAA;EAEE;EACA;EACA;EACA;EACA;;AAIF;EACE;;AAUF;EACE;EACA;;AAOF;EACE;IACE;;;;AAKN;EACE;IACE;;EAGF;IACE;;;ACpGJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAXF;IAYI,YACE;;;AAQN;EACE;EACA;EACA;EAGA;EACA;;AAKF;EACE;;;ACvEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAQF;EACE;EACA;EACA;EACA;;;AClCJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AAGA;EACE;;AAOF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAOF;EACE;EACA;;AAEA;EACE;;;AC/CR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAIF;EACE;;AAMF;EACE;;AAEA;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AC/DN;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACE;;;AAUJ;EACE;;;AAMF;EACE;EACA;EACA;EACA;EACA;;;AASF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAmBF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;;;AClFF;AAAA;AAAA;AAAA;EAQE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;EACA;EACA;EACA;;AAUF;AAAA;AAAA;AAAA;EACE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EACE;EACA;EACA;EACA;EACA;;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;;AAcJ;AAAA;EACE;EACA;;AAGF;AAAA;EACE;EACA;;AAMF;AAAA;EACE;EACA;;AAEA;AAAA;EACE;EACA;;;AC/GN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACtCF;EACE;EACA;;AAMF;EACE;EACA;EACA;EACA;;;AClBJ;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAWA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAUJ;EACE;;AAGF;EACE;;;ACnEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;;AAIJ;EACE;EACA;EAKA;;AAWA;EAGE;EACA;EACA;EACA;EACA;EAGA;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;;ACtGN;EACE;EACA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EAKA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACE;;AAGF;EACE;;AAKJ;EACE;EACA;EACA;;AAGE;EACE;EACA;;AAMF;EACE;EACA;;AAMN;EACE;EACA;EACA;;AAGE;EACE;EACA;;AAMF;EACE;EACA;;;AChGR;EACE;EACA;EACA;;AAEA;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AASJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAOA;AAAA;EAEE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAMJ;EACE;EACA;;AAIF;AAAA;EAEE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAWF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAKF;AAAA;AAAA;AAAA;AAAA;EAKE;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;EACE;;;AC5HR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAKJ;EACE;EACA;;;ACpDJ;EACE;EACA;;AAGA;EACE;EACA;;AAQF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AChJN;EACE;EACA;EACA;EACA;EACA;EAEA;;AAEA;AAAA;EAEE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AA4BF;EACE;;AASF;EACE;;AAMF;AAAA;EAEE;EACA;;AAGF;EACE,YACE;;AAGF;EACE;;AAIJ;EACE,YACE;;AAGF;EACE;;AAgBF;AAAA;EACE;EACA;EACA;;;AAeN;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AC5GF;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAGF;EACE;;AAIF;EACE;EACA;EACA;EACA,YAvBoB;;AAyBpB;EACE;EACA,WA5BU;EA6BV,YA7BU;EA8BV;EACA;EACA;EACA;EACA,YAjCkB;EAkClB;;AAEA;EACE;;AAGF;EACE;;AAGF;EAnBF;IAoBI;;EAEA;IACE;;EAGF;IACE;;;AAMR;EACE;EACA;EACA;EACA;;AAMA;EACE;EACA;EACA,QAxEU;EAyEV;EACA;;AAIJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA,OAxFU;EAyFV;EACA;;AAUJ;EACE;;AAEA;EACE;;AAQF;EAGE;;AAEA;EALF;IAMI;;;AAUN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAEA;EAJF;IAKI;;;AAKN;EACE;EACA;EACA;;AAEA;EALF;IAMI;;;AAIJ;EACE;;AAEA;EAHF;IAII;;;AAKF;EACE,WA1Ka;;AA6Kf;EACE,YA7KQ;;AAgLV;EACE;EACA;;AAKF;EACE,YAzLa;;AA4Lf;EACE,WA5LQ;;AA+LV;EACE;EACA;;;ACvMR;EACE;EAMA;EACA;EACA;EACA;EAGA;;AAEA;EACE;;AAIF;EACE;;;AChBJ;EACE;EACA;EAMA;EACA;EACA;EACA;EASA;EACA;;AAEA;EACE;;AAMF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAIF;EAEE;;AAEA;EACE;EACA;;AAKJ;EAEE;;AAEA;EACE;EACA;;AAKJ;EACE;;AAEA;EACE;EACA;;AAGF;EAEE;;AAEA;EACE;EACA;;AAON;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AClHN;EACE;EAIA;;;ACUA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAOF;EACE,QAnCc;EAoCd;EACA;EACA;;AAGF;EACE,QA1Cc;EA2Cd;EACA;EACA;;AAQF;EAEE;EACA;EACA;EAGA;;AAGF;EACE;EACA,kBACE;EAEF;EACA;;AAGF;EACE;EACA,kBACE;EAEF;EACA;;AAGF;EACE;IAEE;;;;AC3FN;EACE;EACA;EACA;EACA;EAKA;EACA;;;AAQF;EACE;;;AAWF;EACE;;;AAQF;AAAA;EAEE;;;AAYF;EACE;EACA;EACA;EACA;EACA;;;AAKF;EACE;EACA;;;ACnDF;EACE;EACA;;;AAUF;EACE;EACA;;;AAaF;EACE;EACA;;;AClCF;EACE;EACA;EACA;EACA;EACA;EACA;;AAUA;EACE;EACA;EACA;EACA;EACA;EACA;EAGA;;AAkBF;EACE;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;;AAOA;EACE;;AAGF;EACE;;AASF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAOJ;EACE;EACA;EACA;EACA;;AAmBA;EACE;EACA;;AAGF;EACE;EACA;;AAKA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAQN;EACE;EACA;EACA;EACA;EACA;;AAMF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAMJ;EACE;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACxMF;EACE;EACA;EACA;EACA;EACA;;AAOA;EACE;EACA;EACA;EACA;;AASF;EACE;EACA;EACA;EACA;EACA;EACA;;AAQF;AAAA;EAEE;EACA;EACA;EACA;;AAEA;AAAA;EACE;EACA;;AAOF;EACE;;AAGF;EACE;;AASJ;EACE;;AAGF;EACE;;AAMA;EACE;;AAGF;EACE;EACA;EACA;EACA;;;ACtFN;EACE;EACA;EAMA;;AAEA;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;;AAEA;EACE;;AAiBJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;AAAA;EAEE;EACA;EACA;EACA;;AAIA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA,YACE;;AAMJ;EACE;;;AAON;EACE;;AAEA;EACE;EACA;EACA;EACA;EAEA;EACA,YACE;;AAGF;EACE;;;AC5HN;EACE;EACA;EACA;EACA;EAGA;EACA;EACA;EAEA;EAGA;EACA;;AAEA;EACE;;AAGF;EArBF;IAsBI;;;AAMF;EACE;EACA;EACA;EACA;;AAMF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;EACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EAEA;EACA;;AAMF;EACE;;AAKA;EAGE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAZF;IAaI;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;IAGE;;;AAON;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EAIE;;AAGF;EACE;EACA;EACA;EACA;;AAGF;AAAA;EAEE;EAGA;EACA;;AAEA;AAAA;EACE;;AAMJ;EACE;;AAEA;EACE;;AAOJ;EACE;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAMJ;EACE;EACA;;;AChTJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAOA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAON;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EAIE;;AAGF;EACE;EACA;EACA;EACA;;AAQF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;EACE;;AAWJ;EACE;;AAEA;EACE;;AAOJ;EACE;;AAEA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAOF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAKJ;EACE;EACA;;AAKF;EACE;;AAMA;EAGE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;ACnRN;EACI;EACA;EACA;;AAIA;EACI;EACA;EACA;EACA;;AAKJ;EACI;EACA;EACA;EAOA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACI;EAEJ;EACA;;AAOA;EACI;;AAGJ;EACI;EACA;EACA;;AAGJ;EAII;EACA;EACA;EACA;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAmBR;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKJ;EACI;;AAEA;EACI;;AAGJ;EACI;;AAMZ;EACI;EACA;;AAMA;EACI;;AAGJ;EACI;EACA;EASA;EACA;;AAEA;EACI;EACA;;AA4BZ;EACI;EACA;EACA;EACA;;AAMJ;EACI;;AAEA;EACI;EACA;EACA;EACA;;;ACtNZ;EAGI;EAEA;EACA;EACA;;AAGA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACI;EAGJ;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAIJ;EACI;EACA;EACA,YACI;;AAGJ;EACI;;AAOZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAKR;EACI;;AAIA;EACI;;AAMR;EACI;EACA;EACA;;AAGJ;EACI;;AAKA;EACI;;AAGJ;EACI;EACA;EACA;;AAMR;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;;AAEA;EACI;;AAKZ;EACI;;;ACpMZ;EACI;EACA;EACA;EAEA;EACA;;AAIA;EACI;;AAEA;EACI;EACA;EACA;EACA;;;ACdZ;EACI;;AAOA;EACI;;AATR;EAYI;EAGA;EACA;EACA;;AAGA;EACI;EACA;EAEA;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACI;EAEJ;EACA;;AAMA;EACI;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAIR;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKJ;EACI;;AAEA;EACI;;;ACxGd;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAGF;EAIE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;;AC3EJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAGF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAKF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAKF;EAEE;;;AAGF;EAEE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EAEA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAKF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;AAAA;EAGE;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAOF;AAAA;EAEE;;;AAOF;AAAA;EAEE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;IACE;;EAGF;IACE;;EAGF;AAAA;AAAA;IAGE;;;AC/cJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAKF;EACE;EACA;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;AAAA;EAGE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;ACrGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAyBF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAKF;EACE;EACA;;AAMJ;EACE;;AAMF;EACE;;;AAIJ;EACE;IACE;IACA;;EAGF;IACE;IACA;;;ACzFJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAMA;EACE;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;EACA;EACA;EACA,YACE;;AASN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;EACA,YACE;EAEF;;AAUF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAOF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAMF;EACE;;AAEA;EAEE;;AAMN;EACE;;AAOF;EACE;EACA,YACE;;AAMJ;EACE;;;AC5JJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EAEA;;AAGF;EACE;EACA;;AAKA;EACE;;AAKF;EACE;EACA;EACA;;AAGF;EACE;;AAGA;EACE;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;;AAYF;EACE;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAKF;EACE;EACA;;AAEA;EAEE;;AAKN;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;;AASA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEA;EACE;;AAKN;EACE;;;AAgBJ;EAGE;EACA;;AAGF;EACE;EACA;;AAVJ;EAaE;EAEA;;AAEA;EACE;EACA;EACA;;AAIA;EACE;;AAGF;EACE;;AAIJ;AAAA;EAEE;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;;;AC1PJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EAEA;;AAKF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAGF;AAAA;AAAA;EAIE;EACA;;AAGF;AAAA;AAAA;EAGE;EACA;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EAEA;EACA;;AAGF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;IACE;;EAGF;IACE;;;AClKJ;EAGE;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;AAGF;EACE;IAGE;;;AAKN;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;;AAGF;EACE;;AAIJ;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAIJ;EACE;EACA;;;ACrLF;EACE;EAEA;EACA;EACA;EACA;;AAGF;EAEE;EACA;;AAKF;AAAA;EAEE;;AAIF;EACE;EACA;EACA;;AAGF;EACE;;AAKF;EACE;EACA;EACA;EACA;;AAGF;EACE;;;AASF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;;AAIJ;EACE;EACA;EACA;EACA;EAGA;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAEA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EAIE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAEA;EAGE;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAMF;EACE;;AAGF;AAAA;EAEE;;;ACvTJ;EAEE;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;;AAEA;EACE;EACA;;AAKJ;AAAA;AAAA;EAGE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAMA;EACE;EACA;;AAGF;EACE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;;AAMR;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;ACrPJ;EACE;;AAEA;EACE;;;AAKJ;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EAEA;;;AAKF;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;EAEA;;;AAIF;EACE;;;AAIF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EAEA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAIF;EACE;;AAEA;EACE;;;AAMJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;;AAUN;EACE;EACA;;;AAGF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AC7IJ;EAGE;;AAEA;EACE;;AAOF;EACE;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAQJ;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAMJ;EACE;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAOA;EACE;;AAMA;EACE;;;ACzIR;EACE;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;EACA;;AAEA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAKJ;EACE;EACA;EACA;EACA;;AAIF;EACE;;AAtKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EAEA;EACA;EACA;EACA;EACA;;;AAkKJ;EAhLE;IACE;IACA;IACA;;EAGF;IACE;IACA;IAEA;IACA;IACA;IACA;IACA;;;AAwKJ;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;;EAEF;IACE;;;AC7MJ;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;AAEA;EACE;;;AAIJ;EACE;EACA;EAGA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EAEA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOJ;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;AAEA;EACE;;;ACrEJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAOF;AAAA;EAEE;EACA;;;AC0JF;EACE","sourcesContent":["// _icons.generated.scss — auto-generated by scripts/build-scss.mjs\n// DO NOT EDIT — regenerated on every build from @gjsify/adwaita-icons.\n\n:root {\n --icon-go-down: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%205%20c%200%20-0.265625%200.105469%20-0.519531%200.292969%20-0.707031%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20l%205.292969%205.292969%20l%205.292969%20-5.292969%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20c%200.1875%200.1875%200.292969%200.441406%200.292969%200.707031%20s%20-0.105469%200.519531%20-0.292969%200.707031%20l%20-6%206%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20l%20-6%20-6%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-sidebar-show: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%206%2013%20v%20-10%20h%20-3%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208%20c%200%200.550781%200.449219%201%201%201%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3Cpath%20d%3D'm%203%201%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%208%20c%200%201.644531%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-8%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200%202%20h%203%20v%2010%20h%20-3%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-8%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%204%200%20h%206%20c%200.570312%200%201%200.429688%201%201%20v%208%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-6%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-go-previous: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2012%202%20c%200%20-0.265625%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20c%20-0.390625%20-0.390625%20-1.023437%20-0.390625%20-1.414062%200%20l%20-6%206%20c%20-0.1875%200.1875%20-0.292969%200.441406%20-0.292969%200.707031%20s%200.105469%200.519531%200.292969%200.707031%20l%206%206%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20c%200.1875%20-0.1875%200.292969%20-0.441406%200.292969%20-0.707031%20s%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20l%20-5.292969%20-5.292969%20l%205.292969%20-5.292969%20c%200.1875%20-0.1875%200.292969%20-0.441406%200.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-go-next: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%202%20c%200%20-0.265625%200.105469%20-0.519531%200.292969%20-0.707031%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20l%206%206%20c%200.1875%200.1875%200.292969%200.441406%200.292969%200.707031%20s%20-0.105469%200.519531%20-0.292969%200.707031%20l%20-6%206%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20s%200.105469%20-0.519531%200.292969%20-0.707031%20l%205.292969%20-5.292969%20l%20-5.292969%20-5.292969%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-go-up: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%2011%20c%200%20-0.265625%200.105469%20-0.519531%200.292969%20-0.707031%20l%206%20-6%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20l%206%206%20c%200.1875%200.1875%200.292969%200.441406%200.292969%200.707031%20s%20-0.105469%200.519531%20-0.292969%200.707031%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20l%20-5.292969%20-5.292969%20l%20-5.292969%205.292969%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-refresh: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.40625%201%20c%20-0.613281%200.007812%20-1.234375%200.089844%20-1.847656%200.253906%20c%20-3.273438%200.878906%20-5.558594%203.855469%20-5.558594%207.246094%20s%202.285156%206.367188%205.558594%207.242188%20c%203.273437%200.878906%206.742187%20-0.558594%208.4375%20-3.492188%20c%200.277344%20-0.480469%200.109375%20-1.089844%20-0.367188%20-1.367188%20c%20-0.476562%20-0.273437%20-1.089844%20-0.109374%20-1.367187%200.367188%20c%20-1.246094%202.160156%20-3.777344%203.207031%20-6.1875%202.5625%20c%20-2.40625%20-0.644531%20-4.074219%20-2.820312%20-4.074219%20-5.3125%20c%200%20-2.496094%201.667969%20-4.667969%204.074219%20-5.3125%20c%202.410156%20-0.644531%204.941406%200.402344%206.1875%202.5625%20c%200.058593%200.085938%200.125%200.164062%200.203125%200.226562%20l%20-0.019532%200.015626%20l%20-0.007812%200.007812%20h%20-1.4375%20c%20-0.550781%200%20-1%200.449219%20-1%201%20c%200%200%200%201%201%201%20h%205%20v%20-5%20s%200.003906%20-1%20-1%20-1%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%201.6875%20l%20-0.015625%200.011719%20l%20-0.011719%200.011719%20c%20-1.277344%20-2.179688%20-3.53125%20-3.519532%20-5.953125%20-3.691407%20c%20-0.203125%20-0.015625%20-0.40625%20-0.019531%20-0.613281%20-0.019531%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-open-menu: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%201%202%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%201%207%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%201%2012%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-go-home: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200.363281%20c%20-0.5%200%20-1%200.167969%20-1.40625%200.507813%20l%20-4.464844%203.722656%20c%20-0.714844%200.59375%20-1.128906%201.476562%20-1.128906%202.40625%20v%206%20c%200%201.65625%201.34375%203%203%203%20h%208%20c%201.65625%200%203%20-1.34375%203%20-3%20v%20-6%20c%200%20-0.929688%20-0.414062%20-1.8125%20-1.128906%20-2.40625%20l%20-4.464844%20-3.722656%20c%20-0.40625%20-0.339844%20-0.90625%20-0.507813%20-1.40625%20-0.507813%20z%20m%20-0.015625%201.996094%20c%200.050781%20-0.003906%200.101563%200.011719%200.144531%200.046875%20l%204.464844%203.722656%20c%200.257812%200.214844%200.40625%200.535156%200.40625%200.871094%20v%206%20c%200%200.5625%20-0.4375%201%20-1%201%20h%20-2%20v%20-5%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20h%20-2%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%205%20h%20-2%20c%20-0.5625%200%20-1%20-0.4375%20-1%20-1%20v%20-6%20c%200%20-0.335938%200.148438%20-0.65625%200.40625%20-0.871094%20l%204.464844%20-3.722656%20c%200.035156%20-0.027344%200.074218%20-0.042969%200.113281%20-0.046875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-list-add: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%201%20v%206%20h%20-6%20v%202%20h%206%20v%206%20h%202%20v%20-6%20h%206%20v%20-2%20h%20-6%20v%20-6%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-network-wireless: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201.992188%20c%20-2.617188%200%20-5.238281%200.933593%20-7.195312%202.808593%20l%20-0.496094%200.480469%20c%20-0.3984378%200.378906%20-0.410156%201.011719%20-0.03125%201.410156%20c%200.382812%200.398438%201.015625%200.410156%201.414062%200.03125%20l%200.5%20-0.476562%20c%203.085938%20-2.957032%208.53125%20-2.957032%2011.617188%200%20l%200.5%200.476562%20c%200.398437%200.378906%201.03125%200.367188%201.414062%20-0.03125%20c%200.378906%20-0.398437%200.367188%20-1.03125%20-0.03125%20-1.410156%20l%20-0.496094%20-0.484375%20c%20-1.957031%20-1.871094%20-4.578124%20-2.804687%20-7.195312%20-2.804687%20z%20m%20-0.03125%204.007812%20c%20-1.570312%200.011719%20-3.128906%200.628906%20-4.207031%201.8125%20l%20-0.5%200.550781%20c%20-0.179688%200.195313%20-0.277344%200.453125%20-0.261719%200.71875%20c%200.011719%200.265625%200.128906%200.515625%200.328125%200.695313%20c%200.195313%200.179687%200.453125%200.273437%200.71875%200.257812%20c%200.265625%20-0.011718%200.515625%20-0.128906%200.695313%20-0.328125%20l%200.496093%20-0.546875%20c%201.277344%20-1.402344%204.160157%20-1.496094%205.523438%200.003906%20l%200.5%200.542969%20c%200.175781%200.199219%200.425781%200.316407%200.691406%200.328125%20c%200.265625%200.015625%200.523437%20-0.078125%200.722656%20-0.257812%20c%200.195313%20-0.179688%200.3125%20-0.429688%200.324219%20-0.695313%20c%200.011719%20-0.261719%20-0.082031%20-0.523437%20-0.261719%20-0.71875%20l%20-0.5%20-0.546875%20c%20-1.121093%20-1.234375%20-2.703125%20-1.828125%20-4.269531%20-1.816406%20z%20m%200.03125%204%20c%20-0.511719%200%20-1.023438%200.195312%20-1.414062%200.585938%20c%20-0.78125%200.78125%20-0.78125%202.046874%200%202.828124%20s%202.046874%200.78125%202.828124%200%20s%200.78125%20-2.046874%200%20-2.828124%20c%20-0.390624%20-0.390626%20-0.902343%20-0.585938%20-1.414062%20-0.585938%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202.96875%201.003906%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%208%20c%200%201.644532%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355468%203%20-3%20v%20-6%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20h%20-3.585938%20l%20-1.707031%20-1.707031%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%202%20h%203.585938%20l%201%201%20h%20-5.585938%20c%200%20-0.5625%200.4375%20-1%201%20-1%20z%20m%20-1%202%20h%2011%20c%200.5625%200%201%200.4375%201%201%20v%206%20c%200%200.5625%20-0.4375%201%20-1%201%20h%20-10%20c%20-0.5625%200%20-1%20-0.4375%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-starred: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.429688%200%20-0.8125%200.273438%20-0.949219%200.683594%20l%20-1.449219%204.339844%20l%20-4.589843%20-0.015626%20c%20-0.980469%20-0.003906%20-1.382813%201.257813%20-0.582031%201.820313%20l%203.625%202.554687%20l%20-1.5%204.285157%20c%20-0.316407%200.902343%200.6875%201.691406%201.492187%201.171875%20l%204.003906%20-2.59375%20l%203.894531%202.585937%20c%200.800782%200.53125%201.816407%20-0.257812%201.5%20-1.160156%20l%20-1.503906%20-4.289063%20l%203.644532%20-2.578124%20c%200.789062%20-0.5625%200.394531%20-1.808594%20-0.574219%20-1.8125%20l%20-4.660157%20-0.015626%20l%20-1.402343%20-4.285156%20c%20-0.132813%20-0.410156%20-0.515625%20-0.68749975%20-0.949219%20-0.691406%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-system-search: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-3.578125%200%20-6.5%202.921875%20-6.5%206.5%20s%202.921875%206.496094%206.5%206.496094%20c%201.429688%200%202.753906%20-0.464844%203.828125%20-1.253906%20l%202.945313%202.945312%20c%200.957031%200.9375%202.363281%20-0.5%201.40625%20-1.4375%20l%20-2.929688%20-2.929688%20c%200.785156%20-1.074218%201.25%20-2.394531%201.25%20-3.820312%20c%200%20-3.578125%20-2.921875%20-6.5%20-6.5%20-6.5%20z%20m%200%202%20c%202.496094%200%204.5%202.003906%204.5%204.5%20s%20-2.003906%204.496094%20-4.5%204.496094%20s%20-4.5%20-2%20-4.5%20-4.496094%20s%202.003906%20-4.5%204.5%20-4.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-contact-new: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-1.65625%200%20-3%201.34375%20-3%203%20s%201.34375%203%203%203%20s%203%20-1.34375%203%20-3%20s%20-1.34375%20-3%20-3%20-3%20z%20m%20-1.5%207%20c%20-2.492188%200%20-4.5%202.007812%20-4.5%204.5%20v%200.5%20c%200%201.109375%200.890625%202%202%202%20h%206%20v%20-1%20h%20-3%20v%20-4%20h%203%20v%20-1.972656%20c%20-0.164062%20-0.019532%20-0.332031%20-0.027344%20-0.5%20-0.027344%20z%20m%204.5%200%20v%203%20h%20-3%20v%202%20h%203%20v%203%20h%202%20v%20-3%20h%203%20v%20-2%20h%20-3%20v%20-3%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-mail-unread: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%202%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%206%20c%200%201.644531%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-6%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200.800781%202%20h%208.394531%20l%20-3.917968%202.613281%20c%20-0.171875%200.113281%20-0.382813%200.113281%20-0.554688%200%20z%20m%20-1.800781%201.203125%20l%204.613281%203.074219%20c%200.835938%200.558594%201.9375%200.558594%202.773438%200%20l%204.613281%20-3.074219%20v%205.796875%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-10%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-avatar-default: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-1.65625%200%20-3%201.34375%20-3%203%20s%201.34375%203%203%203%20s%203%20-1.34375%203%20-3%20s%20-1.34375%20-3%20-3%20-3%20z%20m%20-1.5%207%20c%20-2.492188%200%20-4.5%202.007812%20-4.5%204.5%20v%200.5%20c%200%201.109375%200.890625%202%202%202%20h%208%20c%201.109375%200%202%20-0.890625%202%20-2%20v%20-0.5%20c%200%20-2.492188%20-2.007812%20-4.5%20-4.5%20-4.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-media-playback-start: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%202.5%20v%2011%20c%200%201.5%201.269531%201.492188%201.269531%201.492188%20h%200.128907%20c%200.246093%200.003906%200.488281%20-0.050782%200.699218%20-0.171876%20l%209.796875%20-5.597656%20c%200.433594%20-0.242187%200.65625%20-0.734375%200.65625%20-1.226562%20c%200%20-0.492188%20-0.222656%20-0.984375%20-0.65625%20-1.222656%20l%20-9.796875%20-5.597657%20c%20-0.210937%20-0.121093%20-0.453125%20-0.175781%20-0.699218%20-0.175781%20h%20-0.128907%20s%20-1.269531%200%20-1.269531%201.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-media-playback-pause: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%203%201%20h%203%20c%200.550781%200%201%200.449219%201%201%20v%2012%20c%200%200.550781%20-0.449219%201%20-1%201%20h%20-3%20c%20-0.550781%200%20-1%20-0.449219%20-1%20-1%20v%20-12%20c%200%20-0.550781%200.449219%20-1%201%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2010%201%20h%203%20c%200.550781%200%201%200.449219%201%201%20v%2012%20c%200%200.550781%20-0.449219%201%20-1%201%20h%20-3%20c%20-0.550781%200%20-1%20-0.449219%20-1%20-1%20v%20-12%20c%200%20-0.550781%200.449219%20-1%201%20-1%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-media-eject: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.585938%201.585938%20l%20-4%204%20c%20-0.371094%200.378906%20-0.578126%200.886718%20-0.582032%201.148437%20l%20-0.003906%201.265625%20c%200%201%201%201%201%201%20h%2010%20s%201%200%201%20-1%20v%20-1%20h%20-0.003906%20c%200%20-0.53125%20-0.207032%20-1.039062%20-0.582032%20-1.414062%20l%20-4%20-4%20c%20-0.375%20-0.375%20-0.8125%20-0.617188%20-1.414062%20-0.585938%20s%20-1.09375%200.265625%20-1.414062%200.585938%20z%20m%20-3.585938%209.414062%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%201%20c%200%200.554688%200.445312%201%201%201%20h%2010%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-1%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-media-playlist-repeat: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20v%202%20h%20-4%20c%20-2.199219%200%20-4%201.800781%20-4%204%20v%202%20c%200%201.019531%200.386719%201.964844%201.019531%202.671875%20c%200.367188%200.410156%201%200.445313%201.410157%200.078125%20c%200.414062%20-0.367188%200.449218%20-1%200.078124%20-1.414062%20c%20-0.316406%20-0.351563%20-0.507812%20-0.8125%20-0.507812%20-1.335938%20v%20-2%20c%200%20-1.125%200.875%20-2%202%20-2%20h%204%20v%202%20h%201%20v%20-0.007812%20c%200.265625%200.003906%200.519531%20-0.101563%200.707031%20-0.285157%20l%202%20-2%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20l%20-2%20-2%20c%20-0.1875%20-0.183594%20-0.441406%20-0.289063%20-0.707031%20-0.285157%20v%20-0.007812%20z%20m%206.289062%203%20c%20-0.265624%20-0.011719%20-0.523437%200.078125%20-0.71875%200.257812%20c%20-0.414062%200.367188%20-0.449218%201%20-0.078124%201.410157%20c%200.316406%200.355469%200.507812%200.816406%200.507812%201.339843%20v%202%20c%200%201.125%20-0.875%202%20-2%202%20h%20-4%20v%20-2.007812%20h%20-1%20v%200.007812%20c%20-0.265625%20-0.003906%20-0.519531%200.101563%20-0.707031%200.285157%20l%20-2%202%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%202%202%20c%200.1875%200.183594%200.441406%200.289063%200.707031%200.285157%20v%200.007812%20h%201%20v%20-1.992188%20h%204%20c%202.199219%200%204%20-1.804687%204%20-4%20v%20-2%20c%200%20-1.023437%20-0.386719%20-1.96875%20-1.019531%20-2.675781%20c%20-0.175781%20-0.199219%20-0.425781%20-0.316406%20-0.691407%20-0.332031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-dialog-error: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-3.871094%200%20-7%203.128906%20-7%207%20s%203.128906%207%207%207%20s%207%20-3.128906%207%20-7%20s%20-3.128906%20-7%20-7%20-7%20z%20m%20-4%206%20h%208%20v%202%20h%20-8%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-muted: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2010%205%20c%20-0.265625%200%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%201.292969%201.292969%20l%20-1.292969%201.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20s%201.023437%200.390625%201.414062%200%20l%201.292969%20-1.292969%20l%201.292969%201.292969%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20s%200.390625%20-1.023437%200%20-1.414062%20l%20-1.292969%20-1.292969%20l%201.292969%20-1.292969%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20l%20-1.292969%201.292969%20l%20-1.292969%20-1.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-low: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%202.957031%202.980469%20c%20-0.199219%200.011719%20-0.394531%200.074219%20-0.5625%200.203125%20c%20-0.441406%200.332032%20-0.53125%200.960938%20-0.195312%201.402344%20c%201.074219%201.425781%201.074219%203.386719%200%204.8125%20c%20-0.335938%200.441406%20-0.246094%201.070312%200.195312%201.402344%20c%200.441407%200.332031%201.066407%200.242187%201.398438%20-0.195313%20c%200.804687%20-1.070312%201.207031%20-2.339843%201.207031%20-3.613281%20s%20-0.402344%20-2.542969%20-1.207031%20-3.613281%20c%20-0.183594%20-0.246094%20-0.464844%20-0.382813%20-0.753907%20-0.398438%20c%20-0.027343%200%20-0.054687%200%20-0.085937%200%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-medium: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%203.039062%202.980469%20c%20-0.222656%20-0.007812%20-0.453124%200.058594%20-0.644531%200.203125%20c%20-0.261719%200.199219%20-0.394531%200.5%20-0.394531%200.804688%20v%200.066406%20c%200.011719%200.1875%200.078125%200.371094%200.199219%200.527344%20c%201.074219%201.429687%201.074219%203.390625%200%204.816406%20c%20-0.121094%200.160156%20-0.1875%200.34375%20-0.199219%200.53125%20v%200.066406%20c%200%200.304688%200.132812%200.605469%200.394531%200.804688%20c%200.441407%200.332031%201.066407%200.242187%201.398438%20-0.199219%20c%200.804687%20-1.066406%201.207031%20-2.335937%201.207031%20-3.609375%20s%20-0.402344%20-2.542969%20-1.207031%20-3.613281%20c%20-0.183594%20-0.246094%20-0.464844%20-0.382813%20-0.753907%20-0.398438%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2013.460938%201.96875%20c%20-0.191407%20-0.003906%20-0.386719%200.054688%20-0.558594%200.167969%20c%20-0.457032%200.3125%20-0.578125%200.933593%20-0.269532%201.390625%20c%201.824219%202.707031%201.824219%206.238281%200%208.945312%20c%20-0.308593%200.457032%20-0.1875%201.078125%200.269532%201.390625%20c%200.457031%200.308594%201.078125%200.1875%201.390625%20-0.269531%20c%201.136719%20-1.691406%201.707031%20-3.640625%201.707031%20-5.59375%20s%20-0.570312%20-3.902344%20-1.707031%20-5.59375%20c%20-0.195313%20-0.285156%20-0.511719%20-0.4375%20-0.832031%20-0.4375%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-high: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%206.460938%200.960938%20c%20-0.191407%20-0.003906%20-0.386719%200.054688%20-0.558594%200.167969%20c%20-0.457032%200.3125%20-0.578125%200.933593%20-0.269532%201.390625%20c%201.824219%202.707031%201.824219%206.238281%200%208.945312%20c%20-0.308593%200.457032%20-0.1875%201.078125%200.269532%201.390625%20c%200.457031%200.308594%201.078125%200.1875%201.390625%20-0.269531%20c%201.136719%20-1.691406%201.707031%20-3.640625%201.707031%20-5.59375%20s%20-0.570312%20-3.902344%20-1.707031%20-5.59375%20c%20-0.195313%20-0.285156%20-0.511719%20-0.4375%20-0.832031%20-0.4375%20z%20m%20-3.421876%202.019531%20c%20-0.222656%20-0.007812%20-0.453124%200.058594%20-0.644531%200.203125%20c%20-0.261719%200.199219%20-0.394531%200.5%20-0.394531%200.804688%20v%200.058594%20c%200.011719%200.191406%200.074219%200.375%200.199219%200.535156%20c%201.074219%201.429687%201.074219%203.390625%200%204.816406%20c%20-0.125%200.164062%20-0.1875%200.347656%20-0.199219%200.535156%20v%200.0625%20c%200%200.304688%200.132812%200.605469%200.394531%200.804688%20c%200.441407%200.332031%201.066407%200.242187%201.398438%20-0.199219%20c%200.804687%20-1.066406%201.207031%20-2.335937%201.207031%20-3.609375%20s%20-0.402344%20-2.542969%20-1.207031%20-3.613281%20c%20-0.183594%20-0.246094%20-0.464844%20-0.382813%20-0.753907%20-0.398438%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-camera-photo: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-0.265625%200%20-0.519531%200.105469%20-0.707031%200.292969%20l%20-1.707031%201.707031%20h%20-1.085938%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%207%20c%200%201.644531%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-7%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20h%20-1.085938%20l%20-1.707031%20-1.707031%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200.414062%202%20h%202.171876%20l%201.707031%201.707031%20c%200.1875%200.1875%200.441406%200.292969%200.707031%200.292969%20h%201.5%20c%200.570312%200%201%200.429688%201%201%20v%207%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-10%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-7%20c%200%20-0.570312%200.429688%20-1%201%20-1%20h%201.5%20c%200.265625%200%200.519531%20-0.105469%200.707031%20-0.292969%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%208%204%20c%20-2.199219%200%20-4%201.800781%20-4%204%20s%201.800781%204%204%204%20s%204%20-1.800781%204%20-4%20s%20-1.800781%20-4%20-4%20-4%20z%20m%200%202%20c%201.117188%200%202%200.882812%202%202%20s%20-0.882812%202%20-2%202%20s%20-2%20-0.882812%20-2%20-2%20s%200.882812%20-2%202%20-2%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-user-trash: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-1.378906%200%20-2.5%201.121094%20-2.5%202.5%20v%200.5%20h%20-3%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20h%201%20v%208%20c%200%201.65625%201.34375%203%203%203%20h%206%20c%201.65625%200%203%20-1.34375%203%20-3%20v%20-8%20h%201%20c%200.550781%200%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20h%20-3.023438%20v%20-0.5%20c%200%20-1.378906%20-1.117187%20-2.5%20-2.5%20-2.5%20z%20m%200%202%20h%202.976562%20c%200.289063%200%200.5%200.210938%200.5%200.5%20v%200.5%20h%20-3.976562%20v%20-0.5%20c%200%20-0.289062%200.210938%20-0.5%200.5%20-0.5%20z%20m%20-2.5%203%20h%208%20v%208%20c%200%200.5625%20-0.4375%201%20-1%201%20h%20-6%20c%20-0.5625%200%20-1%20-0.4375%20-1%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%207%207%20v%205%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-5%20c%200%20-0.277344%200.222656%20-0.5%200.5%20-0.5%20s%200.5%200.222656%200.5%200.5%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2010%207%20v%205%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-5%20c%200%20-0.277344%200.222656%20-0.5%200.5%20-0.5%20s%200.5%200.222656%200.5%200.5%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-view-reveal: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%202%20c%20-3.648438%200.003906%20-6.832031%202.476562%20-7.738281%206.007812%20c%200.914062%203.527344%204.097656%205.988282%207.738281%205.992188%20c%203.648438%20-0.003906%206.832031%20-2.476562%207.738281%20-6.011719%20c%20-0.914062%20-3.523437%20-4.097656%20-5.984375%20-7.738281%20-5.988281%20z%20m%200%202%20c%202.210938%200%204%201.789062%204%204%20s%20-1.789062%204%20-4%204%20s%20-4%20-1.789062%20-4%20-4%20s%201.789062%20-4%204%20-4%20z%20m%200%202%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20s%202%20-0.894531%202%20-2%20s%20-0.894531%20-2%20-2%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-conceal: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201.53125%200.46875%20l%20-1.0625%201.0625%20l%2014%2014%20l%201.0625%20-1.0625%20l%20-2.382812%20-2.382812%20c%201.265624%20-1.0625%202.171874%20-2.496094%202.589843%20-4.097657%20c%20-0.914062%20-3.523437%20-4.097656%20-5.984375%20-7.738281%20-5.988281%20c%20-1.367188%200.011719%20-2.707031%200.371094%20-3.894531%201.042969%20z%20m%206.46875%203.53125%20c%202.210938%200%204%201.789062%204%204%20c%20-0.003906%200.800781%20-0.246094%201.578125%20-0.699219%202.238281%20l%20-1.46875%20-1.46875%20c%200.105469%20-0.242187%200.164063%20-0.503906%200.167969%20-0.769531%20c%200%20-1.105469%20-0.894531%20-2%20-2%20-2%20c%20-0.265625%200.003906%20-0.527344%200.0625%20-0.769531%200.167969%20l%20-1.46875%20-1.46875%20c%200.660156%20-0.453125%201.4375%20-0.695313%202.238281%20-0.699219%20z%20m%20-6.144531%200.917969%20c%20-0.753907%200.898437%20-1.296875%201.957031%20-1.59375%203.09375%20c%200.914062%203.523437%204.097656%205.984375%207.738281%205.988281%20c%200.855469%20-0.007812%201.703125%20-0.152344%202.511719%20-0.425781%20l%20-1.667969%20-1.667969%20c%20-0.277344%200.058594%20-0.5625%200.089844%20-0.84375%200.09375%20c%20-2.210938%200%20-4%20-1.789062%20-4%20-4%20c%200.003906%20-0.28125%200.035156%20-0.566406%200.09375%20-0.84375%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-value-increase: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%203%20v%204%20h%20-4%20v%202%20h%204%20v%204%20h%202%20v%20-4%20h%204%20v%20-2%20h%20-4%20v%20-4%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-value-decrease: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%207%20h%2010%20v%202%20h%20-10%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-edit-clear: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%202%20c%20-0.832031%200%20-1.558594%200.34375%20-2.292969%200.78125%20s%20-1.464843%201.003906%20-2.128906%201.597656%20c%20-0.660156%200.597656%20-1.253906%201.222656%20-1.707031%201.796875%20c%20-0.226563%200.289063%20-0.417969%200.5625%20-0.570313%200.835938%20c%20-0.152343%200.277343%20-0.300781%200.53125%20-0.300781%200.988281%20s%200.148438%200.710938%200.300781%200.984375%20c%200.152344%200.277344%200.34375%200.550781%200.570313%200.835937%20c%200.453125%200.578126%201.046875%201.203126%201.707031%201.796876%20c%200.664063%200.597656%201.394531%201.164062%202.128906%201.601562%20s%201.460938%200.78125%202.292969%200.78125%20h%206%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-6%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%201%203%20c%200.265625%200%200.519531%200.105469%200.707031%200.292969%20l%201.292969%201.292969%20l%201.292969%20-1.292969%20c%200.1875%20-0.1875%200.441406%20-0.292969%200.707031%20-0.292969%20s%200.519531%200.105469%200.707031%200.292969%20c%200.390625%200.390625%200.390625%201.023437%200%201.414062%20l%20-1.292969%201.292969%20l%201.292969%201.292969%20c%200.390625%200.390625%200.390625%201.023437%200%201.414062%20s%20-1.023437%200.390625%20-1.414062%200%20l%20-1.292969%20-1.292969%20l%20-1.292969%201.292969%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20s%20-0.390625%20-1.023437%200%20-1.414062%20l%201.292969%20-1.292969%20l%20-1.292969%20-1.292969%20c%20-0.390625%20-0.390625%20-0.390625%20-1.023437%200%20-1.414062%20c%200.1875%20-0.1875%200.441406%20-0.292969%200.707031%20-0.292969%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-document-edit: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2012.277344%200.832031%20c%20-0.578125%200.007813%20-1.167969%200.230469%20-1.691406%200.753907%20l%20-9%209%20c%20-0.375%200.375%20-0.585938%200.882812%20-0.585938%201.414062%20v%203%20h%203%20c%200.53125%200%201.039062%20-0.210938%201.414062%20-0.585938%20l%209%20-9%20c%201.789063%20-1.789062%200.082032%20-4.390624%20-1.890624%20-4.570312%20c%20-0.082032%20-0.011719%20-0.164063%20-0.011719%20-0.246094%20-0.011719%20z%20m%20-1.777344%203.605469%20l%201.0625%201.0625%20l%20-7.0625%207.0625%20l%20-1.0625%20-1.0625%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-document-open: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%201%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%208%20c%200%201.644531%201.355469%203%203%203%20h%208.882812%20c%200.832032%200%201.578126%20-0.402344%202.054688%20-0.9375%20c%200.472656%20-0.53125%200.738281%20-1.167969%200.910156%20-1.800781%20l%200.972656%20-2.609375%20c%200.390626%20-1.449219%20-0.09375%20-2.652344%20-0.820312%20-3.167969%20c%20-0.484375%20-0.34375%20-0.714844%20-0.292969%20-1%20-0.324219%20v%20-1.160156%20c%200%20-0.855469%20-0.558594%20-1.589844%20-1.09375%20-1.828125%20c%20-0.417969%20-0.1875%20-0.808594%20-0.183594%20-0.953125%20-0.171875%20h%20-3.539063%20l%20-1.707031%20-1.707031%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%202%20h%202.585938%20l%201.707031%201.707031%20c%200.1875%200.1875%200.441406%200.292969%200.707031%200.292969%20h%204%20v%201%20h%20-5%20h%200.039062%20c%20-0.914062%20-0.039062%20-1.746093%200.394531%20-2.1875%200.96875%20c%20-0.714843%201.226562%20-1.160156%202.28125%20-1.800781%203.71875%20c%20-0.171875%200.527344%200.113281%201.09375%200.636719%201.265625%20c%200.527344%200.167969%201.09375%20-0.117187%201.261719%20-0.640625%20c%200.488281%20-1.011719%200.921875%20-1.816406%201.339843%20-2.808594%20c%200.210938%20-0.503906%200.703126%20-0.492187%200.898438%20-0.503906%20h%205.8125%20c%201%200%201.046875%200.703125%200.886719%201.128906%20l%20-0.96875%202.609375%20c%20-0.121094%200.4375%20-0.300781%200.800781%20-0.476563%200.996094%20c%20-0.175781%200.199219%20-0.285156%200.265625%20-0.558594%200.265625%20h%20-8.882812%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-8%20c%200%20-0.570312%200.46875%20-0.792969%201%20-1%20z%20m%209.105469%201.996094%20h%200.003906%20v%200.003906%20h%200.003906%20l%20-0.003906%200.003906%20h%20-0.003906%20v%20-0.003906%20c%20-0.003907%200%20-0.007813%200%20-0.011719%200%20h%20-0.003906%20l%20-0.003906%20-0.003906%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-document-save: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208.585938%20l%20-1.292969%20-1.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%203%203%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%203%20-3%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-1.292969%201.292969%20v%20-8.585938%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-7%2014%20v%202%20h%2014%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-mail-send: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.257812%200%20-0.511719%200.0976562%20-0.707031%200.292969%20l%20-1.25%201.25%20l%20-1.761719%201.730469%20c%20-0.191406%200.199218%20-0.28125%200.441406%20-0.28125%200.75%20c%200%200.976562%201%201%201%201%20c%200.257812%200%200.527344%20-0.128907%200.71875%20-0.3125%20l%201.28125%20-1.28125%20v%203.570312%20s%200%201%201%201%20s%201%20-1%201%20-1%20v%20-3.570312%20l%201.28125%201.28125%20c%200.191406%200.183593%200.410156%200.3125%200.71875%200.3125%20c%200%200%201%20-0.023438%201%20-1%20c%200%20-0.308594%20-0.089844%20-0.550782%20-0.28125%20-0.75%20l%20-1.761719%20-1.730469%20l%20-1.25%20-1.25%20c%20-0.195312%20-0.1953128%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%20-5%209%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%204%20h%202%20v%20-3.800781%20l%204.613281%203.078125%20c%200.835938%200.558594%201.9375%200.558594%202.773438%200%20l%204.613281%20-3.078125%20v%203.800781%20h%202%20v%20-4%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200.800781%202%20h%208.398438%20l%20-3.921875%202.613281%20c%20-0.171875%200.113281%20-0.382813%200.113281%20-0.554688%200%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-mail-reply-sender: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%205%202%20c%20-0.265625%200%20-0.519531%200.105469%20-0.707031%200.292969%20l%20-4%204%20c%20-0.3906252%200.390625%20-0.3906252%201.023437%200%201.414062%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20s%200.390625%20-1.023437%200%20-1.414062%20l%20-2.292969%20-2.292969%20h%208.585938%20c%201.117188%200%202%200.882812%202%202%20v%203%20c%200%200.550781%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20v%20-3%20c%200%20-0.023438%200%20-0.046875%20-0.003906%20-0.070312%20c%20-0.035156%20-2.164063%20-1.820313%20-3.929688%20-3.996094%20-3.929688%20h%20-8.585938%20l%202.292969%20-2.292969%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder-documents: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.96875%201.003906%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%209%20c%200%201.644532%201.355469%203%203%203%20h%206%20c%201.644531%200%203%20-1.355468%203%20-3%20v%20-7.5%20c%200%20-0.265625%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20l%20-3.5%20-3.5%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%202%20h%204%20v%201.5%20c%200%201%200.5%201.5%201.5%201.5%20h%201.5%20v%207%20c%200%200.570313%20-0.429688%201%20-1%201%20h%20-6%20c%20-0.570312%200%20-1%20-0.429687%20-1%20-1%20v%20-9%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder-download: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.984375%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208.585938%20l%20-2.292969%20-2.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%204%20-4%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-2.292969%202.292969%20v%20-8.585938%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-6%2014%20v%202%20h%2012%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-grid: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%208%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%20-8%208%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%208%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-list: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%202%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-2%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%201%20v%202%20h%208%20v%20-2%20z%20m%20-5%204.015625%20c%20-0.554688%200%20-1%200.445313%20-1%201%20v%201.980469%20c%200%200.550781%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.449219%201%20-1%20v%20-1.980469%20c%200%20-0.554687%20-0.445312%20-1%20-1%20-1%20z%20m%205%200.984375%20v%202%20h%208%20v%20-2%20z%20m%20-5%204%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%201.980469%20c%200%200.550781%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.449219%201%20-1%20v%20-1.980469%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200.984375%20v%202%20h%208%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-more: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.996094%200%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%206%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%206%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-paged: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%209%205.5%20v%20-1%20c%200%20-0.277344%20-0.222656%20-0.5%20-0.5%20-0.5%20h%20-3%20c%20-0.277344%200%20-0.5%200.222656%20-0.5%200.5%20v%201%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%203%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3Cpath%20d%3D'm%204%200%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%207%20c%200%201.644531%201.355469%203%203%203%20h%206%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-7%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200%202%20h%206%20c%200.570312%200%201%200.429688%201%201%20v%207%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-6%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-7%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%2011%202%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208%20c%200%200.550781%20-0.449219%201%20-1%201%20h%20-7%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20h%207%20c%201.65625%200%203%20-1.34375%203%20-3%20v%20-8%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%209%208.5%20v%20-1%20c%200%20-0.277344%20-0.222656%20-0.5%20-0.5%20-0.5%20h%20-3%20c%20-0.277344%200%20-0.5%200.222656%20-0.5%200.5%20v%201%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%203%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-view-columns: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-list-remove: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%207%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-send-to: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.257812%200%20-0.511719%200.0976562%20-0.707031%200.292969%20l%20-1.246094%201.25%20l%20-1.765625%201.730469%20c%20-0.191406%200.199218%20-0.28125%200.441406%20-0.28125%200.75%20c%200%200.976562%201%201%201%201%20c%200.257812%200%200.527344%20-0.128907%200.71875%20-0.3125%20l%201.28125%20-1.28125%20v%207.570312%20s%200%201%201%201%20s%201%20-1%201%20-1%20v%20-7.570312%20l%201.28125%201.28125%20c%200.191406%200.183593%200.410156%200.3125%200.71875%200.3125%20c%200%200%201%20-0.023438%201%20-1%20c%200%20-0.308594%20-0.089844%20-0.550782%20-0.28125%20-0.75%20l%20-1.765625%20-1.730469%20l%20-1.246094%20-1.25%20c%20-0.195312%20-0.1953128%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%20-3.96875%206.964844%20c%20-1.660156%20-0.027344%20-3.03125%201.371094%20-3.03125%203.035156%20v%202.972656%20c%200%201.664063%201.371094%203.035156%203.03125%203.035156%20h%207.9375%20c%201.664062%200%203.03125%20-1.371093%203.03125%20-3.035156%20v%20-2.972656%20c%200%20-1.664062%20-1.367188%20-3.0625%20-3.03125%20-3.035156%20l%20-1.96875%200.035156%20v%202%20l%201.96875%20-0.035156%20c%200.589844%20-0.007813%201.03125%200.445312%201.03125%201.035156%20v%202.972656%20c%200%200.589844%20-0.441406%201.035156%20-1.03125%201.035156%20h%20-7.9375%20c%20-0.585938%200%20-1.03125%20-0.445312%20-1.03125%20-1.035156%20v%20-2.972656%20c%200%20-0.589844%200.445312%20-1.042969%201.03125%20-1.035156%20l%201.96875%200.035156%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder-music: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%204.339844%20c%20-0.457031%20-0.214844%20-0.964844%20-0.339844%20-1.5%20-0.339844%20c%20-1.921875%200%20-3.5%201.578125%20-3.5%203.5%20s%201.578125%203.5%203.5%203.5%20c%201.914062%200%203.492188%20-1.570312%203.5%20-3.484375%20c%200%20-0.003906%200%20-0.011719%200%20-0.015625%20v%20-7.5%20c%200%20-0.5625%200.4375%20-1%201%20-1%20h%204%20c%200.5625%200%201%200.4375%201%201%20v%204.339844%20c%20-0.457031%20-0.214844%20-0.964844%20-0.339844%20-1.5%20-0.339844%20c%20-1.921875%200%20-3.5%201.578125%20-3.5%203.5%20s%201.578125%203.5%203.5%203.5%20s%203.5%20-1.578125%203.5%20-3.5%20v%20-7.5%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%20-4.5%209%20c%200.839844%200%201.5%200.660156%201.5%201.5%20v%200.015625%20c%20-0.007812%200.832031%20-0.664062%201.484375%20-1.5%201.484375%20c%20-0.839844%200%20-1.5%20-0.660156%20-1.5%20-1.5%20s%200.660156%20-1.5%201.5%20-1.5%20z%20m%208%200%20c%200.839844%200%201.5%200.660156%201.5%201.5%20s%20-0.660156%201.5%20-1.5%201.5%20s%20-1.5%20-0.660156%20-1.5%20-1.5%20s%200.660156%20-1.5%201.5%20-1.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-edit-copy: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%200%203%20c%200%20-1.644531%201.355469%20-3%203%20-3%20h%205%20c%201.644531%200%203%201.355469%203%203%20c%200%200.550781%20-0.449219%201%20-1%201%20s%20-1%20-0.449219%20-1%20-1%20c%200%20-0.570312%20-0.429688%20-1%20-1%20-1%20h%20-5%20c%20-0.570312%200%20-1%200.429688%20-1%201%20v%205%20c%200%200.570312%200.429688%201%201%201%20c%200.550781%200%201%200.449219%201%201%20s%20-0.449219%201%20-1%201%20c%20-1.644531%200%20-3%20-1.355469%20-3%20-3%20z%20m%205%205%20c%200%20-1.644531%201.355469%20-3%203%20-3%20h%205%20c%201.644531%200%203%201.355469%203%203%20v%205%20c%200%201.644531%20-1.355469%203%20-3%203%20h%20-5%20c%20-1.644531%200%20-3%20-1.355469%20-3%20-3%20z%20m%202%200%20v%205%20c%200%200.570312%200.429688%201%201%201%20h%205%20c%200.570312%200%201%20-0.429688%201%20-1%20v%20-5%20c%200%20-0.570312%20-0.429688%20-1%20-1%20-1%20h%20-5%20c%20-0.570312%200%20-1%200.429688%20-1%201%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emblem-system: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%200.238281%20c%200%200.464844%20-0.378906%200.902344%20-0.820312%201.046875%20c%20-0.023438%200.007813%20-0.042969%200.011719%20-0.0625%200.019532%20c%20-0.445313%200.148437%20-1.007813%200.015624%20-1.28125%20-0.359376%20l%20-0.140626%20-0.195312%20c%20-0.15625%20-0.214844%20-0.390624%20-0.359375%20-0.652343%20-0.398438%20c%20-0.261719%20-0.042968%20-0.53125%200.019532%20-0.742188%200.175782%20c%20-0.449219%200.324218%20-0.550781%200.949218%20-0.222656%201.398437%20l%200.140625%200.199219%20c%200.277344%200.375%200.226562%200.953125%20-0.050781%201.328125%20c%20-0.011719%200.015625%20-0.023438%200.035156%20-0.035157%200.050781%20c%20-0.273437%200.378906%20-0.804687%200.601563%20-1.25%200.457032%20l%20-0.230468%20-0.074219%20c%20-0.523438%20-0.171875%20-1.089844%200.117187%20-1.257813%200.640625%20c%20-0.171875%200.527344%200.113281%201.089844%200.640625%201.261718%20l%200.222656%200.074219%20c%200.445313%200.144531%200.738282%200.636719%200.75%201.101563%20v%200.070312%20c%200.015626%200.464844%20-0.304687%200.960938%20-0.746093%201.105469%20l%20-0.226563%200.070313%20c%20-0.527344%200.171874%20-0.8125%200.738281%20-0.640625%201.261718%20c%200.167969%200.523438%200.734375%200.8125%201.257813%200.640625%20l%200.230468%20-0.074219%20c%200.445313%20-0.144531%200.976563%200.078126%201.25%200.457032%20c%200.011719%200.015625%200.027344%200.035156%200.039063%200.050781%20c%200.277344%200.375%200.324219%200.953125%200.050781%201.328125%20l%20-0.144531%200.203125%20c%20-0.324219%200.445313%20-0.226563%201.070313%200.222656%201.394531%20c%200.445313%200.324219%201.070313%200.226563%201.394531%20-0.21875%20l%200.144532%20-0.199218%20c%200.273437%20-0.378907%200.835937%20-0.507813%201.277344%20-0.359376%20c%200.019531%200.007813%200.042968%200.011719%200.0625%200.019532%20c%200.445312%200.140625%200.820312%200.578125%200.820312%201.046875%20v%200.238281%20c%200%200.550781%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20v%20-0.238281%20c%200%20-0.46875%200.378906%20-0.90625%200.820312%20-1.046875%20c%200.023438%20-0.007813%200.042969%20-0.015625%200.066407%20-0.023438%20c%200.441406%20-0.144531%201.003906%20-0.015625%201.277343%200.363282%20l%200.144532%200.199218%20c%200.324218%200.445313%200.949218%200.542969%201.394531%200.21875%20c%200.445313%20-0.324218%200.546875%20-0.949218%200.222656%20-1.394531%20l%20-0.148437%20-0.203125%20c%20-0.273438%20-0.375%20-0.226563%20-0.953125%200.050781%20-1.328125%20c%200.015625%20-0.015625%200.027344%20-0.035156%200.039063%20-0.050781%20c%200.273437%20-0.378906%200.804687%20-0.601563%201.25%20-0.457032%20l%200.234374%200.078126%20c%200.523438%200.167968%201.085938%20-0.121094%201.257813%20-0.644532%20c%200.171875%20-0.523437%20-0.117187%20-1.089844%20-0.640625%20-1.257812%20l%20-0.230469%20-0.074219%20c%20-0.445312%20-0.144531%20-0.734375%20-0.640625%20-0.746093%20-1.105469%20c%200%20-0.023437%200%20-0.046875%200%20-0.070312%20c%20-0.015626%20-0.464844%200.300781%20-0.957032%200.746093%20-1.101563%20l%200.230469%20-0.074219%20c%200.523438%20-0.171874%200.8125%20-0.734374%200.640625%20-1.261718%20c%20-0.171875%20-0.523438%20-0.734375%20-0.8125%20-1.257813%20-0.640625%20l%20-0.230468%200.074219%20c%20-0.445313%200.144531%20-0.980469%20-0.078126%20-1.253906%20-0.457032%20c%20-0.011719%20-0.015625%20-0.023438%20-0.035156%20-0.035157%20-0.050781%20c%20-0.277343%20-0.375%20-0.324219%20-0.953125%20-0.050781%20-1.328125%20l%200.144531%20-0.199219%20c%200.324219%20-0.445312%200.226563%20-1.074219%20-0.222656%20-1.398437%20c%20-0.214844%20-0.15625%20-0.480469%20-0.21875%20-0.742187%20-0.179688%20c%20-0.265626%200.042969%20-0.5%200.1875%20-0.652344%200.402344%20l%20-0.144532%200.195312%20c%20-0.273437%200.378907%20-0.835937%200.507813%20-1.28125%200.363282%20c%20-0.019531%20-0.007813%20-0.039062%20-0.015625%20-0.0625%20-0.023438%20c%20-0.441406%20-0.140625%20-0.820312%20-0.578125%20-0.820312%20-1.046875%20v%20-0.238281%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%200%204%20c%200.871094%200%201.675781%200.273438%202.332031%200.742188%20c%200.003907%200.007812%200.011719%200.015624%200.019531%200.023437%20c%200.011719%200.003906%200.019532%200.007813%200.03125%200.015625%20c%200.660157%200.484375%201.160157%201.171875%201.421876%201.976562%20v%200.007813%20s%200.003906%200.003906%200.003906%200.007813%20c%200.292968%200.851562%200.15625%201.65625%200%202.457031%20c%200%200%20-0.003906%200.003906%20-0.003906%200.007812%20v%200.003907%20c%20-0.261719%200.800781%20-0.757813%201.488281%20-1.414063%201.976562%20c%20-0.015625%200.003906%20-0.027344%200.011719%20-0.039063%200.019531%20c%20-0.007812%200.003907%20-0.015624%200.011719%20-0.019531%200.019531%20c%20-0.65625%200.46875%20-1.460937%200.742188%20-2.332031%200.742188%20c%20-0.855469%200%20-1.644531%20-0.265625%20-2.289062%20-0.714844%20c%20-0.019532%20-0.015625%20-0.042969%20-0.035156%20-0.0625%20-0.046875%20c%20-0.011719%20-0.007812%20-0.023438%20-0.015625%20-0.035157%20-0.019531%20c%20-0.652343%20-0.484375%20-1.148437%20-1.160156%20-1.40625%20-1.945312%20c%20-0.003906%20-0.015626%20-0.007812%20-0.023438%20-0.011719%20-0.035157%20c%20-0.003906%20-0.007812%20-0.007812%20-0.015625%20-0.011718%20-0.019531%20c%20-0.285156%20-0.847656%20-0.148438%20-1.644531%200%20-2.4375%20c%200.003906%20-0.007812%200.007812%20-0.011719%200.011718%20-0.019531%20c%200.003907%20-0.011719%200.007813%20-0.023438%200.011719%20-0.039063%20c%200.261719%20-0.785156%200.757813%20-1.460937%201.414063%20-1.945312%20c%200.007812%20-0.003906%200.019531%20-0.007813%200.027344%20-0.015625%20c%200.019531%20-0.011719%200.042968%20-0.03125%200.058593%20-0.046875%20c%200.648438%20-0.449219%201.4375%20-0.714844%202.292969%20-0.714844%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-preferences-system: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2013.855469%200%20l%20-1.539063%201.4375%20c%20-0.453125%200.421875%20-0.53125%201.148438%20-0.269531%201.707031%20l%20-5.886719%205.996094%20c%20-0.011718%200%20-0.019531%200%20-0.03125%200%20c%20-0.257812%20-0.128906%20-0.550781%20-0.183594%20-0.839844%20-0.148437%20c%20-0.328124%200.046874%20-0.632812%200.199218%20-0.867187%200.441406%20l%20-3.945313%203.996094%20c%20-0.3906245%200.375%20-0.5468745%200.933593%20-0.4062495%201.457031%20c%200.1406255%200.523437%200.5546875%200.929687%201.0820315%201.058593%20c%200.527344%200.132813%201.082031%20-0.03125%201.453125%20-0.425781%20l%203.945312%20-3.996093%20c%200.472657%20-0.453126%200.59375%20-1.15625%200.296875%20-1.738282%20l%205.890625%20-5.964844%20c%200.558594%200.25%201.273438%200.148438%201.707031%20-0.289062%20l%201.414063%20-1.5625%20z%20m%20-10.308594%200.0898438%20c%20-0.398437%200%20-0.785156%200.0937502%20-1.140625%200.2187502%20l%201.882812%201.878906%20c%200.390626%200.382812%200.390626%201%200%201.386719%20l%20-0.710937%200.707031%20c%20-0.386719%200.386719%20-1%200.386719%20-1.390625%200%20l%20-1.882812%20-1.878906%20c%20-0.125%200.355468%20-0.2187505%200.742187%20-0.2187505%201.140625%20c%200%201.90625%201.5507815%203.453125%203.4609375%203.453125%20c%200.402344%200%200.789063%20-0.09375%201.144531%20-0.21875%20l%201.175782%201.171875%20h%200.058593%20l%202.070313%20-2.0625%20l%20-1.203125%20-1.203125%20c%200.125%20-0.359375%200.214843%20-0.742188%200.214843%20-1.140625%20c%200%20-1.90625%20-1.546874%20-3.4531252%20-3.460937%20-3.4531252%20z%20m%206.550781%207.8906252%20l%20-2.070312%202.066406%20c%200.011718%200.027344%200.023437%200.058594%200.03125%200.089844%20l%201.144531%201.140625%20c%20-0.125%200.355468%20-0.21875%200.742187%20-0.21875%201.140625%20c%200%201.902343%201.550781%203.449219%203.460937%203.449219%20c%200.433594%200%200.855469%20-0.101563%201.238282%20-0.246094%20l%20-2.007813%20-2%20c%20-0.386719%20-0.386719%20-0.386719%20-1.035156%200%20-1.417969%20l%200.679688%20-0.679687%20c%200.195312%20-0.191407%200.457031%20-0.308594%200.710937%20-0.308594%20s%200.515625%200.117187%200.710938%200.308594%20l%201.945312%201.941406%20c%200.105469%20-0.328125%200.183594%20-0.683594%200.183594%20-1.046875%20c%200%20-1.90625%20-1.546875%20-3.453125%20-3.460938%20-3.453125%20c%20-0.398437%200%20-0.785156%200.09375%20-1.140624%200.21875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-application-x-executable: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208.015625%200.015625%20c%20-0.769531%200%20-1.539063%200.292969%20-2.121094%200.875%20l%20-5.003906%205.003906%20c%20-1.164063%201.164063%20-1.164063%203.078125%200%204.242188%20l%205.003906%205.003906%20c%201.164063%201.164063%203.078125%201.164063%204.242188%200%20l%205.007812%20-5.003906%20c%201.164063%20-1.164063%201.164063%20-3.078125%200%20-4.242188%20l%20-5.007812%20-5.003906%20c%20-0.582031%20-0.582031%20-1.351563%20-0.875%20-2.121094%20-0.875%20z%20m%200.101563%201.988281%20c%200.210937%200.023438%200.414062%200.117188%200.585937%200.28125%20l%20-0.339844%200.113282%20c%20-0.074219%20-0.136719%20-0.15625%20-0.269532%20-0.246093%20-0.394532%20z%20m%20-1.570313%201.058594%20c%200.300781%200.421875%200.464844%200.929688%200.46875%201.453125%20c%200%201.378906%20-1.121094%202.5%20-2.5%202.5%20c%20-0.523437%20-0.003906%20-1.03125%20-0.171875%20-1.449219%20-0.472656%20z%20m%203.441406%200.503906%20l%203.742188%203.742188%20c%200.402343%200.402344%200.402343%201.011718%200%201.414062%20l%20-0.253907%200.25%20c%20-0.039062%20-0.046875%20-0.074218%20-0.09375%20-0.117187%20-0.140625%20l%200.621094%20-0.855469%20l%20-0.808594%20-0.585937%20l%20-0.621094%200.851563%20c%20-0.167969%20-0.078126%20-0.347656%20-0.136719%20-0.535156%20-0.175782%20v%20-1.050781%20h%20-1%20v%201.050781%20c%20-0.183594%200.039063%20-0.363281%200.097656%20-0.53125%200.175782%20l%20-0.621094%20-0.851563%20l%20-0.804687%200.585937%20l%200.617187%200.855469%20c%20-0.125%200.136719%20-0.238281%200.289063%20-0.332031%200.453125%20l%20-1%20-0.324218%20l%20-0.308594%200.949218%20l%201%200.324219%20c%20-0.011718%200.09375%20-0.019531%200.1875%20-0.019531%200.28125%20s%200.007813%200.1875%200.019531%200.28125%20l%20-1%200.324219%20l%200.308594%200.949218%20l%201%20-0.324218%20c%200.09375%200.164062%200.207031%200.316406%200.332031%200.453125%20l%20-0.617187%200.855469%20l%200.195312%200.140624%20l%20-0.53125%200.53125%20c%20-0.402344%200.40625%20-1.011718%200.40625%20-1.414062%200%20l%20-4.902344%20-4.902343%20l%200.027344%20-0.039063%20l%200.210937%20-0.289062%20c%200.328125%200.152344%200.679688%200.269531%201.046875%200.339844%20v%201.179687%20h%201.648438%20v%20-1.179687%20c%200.363281%20-0.070313%200.714844%20-0.1875%201.046875%20-0.339844%20l%200.207031%200.289062%20l%200.484375%200.667969%20l%201.335937%20-0.972656%20l%20-0.484374%20-0.667969%20l%20-0.210938%20-0.289062%20c%200.25%20-0.269532%200.46875%20-0.566407%200.648438%20-0.890626%20l%200.339843%200.113282%20l%200.785157%200.253906%20l%200.507812%20-1.566406%20l%20-0.785156%20-0.257813%20l%20-0.335938%20-0.109375%20c%200.019532%20-0.179687%200.035156%20-0.363281%200.035156%20-0.550781%20s%20-0.015624%20-0.371094%20-0.035156%20-0.550781%20l%200.335938%20-0.109375%20l%200.785156%20-0.257813%20z%20m%201.527344%205.449219%20c%200.527344%200%200.984375%200.265625%201.25%200.667969%20l%20-2.078125%202.082031%20c%20-0.40625%20-0.269531%20-0.671875%20-0.722656%20-0.671875%20-1.25%20c%200%20-0.835937%200.667969%20-1.5%201.5%20-1.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3Cpath%20d%3D'm%204.039062%20-18.988281%20c%20-1.449218%200%20-2.679687%201.046875%20-2.964843%202.421875%20c%20-0.019531%200.097656%20-0.035157%200.199218%20-0.046875%200.300781%20c%20-0.007813%200.101563%20-0.015625%200.203125%20-0.015625%200.304687%20v%207.910157%20c%200%201.660156%201.367187%203.027343%203.027343%203.027343%20h%207.949219%20c%201.660157%200%203.027344%20-1.367187%203.027344%20-3.027343%20v%20-7.910157%20c%200%20-0.105468%20-0.003906%20-0.207031%20-0.015625%20-0.304687%20c%20-0.011719%20-0.101563%20-0.027344%20-0.203125%20-0.046875%20-0.300781%20c%20-0.285156%20-1.375%20-1.511719%20-2.421875%20-2.964844%20-2.421875%20z%20m%200%202.003906%20h%202.976563%20v%203%20h%20-2.976563%20c%20-0.585937%200%20-1.027343%20-0.441406%20-1.027343%20-1.027344%20v%20-0.949219%20c%200.003906%20-0.035156%200.003906%20-0.070312%200.007812%20-0.105468%20c%200.003907%20-0.035156%200.007813%20-0.070313%200.011719%20-0.105469%20c%200.007812%20-0.035156%200.019531%20-0.066406%200.027344%20-0.097656%20c%200.125%20-0.421875%200.503906%20-0.714844%200.980468%20-0.714844%20z%20m%204.976563%200%20h%202.972656%20c%200.585938%200%201.023438%200.4375%201.027344%201.023437%20v%200.949219%20c%200%200.585938%20-0.441406%201.027344%20-1.027344%201.027344%20h%20-2.972656%20z%20m%204%203.71875%20v%205.214844%20c%200%200.585937%20-0.441406%201.027343%20-1.027344%201.027343%20h%20-7.949219%20c%20-0.585937%200%20-1.027343%20-0.441406%20-1.027343%20-1.027343%20v%20-5.175781%20c%200.324219%200.148437%200.671875%200.246093%201.027343%200.246093%20h%202.976563%20v%203.035157%20l%202%200.992187%20v%20-4.027344%20h%202.972656%20c%200.34375%200%200.695313%20-0.113281%201.027344%20-0.285156%20z%20m%20-5%2033.28125%20c%20-0.851563%200%20-1.699219%200.328125%20-2.351563%200.976563%20l%20-4.671874%204.671874%20c%20-1.300782%201.300782%20-1.300782%203.402344%200%204.703126%20l%204.671874%204.671874%20c%201.300782%201.300782%203.402344%201.300782%204.699219%200%20l%204.675781%20-4.671874%20c%201.300782%20-1.300782%201.300782%20-3.402344%200%20-4.703126%20l%20-4.675781%20-4.671874%20c%20-0.648437%20-0.648438%20-1.496093%20-0.976563%20-2.347656%20-0.976563%20z%20m%200%201.984375%20c%200.335937%200%200.675781%200.132812%200.941406%200.402344%20l%203.03125%203.027344%20c%20-0.066406%200.039062%20-0.136719%200.070312%20-0.210937%200.09375%20c%20-0.019532%200.003906%20-0.039063%200.011718%20-0.0625%200.015624%20c%20-0.441406%200.148438%20-1.003906%200.019532%20-1.277344%20-0.359374%20l%20-0.140625%20-0.195313%20c%20-0.15625%20-0.210937%20-0.390625%20-0.355469%20-0.652344%20-0.398437%20c%20-0.066406%20-0.011719%20-0.132812%20-0.015626%20-0.199219%20-0.011719%20c%20-0.195312%200.007812%20-0.382812%200.074219%20-0.542968%200.191406%20c%20-0.449219%200.324219%20-0.550782%200.949219%20-0.226563%201.394531%20l%200.144531%200.199219%20c%200.273438%200.378906%200.226563%200.953125%20-0.050781%201.332031%20c%20-0.011719%200.015625%20-0.023437%200.03125%20-0.035156%200.050782%20c%20-0.273437%200.378906%20-0.808594%200.597656%20-1.253906%200.453124%20l%20-0.226563%20-0.074218%20c%20-0.523437%20-0.167969%20-1.089844%200.117187%20-1.257812%200.644531%20c%20-0.171875%200.523437%200.113281%201.089844%200.636718%201.261719%20l%200.226563%200.070312%20c%200.445313%200.144532%200.738281%200.640625%200.746094%201.105469%20c%200.003906%200.023437%200.003906%200.042969%200.003906%200.066406%20c%200.015625%200.464844%20-0.304687%200.960938%20-0.75%201.105469%20l%20-0.226563%200.074219%20c%20-0.179687%200.058593%20-0.332031%200.164062%20-0.445312%200.296875%20l%20-3.785156%20-3.785156%20c%20-0.535156%20-0.535157%20-0.535156%20-1.355469%200%20-1.890626%20l%204.667968%20-4.667968%20c%200.269532%20-0.269532%200.609376%20-0.402344%200.945313%20-0.402344%20z%20m%205.585937%205.234375%20c%200.058594%200%200.117188%200.003906%200.175782%200.007813%20c%200.382812%200.523437%200.335937%201.234374%20-0.144532%201.71875%20l%20-3.753906%203.75%20c%20-0.027344%20-0.066407%20-0.050781%20-0.136719%20-0.070312%20-0.203126%20c%20-0.003906%20-0.011718%20-0.007813%20-0.023437%20-0.011719%20-0.035156%20c%20-0.003906%20-0.007812%20-0.007813%20-0.011718%20-0.011719%20-0.019531%20c%20-0.285156%20-0.84375%20-0.152344%20-1.644531%200%20-2.4375%20c%200.003906%20-0.003906%200.007813%20-0.007813%200.011719%20-0.015625%20c%200.003906%20-0.011719%200.007813%20-0.027344%200.011719%20-0.039062%20c%200.261718%20-0.789063%200.757812%20-1.464844%201.410156%20-1.945313%20c%200.011719%20-0.003906%200.023438%20-0.011719%200.03125%20-0.015625%20c%200.019531%20-0.015625%200.042969%20-0.03125%200.058594%20-0.046875%20c%200.648437%20-0.453125%201.4375%20-0.71875%202.292968%20-0.71875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-close: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%204%20h%201%20h%200.03125%20c%200.253906%200.011719%200.511719%200.128906%200.6875%200.3125%20l%202.28125%202.28125%20l%202.3125%20-2.28125%20c%200.265625%20-0.230469%200.445312%20-0.304688%200.6875%20-0.3125%20h%201%20v%201%20c%200%200.285156%20-0.035156%200.550781%20-0.25%200.75%20l%20-2.28125%202.28125%20l%202.25%202.25%20c%200.1875%200.1875%200.28125%200.453125%200.28125%200.71875%20v%201%20h%20-1%20c%20-0.265625%200%20-0.53125%20-0.09375%20-0.71875%20-0.28125%20l%20-2.28125%20-2.28125%20l%20-2.28125%202.28125%20c%20-0.1875%200.1875%20-0.453125%200.28125%20-0.71875%200.28125%20h%20-1%20v%20-1%20c%200%20-0.265625%200.09375%20-0.53125%200.28125%20-0.71875%20l%202.28125%20-2.25%20l%20-2.28125%20-2.28125%20c%20-0.210938%20-0.195312%20-0.304688%20-0.46875%20-0.28125%20-0.75%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-minimize: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%2010.007812%20h%208%20v%201.988282%20h%20-8%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-maximize: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203.988281%203.992188%20v%208.011718%20h%208.011719%20v%20-8.011718%20z%20m%202%202%20h%204.011719%20v%204.011718%20h%20-4.011719%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-restore: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.988281%204.992188%20v%206.011718%20h%206.011719%20v%20-6.011718%20z%20m%202%202%20h%202.011719%20v%202.011718%20h%20-2.011719%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-image-missing: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.015625%201.03125%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%201%20h%201%20v%20-1%20c%200%20-1.109375%200.890625%20-2%202%20-2%20h%201%20v%20-1%20z%20m%202%200%20v%201%20h%204%20v%20-1%20z%20m%205%200%20v%201%20h%201%20c%201.109375%200%202%200.890625%202%202%20v%201%20h%201%20v%20-1%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%20-5%204%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20z%20m%20-5%201%20v%204%20h%201%20v%20-4%20z%20m%2013%200%20v%204%20h%201%20v%20-4%20z%20m%20-4.5%202%20l%20-2%202%20l%20-1.5%20-1%20l%20-2%202%20v%200.5%20c%200%200.5%200.5%200.5%200.5%200.5%20h%207%20s%200.472656%20-0.035156%200.5%20-0.5%20v%20-1%20z%20m%20-8.5%203%20v%201%20c%200%201.644531%201.355469%203%203%203%20h%201%20v%20-1%20h%20-1%20c%20-1.109375%200%20-2%20-0.890625%20-2%20-2%20v%20-1%20z%20m%2013%200%20v%201%20c%200%201.109375%20-0.890625%202%20-2%202%20h%20-1%20v%201%20h%201%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-1%20z%20m%20-8%203%20v%201%20h%204%20v%20-1%20z%20m%200%200'%20fill%3D'currentColor'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-recent: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208.484375%200.0195312%20c%20-4.128906%200%20-7.484375%203.3554688%20-7.484375%207.4882808%20c%200%204.128907%203.355469%207.484376%207.484375%207.484376%20c%204.132813%200%207.488281%20-3.355469%207.488281%20-7.484376%20c%200%20-4.132812%20-3.355468%20-7.4882808%20-7.488281%20-7.4882808%20z%20m%200%201.9726568%20c%203.050781%200%205.515625%202.464843%205.515625%205.515624%20c%200%203.046876%20-2.464844%205.511719%20-5.515625%205.511719%20c%20-3.046875%200%20-5.511719%20-2.464843%20-5.511719%20-5.511719%20c%200%20-3.050781%202.464844%20-5.515624%205.511719%20-5.515624%20z%20m%203.011719%202.007812%20c%20-0.035156%200%20-0.070313%200%20-0.105469%200.007812%20c%20-0.097656%200.023438%20-0.183594%200.078126%20-0.25%200.15625%20l%20-2.65625%202.65625%20l%20-1.65625%20-1.65625%20c%20-0.105469%20-0.179687%20-0.3125%20-0.269531%20-0.515625%20-0.234374%20c%20-0.203125%200.039062%20-0.363281%200.199218%20-0.402344%200.402343%20c%20-0.039062%200.203125%200.054688%200.410157%200.230469%200.519531%20l%202%202%20c%200.195313%200.179688%200.496094%200.179688%200.6875%200%20l%203%20-3%20c%200.140625%20-0.140624%200.179687%20-0.351562%200.109375%20-0.535156%20c%20-0.074219%20-0.183594%20-0.246094%20-0.308594%20-0.441406%20-0.316406%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-people: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-4.402344%200%20-8%203.597656%20-8%208%20s%203.597656%208%208%208%20s%208%20-3.597656%208%20-8%20s%20-3.597656%20-8%20-8%20-8%20z%20m%200%201.980469%20c%203.339844%200%206.019531%202.679687%206.019531%206.019531%20s%20-2.679687%206.019531%20-6.019531%206.019531%20s%20-6.019531%20-2.679687%20-6.019531%20-6.019531%20s%202.679687%20-6.019531%206.019531%20-6.019531%20z%20m%20-2%203.019531%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20z%20m%204%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20z%20m%20-5.28125%204.066406%20c%20-0.113281%200.066406%20-0.199219%200.175782%20-0.234375%200.304688%20s%20-0.015625%200.265625%200.050781%200.378906%20c%200.714844%201.238281%202.035156%202%203.464844%202%20s%202.75%20-0.761719%203.464844%20-2%20c%200.066406%20-0.113281%200.085937%20-0.25%200.050781%20-0.378906%20s%20-0.121094%20-0.238282%20-0.234375%20-0.304688%20s%20-0.25%20-0.085937%20-0.378906%20-0.050781%20s%20-0.238282%200.121094%20-0.304688%200.234375%20c%20-0.535156%200.929688%20-1.523437%201.5%20-2.597656%201.5%20s%20-2.0625%20-0.570312%20-2.597656%20-1.5%20c%20-0.066406%20-0.113281%20-0.175782%20-0.199219%20-0.304688%20-0.234375%20s%20-0.265625%20-0.015625%20-0.378906%200.050781%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-body: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%207%20v%208%20h%2011%20c%200.4375%200%200.875%20-0.375%201%20-1%20l%201%20-5.96875%20v%20-2.03125%20c%200%20-0.535156%20-0.40625%20-1%20-1%20-1%20h%20-3.898438%20l%200.898438%20-3.5%20c%200.226562%20-0.839844%20-0.433594%20-1.5%20-1%20-1.5%20h%20-1%20l%20-4.042969%207%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-nature: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.003906%201%20s%20-3%200%20-3%203%20v%205%20s%200.042969%201.417969%200.027344%202%20c%200%201%20-0.535156%201.414062%20-1.402344%202.121094%20c%20-0.628906%200.488281%20-0.773437%201.308594%20-0.308594%201.699218%20c%200.429688%200.351563%201.164063%200.300782%201.660157%20-0.34375%20l%201.019531%20-1.476562%20c%200.699219%20-1.015625%200.984375%20-1.875%201%20-3%20l%200.003906%20-6%20c%200%20-1%200.996094%20-1%200.996094%20-1%20v%206.574219%20l%203.003906%20-3.074219%20v%20-2.5%20c%200%20-1%200.996094%20-1%200.996094%20-1%20l%200.003906%202.5%20l%201.996094%20-2.035156%20c%200.339844%20-0.3125%200.503906%20-0.464844%201%20-0.464844%20l%200.003906%201%20l%20-4.003906%204%20h%204%20s%200.003906%201%20-1%201%20h%20-4%20l%20-2%202%20c%200%200.425781%200%202.007812%202%202.007812%20l%204.003906%20-0.007812%20s%203%200%202.996094%20-2.992188%20v%20-9.007812%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-food: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%200.984375%20-0.0117188%20c%20-0.550781%200.00781255%20-0.9921875%200.4609378%20-0.984375%201.0117188%20v%204%20s%200.0078125%200.84375%200.574219%201.601562%20c%200.449219%200.59375%201.257812%201.117188%202.425781%201.3125%20v%201.085938%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%205%20c%200%200.550781%200.449219%201%201%201%20h%202%20c%200.550781%200%201%20-0.449219%201%20-1%20v%20-5%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20v%20-1.085938%20c%201.167969%20-0.195312%201.976562%20-0.71875%202.425781%20-1.3125%20c%200.566407%20-0.757812%200.574219%20-1.601562%200.574219%20-1.601562%20v%20-4%20c%200.003906%20-0.359375%20-0.183594%20-0.695312%20-0.496094%20-0.878906%20c%20-0.3125%20-0.1796878%20-0.695312%20-0.1796878%20-1.007812%200%20c%20-0.3125%200.183594%20-0.5%200.519531%20-0.496094%200.878906%20v%203.5%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-3.5%20c%200.003906%20-0.269531%20-0.101562%20-0.53125%20-0.292969%20-0.722656%20c%20-0.191406%20-0.1914065%20-0.453125%20-0.2968752%20-0.722656%20-0.2890628%20c%20-0.550781%200.00781255%20-0.992187%200.4609378%20-0.984375%201.0117188%20v%203.5%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-3.5%20c%200.003906%20-0.269531%20-0.101562%20-0.53125%20-0.292969%20-0.722656%20c%20-0.191406%20-0.1914065%20-0.453125%20-0.2968752%20-0.722656%20-0.2890628%20z%20m%2012.984375%200.0117188%20c%20-0.253906%200.0078125%20-0.496094%200.113281%20-0.675781%200.292969%20c%20-1.734375%201.734375%20-2.503907%204.160156%20-2.898438%206.136719%20c%20-0.394531%201.976562%20-0.394531%203.570312%20-0.394531%203.570312%20c%200%200.550781%200.449219%201%201%201%20h%201%20v%204%20c%200%200.550781%200.449219%201%201%201%20h%201%20c%200.550781%200%201%20-0.449219%201%20-1%20v%20-14%20c%200%20-0.5625%20-0.464844%20-1.015625%20-1.03125%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-travel: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203.003906%201%20c%20-0.460937%200%20-0.859375%200.3125%20-0.972656%200.757812%20l%20-1%204%20c%20-0.019531%200.078126%20-0.027344%200.160157%20-0.027344%200.242188%20v%200.039062%20c%20-0.566406%200.09375%20-0.99999975%200.5625%20-0.99999975%201.15625%20v%204.613282%20c%200%200.589844%200.43359375%201.058594%200.99999975%201.152344%20v%201.539062%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%202%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20v%20-1.5%20h%208%20v%201.5%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%202%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20v%20-1.539062%20c%200.5625%20-0.09375%201%20-0.5625%201%20-1.15625%20v%20-4.609376%20c%200%20-0.59375%20-0.4375%20-1.0625%20-1%20-1.15625%20v%20-0.039062%20c%200%20-0.082031%20-0.011718%20-0.164062%20-0.03125%20-0.242188%20l%20-1%20-4%20c%20-0.109375%20-0.445312%20-0.511718%20-0.757812%20-0.96875%20-0.757812%20z%20m%200.78125%202%20h%208.4375%20l%200.75%203%20h%20-9.9375%20z%20m%20-0.28125%205%20c%200.828125%200%201.5%200.671875%201.5%201.5%20s%20-0.671875%201.5%20-1.5%201.5%20s%20-1.5%20-0.671875%20-1.5%20-1.5%20s%200.671875%20-1.5%201.5%20-1.5%20z%20m%209%200%20c%200.828125%200%201.5%200.671875%201.5%201.5%20s%20-0.671875%201.5%20-1.5%201.5%20s%20-1.5%20-0.671875%20-1.5%20-1.5%20s%200.671875%20-1.5%201.5%20-1.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-activities: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-4.40625%200%20-8%203.59375%20-8%208%20s%203.59375%208%208%208%20s%208%20-3.59375%208%20-8%20s%20-3.59375%20-8%20-8%20-8%20z%20m%200%202%20c%200.039062%200%200.074219%200.003906%200.113281%200.007812%20c%20-0.335937%201.648438%200.167969%203.394532%201.429688%204.601563%20c%201.203125%201.15625%202.875%201.601563%204.453125%201.285156%20c%200%200.035157%200.003906%200.070313%200.003906%200.105469%20c%200%203.324219%20-2.675781%206%20-6%206%20c%20-0.039062%200%20-0.078125%20-0.003906%20-0.113281%20-0.007812%20c%200.320312%20-1.582032%20-0.128907%20-3.257813%20-1.28125%20-4.460938%20c%20-0.722657%20-0.746094%20-1.636719%20-1.234375%20-2.609375%20-1.429688%20c%20-0.246094%20-0.050781%20-0.492188%20-0.082031%20-0.742188%20-0.09375%20c%20-0.414062%20-0.023437%20-0.835937%200.011719%20-1.246094%200.097657%20c%20-0.003906%20-0.035157%20-0.007812%20-0.070313%20-0.007812%20-0.105469%20c%200%20-3.324219%202.675781%20-6%206%20-6%20z%20m%201.113281%200.105469%20c%202.429688%200.453125%204.332031%202.355469%204.78125%204.785156%20c%20-1.289062%200.296875%20-2.671875%20-0.050781%20-3.660156%20-1.003906%20c%20-1.035156%20-0.988281%20-1.433594%20-2.429688%20-1.121094%20-3.78125%20z%20m%20-5.90625%206.898437%20c%200.992188%200.050782%201.953125%200.472656%202.675781%201.222656%20c%200.949219%200.988282%201.304688%202.371094%201.007813%203.667969%20c%20-2.433594%20-0.453125%20-4.335937%20-2.355469%20-4.785156%20-4.789062%20c%200.363281%20-0.082031%200.734375%20-0.121094%201.101562%20-0.101563%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-objects: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%207.992188%200%20c%20-2.832032%200%20-5.289063%202%20-5.871094%204.777344%20c%20-0.527344%202.535156%200.691406%205.035156%202.875%206.328125%20l%200.003906%200.898437%20c%200%200.550782%200.445312%200.996094%201%200.996094%20h%204%20c%200.550781%200%200.996094%20-0.445312%201%20-0.996094%20v%20-0.902344%20c%202.183594%20-1.292968%203.398438%20-3.796874%202.871094%20-6.328124%20c%20-0.582032%20-2.777344%20-3.042969%20-4.773438%20-5.875%20-4.773438%20z%20m%200%202%20c%201.902343%200%203.53125%201.320312%203.917968%203.183594%20c%200.390625%201.859375%20-0.570312%203.722656%20-2.3125%204.484375%20c%20-0.363281%200.15625%20-0.597656%200.515625%20-0.597656%200.914062%20v%200.417969%20h%20-2.003906%20v%20-0.417969%20c%200%20-0.398437%20-0.234375%20-0.753906%20-0.601563%20-0.914062%20c%20-1.738281%20-0.761719%20-2.703125%20-2.625%20-2.316406%20-4.484375%20c%200.390625%20-1.859375%202.015625%20-3.183594%203.914063%20-3.183594%20z%20m%20-1.996094%2012%20v%201%20c%200%200.554688%200.449218%201%201%201%20h%202%20c%200.554687%200%201%20-0.445312%201%20-1%20v%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%206.644531%206.144531%20c%20-0.195312%200.195313%20-0.195312%200.515625%200%200.710938%20l%201%201%20c%200.191407%200.191406%200.511719%200.191406%200.707031%200%20l%201%20-1%20c%200.191407%20-0.195313%200.191407%20-0.515625%200%20-0.710938%20c%20-0.195312%20-0.191406%20-0.515624%20-0.191406%20-0.707031%200%20l%20-0.648437%200.648438%20l%20-0.644532%20-0.648438%20c%20-0.195312%20-0.191406%20-0.515624%20-0.191406%20-0.707031%200%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-symbols: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.5%201%20c%20-0.257812%200%20-0.511719%200.097656%20-0.707031%200.292969%20l%20-2.5%202.5%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%202.5%202.5%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%202.5%20-2.5%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20l%20-2.5%20-2.5%20c%20-0.195312%20-0.195313%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%207.515625%201%20c%20-0.023437%200%20-0.046875%200%20-0.070313%200.003906%20c%20-0.335937%200.015625%20-0.640624%200.203125%20-0.808593%200.496094%20l%20-2.320313%204%20c%20-0.386718%200.664062%200.089844%201.5%200.863282%201.5%20h%204.644531%20c%200.769531%200%201.246093%20-0.835938%200.863281%20-1.5%20l%20-2.320312%20-4%20c%20-0.179688%20-0.308594%20-0.503907%20-0.496094%20-0.851563%20-0.5%20z%20m%20-5.015625%207%20c%20-1.65625%200%20-3%201.34375%20-3%203%20s%201.34375%203%203%203%20s%203%20-1.34375%203%20-3%20s%20-1.34375%20-3%20-3%20-3%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-flags: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%2015%20h%202%20v%20-8%20h%202.382812%20l%200.722657%201.449219%20c%200.167969%200.335937%200.515625%200.550781%200.894531%200.550781%20h%205%20c%200.550781%200%201%20-0.449219%201%20-1%20v%20-6%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20h%20-3.382812%20l%20-0.722657%20-1.449219%20c%20-0.167969%20-0.335937%20-0.515625%20-0.550781%20-0.894531%20-0.550781%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-edit-find: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-3.578125%200%20-6.5%202.921875%20-6.5%206.5%20s%202.921875%206.5%206.5%206.5%20c%201.429688%200%202.753906%20-0.46875%203.828125%20-1.257812%20l%202.945313%202.945312%20c%200.957031%200.9375%202.363281%20-0.5%201.40625%20-1.4375%20l%20-2.929688%20-2.929688%20c%200.785156%20-1.074218%201.25%20-2.394531%201.25%20-3.820312%20c%200%20-3.578125%20-2.921875%20-6.5%20-6.5%20-6.5%20z%20m%200%202%20c%202.496094%200%204.5%202.003906%204.5%204.5%20s%20-2.003906%204.5%20-4.5%204.5%20s%20-4.5%20-2.003906%20-4.5%20-4.5%20s%202.003906%20-4.5%204.5%20-4.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-printer: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%205%201%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%201%20h%208%20v%20-1%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-3%203%20c%20-1.109375%200%20-2%200.890625%20-2%202%20v%204%20c%200%201.109375%200.890625%202%202%202%20v%201%20c%200%201.089844%200.910156%202%202%202%20h%208%20c%201.089844%200%202%20-0.910156%202%20-2%20v%20-1%20c%201.109375%200%202%20-0.890625%202%20-2%20v%20-4%20c%200%20-1.109375%20-0.890625%20-2%20-2%20-2%20z%20m%202%206%20h%208%20v%203%20h%20-8%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-face-smile: url(\"data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'16'%20height%3D'16'%3E%3Cpath%20d%3D'M8%201a7%207%200%20100%2014A7%207%200%20008%201zM6%205c.559%200%201.031.473%201.031%201.031V7c0%20.558-.472%201-1.03%201-.56%200-1-.442-1-1v-.969C5%205.473%205.44%205%206%205zm4%200c.559%200%201%20.473%201%201.031V7c0%20.558-.441%201-1%201-.558%200-1-.442-1-1v-.969C9%205.473%209.442%205%2010%205zM3%209.07c.997.637%204.017.917%205%20.917.984%200%203.805.051%205-.917v.5c0%20.68-1.744%201.404-5%201.404-3.256%200-5-.872-5-1.404z'%20fill%3D'currentColor'%2F%3E%3C%2Fsvg%3E\");\n --icon-dialog-warning: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.90625%200.09375%20c%20-0.527344%20-0.0273438%20-1.039062%200.28125%20-1.4375%200.96875%20l%20-6.25%2011.59375%20c%20-0.535156%200.964844%200.046875%202.34375%201.09375%202.34375%20h%2013.15625%20c%200.980469%200%201.902344%20-1.160156%201.21875%20-2.34375%20l%20-6.3125%20-11.53125%20c%20-0.398438%20-0.644531%20-0.941406%20-1.003906%20-1.46875%20-1.03125%20z%20m%201.09375%203.90625%20v%205%20c%200.007812%200.527344%20-0.472656%201%20-1%201%20s%20-1.007812%20-0.472656%20-1%20-1%20v%20-5%20z%20m%20-1%207%20c%200.550781%200%201%200.449219%201%201%20s%20-0.449219%201%20-1%201%20s%20-1%20-0.449219%20-1%20-1%20s%200.449219%20-1%201%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-pan-end: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%2013%20c%200.265625%200%200.519531%20-0.101562%200.707031%20-0.292969%20l%204%20-4%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20l%20-4.003906%20-4%20c%20-0.390625%20-0.386719%20-1.023437%20-0.386719%20-1.414063%200%20c%20-0.386718%200.394531%20-0.386718%201.027343%200.003907%201.414062%20l%203.292969%203.292969%20l%20-3.292969%203.292969%20c%20-0.390625%200.390625%20-0.390625%201.027343%200%201.414062%20c%200.1875%200.191407%200.441406%200.292969%200.707031%200.292969%20z%20m%200%200'%20fill%3D'currentColor'%20fill-rule%3D'evenodd'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-pan-end-rtl: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208.285156%2012.699219%20l%20-3.917968%20-4%20c%20-0.378907%20-0.390625%20-0.378907%20-1.007813%200%20-1.394531%20l%203.917968%20-4%20c%200.382813%20-0.398438%201.015625%20-0.40625%201.414063%20-0.019532%20c%200.394531%200.382813%200.402343%201.015625%200.019531%201.414063%20l%20-3.242188%203.300781%20l%203.242188%203.300781%20c%200.382812%200.398438%200.375%201.03125%20-0.019531%201.417969%20c%20-0.398438%200.382812%20-1.03125%200.375%20-1.414063%20-0.019531%20z%20m%200%200'%20fill%3D'currentColor'%20fill-rule%3D'evenodd'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-pan-down: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203.292969%207.707031%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%204%20-4%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-3.292969%203.292969%20l%20-3.292969%20-3.292969%20c%20-0.390625%20-0.390625%20-1.023437%20-0.390625%20-1.414062%200%20s%20-0.390625%201.023437%200%201.414062%20z%20m%200%200'%20fill%3D'currentColor'%20fill-rule%3D'evenodd'%2F%3E%20%3C%2Fsvg%3E\");\n}\n\n.adw-icon--go-down {\n mask-image: var(--icon-go-down);\n -webkit-mask-image: var(--icon-go-down);\n}\n\n.adw-icon--sidebar-show {\n mask-image: var(--icon-sidebar-show);\n -webkit-mask-image: var(--icon-sidebar-show);\n}\n\n.adw-icon--go-previous {\n mask-image: var(--icon-go-previous);\n -webkit-mask-image: var(--icon-go-previous);\n}\n\n.adw-icon--go-next {\n mask-image: var(--icon-go-next);\n -webkit-mask-image: var(--icon-go-next);\n}\n\n.adw-icon--go-up {\n mask-image: var(--icon-go-up);\n -webkit-mask-image: var(--icon-go-up);\n}\n\n.adw-icon--view-refresh {\n mask-image: var(--icon-view-refresh);\n -webkit-mask-image: var(--icon-view-refresh);\n}\n\n.adw-icon--open-menu {\n mask-image: var(--icon-open-menu);\n -webkit-mask-image: var(--icon-open-menu);\n}\n\n.adw-icon--go-home {\n mask-image: var(--icon-go-home);\n -webkit-mask-image: var(--icon-go-home);\n}\n\n.adw-icon--list-add {\n mask-image: var(--icon-list-add);\n -webkit-mask-image: var(--icon-list-add);\n}\n\n.adw-icon--network-wireless {\n mask-image: var(--icon-network-wireless);\n -webkit-mask-image: var(--icon-network-wireless);\n}\n\n.adw-icon--folder {\n mask-image: var(--icon-folder);\n -webkit-mask-image: var(--icon-folder);\n}\n\n.adw-icon--starred {\n mask-image: var(--icon-starred);\n -webkit-mask-image: var(--icon-starred);\n}\n\n.adw-icon--system-search {\n mask-image: var(--icon-system-search);\n -webkit-mask-image: var(--icon-system-search);\n}\n\n.adw-icon--contact-new {\n mask-image: var(--icon-contact-new);\n -webkit-mask-image: var(--icon-contact-new);\n}\n\n.adw-icon--mail-unread {\n mask-image: var(--icon-mail-unread);\n -webkit-mask-image: var(--icon-mail-unread);\n}\n\n.adw-icon--avatar-default {\n mask-image: var(--icon-avatar-default);\n -webkit-mask-image: var(--icon-avatar-default);\n}\n\n.adw-icon--media-playback-start {\n mask-image: var(--icon-media-playback-start);\n -webkit-mask-image: var(--icon-media-playback-start);\n}\n\n.adw-icon--media-playback-pause {\n mask-image: var(--icon-media-playback-pause);\n -webkit-mask-image: var(--icon-media-playback-pause);\n}\n\n.adw-icon--media-eject {\n mask-image: var(--icon-media-eject);\n -webkit-mask-image: var(--icon-media-eject);\n}\n\n.adw-icon--media-playlist-repeat {\n mask-image: var(--icon-media-playlist-repeat);\n -webkit-mask-image: var(--icon-media-playlist-repeat);\n}\n\n.adw-icon--dialog-error {\n mask-image: var(--icon-dialog-error);\n -webkit-mask-image: var(--icon-dialog-error);\n}\n\n.adw-icon--audio-volume-muted {\n mask-image: var(--icon-audio-volume-muted);\n -webkit-mask-image: var(--icon-audio-volume-muted);\n}\n\n.adw-icon--audio-volume-low {\n mask-image: var(--icon-audio-volume-low);\n -webkit-mask-image: var(--icon-audio-volume-low);\n}\n\n.adw-icon--audio-volume-medium {\n mask-image: var(--icon-audio-volume-medium);\n -webkit-mask-image: var(--icon-audio-volume-medium);\n}\n\n.adw-icon--audio-volume-high {\n mask-image: var(--icon-audio-volume-high);\n -webkit-mask-image: var(--icon-audio-volume-high);\n}\n\n.adw-icon--camera-photo {\n mask-image: var(--icon-camera-photo);\n -webkit-mask-image: var(--icon-camera-photo);\n}\n\n.adw-icon--user-trash {\n mask-image: var(--icon-user-trash);\n -webkit-mask-image: var(--icon-user-trash);\n}\n\n.adw-icon--view-reveal {\n mask-image: var(--icon-view-reveal);\n -webkit-mask-image: var(--icon-view-reveal);\n}\n\n.adw-icon--view-conceal {\n mask-image: var(--icon-view-conceal);\n -webkit-mask-image: var(--icon-view-conceal);\n}\n\n.adw-icon--value-increase {\n mask-image: var(--icon-value-increase);\n -webkit-mask-image: var(--icon-value-increase);\n}\n\n.adw-icon--value-decrease {\n mask-image: var(--icon-value-decrease);\n -webkit-mask-image: var(--icon-value-decrease);\n}\n\n.adw-icon--edit-clear {\n mask-image: var(--icon-edit-clear);\n -webkit-mask-image: var(--icon-edit-clear);\n}\n\n.adw-icon--document-edit {\n mask-image: var(--icon-document-edit);\n -webkit-mask-image: var(--icon-document-edit);\n}\n\n.adw-icon--document-open {\n mask-image: var(--icon-document-open);\n -webkit-mask-image: var(--icon-document-open);\n}\n\n.adw-icon--document-save {\n mask-image: var(--icon-document-save);\n -webkit-mask-image: var(--icon-document-save);\n}\n\n.adw-icon--mail-send {\n mask-image: var(--icon-mail-send);\n -webkit-mask-image: var(--icon-mail-send);\n}\n\n.adw-icon--mail-reply-sender {\n mask-image: var(--icon-mail-reply-sender);\n -webkit-mask-image: var(--icon-mail-reply-sender);\n}\n\n.adw-icon--folder-documents {\n mask-image: var(--icon-folder-documents);\n -webkit-mask-image: var(--icon-folder-documents);\n}\n\n.adw-icon--folder-download {\n mask-image: var(--icon-folder-download);\n -webkit-mask-image: var(--icon-folder-download);\n}\n\n.adw-icon--view-grid {\n mask-image: var(--icon-view-grid);\n -webkit-mask-image: var(--icon-view-grid);\n}\n\n.adw-icon--view-list {\n mask-image: var(--icon-view-list);\n -webkit-mask-image: var(--icon-view-list);\n}\n\n.adw-icon--view-more {\n mask-image: var(--icon-view-more);\n -webkit-mask-image: var(--icon-view-more);\n}\n\n.adw-icon--view-paged {\n mask-image: var(--icon-view-paged);\n -webkit-mask-image: var(--icon-view-paged);\n}\n\n.adw-icon--view-columns {\n mask-image: var(--icon-view-columns);\n -webkit-mask-image: var(--icon-view-columns);\n}\n\n.adw-icon--list-remove {\n mask-image: var(--icon-list-remove);\n -webkit-mask-image: var(--icon-list-remove);\n}\n\n.adw-icon--send-to {\n mask-image: var(--icon-send-to);\n -webkit-mask-image: var(--icon-send-to);\n}\n\n.adw-icon--folder-music {\n mask-image: var(--icon-folder-music);\n -webkit-mask-image: var(--icon-folder-music);\n}\n\n.adw-icon--edit-copy {\n mask-image: var(--icon-edit-copy);\n -webkit-mask-image: var(--icon-edit-copy);\n}\n\n.adw-icon--emblem-system {\n mask-image: var(--icon-emblem-system);\n -webkit-mask-image: var(--icon-emblem-system);\n}\n\n.adw-icon--preferences-system {\n mask-image: var(--icon-preferences-system);\n -webkit-mask-image: var(--icon-preferences-system);\n}\n\n.adw-icon--application-x-executable {\n mask-image: var(--icon-application-x-executable);\n -webkit-mask-image: var(--icon-application-x-executable);\n}\n\n.adw-icon--window-close {\n mask-image: var(--icon-window-close);\n -webkit-mask-image: var(--icon-window-close);\n}\n\n.adw-icon--window-minimize {\n mask-image: var(--icon-window-minimize);\n -webkit-mask-image: var(--icon-window-minimize);\n}\n\n.adw-icon--window-maximize {\n mask-image: var(--icon-window-maximize);\n -webkit-mask-image: var(--icon-window-maximize);\n}\n\n.adw-icon--window-restore {\n mask-image: var(--icon-window-restore);\n -webkit-mask-image: var(--icon-window-restore);\n}\n\n.adw-icon--image-missing {\n mask-image: var(--icon-image-missing);\n -webkit-mask-image: var(--icon-image-missing);\n}\n\n.adw-icon--emoji-recent {\n mask-image: var(--icon-emoji-recent);\n -webkit-mask-image: var(--icon-emoji-recent);\n}\n\n.adw-icon--emoji-people {\n mask-image: var(--icon-emoji-people);\n -webkit-mask-image: var(--icon-emoji-people);\n}\n\n.adw-icon--emoji-body {\n mask-image: var(--icon-emoji-body);\n -webkit-mask-image: var(--icon-emoji-body);\n}\n\n.adw-icon--emoji-nature {\n mask-image: var(--icon-emoji-nature);\n -webkit-mask-image: var(--icon-emoji-nature);\n}\n\n.adw-icon--emoji-food {\n mask-image: var(--icon-emoji-food);\n -webkit-mask-image: var(--icon-emoji-food);\n}\n\n.adw-icon--emoji-travel {\n mask-image: var(--icon-emoji-travel);\n -webkit-mask-image: var(--icon-emoji-travel);\n}\n\n.adw-icon--emoji-activities {\n mask-image: var(--icon-emoji-activities);\n -webkit-mask-image: var(--icon-emoji-activities);\n}\n\n.adw-icon--emoji-objects {\n mask-image: var(--icon-emoji-objects);\n -webkit-mask-image: var(--icon-emoji-objects);\n}\n\n.adw-icon--emoji-symbols {\n mask-image: var(--icon-emoji-symbols);\n -webkit-mask-image: var(--icon-emoji-symbols);\n}\n\n.adw-icon--emoji-flags {\n mask-image: var(--icon-emoji-flags);\n -webkit-mask-image: var(--icon-emoji-flags);\n}\n\n.adw-icon--edit-find {\n mask-image: var(--icon-edit-find);\n -webkit-mask-image: var(--icon-edit-find);\n}\n\n.adw-icon--printer {\n mask-image: var(--icon-printer);\n -webkit-mask-image: var(--icon-printer);\n}\n\n.adw-icon--face-smile {\n mask-image: var(--icon-face-smile);\n -webkit-mask-image: var(--icon-face-smile);\n}\n\n.adw-icon--dialog-warning {\n mask-image: var(--icon-dialog-warning);\n -webkit-mask-image: var(--icon-dialog-warning);\n}\n\n.adw-icon--pan-end {\n mask-image: var(--icon-pan-end);\n -webkit-mask-image: var(--icon-pan-end);\n}\n\n.adw-icon--pan-end-rtl {\n mask-image: var(--icon-pan-end-rtl);\n -webkit-mask-image: var(--icon-pan-end-rtl);\n}\n\n.adw-icon--pan-down {\n mask-image: var(--icon-pan-down);\n -webkit-mask-image: var(--icon-pan-down);\n}\n","// _variables.scss — Adwaita CSS custom properties (light theme defaults).\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss (canonical color palette)\n// Reference: refs/adwaita-web/adwaita-web/scss/_variables.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Subset adapted for @gjsify/adwaita-web Web Components.\n\n@mixin light-theme {\n // Window\n --window-bg-color: #fafafb;\n --window-fg-color: rgba(0, 0, 6, 0.8);\n\n // Views\n --view-bg-color: #ffffff;\n --view-fg-color: rgba(0, 0, 6, 0.8);\n\n // Header bar\n --headerbar-bg-color: #ffffff;\n --headerbar-fg-color: rgba(0, 0, 6, 0.8);\n --headerbar-shade-color: rgba(0, 0, 6, 0.12);\n\n // Hairline separators (header underline, sidebar/pane dividers). Subtle in\n // BOTH themes — dark theme flips to a faint light line, the way libadwaita\n // draws separators, instead of a harsh near-black line on a dark surface.\n --separator-color: rgba(0, 0, 6, 0.1);\n\n // The GENERIC shade the whole `*-shade-color` family below specialises\n // (`_colors.scss:79,141`). Scroll undershoots are drawn from it, and it belongs\n // to the palette rather than to any one widget: a scroller can sit on a window,\n // a view, a sidebar or a card, and reading its neighbour's shade would make the\n // same indicator four different colours.\n --shade-color: rgba(0, 0, 6, 0.07);\n\n // Sidebar / split panes. libadwaita defines the whole family, not just the\n // background (_colors.scss:47-58), and only the background was here — so\n // `.sidebar-pane` had no foreground to name, and an app overriding\n // `--sidebar-fg-color` was overriding nothing.\n --sidebar-bg-color: #ebebed;\n --sidebar-fg-color: rgba(0, 0, 6, 0.8);\n --sidebar-backdrop-color: #f2f2f4;\n --sidebar-shade-color: rgba(0, 0, 6, 0.07);\n --sidebar-border-color: rgba(0, 0, 6, 0.07);\n\n // The MIDDLE pane of a three-pane setup. Nothing renders one yet; the tokens\n // are defined because they are public API an app may already reference, and a\n // half-present family reads as \"this one is unsupported\" rather than \"this\n // composition is not built yet\".\n --secondary-sidebar-bg-color: #f3f3f5;\n --secondary-sidebar-fg-color: rgba(0, 0, 6, 0.8);\n --secondary-sidebar-backdrop-color: #f6f6fa;\n --secondary-sidebar-shade-color: rgba(0, 0, 6, 0.07);\n --secondary-sidebar-border-color: rgba(0, 0, 6, 0.07);\n\n // Cards / boxed lists\n --card-bg-color: #ffffff;\n --card-fg-color: rgba(0, 0, 6, 0.8);\n --card-shade-color: rgba(0, 0, 6, 0.07);\n\n // Accent\n --accent-bg-color: #3584e4;\n --accent-fg-color: #ffffff;\n --accent-color: #1c71d8;\n\n // Popover (menus, dropdowns) — an elevated surface above the window.\n --popover-bg-color: #ffffff;\n --popover-fg-color: rgba(0, 0, 6, 0.8);\n --popover-shade-color: rgba(0, 0, 6, 0.07);\n\n // Dialog scrim — the dimming wash behind a presented dialog (Adw dims with\n // --shade-color at double alpha; this is the equivalent neutral wash).\n --dialog-scrim-color: rgba(0, 0, 6, 0.32);\n\n // Buttons\n --button-bg-color: rgba(0, 0, 6, 0.08);\n --button-hover-color: rgba(0, 0, 6, 0.13);\n --button-active-color: rgba(0, 0, 6, 0.19);\n\n // Entries\n --entry-bg-color: rgba(0, 0, 6, 0.1);\n --entry-border-color: rgba(0, 0, 6, 0.18);\n --entry-border-hover-color: rgba(0, 0, 6, 0.28);\n\n // Destructive action\n --destructive-bg-color: #e01b24;\n --destructive-fg-color: #ffffff;\n --destructive-color: oklab(from var(--destructive-bg-color) min(l, 0.5) a b);\n\n // Semantic states. `.error` / `.warning` / `.success` (see _labels.scss) do\n // not just recolour text — they REBIND the three accent tokens to these, so\n // anything accent-coloured inside them follows. Values are libadwaita's\n // (_colors.scss:16-29): red_3 / yellow_5 / green_4 from _palette.scss:106-121.\n // The standalone `*-color` is upstream's own relative-colour derivation of the\n // background, kept as an expression rather than resolved to a hex so it tracks\n // a re-themed `*-bg-color`.\n --success-bg-color: #2ec27e;\n --success-fg-color: #ffffff;\n --success-color: oklab(from var(--success-bg-color) min(l, 0.5) a b);\n --warning-bg-color: #e5a50a;\n --warning-fg-color: rgba(0, 0, 0, 0.8);\n --warning-color: oklab(from var(--warning-bg-color) min(l, 0.5) a b);\n --error-bg-color: #e01b24;\n --error-fg-color: #ffffff;\n --error-color: oklab(from var(--error-bg-color) min(l, 0.5) a b);\n\n // Switch\n --switch-off-bg: rgba(0, 0, 0, 0.2);\n --switch-knob-bg: #ffffff;\n\n // Layout radii\n --window-radius: 15px;\n --card-radius: 12px;\n --button-radius: 9px;\n\n // Spacing scale\n --spacing-xs: 6px;\n --spacing-s: 9px;\n --spacing-m: 12px;\n --spacing-l: 18px;\n --spacing-xl: 24px;\n\n // Typography — GNOME default: Adwaita Sans 11. The stack is a PROGRESSION, and the\n // tail is what makes it one (#1817). 'Adwaita Sans' is installed on a GNOME desktop\n // and nowhere else; 'Cantarell' is GNOME's own earlier UI face and the right second\n // guess there; 'Inter' is the one cross-platform name an app usually has beside it.\n //\n // What was MISSING is macOS, and it was missing in the worst place. With no Apple face\n // named, `sans-serif` resolved to Helvetica — measured on a Mac carrying neither\n // Adwaita Sans nor Cantarell — which is the one typeface no libadwaita application is\n // meant to look like, and the stylesheet said nothing about it. `system-ui` and its\n // `-apple-system` alias are the two spellings every current engine resolves to the\n // platform's own UI face (SF on macOS, Segoe UI Variable on Windows, Cantarell on\n // GNOME), so they go after the named faces and BEFORE the generic: a generic asks the\n // host for its DEFAULT, which is the substitution this is about, while `system-ui` asks\n // for its UI face, which is what an Adwaita app wants.\n //\n // 'Segoe UI' stays ahead of them as the EXPLICIT Windows face: `system-ui` reached it\n // only from Windows 8 and Segoe UI Variable only from Windows 11, so the name is still\n // the portable spelling there. Held honest by the `stylesheet-font-families`\n // conformance rule, whose ledger carries the reason for 'Adwaita Sans' — never delete\n // one without the other.\n //\n // THE PERIOD ending this first sentence, and the absence of a comment block between\n // these declarations, are both load-bearing rather than stylistic.\n // `scripts/generate-adwaita-tokens.mjs` titles each token group by the first sentence\n // of the comment block touching its FIRST declaration, so a caption with no terminator\n // runs on into the next words — and a block sitting between two declarations starts a\n // NEW group, which is how a paragraph about this mechanism became a section title in\n // the website before it was moved in here. Everything past the first sentence is prose\n // for that one reader; `check-generated-website-data.mjs` holds both derived artifacts\n // against the run.\n --font-family: 'Adwaita Sans', 'Cantarell', 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;\n --font-size-base: 11pt;\n --font-size-small: 9pt;\n --font-size-heading: 12pt;\n --dim-opacity: 0.55;\n\n // Borders and disabled dimming, as libadwaita's own two-step (_colors.scss:263,\n // 317-329): an OPACITY token the high-contrast query moves, and a colour\n // DERIVED from it against `currentColor` — so a border follows the text colour\n // of the surface it is drawn on instead of being a fixed grey.\n //\n // `--disabled-opacity` had no home here, and three partials said so in a\n // comment and reached for `--dim-opacity` instead (`_switch.scss:81-83`,\n // `_checks.scss:164-166`, `_progress_bar.scss:87-89`). Those are different\n // numbers upstream — 50% disabled vs 55% dimmed — and under high contrast they\n // move in OPPOSITE directions (disabled 40%, dimmed 90%), so the stand-in was\n // most wrong exactly where it mattered most.\n --border-opacity: 15%;\n --border-color: color-mix(in srgb, currentColor var(--border-opacity), transparent);\n --disabled-opacity: 0.5;\n\n // Document + monospace families, behind `.document` / `.monospace`\n // (_labels.scss:75-84). In GTK these four are written into `:root` at RUNTIME\n // by AdwStyleManager from the desktop's font settings\n // (adw-style-manager.c:169-218), defaulting to `Sans 10` / `Monospace 10`\n // (:50-56). A browser has no style manager, so they are ordinary tokens here\n // — same names, so re-theming goes through the documented contract.\n //\n // The monospace stack has ONE home, and did not until recently: `_data_grid.scss`\n // used to inline it, and `source-view/theme.ts` carried a SECOND, longer copy in\n // a TS string literal (measured on one page, `.cm-scroller` resolved to\n // 'Adwaita Mono', 'Cascadia Code', 'JetBrains Mono', … while a `.monospace`\n // label beside it resolved to this token — two typefaces, same document).\n // A literal in TS is also outside the `stylesheet-font-families` rule, which\n // reads `.css`/`.scss`. Both now read this token; its consumers are\n // `.monospace` (_labels.scss:128), `_action_row.scss:94`, the data-grid mono\n // cell (via `@extend .monospace`) and `<adw-source-view>`.\n //\n // Adwaita Mono heads the stack as a PROGRESSIVE ENHANCEMENT, not because\n // anything here ships it: `@gjsify/adwaita-fonts` vendors two Sans TTFs and no\n // mono face at all (the upstream mono faces are 1.4-1.5 MB each). This comment\n // used to claim the package ships it — a claim the NativeScript theme, which\n // carries the same stack, already contradicted in prose\n // (`nativescript-bridge/adwaita/src/theme/adwaita.css:769`). So on a GNOME\n // desktop the system `adwaita-mono-fonts` resolves it; anywhere else the\n // generic tail is what renders, which is the correct outcome and the reason the\n // tail exists. Held honest by the `stylesheet-font-families` conformance rule,\n // whose ledger carries this reason — never delete one without the other.\n //\n // `'Cantarell'` is dropped from that stack on the way here: Cantarell is\n // GNOME's PROPORTIONAL UI font, so a monospace fallback chain that reaches it\n // second lands on a font whose figures do not line up — the exact property\n // `.monospace` exists for.\n //\n // The tail is the same PROGRESSION the sans stack is, for the same reason (#1817), and\n // it had the gap in the other direction: `ui-monospace` covers macOS and GNOME but\n // reaches Cascadia Mono only from Windows 10 1903, and no Windows face was named at\n // all, so a Windows 10 host without it landed on the `monospace` GENERIC — Times New\n // Roman, whose figures do not line up, which is the one thing this stack exists to\n // provide. 'Cascadia Code' ships with Windows Terminal and 'Consolas' is on every\n // Windows since Vista.\n //\n // ONE LINE, and not a style choice: the same generator reads this file with a line-based\n // reader that REFUSES a declaration it cannot read rather than dropping the token\n // without saying so, so a wrapped value makes it exit 1.\n --document-font-family: var(--font-family);\n --document-font-size: var(--font-size-base);\n --monospace-font-family: 'Adwaita Mono', ui-monospace, 'SF Mono', 'Cascadia Code', 'Consolas', 'Menlo', monospace;\n --monospace-font-size: var(--font-size-base);\n}\n\n// The tokens above are a MIXIN rather than a bare `:root` block so `.theme-light`\n// can include them too (see `_theme.scss`). A light opt-out that exists only as\n// `:not(.theme-light)` on the media query cannot serve a SUBTREE: on a dark system\n// the root stays dark, and a container asking for light matches no rule at all.\n:root {\n @include light-theme;\n}\n\n// High contrast moves the three opacity tokens, and only those — every colour\n// that reads them follows without its own query (_colors.scss:325-329).\n@media (prefers-contrast: more) {\n :root {\n --border-opacity: 50%;\n --dim-opacity: 0.9;\n --disabled-opacity: 0.4;\n }\n}\n","// _theme.scss — Light/dark theme switching.\n// Auto via prefers-color-scheme + manual .theme-dark / .theme-light overrides.\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `light-theme` lives in _variables.scss; @use makes it reachable (the skin uses\n// the module system, so a mixin there is namespaced rather than global).\n@use 'variables';\n\n@mixin dark-theme {\n --window-bg-color: #222226;\n --window-fg-color: #ffffff;\n --view-bg-color: #1d1d20;\n --view-fg-color: #ffffff;\n --headerbar-bg-color: #2e2e32;\n --headerbar-fg-color: #ffffff;\n --headerbar-shade-color: rgba(0, 0, 6, 0.36);\n --separator-color: rgba(255, 255, 255, 0.08);\n --shade-color: rgba(0, 0, 6, 0.25);\n --sidebar-bg-color: #2e2e32;\n --sidebar-fg-color: #ffffff;\n --sidebar-backdrop-color: #28282c;\n --sidebar-shade-color: rgba(0, 0, 6, 0.25);\n --sidebar-border-color: rgba(0, 0, 6, 0.36);\n --secondary-sidebar-bg-color: #28282c;\n --secondary-sidebar-fg-color: #ffffff;\n --secondary-sidebar-backdrop-color: #252529;\n --secondary-sidebar-shade-color: rgba(0, 0, 6, 0.25);\n --secondary-sidebar-border-color: rgba(0, 0, 6, 0.36);\n --card-bg-color: rgba(255, 255, 255, 0.08);\n --card-fg-color: #ffffff;\n --card-shade-color: rgba(0, 0, 6, 0.36);\n --accent-color: #78aeed;\n --popover-bg-color: #36363a;\n --popover-fg-color: #ffffff;\n --popover-shade-color: rgba(0, 0, 6, 0.36);\n // A deeper scrim in dark mode so the dimming reads against a dark window.\n --dialog-scrim-color: rgba(0, 0, 6, 0.55);\n --button-bg-color: rgba(255, 255, 255, 0.1);\n --button-hover-color: rgba(255, 255, 255, 0.15);\n --button-active-color: rgba(255, 255, 255, 0.22);\n --entry-bg-color: rgba(255, 255, 255, 0.1);\n --entry-border-color: rgba(255, 255, 255, 0.16);\n --entry-border-hover-color: rgba(255, 255, 255, 0.26);\n --destructive-bg-color: #c01c28;\n --destructive-fg-color: #ffffff;\n --destructive-color: oklab(from var(--destructive-bg-color) max(l, 0.85) a b);\n // Semantic states — libadwaita's dark overrides (_colors.scss:83-92): the\n // backgrounds darken (green_5 / a hand-picked amber / red_4) and the\n // standalone colour LIGHTENS instead of darkening, so it stays readable on a\n // dark surface. Upstream does not re-declare the `*-fg-color`s here either.\n --success-bg-color: #26a269;\n --success-color: oklab(from var(--success-bg-color) max(l, 0.85) a b);\n --warning-bg-color: #cd9309;\n --warning-color: oklab(from var(--warning-bg-color) max(l, 0.85) a b);\n --error-bg-color: #c01c28;\n --error-color: oklab(from var(--error-bg-color) max(l, 0.85) a b);\n --switch-off-bg: rgba(255, 255, 255, 0.2);\n --switch-knob-bg: #deddda;\n // The active toggle chip is NOT near-white in both themes — that premise was\n // wrong, and it is what made the selected toggle a solid white pill on a dark\n // window while GTK draws a grey one. libadwaita's own _colors.scss:247-248 says\n // dark takes a TRANSLUCENT white over the dark background, with white text:\n // --active-toggle-bg-color: rgb(255 255 255 / 20%);\n // --active-toggle-fg-color: #ffffff;\n // The foreground needs no entry at all — _toggle_group.scss defaults it to\n // var(--window-fg-color), which is already #ffffff here. Only the background\n // was ever missing; the old dark override forced dark text to compensate for it.\n --active-toggle-bg-color: rgb(255 255 255 / 20%);\n}\n\n// Auto dark theme via prefers-color-scheme — opt out with .theme-light\n@media (prefers-color-scheme: dark) {\n :root:not(.theme-light) {\n @include dark-theme;\n }\n}\n\n// Manual override, on ANY element rather than only on `:root`.\n//\n// It was `:root.theme-dark`, which silently does nothing unless the class lands on\n// `<html>` — so an EMBEDDED consumer could not give its own subtree a scheme without\n// re-theming the host page around it. The storybook is exactly that case: it scopes\n// to its own container, the class was present, the tokens never changed, and nothing\n// reported a problem. Custom properties resolve per element, so an element-level\n// selector overrides the inherited values for its subtree and for nothing else.\n.theme-dark {\n @include dark-theme;\n}\n\n// The light counterpart, for the same reason: on a dark system a subtree has to be\n// able to ask for light, which `:root:not(.theme-light)` on the media query above\n// cannot give it once the class sits anywhere but the root.\n.theme-light {\n @include variables.light-theme;\n}\n","// _root.scss — opt-in page surface for chrome-less layouts.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_window.scss (surface tokens)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: original opt-in helper for @gjsify/adwaita-web.\n//\n// The components theme via the `--window-*` CSS custom properties, but only\n// `adw-window` actually PAINTS the window surface (background + text colour).\n// A page laid out WITHOUT an `<adw-window>` (e.g. a plain browser view that\n// hosts rows/cards directly) therefore renders on the browser default (white)\n// and its native form controls / scrollbars don't follow the light/dark scheme.\n//\n// Applying `.adw-root` to `<body>` (or `<html>` / the `:root` element) binds the\n// Adwaita window surface + `color-scheme: light dark` to the document, so a\n// window-less layout is themed exactly like the components inside it. This is\n// OPT-IN and additive — it does not change any component's own styling.\n.adw-root {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n color-scheme: light dark;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n}\n","// _reset.scss — style-isolation boundary for embedding in arbitrary host pages.\n//\n// adwaita-web renders as LIGHT-DOM custom elements (by design: the widgets\n// compose with the page and stay overridable via the `--adw-*` / `--*` design\n// tokens). The trade-off of light DOM is that a host page's *inherited*\n// typography — `font-family`, `color`, `line-height`, `letter-spacing`, … — and\n// generic element resets can leak into the widgets.\n//\n// This partial establishes an Adwaita typographic + box-model context at EVERY\n// component boundary, so inheritance from the host stops at the widget. It sets\n// only a FLOOR: it is `@use`d before the component partials, so each component's\n// own rules override it, and consumers keep full control through the tokens and\n// ordinary higher-specificity rules (isolation without giving up overriding).\n//\n// The box battles (borders, backgrounds) are already won by the components'\n// class-scoped rules against realistic element-level host CSS; the real leak is\n// inherited typography + a host `* {}` box-sizing reset, which is what this\n// neutralises.\n\n// Every custom element adwaita-web defines — one entry per `customElements\n// .define(…)` call under `src/`, in BOTH namespaces: a tag carries the prefix of\n// the library that owns its GType (ADR 0034 clause 1), so `gtk-entry` is on this\n// list beside `adw-action-row`.\n//\n// DERIVED, NOT REMEMBERED: `scripts/check-adwaita-reset-components.mjs` walks\n// those calls and fails on any tag missing from this list (and on any entry with\n// no call behind it). A hand-kept list is a second copy of the registry, and it\n// had already drifted — `adw-source-view` was defined for its whole life and\n// never listed, so it silently ran without the isolation floor. Nothing noticed,\n// because the only spec touching this file instantiates `adw-switch-row`.\n$adw-components:\n adw-about-dialog, adw-action-row, adw-alert-dialog, adw-alert-response, adw-application-window, adw-avatar,\n adw-banner, adw-bin, adw-bottom-sheet, adw-bottom-sheet-bottom-bar, adw-bottom-sheet-content,\n adw-bottom-sheet-sheet, adw-breakpoint-bin, adw-button-content, adw-button-row, adw-card, adw-carousel,\n adw-carousel-indicator-dots, adw-carousel-indicator-lines, adw-clamp, adw-clamp-scrollable, adw-combo-row,\n adw-data-grid, adw-dialog, adw-entry-row, adw-expander-row, adw-header-bar, adw-inline-view-switcher,\n adw-layout-slot, adw-multi-layout-view, adw-navigation-page, adw-navigation-split-view, adw-navigation-view,\n adw-overlay-split-view, adw-password-entry-row, adw-preferences-dialog, adw-preferences-group,\n adw-preferences-page, adw-preferences-row, adw-radio, adw-shortcut-label, adw-shortcuts-dialog, adw-shortcuts-item,\n adw-shortcuts-section, adw-sidebar, adw-sidebar-item, adw-sidebar-section, adw-source-view, adw-spin-row,\n adw-spinner, adw-split-button, adw-status-page, adw-switch-row, adw-tab-bar, adw-tab-button, adw-tab-overview, adw-tab-page, adw-tab-view,\n adw-toast-overlay, adw-toggle, adw-toggle-group, adw-toolbar-view, gtk-notebook, adw-view-stack, adw-view-stack-page,\n adw-view-switcher, adw-view-switcher-bar, adw-view-switcher-page, adw-view-switcher-sidebar, adw-window, adw-window-title, adw-wrap-box,\n gtk-about-dialog, gtk-action-bar, gtk-application-window, gtk-aspect-frame, gtk-box, gtk-button, gtk-center-box,\n gtk-calendar, gtk-check-button, gtk-color-dialog-button, gtk-column-view, gtk-drag-icon, gtk-drawing-area, gtk-drop-down,\n gtk-editable-label, gtk-emoji-chooser, gtk-entry, gtk-expander, gtk-fixed, gtk-flow-box, gtk-flow-box-child, gtk-font-dialog-button, gtk-frame,\n gtk-gl-area, gtk-graphics-offload, gtk-grid, gtk-grid-view, gtk-header-bar, gtk-image, gtk-inscription, gtk-label, gtk-level-bar,\n gtk-link-button, gtk-list-box, gtk-list-box-row, gtk-list-view, gtk-media-controls, gtk-menu-button, gtk-overlay, gtk-page-setup-unix-dialog, gtk-paned,\n gtk-password-entry, gtk-picture, gtk-popover, gtk-popover-bin, gtk-popover-menu, gtk-popover-menu-bar, gtk-print-unix-dialog,\n gtk-progress-bar, gtk-revealer, gtk-scale, gtk-scale-button, gtk-scrollbar, gtk-scrolled-window, gtk-search-bar, gtk-search-entry, gtk-separator,\n gtk-spin-button, gtk-spinner, gtk-stack, gtk-stack-sidebar, gtk-stack-switcher, gtk-switch, gtk-text, gtk-text-view, gtk-toggle-button, gtk-tree-expander, gtk-video, gtk-viewport,\n gtk-window, gtk-window-controls, gtk-window-handle;\n\n// Roots: re-root the inherited typographic properties (and the box model) so a\n// host page's font / colour / spacing cannot flow into the widget. Every value\n// is the Adwaita default; a component that wants something else overrides it on\n// its own element (this rule is emitted first).\n#{$adw-components} {\n box-sizing: border-box;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 400;\n font-style: normal;\n font-variant: normal;\n line-height: normal;\n letter-spacing: normal;\n word-spacing: normal;\n text-align: start;\n text-indent: 0;\n text-transform: none;\n text-shadow: none;\n}\n\n// A box and a label INHERIT inside another widget, as every GTK node does. They\n// are the two elements an authored tree puts INSIDE the others — a label in a\n// `.error` box, a box of labels in a header bar — and the floor above would\n// repaint every one of them in `--window-fg-color` at the base size, whatever\n// its parent says. Nested in any component the floor already stops the host\n// page, so only the OUTERMOST one keeps it. `:where()` adds no specificity, so a\n// class on the element itself (`.title-1`, `.dimmed`) still wins.\n//\n// A button's content inherits for the same reason: `<adw-button-content>` is the child\n// of a `<gtk-button>`, and the floor painted its icon and label in the window colour on\n// a `.suggested-action` button, where GTK draws them in the accent foreground.\n:where(#{$adw-components}) :is(gtk-box, gtk-label, adw-button-content) {\n color: inherit;\n font-family: inherit;\n font-size: inherit;\n font-weight: inherit;\n font-style: inherit;\n font-variant: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n word-spacing: inherit;\n text-transform: inherit;\n text-shadow: inherit;\n}\n\n// Descendants: `box-sizing` does not inherit, so a host `*, *::before {\n// box-sizing: content-box }` reset would still reach internal elements. Pin it\n// to `border-box` (adwaita's model throughout) inside every component.\n@each $c in $adw-components {\n #{$c} *,\n #{$c} *::before,\n #{$c} *::after {\n box-sizing: border-box;\n }\n}\n","// _icon.scss — the symbolic icon box behind <gtk-image>.\n//\n// A symbolic icon is rendered as a CSS mask rather than an <img> or inline SVG,\n// so `currentColor` drives the fill and the glyph re-themes with whatever\n// contains it. The per-name `.adw-icon--<name>` mask classes are GENERATED into\n// scss/_icons.generated.scss by scripts/build-scss.mjs (one entry per icon in\n// its ICONS map), so adding an icon is a single map edit.\n//\n// This block lived in `_button.scss` for as long as the button was the only\n// widget that drew one. It is emitted BEFORE the widget partials so a context\n// that sizes its own icons (`.adw-about-dialog-icon` at 96px, the split button's\n// 14px arrows, the view switcher's 16px) still wins on ordinary specificity.\n//\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:34-41 — `.normal-icons`\n// / `.large-icons` set `-gtk-icon-size`. libadwaita has NO `_icon.scss`: there\n// the icon is a GtkImage and its size is a widget property, not a rule.\n// Reference: refs/adwaita-web/adwaita-web/scss/_icon.scss — the vendored web\n// port's `.adw-icon` is an inline-flex holder around a real <svg>; this\n// package masks instead, which is what keeps it colourable via currentColor.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components (mask-based).\n\n.adw-icon {\n display: inline-block;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n background-color: currentColor;\n mask-size: 16px;\n mask-repeat: no-repeat;\n mask-position: center;\n -webkit-mask-size: 16px;\n -webkit-mask-repeat: no-repeat;\n -webkit-mask-position: center;\n\n // `currentColor` IS the icon: the mask is painted with the inherited colour,\n // so a suggested-action button's `--accent-fg-color` has to reach it. Since\n // <gtk-image> is a custom element it is also in `$adw-components`, and the\n // ADR-0010 boundary reset re-roots `color` on every entry there — which would\n // otherwise repaint every icon in `--window-fg-color` regardless of its host.\n // Class beats type selector, so this restores inheritance.\n color: inherit;\n\n // `display: inline-block` (author CSS) otherwise beats the UA `[hidden]`\n // rule, so a hidden icon (e.g. an avatar's fallback icon while initials\n // show) would still render as a solid maskless square. Honor `hidden`.\n &[hidden] {\n display: none;\n }\n}\n\n// THE FALLBACK GLYPH — what a name the stylesheet cannot draw resolves to.\n//\n// Until this rule existed there was no `mask-image` on `.adw-icon` at all, so an\n// icon whose name has no generated class kept `background-color: currentColor`\n// over an empty mask and painted a SOLID 16px square in the widget's text\n// colour. Measured in Firefox: `.adw-icon.adw-icon--dialog-error` reported\n// `mask-image: none`, `background-color: rgb(0, 128, 0)`, box 16x16 — visually a\n// deliberate colour swatch, which is why three renderer-comparison surfaces\n// carried substituted glyphs and nobody read it as a bug.\n//\n// `image-missing` is libadwaita's OWN answer to \"I have no icon to draw here\":\n// C substitutes exactly that name for a NULL icon-name in three widgets\n// (adw-button-content.c:294,356 · adw-view-switcher-button.c:286,347,405 ·\n// adw-inline-view-switcher.c:142), and GTK's icon theme returns the same\n// broken-image paintable for a name it cannot find. So the three renderers end\n// up on ONE glyph: GTK draws it from the system theme, the web draws it from\n// here, and NativeScript cannot reach the state at all — its GtkImage takes SVG\n// SOURCE, not a name, so a missing icon there is a missing import the compiler\n// rejects. Nothing THROWS, on any of the three: an icon is decorative and taking\n// an application down over a glyph is a failure mode none of them has.\n//\n// `:where()` and not `.adw-icon`, and that is the load-bearing detail:\n// `adwaita-skin.scss` @uses `icons.generated` BEFORE `icon`, so at equal\n// specificity this rule would come last and override every generated mask class\n// — every icon in the package would draw the broken glyph. `:where()` scores\n// 0,0,0, so ANY `.adw-icon--<name>` rule beats it wherever it sits in the\n// cascade, including one `registerIcon()` inserts at runtime.\n:where(.adw-icon) {\n mask-image: var(--icon-image-missing);\n -webkit-mask-image: var(--icon-image-missing);\n}\n\n// …and NO name at all draws nothing, rather than the broken glyph. `<gtk-image>`\n// leaves the node classless only when `icon-name` is ABSENT or EMPTY, which is the\n// state where the HOST decided against an icon — the tab strip's indicator slot,\n// the avatar's fallback while initials show. `Gtk.Image` with a NULL icon-name\n// draws nothing too.\n//\n// A name that was GIVEN never reaches this rule, even an unusable one: the element\n// puts `adw-icon--image-missing` on it, because `gtk_icon_theme_lookup_icon` has no\n// \"found nothing\" answer either. Until it did, `<adw-button-row start-icon-name=\"a b\">`\n// reserved a VISIBLE 16px slot and painted none of it — this rule turning the\n// pre-existing solid square into an invisible hole.\n.adw-icon:not([class*='adw-icon--']) {\n background-color: transparent;\n}\n","// _labels.scss — libadwaita's typography + semantic-colour UTILITY CLASSES, and\n// the `label {}` rules of the element they are written for.\n//\n// `refs/libadwaita/src/stylesheet/widgets/_labels.scss` is a widget partial in\n// name only: `label { … }` is four lines of GtkLabel plumbing and everything else\n// in it is a CLASS a consumer puts on whatever node it already has — a `<span>` on\n// a hand-written page, or <gtk-label>, which exists because an AUTHORED tree (a\n// Blueprint `Gtk.Label` mounted through `mountSharedTree`) arrives as a tag with a\n// `label` attribute and needs an element to read it. ADR 0010 makes the class\n// surface the public contract either way; the element adds the layout below and\n// nothing to the classes.\n//\n// This is also where the in-tree duplication ends: `_data_grid.scss` declared\n// `font-variant-numeric: tabular-nums` twice and inlined a whole monospace font\n// stack — i.e. `.numeric` and `.monospace` — and dimmed its header row with a\n// raw `opacity: var(--dim-opacity)` where `.dimmed` is the upstream spelling. It\n// composes these now.\n//\n// WHAT DIFFERS FROM UPSTREAM, AND WHY\n//\n// - `font-size` percentages are upstream's (181% / 136% / 118% / 82%), which\n// are relative to the INHERITED size. That is what libadwaita means by them\n// and it composes with `--font-size-base`, so they are kept verbatim rather\n// than resolved to pt values.\n// - `.document` / `.monospace` read `--document-font-*` / `--monospace-font-*`.\n// In GTK those four are written into `:root` at runtime by AdwStyleManager\n// from the desktop's font settings (adw-style-manager.c:169-218), defaulting\n// to `Sans 10` / `Monospace 10` (:50-56). There is no style manager in a\n// browser, so `_variables.scss` supplies them as ordinary tokens — same\n// names, so a consumer re-themes through the documented contract.\n// - `refs/adwaita-web/adwaita-web/scss/_utility_classes.scss` carries its own\n// version of this block (it puts these in `_utility_classes.scss`, NOT in\n// `_label.scss`) and it disagrees with libadwaita on two points: it adds a\n// `line-height` to every title/heading, and it dims `.caption` and\n// `.caption-heading` by folding `--dim-opacity` into them. Neither is in\n// libadwaita — a caption is small, not dim, and dimming is `.dimmed`'s job,\n// composable onto anything. libadwaita is followed here.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss:13-88 (every class below)\n// Reference: refs/libadwaita/src/adw-style-manager.c:50-56,169-218 (the four font tokens)\n// Reference: refs/adwaita-web/adwaita-web/scss/_utility_classes.scss (the vendored port's variant, NOT followed — see above)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web; `label {}` is ported onto\n// <gtk-label> without `:disabled`, which the element has no state for.\n\n// <gtk-label>: `label {}` (_labels.scss:1-11) plus the layout GtkLabel does in C.\n//\n// THE TWO SPACERS ARE `xalign`. GTK places the text at `xalign * (width − text\n// width)` inside the label's allocation (gtklabel.c, gtk_label_get_layout_location); the\n// element's free space is split between `::before` and `::after` in the ratio\n// `xalign : 1 − xalign`, which is that formula, and flips in RTL as the C does.\n//\n// `YALIGN` HAS NO CONTINUUM ON THE CROSS AXIS. `xalign`'s spacer trick splits free space\n// along flexbox's MAIN axis, where a flex item's `flex-grow` ratio is a real number;\n// `align-items` is the CROSS-axis equivalent and CSS gives it three keywords, not a ratio\n// — there is no `align-items: 0.25` the way there is a `flex-grow: 0.25`. A second pair of\n// spacers would need a second axis, and a `<gtk-label>` cannot be both a row (for `xalign`)\n// and a column (for `yalign`) at once without an inner wrapper element, which would cost\n// every single-line label the \"one text node, no children\" DOM shape `gtk-label.spec.ts`\n// pins for the XSS answer. So `--gtk-label-align-items` is set by `labelYalignAlignItems`\n// (`@gjsify/adwaita-core`) from the NEAREST of three zones — `flex-start` below `0.25`,\n// `flex-end` above `0.75`, `center` between (the default, unchanged from before this\n// property existed) — exact at the three values GTK's own default and both edges take,\n// and a DECLARED divergence for anything else: nearest zone, not a silent half-split, and\n// `label.spec.ts`/`gtk-label.spec.ts` both say so where they test the intermediate values.\n//\n// `white-space: pre`: Pango keeps a newline and a run of spaces, and a label that\n// does not wrap is as wide as its text — which a flex item's `min-width: auto`\n// already makes its minimum. `wrap` breaks at word boundaries, WORD being the\n// default `wrap-mode` — so does `ellipsize` alone, see `.adw-label-clamp` below.\ngtk-label {\n display: flex;\n align-items: var(--gtk-label-align-items, center);\n white-space: pre;\n caret-color: currentColor;\n // GtkLabel is not selectable unless asked (`selectable` defaults to FALSE).\n user-select: none;\n\n &::before,\n &::after {\n content: '';\n flex-shrink: 1;\n flex-basis: 0;\n }\n\n &::before {\n flex-grow: var(--gtk-label-xalign, 0.5);\n }\n\n &::after {\n flex-grow: calc(1 - var(--gtk-label-xalign, 0.5));\n }\n\n &[wrap] {\n white-space: pre-wrap;\n }\n\n // `gtk-label.ts`'s span-render path: the text moves into this span so it can be pinned\n // to its measured wrap width (a flex item is blockified by spec, but `display: block` is\n // spelled out rather than relied on implicitly). Present whenever `wrap` is set OR\n // `ellipsize` is active — MEASURED (`@gjsify/adwaita-core`'s `label.ts` header): GTK's\n // own Pango layout wraps onto multiple lines from `ellipsize` ALONE, `wrap` or not, so\n // both cases need the same span and the same measurement pass.\n .adw-label-text {\n display: block;\n // A pinned width, or a shrink-to-fit one, may never push the label wider than its\n // container.\n max-width: 100%;\n }\n\n // `wrap-mode` — Pango's break-opportunity choice — is a real `word-break`/\n // `overflow-wrap` mapping, not a declared gap: CSS's `break-all` is Pango's CHAR (break\n // anywhere), and `overflow-wrap: anywhere` is Pango's WORD_CHAR (word boundaries, falling\n // back to a character break only when a single word will not fit) — the pspec's own\n // words for that member. WORD, the default, is the browser's un-overridden behaviour, so\n // it has no rule here. Scoped to `.adw-label-text` alone, not `[wrap]`: `wrap-mode` only\n // matters once the layout can span more than one line at all, which `ellipsize` alone\n // already grants (see above) — the span's mere existence is that condition.\n &[wrap-mode='char'] .adw-label-text {\n word-break: break-all;\n }\n\n &[wrap-mode='word-char'] .adw-label-text {\n overflow-wrap: anywhere;\n }\n\n // `ellipsize` — a JS-toggled CLASS, not an attribute selector: `.adw-label-clamp` is set\n // by `gtk-label.ts`'s `_renderSpan` from `ellipsize`'s NORMALIZED value, so a raw,\n // unrecognised `ellipsize` attribute (which `normalizeLabelEllipsize` already reads as\n // `none`) can never leave this rule half-applied the way an `[ellipsize]` PRESENCE\n // selector would. `lines`, gated by `labelEffectiveLines` (`@gjsify/adwaita-core`) to\n // \"ellipsize is active\", `wrap` or not — MEASURED, the same header — applies here\n // REGARDLESS of `wrap`: a real `Gtk.Label` allocated with `wrap=FALSE, ellipsize=END,\n // lines=2` lays out exactly two lines, ellipsized, not one. `-webkit-line-clamp` needs\n // its own box context (`display: -webkit-box` + `-webkit-box-orient: vertical`) and text\n // that can actually WRAP (`white-space: normal`, overriding the host's inherited `pre`/\n // `pre-wrap`) to have more than one line to clamp in the first place; the default of `1`\n // is Pango's own when `lines` is unset (`--gtk-label-lines` is still set then — see\n // `_render()` — so the fallback here is only a defensive belt for a span whose host\n // somehow reached this class without it).\n .adw-label-text.adw-label-clamp {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: var(--gtk-label-lines, 1);\n overflow: hidden;\n text-overflow: var(--gtk-label-ellipsize-overflow, ellipsis);\n white-space: normal;\n }\n\n &[selectable] {\n user-select: text;\n cursor: text;\n }\n\n &.separator {\n @extend .dimmed;\n }\n}\n\n// _labels.scss:13-15\n.dimmed {\n opacity: var(--dim-opacity);\n}\n\n// _labels.scss:17-19\n.accent {\n color: var(--accent-color);\n}\n\n// _labels.scss:21-29 — a semantic class does not just recolour the text, it\n// REBINDS the three accent tokens, so a button or switch inside it turns the\n// same colour without knowing which state it is in.\n@each $e_type in error, warning, success {\n .#{$e_type} {\n color: var(--accent-color);\n\n --accent-bg-color: var(--#{$e_type}-bg-color);\n --accent-fg-color: var(--#{$e_type}-fg-color);\n --accent-color: var(--#{$e_type}-color);\n }\n}\n\n/**********************\n * General Typography *\n **********************/\n\n// _labels.scss:35-53\n.title-1 {\n font-weight: 800;\n font-size: 181%;\n}\n\n.title-2 {\n font-weight: 800;\n font-size: 136%;\n}\n\n.title-3 {\n font-weight: 700;\n font-size: 136%;\n}\n\n.title-4 {\n font-weight: 700;\n font-size: 118%;\n}\n\n// _labels.scss:55-57\n.heading {\n font-weight: 700;\n}\n\n// _labels.scss:59-62\n.body {\n font-weight: 400;\n line-height: 140%;\n}\n\n// _labels.scss:64-67\n.caption-heading {\n font-weight: 700;\n font-size: 82%;\n}\n\n// _labels.scss:69-73\n.caption {\n font-weight: 400;\n font-size: 82%;\n line-height: 140%;\n}\n\n// _labels.scss:75-79\n.document {\n font-family: var(--document-font-family);\n font-size: var(--document-font-size);\n line-height: 140%;\n}\n\n// _labels.scss:81-84\n.monospace {\n font-family: var(--monospace-font-family);\n font-size: var(--monospace-font-size);\n}\n\n// _labels.scss:86-88\n.numeric {\n font-variant-numeric: tabular-nums;\n}\n","// _box.scss — <gtk-box>, GTK's one-axis container.\n//\n// libadwaita has no box partial: a box draws nothing, it only places children.\n// The element sets `flex-direction` and `gap` inline from its normalised\n// properties (gtk-box.ts); this is the rest of GtkBoxLayout's shape.\n//\n// `align-items: stretch`: a child's default `halign`/`valign` is FILL, so it takes\n// the whole cross axis. `min-width`/`min-height: 0` are deliberately NOT set on\n// the children: a GTK box never allocates a child less than its minimum, and a\n// flex item's `auto` minimum is that.\n//\n// Reference: refs/gtk/gtk/gtkboxlayout.c (homogeneous: every child the same size)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n\ngtk-box {\n display: flex;\n flex-direction: row;\n align-items: stretch;\n}\n\ngtk-box[homogeneous] > * {\n flex: 1 1 0;\n}\n","// _frame.scss — <gtk-frame>: the 1px border, and the label that sits inside its top edge.\n//\n// libadwaita writes this rule TWICE, once for the widget node and once for the style\n// class (`widgets/_misc.scss:4-7`); the widget half is here and the class half stays in\n// `_style_classes.scss`, where every other `.frame` consumer already is. The label's\n// `margin: 4px` (`_misc.scss:12-14`) is the inset it gets inside the border, keyed on the\n// class the element puts on whatever stands in for GtkFrame's label widget — the internal\n// `<gtk-label>` `label` builds, or an author's `label-widget`.\n//\n// The BOX is GtkFrame's, not libadwaita's: the label widget takes the top line and the\n// child the rest (`gtk_frame_real_compute_child_allocation`, gtkframe.c:554-580), so the\n// host is a flex column whose children grow into whatever the pinned label leaves.\n// `overflow: hidden` is `GTK_OVERFLOW_HIDDEN` (gtkframe.c:246) — the GIR doc calls the\n// clipping out as the way to round a child's corners, at the price of its shadows.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:4-15\n// Reference: refs/gtk/gtk/gtkframe.c:246, :519-580\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-frame {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n border: 1px solid var(--border-color);\n border-radius: var(--card-radius);\n overflow: hidden;\n\n // GTK sizes the label widget itself and never grows it, so it is pinned at its own size\n // (`flex: none`) and its `align-self` is the element's, written from `label-xalign`.\n > .adw-frame-label {\n flex: none;\n margin: 4px;\n }\n\n // Everything else is the child, and it takes the height the label leaves.\n > * {\n flex: 1 1 auto;\n }\n}\n","// _aspect_frame.scss — <gtk-aspect-frame>: draws NOTHING, it only sizes and places.\n//\n// libadwaita has no rule for the `aspectframe` node (its stylesheet never names it), and\n// neither should this: the widget paints no border, no background and no frame, because\n// `gtk_aspect_frame_size_allocate` gives its child one allocation of the requested shape\n// and puts that box at (`xalign`, `yalign`) — gtakaspectframe.c:561-587. That allocation\n// IS the widget.\n//\n// What is left to CSS is the placing, and all of it is per-INSTANCE: the element writes\n// `justify-content` and `align-items` from `xalign` / `yalign` and the child's\n// `aspect-ratio`, `max-width` and `max-height` inline, because a stylesheet cannot key on a\n// fraction. So this partial is the flex container and nothing else.\n//\n// Reference: refs/gtk/gtk/gtkaspectframe.c:561-587\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-aspect-frame {\n display: flex;\n // The child's shape and both alignments are written INLINE by the element, because a\n // stylesheet cannot key on a fraction; these are the values in the frame before it does,\n // which are also the pspec defaults for `xalign` and `yalign`.\n justify-content: center;\n align-items: center;\n}\n","// _center_box.scss — <gtk-center-box>: three children, and the space between them.\n//\n// `gtk_center_box_set_css_name (widget_class, I_(\"box\"))` (gtkcenterbox.c:345) means the\n// theme's `box` rule styles this widget, and libadwaita ships NO `box` rule — a box draws\n// nothing, it only places. `justify-content: space-between` IS the placement: the centre\n// layout puts the start child at the start, the end child at the end and the centre between\n// them, growing the centre into whatever is left when it expands\n// (gtkcenterlayout.c:174-186).\n//\n// The `shrink-center-last` weights and a `baseline-position` are written INLINE by the\n// element, because both are per-instance values a selector cannot express: the weights\n// differ per child, and the position is a fraction.\n//\n// Reference: refs/gtk/gtk/gtkcenterbox.c:345-346\n// Reference: refs/gtk/gtk/gtkcenterlayout.c:144-186\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-center-box {\n display: flex;\n justify-content: space-between;\n // A child's default `valign` is FILL, and the centre layout's one line takes the whole\n // cross axis — the same thing `_box.scss` states for `<gtk-box>`.\n align-items: stretch;\n}\n","// _grid.scss — <gtk-grid>: a table of cells, sized by what is in them.\n//\n// libadwaita styles the `grid` node nowhere — the grid has no node of its own beyond what\n// GtkGridLayout builds — so this partial is `display: grid` and the one default worth\n// stating: a child written without a position is attached along the columns, which is\n// `grid-auto-flow: row` (`gtk_grid_buildable_add_child`, gtkgrid.c:493-507).\n//\n// Everything else is per-instance and inline, because a selector cannot key on a number:\n// the two spacings, the two `homogeneous` flags and the orientation all go on the element\n// as `row-gap` / `column-gap` / `grid-auto-rows` / `grid-auto-columns` / `grid-auto-flow`.\n//\n// Reference: refs/gtk/gtk/gtkgrid.c:493-507\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-grid {\n display: grid;\n grid-auto-flow: row;\n}\n","// _fixed.scss — <gtk-fixed>: children at pixel positions, and a box around all of them.\n//\n// `gtk_fixed_init` sets `GTK_OVERFLOW_HIDDEN` (gtkfixed.c:189-195), so the fixed clips a\n// child that reaches past its own bounds — and the element sizes those bounds from the\n// union of the children (`gtk_fixed_layout_measure`, gtkfixedlayout.c:224-300), which is\n// what makes `overflow: hidden` a clipping rule rather than a layout one.\n//\n// The children are out of flow, which is what a position means: `position: absolute` against\n// the fixed's own padding box, which `gtk_fixed_layout_allocate` does by handing each child\n// its measured size at (x, y). `left` / `top` DEFAULT TO ZERO and not to CSS's `auto`\n// because `gtk_fixed_buildable_add_child` puts an unpositioned child at 0, 0\n// (gtkfixed.c:171-177), and `auto` would resolve it to its STATIC position instead.\n//\n// Reference: refs/gtk/gtk/gtkfixed.c:171-177, :189-195\n// Reference: refs/gtk/gtk/gtkfixedlayout.c:224-300\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-fixed {\n display: block;\n position: relative;\n overflow: hidden;\n\n > * {\n position: absolute;\n left: 0;\n top: 0;\n }\n}\n","// _style_classes.scss — libadwaita's documented, WIDGET-INDEPENDENT style classes.\n//\n// THE GAP THIS CLOSES\n//\n// `refs/libadwaita/doc/style-classes.md` is the public contract an app author\n// reads: put `.card` on a box, `.boxed-list` on a list, `.toolbar` on a bar,\n// `.linked` around a button group. Twenty-one of those classes had NO rule in\n// this package (#1049) — and two of them looked ported because their names\n// appear in comments (`.osd`, `.linked`) while the code spells its own\n// `.adw-linked`. A consumer following the upstream documentation got nothing,\n// silently, which is the worst failure mode for a styling contract.\n//\n// Widget-scoped classes are NOT here — they live with the widget whose markup\n// they modify (`.property` in `_action_row.scss`, `.compact` in\n// `_status_page.scss`, `.devel` in `_headerbar.scss`, `.osd`'s button and\n// progress-bar variants in theirs), because that is where their selector needs\n// to see the widget's inner nodes. `scripts/check-adwaita-style-classes.mjs`\n// holds the ledger of which class lives where and fails when one has no rule at\n// all.\n//\n// Reference: refs/libadwaita/doc/style-classes.md (the documented surface)\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:25-28,43-60,90-104\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:4-7,21-32,197-236\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:1-18\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:520-600\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss:91-102\n// Reference: refs/libadwaita/src/stylesheet/widgets/_linked.scss:1-45\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scrolling.scss:150-166\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — GTK node names (`row`,\n// `list`, `button`) become the custom-element tags and `.adw-*` structure\n// classes this package renders, and GTK-only drawing (`image()`,\n// `-gtk-icon-shadow`, `border-spacing` on a box) becomes its CSS equivalent.\n\n/************\n * Surfaces *\n ************/\n\n// _common.scss:25-28 — an opaque window-coloured background on any node.\n.background {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n\n// _views.scss:1-18 — the content-area surface. `:disabled` and `:selected` are\n// GTK pseudo-classes with no DOM counterpart; `[disabled]`/`[aria-selected]`\n// are how the same states are spelled here, and both are what our own widgets\n// already set.\n.view {\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n\n &:disabled,\n &[disabled] {\n color: color-mix(in srgb, var(--view-fg-color) var(--disabled-opacity), transparent);\n background-color: color-mix(in srgb, var(--window-bg-color) 60%, var(--view-bg-color));\n }\n\n &[aria-selected='true'] {\n background-color: color-mix(in srgb, var(--accent-bg-color) 25%, transparent);\n border-radius: var(--button-radius);\n }\n}\n\n// _misc.scss:4-7 — the default border. `--border-color` is derived from\n// `currentColor`, so this follows the foreground of whatever it is drawn on.\n.frame {\n border: 1px solid var(--border-color);\n}\n\n/*********\n * Cards *\n *********/\n\n// _misc.scss:197-236. The ONE card recipe: `adw-card` and the preferences\n// group's list box each carried their own copy of these five declarations\n// before this placeholder existed.\n%card {\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n border-radius: var(--card-radius);\n box-shadow:\n 0 0 0 1px rgb(0 0 6 / 3%),\n 0 1px 3px 1px rgb(0 0 6 / 7%),\n 0 2px 6px 2px rgb(0 0 6 / 3%);\n\n @media (prefers-contrast: more) {\n box-shadow:\n 0 0 0 1px var(--border-color),\n 0 1px 3px 1px rgb(0 0 6 / 7%),\n 0 2px 6px 2px rgb(0 0 6 / 3%);\n }\n}\n\n.card {\n @extend %card;\n\n // `.card.activatable` gets the hover/active states of an activatable row\n // (:225-235). GTK's `background-image: image(…)` is a solid-colour layer over\n // the background; a one-stop gradient is its CSS equivalent, and it composes\n // with `background-color` the same way — so a re-themed card keeps its colour\n // and only gains the wash.\n &.activatable {\n transition:\n background-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),\n box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n\n &:hover {\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 3%, transparent),\n color-mix(in srgb, currentColor 3%, transparent)\n );\n }\n\n &:active {\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 8%, transparent),\n color-mix(in srgb, currentColor 8%, transparent)\n );\n }\n }\n\n // A card inside (or itself) an OSD surface loses its own elevation and reads\n // as a translucent inset instead (:212-220).\n .osd &,\n &.osd {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n color: rgb(255 255 255 / 90%);\n box-shadow: none;\n\n @media (prefers-contrast: more) {\n box-shadow: 0 0 0 1px var(--border-color);\n }\n }\n}\n\n/***************\n * Boxed lists *\n ***************/\n\n// _lists.scss:520-556. In GTK the row separators are drawn by the rows\n// themselves and the list only supplies the card box plus the rounding of its\n// two ends — which is exactly how this package's rows behave already\n// (`adw-action-row` and friends draw their own `border-bottom` and drop it on\n// `:last-child`), so the class is the box and the clip.\n.boxed-list {\n @extend %card;\n\n display: flex;\n flex-direction: column;\n // The rounding of the first and last row is a CLIP here rather than per-row\n // corner radii: a row is a custom element whose own background paints over\n // the list's corners, and every row type would otherwise need the same four\n // radii repeated.\n overflow: hidden;\n}\n\n// :556-600 — same content, each row its own card. The list drops its box, and\n// the rows carry it, spaced 12px apart.\n.boxed-list-separate {\n display: flex;\n flex-direction: column;\n gap: 12px;\n background: none;\n color: var(--card-fg-color);\n\n > * {\n @extend %card;\n\n overflow: hidden;\n // A row that draws a separator for its neighbours must not draw one when it\n // IS the card (:585-586: `border: none`).\n border-bottom: none;\n }\n}\n\n/************\n * Toolbars *\n ************/\n\n// _toolbars.scss:91-102 + doc \"Toolbars\". GTK's `border-spacing: 6px` on a box\n// is the gap between children; the flex row is what makes that expressible.\n//\n// The automatic flat appearance follows upstream's rule list exactly: icon-only\n// buttons, buttons with an `adw-button-content` (icon + label), menu buttons and\n// split buttons go flat — unless they are `.raised`, `.suggested-action`,\n// `.destructive-action`, `.opaque`, or sit inside a `.linked` group. Text-only\n// buttons keep their frame, which is why this cannot be a blanket\n// `.toolbar gtk-button { … }`.\n$_keeps-frame: ':not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque)';\n\n.toolbar {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px;\n\n gtk-button#{$_keeps-frame} .adw-button.icon-only,\n gtk-button#{$_keeps-frame}:has(adw-button-content) .adw-button,\n gtk-menu-button#{$_keeps-frame} .adw-button,\n adw-split-button#{$_keeps-frame} .adw-button {\n background-color: transparent;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Inside a linked group the frames come BACK — upstream states this as its own\n // rule (`_toolbars.scss:20-26`) rather than as an exclusion, because a linked\n // group only reads as one control if its members are raised.\n .linked,\n .adw-linked {\n gtk-button#{$_keeps-frame} .adw-button,\n gtk-menu-button#{$_keeps-frame} .adw-button,\n adw-split-button#{$_keeps-frame} .adw-button {\n background-color: var(--button-bg-color);\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n }\n\n // Stand-alone OSD toolbars — the floating video-player-controls shape\n // (:99-102).\n &.osd {\n padding: 12px;\n border-radius: calc(var(--button-radius) + 6px);\n }\n}\n\n// _misc.scss:21-32 — a separator that reserves whitespace instead of drawing a\n// line, for separating groups inside a toolbar.\n.spacer {\n background: none;\n border: none;\n flex-shrink: 0;\n\n &,\n &.horizontal {\n min-width: 12px;\n }\n\n &.vertical {\n min-height: 12px;\n }\n}\n\n/*******\n * OSD *\n *******/\n\n// _common.scss:43-60. The exclusions are upstream's: a progress bar, button,\n// menu button, split button and inline view switcher each define what `.osd`\n// means for them, and must not get the dark surface treatment on top.\n//\n// This is a token REBIND, not just a colour: everything accent-coloured inside\n// an OSD surface turns white without knowing it is inside one.\n.osd:not(gtk-progress-bar):not(gtk-button):not(gtk-menu-button):not(adw-split-button):not(\n adw-inline-view-switcher\n ) {\n --accent-bg-color: rgb(255 255 255 / 75%);\n --accent-fg-color: rgb(0 0 0 / 75%);\n --accent-color: oklab(from var(--accent-bg-color) max(l, 0.85) a b);\n --destructive-color: oklab(from var(--destructive-bg-color) max(l, 0.85) a b);\n --success-color: oklab(from var(--success-bg-color) max(l, 0.85) a b);\n --warning-color: oklab(from var(--warning-bg-color) max(l, 0.85) a b);\n --error-color: oklab(from var(--error-bg-color) max(l, 0.85) a b);\n\n color: rgb(255 255 255 / 90%);\n border: none;\n background-color: rgb(0 0 0 / 70%);\n background-clip: padding-box;\n}\n\n/*******************\n * Linked controls *\n *******************/\n\n// _linked.scss:1-45 + doc \"Linked Controls\": the children of a linked box share\n// their touching edges. Upstream squares the inner corners and overlaps the\n// borders by -1px; this package's controls have no border, so the overlap is\n// dropped and only the corner squaring remains.\n//\n// `.adw-linked` is this package's own earlier spelling, kept as an alias — and\n// it USED to add a 2px gap between children, which is a segmented look, not a\n// linked one. The gap is gone; a consumer who wanted it can say `gap`.\n// The styled node is either the child itself (a bare `.adw-button` /\n// `.adw-entry`) or one rendered inside the child host element (`<gtk-button>`,\n// `<gtk-menu-button>`, `<gtk-drop-down>`, …) — so both spellings are matched\n// rather than enumerating host tags the way GTK has to.\n$_linked-nodes: '.adw-button', '.adw-entry';\n\n.linked,\n.adw-linked {\n display: inline-flex;\n\n &:not(.vertical) > * {\n @each $node in $_linked-nodes {\n &:not(:first-child) #{$node},\n &:not(:first-child)#{$node} {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n\n &:not(:last-child) #{$node},\n &:not(:last-child)#{$node} {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n }\n }\n\n &.vertical {\n flex-direction: column;\n\n > * {\n @each $node in $_linked-nodes {\n &:not(:first-child) #{$node},\n &:not(:first-child)#{$node} {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n &:not(:last-child) #{$node},\n &:not(:last-child)#{$node} {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n }\n }\n }\n}\n\n/*************\n * App icons *\n *************/\n\n// _common.scss:90-104. `-gtk-icon-shadow` has no CSS counterpart; `filter:\n// drop-shadow()` is the equivalent that follows the icon's alpha rather than its\n// box, which is what makes these legible on a light background. Each upstream\n// shadow layer becomes one `drop-shadow()`.\n.lowres-icon {\n filter: drop-shadow(0 -1px rgb(0 0 6 / 5%)) drop-shadow(1px 0 rgb(0 0 6 / 10%))\n drop-shadow(0 1px rgb(0 0 6 / 30%)) drop-shadow(-1px 0 rgb(0 0 6 / 10%));\n}\n\n.icon-dropshadow {\n filter: drop-shadow(0 1px 12px rgb(0 0 6 / 5%)) drop-shadow(0 -1px rgb(0 0 6 / 5%))\n drop-shadow(1px 0 rgb(0 0 6 / 10%)) drop-shadow(0 1px rgb(0 0 6 / 30%))\n drop-shadow(-1px 0 rgb(0 0 6 / 10%));\n}\n\n/************************\n * Undershoot indicators *\n ************************/\n\n// _scrolling.scss:150-166 — a shadow on the given edge of a scrolling box,\n// telling the reader there is content past it. GTK draws them with an inset\n// background; an inset `box-shadow` on the scroll container is the CSS\n// equivalent and, unlike a `::before`, stays put while the content scrolls.\n//\n// `-start`/`-end` follow text direction, same as `margin-start`/`margin-end`,\n// which `:dir()` expresses directly.\n//\n// THESE FOUR NAMES HAVE TWO WRITERS, so both of them are excluded here and this\n// rule is left to the third: an author applying the documented style class by\n// hand to markup adwaita-web does not drive.\n//\n// - `adw-toolbar-view` carries `undershoot-top`/`-bottom` as its own STATE\n// (`update_undershoots`), and hands the two flags down to the scrollers.\n// - `src/scroll-shading.ts` stamps all four onto every scroller under a toolbar\n// view and marks it `.adw-scroll-shaded`; `_scrolling.scss` draws that one,\n// per scroller, as the 1px line + 4px fade GTK paints on a `scrolledwindow`.\n//\n// Without the second exclusion each shaded scroller drew BOTH — a 6px blurred\n// host shadow under the new gradient — and on the horizontal axis, which\n// `_scrolling.scss` deliberately leaves unpainted because neither AdwTabBox nor\n// AdwCarousel has a `scrolledwindow` node, this rule was the only thing drawing\n// at all: an overflowing tab strip lost its own `inset 0 -1px` bottom hairline to\n// this more specific `box-shadow` and gained an edge shadow libadwaita never\n// draws there.\n$undershoot-color: color-mix(in srgb, currentColor 6%, transparent);\n\n.undershoot-top:not(adw-toolbar-view):not(.adw-scroll-shaded) {\n box-shadow: inset 0 6px 6px -6px $undershoot-color;\n}\n\n.undershoot-bottom:not(adw-toolbar-view):not(.adw-scroll-shaded) {\n box-shadow: inset 0 -6px 6px -6px $undershoot-color;\n}\n\n.undershoot-start:not(.adw-scroll-shaded) {\n &:dir(ltr) {\n box-shadow: inset 6px 0 6px -6px $undershoot-color;\n }\n\n &:dir(rtl) {\n box-shadow: inset -6px 0 6px -6px $undershoot-color;\n }\n}\n\n.undershoot-end:not(.adw-scroll-shaded) {\n &:dir(ltr) {\n box-shadow: inset -6px 0 6px -6px $undershoot-color;\n }\n\n &:dir(rtl) {\n box-shadow: inset 6px 0 6px -6px $undershoot-color;\n }\n}\n","// _window.scss — adw-window styling.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_window.scss (the frame; the\n// `.maximized`/`.fullscreen` rules at 66-72 are the ones an in-page frame can use)\n// Reference: refs/adwaita-web/adwaita-web/scss/_window.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `adw-application-window` is `adw-window` plus a menubar (it extends the class and adds nothing\n// else), so it is the same frame: without this an application window was an inline box with no\n// size at all, and a tree rooted at one measured 0 x 0.\nadw-window,\nadw-application-window {\n display: flex;\n flex-direction: column;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n border-radius: var(--window-radius);\n box-shadow:\n 0 0 14px 5px rgb(0 0 0 / 15%),\n 0 0 5px 2px rgb(0 0 0 / 10%),\n 0 0 0 1px rgb(0 0 0 / 5%);\n overflow: hidden;\n outline: 1px solid rgb(255 255 255 / 7%);\n outline-offset: -1px;\n\n // `window.maximized` / `window.fullscreen` zero the radius and drop the shadow\n // (_window.scss:66-72). A page-sized window IS the maximised one here: the frame\n // is in-page, so there is nothing outside it to cast a shadow on.\n &.maximized,\n &.fullscreen {\n --window-radius: 0px;\n outline: none;\n box-shadow: none;\n }\n}\n\n// The content area — the one child slot `Adw.Window:content` fills. It takes the\n// window's own column, so a toolbar view dropped in stretches both ways.\n.adw-window-content {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n min-height: 0;\n min-width: 0;\n}\n\n// A window hands its one child the WHOLE allocation, whatever that child's own expand flags say.\n// On the web a box is only as tall as what it holds, so the `Gtk.Box` a `.blp` roots its content\n// in stopped at its header bar and the split view below it drew a quarter of the window.\n.adw-window-content > gtk-box {\n flex: 1 1 auto;\n min-height: 0;\n}\n\n// <gtk-window> — the GTK frame, in the SAME file upstream styles `Adw.Window` in: libadwaita\n// keys `window { &.csd { … } }` off the GtkWindow CSS node\n// (refs/libadwaita/src/stylesheet/widgets/_window.scss:1-31), and this element IS a window\n// as far as the stylesheet is concerned.\n//\n// The frame rules are `<adw-window>`'s, restated for the `gtk-` tag rather than shared\n// through a selector list: `_reset.scss` re-roots the box model at each registered element,\n// and a shared `adw-window, gtk-window` block would put two component resets in one rule.\n//\n// NOT the same as `<adw-window>`, deliberately. `Adw.Window` is a plain styled container —\n// nothing about it is GTK's `GtkWindow` — while this one answers the FRAME properties:\n// `decorated` drops the titlebar strip, `maximized` and `fullscreened` square the corners\n// off and drop the shadow (`_window.scss:66-72`), and the strip itself is either the\n// application's `titlebar` or the two `<gtk-window-controls>` a server-side decoration would\n// have had. See `gtk-window.ts` for the whole list and each source line.\ngtk-window,\ngtk-application-window {\n display: flex;\n flex-direction: column;\n position: relative;\n box-sizing: border-box;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n border-radius: var(--window-radius);\n outline: 1px solid rgb(255 255 255 / 7%);\n outline-offset: -1px;\n box-shadow:\n 0 0 14px 5px rgb(0 0 0 / 15%),\n 0 0 5px 2px rgb(0 0 0 / 10%),\n 0 0 0 1px rgb(0 0 0 / 5%);\n overflow: hidden;\n\n // `_window.scss:66-72` — a maximized or fullscreen window fills the screen, so it has no\n // corners to round and no frame to cast a shadow from.\n &.maximized,\n &.fullscreen {\n --window-radius: 0px;\n outline: none;\n box-shadow: none;\n }\n\n // The strip: an application's `titlebar` slot, or the two window-control groups and the\n // window's own title. `min-width: 0` on the title is what lets a long one ellipsize\n // instead of pushing the end controls out of the frame.\n > .adw-gtk-window-titlebar {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n min-height: 47px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n\n > .adw-gtk-window-title {\n flex: 1;\n min-width: 0;\n padding: 0 12px;\n font-weight: bold;\n text-align: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // A window with no title shows no title; GTK would draw the empty SSD label, and an\n // empty flex track is exactly that.\n &:has(> .adw-gtk-window-title:not([title])) > .adw-gtk-window-title {\n display: none;\n }\n }\n\n > .adw-gtk-application-window-menubar {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n gap: 6px;\n padding: 0 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n }\n\n // `Gtk.Box`'s own `border-spacing` is 0 here; the gap between the window's children is the\n // application's business, and the content box exists so it can have one without the strip\n // taking part.\n > .adw-gtk-window-content {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n overflow: auto;\n }\n}\n","// _application_window.scss — the application window's menubar strip.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (`menubar`, the\n// row libadwaita styles for GtkPopoverMenuBar — the GTK 4 menubar this widget\n// stands in for)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_header-bar.scss (the bar it sits\n// above, for the background and the border between them)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n.adw-application-window-menubar {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n gap: 2px;\n padding: 0 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n // The rule between the bar and the header bar below it, which is the whole of what\n // separates one bar from another in a stacked window.\n box-shadow: inset 0 -1px 0 var(--headerbar-border-color);\n\n &[hidden] {\n display: none;\n }\n}\n","// _headerbar.scss — adw-header-bar styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_headerbar.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_header-bar.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// A GRID, not a flex row, because `Adw.HeaderBar` puts its three sections in a\n// `GtkCenterBox` (adw-header-bar.c:992) — and a center box centres its middle\n// child in the WHOLE box, not in whatever space the sides left over. As a flex\n// row with `flex: 1` on the centre, the title was centred between the buttons\n// instead: any bar whose two sides differ in width — which is most of them, e.g.\n// a storybook preview header with no start buttons and two end buttons — drew its\n// title visibly off-centre.\n//\n// `1fr` is `minmax(auto, 1fr)`, and that auto floor is what makes this the LOOSE\n// centering policy (the default) rather than STRICT: the side tracks share the\n// free space equally, so the title sits dead centre while both sides fit, but a\n// side whose content is wider than its share pushes the title off centre rather\n// than truncating itself. STRICT — `adw_header_bar_set_centering_policy`, which\n// size-groups the two sides — would instead keep the title centred at all cost.\nadw-header-bar {\n display: grid;\n grid-template-columns: 1fr minmax(0, auto) 1fr;\n align-items: center;\n min-height: 47px;\n padding: 0 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--separator-color);\n // flex-shrink: 0 ensures the headerbar never collapses inside a flex-column\n // adw-window, preventing a spurious spacing band between bar and content.\n flex-shrink: 0;\n\n .adw-header-bar-center {\n // STRETCHED into its track, never `justify-self: center`. A grid item that is\n // centred is sized `fit-content`, whose floor is the item's own MIN-CONTENT —\n // and a `nowrap` title's min-content is the whole string. Centred, a 260px bar\n // with a back button and two end buttons therefore drew a 277px centre section\n // starting 6.6px OUTSIDE the bar and running straight over all three buttons,\n // with the ellipsis never reached. Stretched, the item is exactly its track,\n // and the track is what is left once both sides have their natural width.\n //\n // That leftover is the rule `gtk_center_layout_distribute` applies while\n // `shrink-center-last` is FALSE (gtkcenterlayout.c:155-157): the centre is\n // CLAMPed to `size - spacing - (start.natural + end.natural)` and then pushed\n // in from either side, so it cannot overlap them. The centring above still\n // holds wherever the bar HAS room, because the two `1fr` side tracks split the\n // free space evenly and `justify-content: center` centres the title in the\n // middle track.\n display: flex;\n justify-content: center;\n // min-width: 0 prevents the title from pushing the end buttons off-screen.\n // `shrink-center-last` is FALSE on the center box, so the TITLE is what gives\n // way when the bar runs out of room, not the buttons.\n min-width: 0;\n }\n\n .adw-header-bar-title {\n font-weight: bold;\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .adw-header-bar-start {\n justify-self: start;\n display: flex;\n align-items: center;\n padding: 0 6px;\n gap: 4px;\n }\n\n .adw-header-bar-end {\n justify-self: end;\n display: flex;\n align-items: center;\n // justify-content: flex-end aligns end buttons to the right edge of the\n // end section, fixing the pause-button misposition bug.\n justify-content: flex-end;\n padding: 0 6px;\n gap: 4px;\n }\n\n .adw-header-btn {\n position: relative;\n width: 34px;\n height: 34px;\n border: none;\n border-radius: var(--button-radius);\n background: transparent;\n color: var(--headerbar-fg-color);\n cursor: pointer;\n padding: 0;\n margin: 0;\n flex-shrink: 0;\n\n &:hover {\n background: rgba(128, 128, 128, 0.12);\n }\n\n &:active {\n background: rgba(128, 128, 128, 0.22);\n }\n }\n}\n\n// `.devel` on the WINDOW gives every header bar inside it a striped background —\n// the marker for a nightly or unstable build (style-classes.md \"Development\n// Window\", `_toolbars.scss:345-354`).\n//\n// Upstream cross-fades a 5% recoloured SVG (`assets/devel-stripes.svg`) and\n// masks it so it fades out downwards. The stripe geometry is read off that\n// asset: a 64px tile, 32px of stripe per period, leaning left as it descends.\n//\n// The fade is the top LAYER here rather than a mask: `mask-image` on the bar\n// would fade its title and buttons with the stripes, and a masked pseudo-element\n// would paint over them. Washing the stripes out with the bar's own opaque\n// background colour renders identically and leaves the content alone.\n.devel adw-header-bar,\nadw-window.devel adw-header-bar,\nadw-application-window.devel adw-header-bar {\n background-image:\n linear-gradient(to bottom, transparent 0%, var(--headerbar-bg-color) 100%),\n repeating-linear-gradient(\n 116.565deg,\n color-mix(in srgb, currentColor 5%, transparent) 0 32px,\n transparent 32px 64px\n );\n}\n\n/*********************\n * Gtk.HeaderBar *\n *********************/\n\n// GTK's own bar, in the SAME file upstream styles `Adw.HeaderBar` in: libadwaita keys\n// `headerbar`, `windowhandle > box` and `box.start`/`box.end` off the GtkHeaderBar CSS tree\n// (refs/gtk/gtk/gtkheaderbar.c:99-116), and the element builds that tree here — so the\n// selectors are the same ones and the two bars sit on the same surface.\n//\n// `order` on the three children rather than their DOM order: the title widget is ADOPTED\n// into the centre `box` after the two side boxes are already in it, and a flex row lays out\n// in DOM order. The centring itself is the `flex: 1` centre track, which is\n// `gtk_center_layout_distribute`'s rule that the centre is clamped to\n// `size - (start.natural + end.natural)` (gtkcenterlayout.c:155-157) — the two ends keep\n// their natural width and the title takes what is left.\n//\n// The `.title` label is the derived one, and `min-width: 5ch` is `width-chars = 5`\n// (MIN_TITLE_CHARS, gtkheaderbar.c:117, :287) as CSS: a bar with a short title must not\n// collapse its centre to nothing and drop the ends on each other.\ngtk-header-bar {\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n min-height: 47px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n\n > .adw-gtk-header-bar-handle > .adw-gtk-header-bar-box {\n display: flex;\n align-items: center;\n flex: 1;\n // `_header-bar.scss:20-26` — the padding around the bar's whole content, and the 6px\n // spacing between the packed children at either side.\n padding: 6px 7px 7px 7px;\n\n > .adw-gtk-header-bar-start {\n order: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n // `:29-37` — the gap libadwaita puts between the centre and a side.\n margin-right: 6px;\n }\n\n > .adw-gtk-header-bar-end {\n order: 2;\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: 6px;\n }\n\n > :not(.adw-gtk-header-bar-start):not(.adw-gtk-header-bar-end) {\n order: 1;\n flex: 1;\n min-width: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n\n // The derived `GtkLabel` (gtkheaderbar.c:274-290): no wrap, `single-line-mode`,\n // `ellipsize = END`, `width-chars = 5`, and the `title` style class on top — which\n // `_header-bar.scss:213-219` gives 12px of padding either side and a bold weight.\n > .adw-gtk-header-bar-handle > .adw-gtk-header-bar-box > .adw-gtk-header-bar-title {\n min-width: 5ch;\n padding: 0 12px;\n font-weight: bold;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n\n/************************\n * Gtk.WindowControls *\n ************************/\n\n// The three frame buttons, off libadwaita's own `windowcontrols > button > image`\n// (refs/libadwaita/src/stylesheet/widgets/_header-bar.scss:175-207). A button is a 24px\n// square with 5px of padding; the IMAGE carries the whole hover/active affordance — a\n// circular `$button_color` disc that grows darker — which is why the disc and not the button\n// is what has a background here.\ngtk-window-controls {\n display: flex;\n align-items: center;\n // `:176` — the gap between two controls.\n gap: 3px;\n\n > .adw-window-controls-button {\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 24px;\n min-height: 24px;\n padding: 5px;\n border: none;\n background: none;\n color: inherit;\n cursor: pointer;\n\n > .adw-icon {\n // `:189-199` — the disc, its radius and its transitions.\n background-color: var(--button-bg-color);\n border-radius: 100%;\n padding: 4px;\n transition:\n background-color 150ms ease-out,\n box-shadow 150ms ease-out;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n\n &:hover > .adw-icon {\n background-color: var(--button-hover-color);\n }\n\n &:active > .adw-icon {\n background-color: var(--button-active-color);\n }\n\n // `:204-206` — the window icon is not a button, so it takes a margin, not a padding.\n > .icon {\n margin: 9px;\n }\n }\n}\n","// _action_bar.scss — <gtk-action-bar>, GTK's bottom bar of packed widgets.\n//\n// libadwaita styles the bar's inner box (`actionbar > revealer > box`); this element has\n// no revealer, so the host carries that box's surface and the three sections are its\n// start box, centre and end box. `border-spacing: 6px` there is the gap between the\n// packed children here.\n//\n// `revealed` is applied by toggling the `hidden` attribute, and `[hidden]` is re-asserted\n// as an AUTHOR rule for the reason `_view_switcher_bar.scss` gives: the UA rule loses to\n// this block's own `display` by cascade origin.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (GtkActionBar)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-action-bar {\n display: flex;\n align-items: center;\n gap: 6px;\n box-sizing: border-box;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 1px var(--headerbar-shade-color);\n padding: 7px 6px 6px 6px;\n\n &[hidden] {\n display: none;\n }\n\n > .adw-action-bar-start,\n > .adw-action-bar-end {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n > .adw-action-bar-start {\n flex: 1 1 0;\n justify-content: flex-start;\n }\n\n > .adw-action-bar-center {\n display: flex;\n align-items: center;\n }\n\n > .adw-action-bar-end {\n flex: 1 1 0;\n justify-content: flex-end;\n }\n}\n","// _window_title.scss — adw-window-title styling (header-bar title widget).\n// Reference: refs/adwaita-web/adwaita-web/docs/widgets/windowtitle.md\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-window-title {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n line-height: 1.15;\n min-width: 0;\n\n // Both labels carry 12px sides upstream (_header-bar.scss:214-227). Without them the\n // gallery's window title measured 27px narrower than GTK's render of the same `.blp`,\n // and a header bar's title could run up against the buttons beside it.\n .adw-window-title-title,\n .adw-window-title-subtitle {\n padding-left: 12px;\n padding-right: 12px;\n }\n\n .adw-window-title-title {\n font-size: var(--font-size-base);\n font-weight: 700;\n color: var(--headerbar-fg-color);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n }\n\n .adw-window-title-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--headerbar-fg-color);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n }\n}\n","// _button.scss — gtk-button + Adwaita button styles + symbolic icons + .linked.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// <gtk-button> is a thin host that renders an inner <button class=\"adw-button\">;\n// the class set is the real styling API and works on a plain <button> too.\ngtk-button {\n display: inline-flex;\n}\n\n.adw-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n min-height: 34px;\n min-width: 34px;\n margin: 0;\n padding: 4px 14px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n text-decoration: none;\n cursor: pointer;\n transition: background-color 0.1s ease;\n user-select: none;\n -webkit-user-select: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &:disabled {\n opacity: 0.45;\n cursor: default;\n }\n\n // Flat — no resting background; only reacts on hover/active. The header bar's\n // navigation buttons use this.\n &.flat {\n background-color: transparent;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Suggested action — accent-coloured primary button.\n &.suggested-action {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n\n &:hover {\n background-color: var(--accent-color);\n }\n\n &:active {\n background-color: var(--accent-color);\n filter: brightness(0.92);\n }\n }\n\n // Destructive action — libadwaita's `%destructive_button` (_buttons.scss:183-210):\n // red TEXT on a 15% tint of it, not a filled red button. It was filled here, so the\n // gallery's \"Delete\" read as a second primary action beside the GTK render of the\n // same `.blp`. The accent tokens are rebound as upstream does, so anything accent-\n // coloured inside the button (a focus ring) turns red with it.\n &.destructive-action {\n --accent-bg-color: var(--destructive-bg-color);\n --accent-fg-color: var(--destructive-fg-color);\n --accent-color: var(--destructive-color);\n\n color: var(--destructive-color);\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 20%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 35%, transparent);\n }\n }\n\n // A label-only button — GTK's `.text-button`, which `gtk_button_set_label` puts on the\n // button (_buttons.scss:72-75). 17px against the 14px every web button had, so each\n // text button in the gallery's button row was 6px narrower than GTK's. Before the pill,\n // circular and icon-only rules, which upstream also lets win.\n &.text-button {\n padding-left: 17px;\n padding-right: 17px;\n }\n\n // Icon-only square button (no label).\n &.icon-only {\n padding: 0;\n width: 34px;\n }\n\n // Circular — round icon button.\n &.circular {\n padding: 0;\n width: 34px;\n border-radius: 9999px;\n }\n\n // Pill — fully-rounded ends, and libadwaita's `%pill_button` padding\n // (_buttons.scss: `padding: 10px 32px`). It was 6px 20px, which drew every pill\n // 10px shorter and 24px narrower than GTK beside a GTK render of the same `.blp`.\n // GTK's height is `min-height: 24px` plus that padding, so 44; the floor is\n // restated because the base's 34 would otherwise hold the box at the text height.\n &.pill {\n min-height: 44px;\n padding: 10px 32px;\n border-radius: 9999px;\n }\n\n // Raised — the documented opt-OUT of the automatic flat appearance a button\n // gets inside a `.toolbar` or a header bar (style-classes.md \"Raised\"). It is\n // the default look, stated explicitly, so it must also beat `.flat` when both\n // are present, the way `_toolbars.scss` treats it.\n &.raised {\n background-color: var(--button-bg-color);\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // OSD — a standalone button overlapping content (style-classes.md \"OSD ›\n // Overlay Buttons\"). `_common.scss:44` excludes buttons from the generic OSD\n // surface precisely so this can define what `.osd` means for one:\n // `_buttons.scss:111-135` gives it a dark translucent background whose hover\n // and active states mix TOWARDS the foreground rather than changing alpha, so\n // it stays readable over any content. It composes with `.circular` / `.pill`.\n &.osd {\n min-height: 32px;\n min-width: 32px;\n color: rgb(255 255 255 / 90%);\n background-color: rgb(0 0 0 / 65%);\n\n @media (prefers-contrast: more) {\n box-shadow: 0 0 0 1px currentColor;\n }\n\n &:hover {\n color: #ffffff;\n background-color: color-mix(in srgb, black calc(0.85 * 65%), currentColor calc(0.15 * 65%));\n }\n\n &:active {\n color: #ffffff;\n background-color: color-mix(in srgb, black calc(0.75 * 65%), currentColor calc(0.25 * 65%));\n }\n }\n\n // Checked — `<gtk-toggle-button>`'s pressed state, libadwaita's `:checked`\n // (_buttons.scss:44-56, 136-140, 169-177, 199-210). Last in the block so it outranks the\n // hover/active/`.raised` rules of equal specificity above, which is also why the flat,\n // suggested and destructive variants restate their own checked colours: upstream\n // resolves them by the same source order.\n &.checked {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 35%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n }\n\n &.flat.checked {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n\n &.suggested-action.checked {\n background-color: var(--accent-bg-color);\n }\n\n &.destructive-action.checked {\n background-color: color-mix(in srgb, currentColor 35%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 45%, transparent);\n }\n }\n}\n\n// The symbolic icon (`.adw-icon`) used to be declared here, because the first\n// widget that needed one was the button. It is `scss/_icon.scss` now — every\n// other widget needs one too, and `<gtk-image>` is an element.\n\n// The linked group is `scss/_style_classes.scss` now, under libadwaita's own\n// `.linked` name (with `.adw-linked` kept as an alias): the documented class is\n// what a consumer reading style-classes.md reaches for, and it applies to\n// entries and drop-downs too, not only to buttons.\n","// _link.scss — `link` and `button.link`, libadwaita's link treatment.\n//\n// UNSCOPED, because upstream's rule is on the node and the class together\n// (`_links.scss:1-2`) and both spellings have a reader: a `Gtk.Label` that is a link is\n// the `link` node, and a `Gtk.LinkButton` is `button.link`. `<gtk-link-button>` renders an\n// inner `<button class=\"adw-button link\">`, so the class is what the selector needs.\n//\n// THE TWO COLOURS ARE THE PALETTE'S, not new tokens: `$link_color: var(--accent-color)`\n// and `$link_visited_color: color-mix(in srgb, var(--accent-color) 80%, var(--view-fg-color))`\n// (`_colors.scss:265-266`) are Sass variables over tokens this package already has, so a\n// consumer overriding `--accent-color` recolours its links with everything else.\n//\n// THE `:visited` CLAUSE IS PORTED AS A CLASS. Upstream styles GTK's `:visited` state\n// (`:7-9`), which is a state FLAG on the widget (`GTK_STATE_FLAG_VISITED`,\n// gtklinkbutton.c:743) rather than anything a selector can name from outside.\n// `gtk_link_button_set_visited()` flips exactly that flag and no CSS class, so\n// `<gtk-link-button>` writes `.visited` on the inner button and the rule below reads it.\n// `:disabled` needs no such translation: a disabled `<button>` is already the UA's.\n//\n// `font-weight: inherit` and the transparent background in EVERY state (`:38-44`) are\n// upstream's point: a link is a link, not a button that happens to be blue, so the\n// hover/active/checked rules must not paint over it.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_links.scss:1-49\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:265-266\n// Reference: refs/gtk/gtk/gtklinkbutton.c:380 (the `.link` style class), :646-672 (the\n// URI tooltip), :742-749 (the VISITED state flag)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — `:visited` becomes `.visited`, because\n// a state flag has no CSS spelling a selector can match on.\n\n$link-color: var(--accent-color);\n$link-visited-color: color-mix(in srgb, var(--accent-color) 80%, var(--view-fg-color));\n$osd-link-color: color-mix(in srgb, var(--accent-bg-color) 50%, white);\n\n.link,\n.adw-button.link {\n color: $link-color;\n text-decoration: underline;\n font-weight: inherit;\n\n &:hover {\n color: hsl(from $link-color h calc(s * 1.1) calc(l * 1.1));\n }\n\n &:active {\n color: $link-color;\n }\n\n &:disabled {\n color: color-mix(in srgb, currentColor var(--disabled-opacity), transparent);\n }\n\n &.visited {\n color: $link-visited-color;\n }\n\n // `.osd &` — a link over content, where the accent is too dark to read.\n .osd & {\n color: $osd-link-color;\n\n &:visited,\n &.visited {\n color: color-mix(in srgb, $osd-link-color 60%, currentColor);\n }\n\n &:active {\n color: $osd-link-color;\n }\n }\n\n // Every state transparent: upstream gives `button.link` no background at rest, on\n // hover, on active or when checked (_links.scss:38-44), so a toggle-button-styled link\n // cannot paint one.\n &,\n &:hover,\n &:active,\n &:checked,\n &.checked {\n background-color: transparent;\n }\n}","// _scale_button.scss — `<gtk-scale-button>`: the icon button, its `.scale-popup` dock and\n// the range inside it.\n//\n// The node is `scalebutton.scale` holding `button.toggle`\n// (gtkscalebutton.c:87-97), and the DOCK is a `GtkPopover` with the `scale-popup` style\n// class holding a box of [minus, scale, plus] with 4px margins and 4px spacing\n// (gtk/ui/gtkscalebutton.ui) — all three of those numbers restated here, because the box is the\n// dock's whole layout and GTK sizes the scale to `SCALE_SIZE` (100px) along its axis.\n//\n// The RANGE ITSELF is libadwaita's `scale` node (_scale.scss:19-251): the 12px padding,\n// the 99px trough, the accent-coloured `highlight`, the 20px round slider with a `-8px`\n// negative margin and a two-part shadow. An `<input type=\"range\">` is the element the\n// NativeScript port already substitutes for `GtkScale`, and the trough/highlight/slider\n// are drawn with `appearance: none` and the same numbers. The vertical case is the\n// `writing-mode` + `direction` pair that makes a range grow UPWARD, which is\n// `gtk_range_set_inverted (scale, TRUE)` for the vertical orientation (:883) — and\n// `scale-button-box` reverses its column for the same reason `apply_orientation`\n// reorders the children (:869-889).\n//\n// Reference: refs/gtk/gtk/gtkscalebutton.c:87-97 (the node), :869-889 (the orientation),\n// :1099-1100 (the steppers' sensitivity)\n// Reference: refs/gtk/gtk/ui/gtkscalebutton.ui:13-25 (the dock, its box, its margins)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scale.scss:1-60 (trough, highlight, slider)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — the scale is `<input type=\"range\">`\n// rather than a `scale` node, and the slider is drawn with `appearance: none`.\n\n/** `SCALE_SIZE` (gtkscalebutton.c:88) — the scale's size request along its own axis. */\n$scale-size: 100px;\n\n// libadwaita's own values (`_colors.scss:280-288`), which are Sass variables over tokens\n// this package already has rather than new ones: a trough is 15% of the current text\n// colour and a slider is 80% white over the view background.\n$trough-color: color-mix(in srgb, currentColor 15%, transparent);\n$trough-hover-color: color-mix(in srgb, currentColor 20%, transparent);\n$slider-color: color-mix(in srgb, white 80%, var(--view-bg-color));\n$slider-border-color: rgb(0 0 6 / 10%);\n\ngtk-scale-button {\n display: inline-flex;\n position: relative;\n}\n\n.scale-button-icon {\n min-width: 34px;\n}\n\n// The dock's own box: 4px of margin on all four sides, 4px between the three children.\n.scale-button-box {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n margin: 4px;\n\n // `apply_orientation` moves plus ABOVE minus when the scale is vertical\n // (gtkscalebutton.c:876-878). Reversing the column is the same arrangement without\n // moving nodes, which would take focus off a stepper mid-click.\n .vertical & {\n flex-direction: column-reverse;\n }\n}\n\n.scale-button-step {\n min-width: 24px;\n min-height: 24px;\n padding: 2px;\n}\n\n.scale-button-range {\n appearance: none;\n background: none;\n margin: 0;\n padding: 12px;\n min-width: 10px;\n min-height: 10px;\n flex: 1;\n cursor: pointer;\n\n // libadwaita sizes the SLIDER at 20px and pulls it 8px back out of the trough\n // (_scale.scss:49-58) — the negative margin is upstream's, not decoration.\n &::-webkit-slider-runnable-track {\n height: 4px;\n border-radius: 99px;\n background-color: $trough-color;\n transition: background-color 0.2s ease;\n }\n\n &::-webkit-slider-thumb {\n appearance: none;\n width: 20px;\n height: 20px;\n margin: -8px;\n border: none;\n border-radius: 100%;\n background-color: $slider-color;\n box-shadow: 0 0 0 1px $slider-border-color, 0 2px 4px rgb(0 0 6 / 20%);\n }\n\n &::-moz-range-track {\n height: 4px;\n border-radius: 99px;\n background-color: $trough-color;\n transition: background-color 0.2s ease;\n }\n\n &::-moz-range-progress {\n height: 4px;\n border-radius: 99px;\n background-color: var(--accent-bg-color);\n }\n\n &::-moz-range-thumb {\n width: 20px;\n height: 20px;\n border: none;\n border-radius: 100%;\n background-color: $slider-color;\n box-shadow: 0 0 0 1px $slider-border-color, 0 2px 4px rgb(0 0 6 / 20%);\n }\n\n &:hover::-webkit-slider-runnable-track,\n &:active::-webkit-slider-runnable-track {\n background-color: $trough-hover-color;\n }\n\n &:hover::-moz-range-track,\n &:active::-moz-range-track {\n background-color: $trough-hover-color;\n }\n\n &:disabled {\n filter: opacity(var(--disabled-opacity));\n }\n\n // A VERTICAL scale: `writing-mode` gives the axis and `direction: rtl` makes the value\n // grow upward, which is `gtk_range_set_inverted (scale, TRUE)` for the vertical\n // orientation (gtkscalebutton.c:883) and the only reason a media volume button fills\n // from the bottom.\n .vertical & {\n writing-mode: vertical-lr;\n direction: rtl;\n width: 24px;\n height: $scale-size;\n flex: none;\n\n &::-webkit-slider-runnable-track {\n width: 4px;\n height: $scale-size;\n }\n\n &::-webkit-slider-thumb {\n margin: -8px;\n }\n\n &::-moz-range-track {\n width: 4px;\n height: $scale-size;\n }\n }\n\n .horizontal & {\n height: 24px;\n width: $scale-size;\n flex: none;\n }\n}","// _color_button.scss — `<gtk-color-dialog-button>`: the `button.color` node and the\n// swatch it holds.\n//\n// THE SWATCH IS NOT LIBADWAITA'S, and saying so is the point of this partial. GTK paints\n// the `GtkColorSwatch` from GTK's OWN theme — libadwaita's `_color-chooser.scss` styles the\n// `colorchooser` popover, and `grep` finds no rule for the swatch or for `colorbutton` at\n// all. So what upstream does have is this:\n//\n// · the node `colorbutton > button.color` and the `.color` style class\n// (gtkcolordialogbutton.c:63-70, :163) — which is what puts the button in the\n// `.linked` group and makes it square;\n//\n// and what this partial adds is the geometry `gtk_color_dialog_button_init` asks for: a\n// swatch as wide as the word \"Black\" rendered at the base size and as tall as its line\n// (:139-148). 24x18 is that box at the base font size, so the button around it is the\n// usual 34px-tall button.\n//\n// THE TRANSLUCENT CLAUSE IS GTK's own drawing, keyed off the element's `data-translucent`:\n// `GtkColorSwatch` draws a checkerboard under a colour with alpha, and `rgba_to_gdk_rgba`\n// is how it decides. A browser has no such thing, and a translucent colour on a plain\n// background is unreadable without one.\n//\n// Reference: refs/gtk/gtk/gtkcolordialogbutton.c:63-70 (the node), :139-163 (the swatch,\n// the `.color` class), :329-347 (the accessible name's rounding)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_linked.scss:6 (`colorbutton > button`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — the swatch is a `<span>` painted with\n// `background-color`, and its checkerboard is this package's drawing of GtkColorSwatch.\n\ngtk-color-dialog-button {\n display: inline-flex;\n}\n\n.color-button-swatch {\n display: block;\n width: 24px;\n height: 18px;\n border-radius: 4px;\n box-shadow: 0 0 0 1px var(--shade-color);\n // The checkerboard, only while the colour is translucent — the element writes\n // `data-translucent` from `rgba[3] < 1`, which is GtkColorSwatch's own test.\n &[data-translucent='true'] {\n background-image:\n linear-gradient(45deg, rgb(0 0 6 / 12%) 25%, transparent 25%),\n linear-gradient(-45deg, rgb(0 0 6 / 12%) 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, rgb(0 0 6 / 12%) 75%),\n linear-gradient(-45deg, transparent 75%, rgb(0 0 6 / 12%) 75%);\n background-position:\n 0 0,\n 0 4px,\n 4px -4px,\n -4px 0;\n background-size: 8px 8px;\n }\n}\n\n// The chooser itself: visually nothing, and reachable only from the button's click, which\n// is why it is `aria-hidden` and out of the tab order rather than merely transparent.\n.color-button-input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n border: none;\n opacity: 0;\n pointer-events: none;\n}","// _font_button.scss — `<gtk-font-dialog-button>`: the `button.font` node and the two\n// labels it holds.\n//\n// libadwaita has no rule for it either: `_linked.scss:7` is the only place upstream names\n// `fontbutton`, and it is there because the node is a button that participates in a linked\n// group. So this partial is the node's layout and nothing else — and the node's layout IS\n// the C's, which builds a horizontal box of the family label (hexpand, so it takes the\n// room) and the size box, the latter a vertical separator followed by the size label\n// (gtkfontdialogbutton.c:121-140).\n//\n// The element hides the size box itself when the level is below FONT, because\n// `update_font_info` ends with `gtk_widget_set_visible (self->font_size_box, self->level >=\n// GTK_FONT_LEVEL_FONT)` (:685) — a family chooser shows one word where a font chooser shows\n// two, and the separator with it.\n//\n// Reference: refs/gtk/gtk/gtkfontdialogbutton.c:52-60 (the node), :118-152 (init, the box,\n// the labels), :649-687 (update_font_info, and the size box's visibility)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_linked.scss:7 (`fontbutton > button`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — the labels are `<span>`s inside an\n// ordinary `<button>`, and `use-font` sets their inline `font` (apply_use_font).\n\ngtk-font-dialog-button {\n display: inline-flex;\n position: relative;\n}\n\n.font-button-label {\n flex: 1;\n text-align: start;\n}\n\n// The size box: a separator and the size, in a row of their own — which is why the element\n// wraps them in a span rather than appending both to the button.\n.font-button-size {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n margin-inline-start: 6px;\n color: color-mix(in srgb, currentColor var(--dim-opacity), transparent);\n}\n\n.font-button-size-label {\n min-width: 2ch;\n font-variant-numeric: tabular-nums;\n}\n\n// The chooser: one row of families. A popover rather than a `<select>` on the button\n// itself, because `gtk_font_dialog_button_new()` is given a dialog and shows nothing until\n// it is pressed.\n.font-button-popover {\n .font-button-chooser {\n min-width: 180px;\n max-width: 320px;\n padding: 4px;\n border: none;\n border-radius: 6px;\n background-color: var(--popover-bg-color);\n color: var(--popover-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n }\n}","// _button_content.scss — adw-button-content styling (icon + label box used as a\n// button child). Mirrors libadwaita's `buttoncontent > box > {image, label}`\n// node: a horizontal box with 6px spacing between icon and label and a bold\n// label, plus optional ellipsizing when `.can-shrink` is set.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss (buttoncontent)\n// Reference: refs/libadwaita/src/adw-button-content.c (AdwButtonContent)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The class <adw-button-content> stamps on the button hosting it\n// (adw-button-content.c:115), removed again on unroot (:126).\n//\n// libadwaita: `button.image-text-button { padding-left: 9px; padding-right: 9px }`\n// (_buttons.scss:77-80) — against the 17px a plain `.text-button` gets (:72-75).\n// This rule lived in NEITHER renderer, so every icon+label button was drawn with\n// the wrong horizontal padding.\n//\n// Only the PADDING half of that block applies here. The same selector also\n// declares `> box, > box > box { border-spacing: 4px }` (:82-84), and neither\n// matches: the node tree is `button > buttoncontent > box` (:47-52), so the\n// button's direct child is the `buttoncontent`, not a box. The icon↔label gap\n// stays the 6px `buttoncontent > box` gives it (:626-628), which is the `gap`\n// below. It lives in this file rather than in `_button.scss` because the class\n// belongs to this widget, and `.adw-button.image-text-button` beats `.adw-button`\n// on specificity regardless of order.\n//\n// `:not(.pill)` because upstream states `.pill` (:322-323) AFTER this block at the same\n// specificity, so a pill keeps its `10px 32px` whatever it holds. This file is emitted\n// after `_button.scss`, so without the exclusion the order flipped: a pill button with\n// button content was drawn 9px from its label, 47px narrower than GTK.\n.adw-button.image-text-button:not(.pill) {\n padding-left: 9px;\n padding-right: 9px;\n}\n\n// Inside a split button the class sits on the `splitbutton` node instead, and a\n// DIFFERENT block wins: `splitbutton.image-text-button > button` (:499-502).\n.adw-split-button.image-text-button > .adw-split-button-action {\n padding-left: 9px;\n padding-right: 9px;\n}\n\nadw-button-content {\n display: inline-flex;\n align-items: center;\n // Centered as a group, matching the box's halign:center in AdwButtonContent.\n justify-content: center;\n min-width: 0;\n\n // The inner box holds the image + label nodes (border-spacing 6px upstream).\n .adw-button-content-box {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n min-width: 0;\n }\n\n .adw-button-content-label {\n // libadwaita: `buttoncontent > box > label { font-weight: bold; }` with a\n // 2px trailing pad (LTR) so the label does not hug the button edge.\n font-weight: 700;\n line-height: 1;\n padding-right: 2px;\n }\n\n // can-shrink — the label ellipsizes instead of forcing the button wider\n // (Gtk.Label PANGO_ELLIPSIZE_END). The icon keeps its natural size.\n &.can-shrink {\n .adw-button-content-box {\n min-width: 0;\n }\n\n .adw-button-content-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 0;\n }\n }\n}\n","// _popover.scss — <gtk-popover>, the one popover surface in this package.\n//\n// It replaces three hand-rolled copies (`.adw-menu-button-popover`,\n// `.adw-drop-down-popover`, `.adw-split-button-menu`) that disagreed with\n// libadwaita AND with each other: 12px / 12px / 9px radius against libadwaita's\n// 15px, two correct three-layer shadows and one invented two-layer one. Nothing\n// compared any of them to the vendored stylesheet, so all three shipped.\n//\n// GROUND TRUTH, AND THE SELECTOR THAT WINS THE CASCADE\n//\n// `popover > contents` is `padding: 8px; border-radius: $popover_radius` plus a\n// three-layer shadow (_popovers.scss:13-21), with a `prefers-contrast: more`\n// variant that swaps the innermost layer for a hairline border (:23-27).\n// `$popover_radius` is `$menu_radius + 6` = 15px (_common.scss:10,13) — not\n// `$card_radius` (12px) and not `$button_radius` (9px), the two tokens the\n// copies reached for.\n//\n// The PADDING has a second, more specific rule: `popover.menu > contents`\n// re-declares `padding: 0` and moves the inset onto the item box as\n// `$menu_margin` (6px) at _menus.scss:58-66. Two element selectors plus a class\n// beats one element selector plus a child, so a MENU popover renders a 6px inset\n// and a plain one an 8px inset. The three copies all used 6px — they were right\n// about the inset for the menus they drew, and wrong only about the radius.\n//\n// We reproduce the menu inset with ONE node instead of GTK's contents+box pair:\n// `[menu]` puts the 6px directly on the surface. Same rendered geometry, and\n// there is no separate box element to hang it on in the DOM.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_popovers.scss:7-28\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss:58-66, :134-156\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:10-13 ($menu_radius, $menu_margin, $popover_radius)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for the @gjsify/adwaita-web light-DOM custom elements.\n\n// Distance between the anchor and the surface. GTK gets this gap from the\n// popover's arrow, which this port does not draw (`has-arrow` is not modelled —\n// GtkPopover's C is not vendored here). 6px is what the menu button and the\n// drop-down already used; the split button's 4px was the odd one out.\n$popover-gap: 6px;\n\ngtk-popover {\n // $popover_radius = $menu_radius + 6 (_common.scss:10,13). Exposed as a token\n // so consumers re-theme it the same way as the rest (ADR 0010), with the\n // libadwaita value as the fallback.\n --popover-radius: 15px;\n\n position: absolute;\n z-index: 10;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n min-width: 120px; // popover.menu > contents (_menus.scss:2-4)\n padding: 8px; // popover > contents (_popovers.scss:14)\n border-radius: var(--popover-radius);\n background-color: var(--popover-bg-color, var(--window-bg-color, #fff));\n color: var(--popover-fg-color, var(--window-fg-color));\n\n // The exact three layers of _popovers.scss:18-20. The COUNT is load-bearing:\n // the split button shipped two.\n box-shadow:\n 0 0 0 1px rgba(0, 0, 0, 0.05),\n 0 1px 5px 1px rgba(0, 0, 0, 0.09),\n 0 2px 14px 3px rgba(0, 0, 0, 0.05);\n\n // _popovers.scss:23-27 — the innermost layer becomes a real hairline so the\n // surface has a visible edge when the shadow alone is not enough. Missing\n // from all three copies.\n @media (prefers-contrast: more) {\n box-shadow:\n 0 0 0 1px var(--separator-color),\n 0 1px 5px 1px rgba(0, 0, 0, 0.09),\n 0 2px 14px 3px rgba(0, 0, 0, 0.05);\n }\n\n // `popover.menu > contents { padding: 0 }` + `$menu_margin` on the item box\n // (_menus.scss:58-66), flattened onto the single surface node.\n //\n // `[menu]` is the attribute the element sets; `.menu` is the name libadwaita\n // DOCUMENTS for the same thing (style-classes.md \"Menu Popovers\"). Both are\n // accepted, because a consumer following the upstream documentation reaches\n // for the class and would otherwise get an 8px inset and no explanation.\n &[menu],\n &.menu {\n padding: 6px;\n }\n\n // --- Placement. Pure CSS, as it always was: nothing measures a rect and\n // --- nothing flips on overflow, in either the element or the core.\n &[data-position='bottom'] {\n top: calc(100% + #{$popover-gap});\n }\n\n &[data-position='top'] {\n bottom: calc(100% + #{$popover-gap});\n }\n\n &[data-position='start'] {\n top: 0;\n right: calc(100% + #{$popover-gap});\n }\n\n &[data-position='end'] {\n top: 0;\n left: calc(100% + #{$popover-gap});\n }\n\n // `align` picks the edge the surface lines up with, and only applies on the\n // vertical axis — a start/end popover is already pinned horizontally.\n &[data-position='bottom'],\n &[data-position='top'] {\n &[data-align='start'] {\n left: 0;\n }\n\n &[data-align='end'] {\n right: 0;\n }\n }\n}\n\n// A popover row — libadwaita's `modelbutton` (_menus.scss:134-156).\n.adw-popover-item {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n width: 100%;\n min-height: 32px; // :135\n min-width: 40px; // :136\n margin: 0;\n // `padding: 0 $menu_padding` (:137) — $menu_padding is 12px (_common.scss:12),\n // and the vertical inset comes from min-height, not from padding. No 12px\n // spacing token exists in this port, so the value is literal like the radius.\n padding: 0 12px;\n border: none;\n border-radius: 9px; // $menu_radius (:138) — NOT calc(--button-radius - 2px), which two copies invented\n background-color: transparent; // :139\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n // `&:hover, &:selected { background-color: $selected_color }` (:141-144).\n // `:selected` is GTK's keyboard-highlight pseudo-class; in the DOM that state\n // is focus, so `.selected` (the drop-down's chosen row) and `:focus` share it.\n &:hover,\n &:focus,\n &.selected {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color); // $selected_active_color (:146-148)\n }\n\n // :150-156 — a contrast-mode ring on the same three states.\n @media (prefers-contrast: more) {\n &:hover,\n &:focus,\n &.selected,\n &:active {\n box-shadow: inset 0 0 0 1px var(--separator-color);\n }\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n &[disabled] {\n opacity: var(--disabled-opacity);\n pointer-events: none;\n }\n}\n\n// Optional heading atop a menu. libadwaita's `label.title` is `font-weight: bold`\n// + `padding: 4px ($menu_padding + 20px)` (_menus.scss:180-183) — 32px of\n// horizontal padding to centre the title over icon-indented rows, which\n// libadwaita's own comment calls out as fragile. This port keeps the tighter\n// inset `.adw-menu-button-title` already shipped rather than changing how the\n// existing menus look; only the class name moved here. A DELIBERATE deviation,\n// not a reading of :180-183.\n.adw-popover-title {\n padding: 4px var(--spacing-s) 6px;\n font-weight: 700;\n opacity: var(--dim-opacity);\n}\n\n// --- The menu INSIDE the popover (ADR 0042) -----------------------------------\n//\n// One rule set for both menu-bearing elements, because the split button's dropdown\n// half IS a GtkMenuButton and its popup is the same `popover.menu`. SIX nodes, none of\n// which has a counterpart in the port's previous menus — they drew a flat list of labels\n// and nothing else: the separator, the section title, the accelerator, the check/radio\n// mark (plus the two nested `[aria-checked='true']` rules that draw it), the submenu\n// chevron and the back row.\n\n// `popover.menu separator { margin: 6px 0 }` (_menus.scss:68-70). GTK's separator is\n// a real widget with its own background; in the DOM the hairline is the border, so\n// the 6px is split above and below it rather than being a margin on a 1px box.\n.adw-popover-separator {\n height: 1px;\n margin: 6px 0;\n background-color: var(--separator-color, rgba(0, 0, 0, 0.15));\n}\n\n// A section's heading. `.adw-popover-title` already carries the weight and the dim;\n// this is the tighter top inset a heading needs when it follows a separator rather\n// than opening the menu.\n.adw-popover-section-title {\n padding-top: 2px;\n}\n\n// `popover.menu accelerator { color: dim; margin-left: $menu_padding }`\n// (_menus.scss:78-82). `margin-inline-start` rather than `margin-left`, so it follows\n// the writing direction the way GTK's `:dir(ltr)`/`:dir(rtl)` pair does — the two\n// rules are one logical property here.\n.adw-popover-item-accel {\n margin-inline-start: auto;\n padding-inline-start: 12px;\n opacity: var(--dim-opacity);\n font-size: 0.9em;\n}\n\n// `popover.menu check, radio { min-width: 14px; min-height: 14px; padding: 2px }`\n// (_menus.scss:85-90). The slot is reserved whether or not the row is checked, so the\n// labels of a group line up — the reason it is a node and not a `::before`.\n//\n// A DELIBERATE SUBSTITUTION, the same kind `<adw-split-button>`'s pan-up arrow already\n// documents: GTK draws the tick with `object-select-symbolic`, and this port's icon set\n// ships no checkmark (`_icons.generated.scss` has 42 glyphs and none of them is one). A\n// two-sided rotated border is the tick, so nothing here depends on an asset that would\n// silently render as `image-missing`.\n.adw-popover-item-check {\n position: relative;\n box-sizing: border-box;\n flex: none;\n width: 14px;\n height: 14px;\n padding: 2px;\n\n // Drawn off `aria-checked`, never off a class of its own: the accessible state and\n // the visible state are then the same fact rather than two that can disagree.\n [aria-checked='true'] > &::after {\n content: '';\n position: absolute;\n inset-inline-start: 4px;\n top: 1px;\n width: 4px;\n height: 8px;\n border: solid currentcolor;\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n }\n\n // A radio's mark is a filled dot, so the tick becomes a disc.\n &.radio {\n border-radius: 9999px;\n }\n\n [aria-checked='true'] > &.radio::after {\n inset-inline-start: 4px;\n top: 4px;\n width: 6px;\n height: 6px;\n border: none;\n border-radius: 9999px;\n background-color: currentcolor;\n transform: none;\n }\n}\n\n// The chevron on a row that opens a submenu.\n.adw-popover-item-arrow {\n margin-inline-start: auto;\n width: 16px;\n height: 16px;\n flex: none;\n opacity: var(--dim-opacity);\n}\n\n// The row that leaves a submenu. It carries the parent's own label, so it reads as\n// the heading of the page it returns to rather than as a bare \"Back\".\n.adw-popover-back {\n font-weight: 700;\n}\n","// _popover_menu_bar.scss — <gtk-popover-menu-bar>: a horizontal bar of items that pop up\n// a menu when clicked.\n//\n// libadwaita styles `menubar` in ONE place — the tail of `_menus.scss:244-269`, beside the\n// `popover.menu` rules rather than in a file of its own — so this partial holds that block\n// and nothing else. The values are libadwaita's:\n//\n// menubar box-shadow: inset 0 -1px $border_color; padding-bottom: 1px;\n// menubar > item min-height: 16px; padding: 4px 8px;\n// border-radius: $button_radius (9px, `_common.scss:8`);\n// menubar > item:selected background-color: $selected_color, plus the\n// `prefers-contrast: more` inset hairline.\n//\n// `:selected` is GTK's keyboard-highlight pseudo-class, which has no DOM counterpart: it is\n// the SELECTED item (`set_active_item` sets and unsets `GTK_STATE_FLAG_SELECTED`,\n// gtkpopovermenubar.c:145-152), and this package spells it `.selected` for the same reason\n// `.checked` stands in for `:checked` elsewhere. The hover and focus states are this\n// element's own addition, not libadwaita's: the upstream rule keys only on `:selected`\n// (with the comment \"seems like it :hover even with keyboard focus\"), and a DOM item takes\n// real focus where a GTK item is merely highlighted, so without them a keyboard reader would\n// see nothing move at all.\n//\n// NOTHING ELSE IS HERE, and the omissions are load-bearing. Each item's popover is a\n// `<gtk-popover-menu>`, so its surface, its 15px radius and its item rows are\n// `_popover.scss`'s — which is the point of this partial being small. The NESTED SUBMENU\n// rules libadwaita adds under `> item` (`popover.menu popover.menu` drops its top radius,\n// _menus.scss:257-263) are NOT ported: they exist to flatten the seam where two popovers\n// OVERLAP, and this port's surfaces never do — placement is the `position`/`align` pair\n// with a 6px gap, so there is no seam to flatten.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss:244-269 (`menubar`)\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:8 ($button_radius)\n// Reference: refs/gtk/gtk/gtkpopovermenubar.c:38-51 (the node tree and `.active`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+\n// Modifications: Adapted for the @gjsify/adwaita-web light-DOM custom elements —\n// `menubar > item` becomes `.adw-popover-menu-bar-item`, whose BUTTON is the `item`, and\n// `:selected` becomes `.selected`.\n\n.adw-popover-menu-bar {\n display: flex;\n align-items: center;\n box-sizing: border-box;\n box-shadow: inset 0 -1px var(--separator-color, rgba(0, 0, 0, 0.15));\n padding-bottom: 1px;\n\n // The wrapper carries GTK's `item` NODE, which is the positioning context the popover\n // hangs off — `<gtk-popover>` places itself against `parentElement`, and this is it.\n .adw-popover-menu-bar-item {\n position: relative;\n display: flex;\n align-items: center;\n }\n\n .adw-popover-menu-bar-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n min-height: 16px;\n padding: 4px 8px;\n margin: 0;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n // The two states libadwaita and the DOM each contribute: `.selected` for GTK's\n // `:selected`, `:hover`/`:focus` because a DOM item takes focus where a GTK item is\n // merely highlighted.\n &.selected,\n &:hover,\n &:focus {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n @media (prefers-contrast: more) {\n &.selected,\n &:hover,\n &:focus,\n &:active {\n box-shadow: inset 0 0 0 1px var(--separator-color);\n }\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n\n // `.active` is the item whose POPOVER IS OPEN, not the selected one\n // (gtkpopovermenubar.c:50-51), so hovering the bar selects without lighting anything and\n // the bar looks lit exactly while its menu is up.\n .adw-popover-menu-bar-item.active > .adw-popover-menu-bar-button {\n background-color: var(--button-active-color);\n }\n}","// _popover_bin.scss — <gtk-popover-bin>: the container around a widget that owns a popover.\n//\n// libadwaita has NO `popoverbin` rule — the node is new in GTK 4.22\n// (`gtk_widget_class_set_css_name (widget_class, \"popoverbin\")`, gtkpopoverbin.c:382) and\n// libadwaita 1.10 never styles it. So this partial is small on purpose, and the claim it\n// makes is exactly what GTK does with the class GTK ITSELF puts on the child:\n//\n// `on_popover_map` / `on_popover_unmap` (gtkpopoverbin.c:117-126) add and remove\n// `.has-open-popup` on the bin's CHILD, and libadwaita's `_lists.scss:57` comments that\n// class as \"indicathing which row generated a popover\" — a list row and a sidebar row\n// (`:132`) both keep their selected tint while their popup is up.\n//\n// The rules below are therefore the two libadwaita ALREADY ships, restated against this\n// package's tokens, because this package spells a row as a custom element rather than as\n// GTK's `row` node. Both values are libadwaita's own:\n//\n// row.activatable.has-open-popup background-color: $view_hover_color;\n// row.activatable:selected.has-open-popup $view_selected_hover_color;\n//\n// A bin whose child is a `<gtk-list-box-row>` or a `<gtk-button>` therefore stays highlighted\n// while its menu is open, which is the whole reason the class exists and the reason this\n// element toggles it rather than merely mirroring GTK's signal wiring.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:57, :64 (`row.has-open-popup`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss:132 (the sidebar row)\n// Reference: refs/gtk/gtk/gtkpopoverbin.c:117-126 (`.has-open-popup` on the child)\n// Copyright (c) GNOME contributors (GTK, libadwaita). LGPLv2.1+\n// Modifications: Adapted for the @gjsify/adwaita-web light-DOM custom elements.\n\n// The bin itself draws nothing: it is a bin layout holding one child and the popover, and\n// `gtk_popover_bin_compute_expand` (gtkpopoverbin.c:289-306) simply forwards the child's\n// expand to the bin. A `display: inline-flex` here would be an invented box, and the one\n// thing it must not do is take the popover out of flow — `_popover.scss` already positions\n// it absolutely against this element.\n.adw-popover-bin {\n position: relative;\n}\n\n// `row.activatable.has-open-popup { background-color: $view_hover_color }`\n// (_lists.scss:57). `view-hover-color` is the token `_lists.scss` uses for an activatable\n// row under the pointer, which is the closest thing this package has to a row that is\n// \"activated\" by a popup it did not ask for.\n.adw-popover-bin > .has-open-popup {\n background-color: var(--view-hover-color, var(--button-hover-color));\n}\n\n// `_lists.scss:64` — the same, for a row that is ALSO selected: libadwaita darkens to\n// `$view_selected_hover_color` rather than repeating the plain hover colour, which is what\n// keeps a selected row readable while its popup covers the list.\n.adw-popover-bin > .has-open-popup[aria-selected='true'],\n.adw-popover-bin > .has-open-popup.selected {\n background-color: var(--view-selected-hover-color, var(--button-hover-color));\n}","// _split_button.scss — adw-split-button styling: a primary action button fused\n// with a dropdown that opens a menu of related actions, split by a thin divider.\n// The suggested/destructive/flat style classes recolor the whole control like\n// the matching Adwaita button variants.\n// Reference: refs/libadwaita/src/adw-split-button.c (splitbutton CSS node)\n// Reference: refs/adwaita-web/adwaita-web/scss/_split_button.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n.adw-split-button {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: stretch;\n vertical-align: middle;\n min-height: 34px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n user-select: none;\n -webkit-user-select: none;\n\n &:focus-within {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // Primary action half — fills the available width, rounded on the leading\n // side only so it meets the dropdown flush.\n .adw-split-button-action {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n flex-grow: 1;\n min-height: 34px;\n margin: 0;\n padding: 4px 14px;\n border: none;\n border-radius: var(--button-radius) 0 0 var(--button-radius);\n background-color: transparent;\n color: inherit;\n font: inherit;\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n }\n\n // Icon-only action half — square, no horizontal text padding.\n &.icon-only {\n padding: 0;\n width: 34px;\n flex-grow: 0;\n }\n }\n\n // Thin divider between the two halves (the splitbutton `separator` node).\n .adw-split-button-dropdown {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-height: 34px;\n // libadwaita: `splitbutton > menubutton > button { padding: 0 4px }` over the button's\n // 16px minimum (_buttons.scss:486-489), so the arrow half is 24px. It was 28, and the\n // gallery's split button measured 5px wider than GTK's render of the same `.blp`.\n width: 24px;\n margin: 0;\n padding: 0 4px;\n border: none;\n border-left: 1px solid var(--separator-color);\n border-radius: 0 var(--button-radius) var(--button-radius) 0;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n .adw-icon {\n width: 14px;\n height: 14px;\n mask-size: 14px;\n -webkit-mask-size: 14px;\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n }\n }\n\n // The dropdown menu is `<gtk-popover>` (`_popover.scss`), and this was the\n // WORST of the three hand-rolled surfaces: `--button-radius` (9px) where\n // libadwaita's popover is 15px, under a two-layer shadow that exists nowhere\n // in the vendored stylesheet (`popover > contents` has three,\n // _popovers.scss:18-20), and a `calc(var(--button-radius) - 2px)` (7px) row\n // where `modelbutton` is 9px. Nothing element-specific was left to keep.\n\n // --- Suggested action — accent-coloured whole control ---\n &.suggested-action {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n\n .adw-split-button-dropdown {\n border-left-color: rgba(255, 255, 255, 0.3);\n }\n\n .adw-split-button-action:hover,\n .adw-split-button-dropdown:hover {\n background-color: var(--accent-color);\n }\n\n .adw-split-button-action:active,\n .adw-split-button-dropdown:active {\n background-color: var(--accent-color);\n filter: brightness(0.92);\n }\n }\n\n // --- Destructive action — red whole control ---\n &.destructive-action {\n background-color: var(--destructive-bg-color);\n color: var(--destructive-fg-color);\n\n .adw-split-button-dropdown {\n border-left-color: rgba(255, 255, 255, 0.3);\n }\n\n .adw-split-button-action:hover,\n .adw-split-button-dropdown:hover {\n filter: brightness(1.06);\n }\n\n .adw-split-button-action:active,\n .adw-split-button-dropdown:active {\n filter: brightness(0.9);\n }\n }\n\n // --- Flat — no resting background; only reacts on hover/active ---\n &.flat {\n background-color: transparent;\n }\n\n // --- Disabled ---\n &.disabled {\n opacity: 0.45;\n cursor: default;\n\n .adw-split-button-action,\n .adw-split-button-dropdown {\n cursor: default;\n pointer-events: none;\n }\n }\n}\n","// _menu_button.scss — gtk-menu-button styling: a flat (or circular) icon button\n// that drops an Adwaita-styled popover menu (the web counterpart of\n// Adw.MenuButton / Gtk.MenuButton). The button mirrors libadwaita's flat/circular\n// `menubutton > button`; the popover reproduces `popover.menu > contents` with\n// its soft triple-shadow surface and `modelbutton`-style item rows.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss (menubutton flat/circular)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_popovers.scss (popover > contents)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss (popover.menu modelbutton)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n.adw-menu-button {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n vertical-align: middle;\n\n // The icon button — square with the button radius by default.\n .adw-menu-button-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 34px;\n min-height: 34px;\n margin: 0;\n padding: 0 8px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n .adw-menu-button-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n\n // Flat — no resting fill (the header app-menu idiom).\n &.flat .adw-menu-button-button {\n background-color: transparent;\n }\n\n // The open state keeps a subtle fill so the button reads as \"checked\".\n &.active .adw-menu-button-button {\n background-color: var(--button-active-color);\n }\n\n // Circular — a round 34×34 button (window-control / FAB idiom).\n &.circular .adw-menu-button-button {\n padding: 0;\n border-radius: 9999px;\n }\n\n &.disabled {\n opacity: 0.45;\n\n .adw-menu-button-button {\n cursor: default;\n pointer-events: none;\n }\n }\n\n // The surface, the heading and the item row are `<gtk-popover>`'s —\n // `_popover.scss` (`gtk-popover`, `.adw-popover-title`, `.adw-popover-item`).\n // What used to be here was one of three hand-rolled copies: a\n // `--card-radius` (12px) surface where libadwaita's is 15px, and a\n // `calc(var(--button-radius) - 2px)` (7px) row where `modelbutton` is 9px.\n // Only the icon slot is a menu-button fact.\n .adw-menu-button-item-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n}\n","// _drop_down.scss — gtk-drop-down: a standalone dropdown selector (the web\n// counterpart of Gtk.DropDown). A normal Adwaita button showing the current\n// selection + a `pan-down` chevron, dropping an elevated Adwaita popover list of\n// options. The popover reproduces libadwaita's popover.menu > contents surface\n// (soft triple shadow), the items its modelbutton rows, matching <gtk-menu-button>.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_popovers.scss (popover > contents)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss (modelbutton rows)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dropdowns.scss (dropdown button)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n.adw-drop-down {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n vertical-align: middle;\n\n // The selection button — a normal Adwaita button (label + dim chevron).\n .adw-drop-down-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-xs);\n min-width: 100px;\n min-height: 34px;\n margin: 0;\n padding: 0 8px 0 12px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &:disabled {\n cursor: default;\n pointer-events: none;\n }\n }\n\n .adw-drop-down-label {\n flex: 1 1 auto;\n min-width: 0;\n text-align: start;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // The chevron — a smaller, dimmed down-glyph after the label.\n .adw-drop-down-arrow {\n width: 12px;\n height: 12px;\n mask-size: 12px;\n -webkit-mask-size: 12px;\n flex: none;\n opacity: var(--dim-opacity);\n }\n\n &.disabled {\n opacity: 0.55;\n }\n\n // The popover SURFACE is `<gtk-popover>`'s (`_popover.scss`, the `[menu]`\n // variant — a dropdown's popover is a `popover.menu`, _dropdowns.scss:22).\n // What stays here is what libadwaita ALSO scopes to `dropdown`:\n // - the extra 6px above the contents (`popover.menu { padding-top: 6px }`,\n // _dropdowns.scss:23). GTK puts it on the popover node while the 6px inset\n // sits on `> contents`; flattened onto one node they add, which is what\n // the two-node original renders too.\n // - the width tracking the button rather than libadwaita's flat `min-width`.\n .adw-drop-down-popover {\n padding-top: 12px;\n min-width: 100%;\n max-width: 320px;\n }\n\n // Search entry atop the popover (enable-search). It reuses the .adw-entry skin\n // but needs its own bottom margin to separate it from the list.\n .adw-drop-down-search {\n margin-bottom: var(--spacing-xs);\n }\n\n // Scrollable column of option rows.\n .adw-drop-down-list {\n display: flex;\n flex-direction: column;\n max-height: 320px;\n overflow-y: auto;\n }\n\n // An option row is `.adw-popover-item` (`_popover.scss` — libadwaita's\n // `modelbutton`). Only the trailing-check layout is a drop-down fact: the\n // label and the check sit at opposite ends of the row.\n .adw-drop-down-item {\n justify-content: space-between;\n gap: var(--spacing-s);\n }\n\n .adw-drop-down-item-label {\n flex: 1 1 auto;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // The selected-row check — a CSS checkmark, shown only on `.selected`.\n .adw-drop-down-item-check {\n position: relative;\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n .adw-drop-down-item.selected .adw-drop-down-item-check::after {\n content: '';\n position: absolute;\n left: 5px;\n top: 2px;\n width: 4px;\n height: 8px;\n border: solid var(--accent-color);\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n }\n}\n","// _toggle_group.scss — adw-toggle-group styling (a linked set of toggle buttons\n// with a single active item, recolored with the Adwaita active-toggle accent).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toggle-group.scss (AdwToggleGroup)\n// Reference: refs/adwaita-web/adwaita-web/scss/_toggle_group.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The active toggle uses a white-on-fg \"raised\" chip. These tokens default to\n// libadwaita's light-theme values; _theme.scss overrides them for dark.\n:root {\n --active-toggle-bg-color: #ffffff;\n --active-toggle-fg-color: var(--window-fg-color);\n}\n\nadw-toggle-group {\n // libadwaita's ---group-padding: a small inset so the active chip floats\n // inside the group's pill, leaving a hairline of group background around it.\n --group-padding: 3px;\n\n display: inline-flex;\n box-sizing: border-box;\n padding: var(--group-padding);\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n\n // `toggle-group:disabled` (libadwaita `_toggle-group.scss:16`) — the whole group's\n // background mixed toward transparent. Written against `[disabled]` and not `:disabled`:\n // a custom element is never `:disabled`, the way `_expander.scss` records.\n &[disabled] {\n background-color: color-mix(in srgb, var(--button-bg-color) var(--disabled-opacity), transparent);\n }\n\n .adw-toggle-group-inner {\n display: flex;\n align-items: stretch;\n gap: var(--group-padding);\n }\n\n // Each toggle is a button-shaped chip with the group's inner radius.\n .adw-toggle {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n min-width: 34px;\n min-height: 28px;\n margin: 0;\n padding: 4px 11px;\n border: none;\n border-radius: calc(var(--button-radius) - var(--group-padding));\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease,\n box-shadow 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // A `<button disabled>` carries GTK's `:disabled` dimming — `_buttons.scss:58`,\n // `filter: Opacity(var(--disabled-opacity))` — and `cursor: default` with it\n // (`_button.scss`). Hover and active are suppressed because a disabled button takes\n // neither, so the hover fill would linger over a toggle that cannot be pressed.\n &:disabled {\n opacity: var(--disabled-opacity);\n cursor: default;\n\n &:hover,\n &:active {\n background-color: transparent;\n }\n }\n\n // The active toggle — a raised white chip, the way libadwaita draws it.\n &.active {\n background-color: var(--active-toggle-bg-color);\n color: var(--active-toggle-fg-color);\n box-shadow:\n 0 1px 3px 1px rgba(0, 0, 6, 0.07),\n 0 2px 6px 2px rgba(0, 0, 6, 0.03);\n\n &:hover {\n background-color: var(--active-toggle-bg-color);\n }\n\n // The raised chip is what makes it read as raised; libadwaita drops the shadow on a\n // disabled active toggle (`_toggle-group.scss:131`) so an unavailable choice does not\n // look pressed.\n &:disabled {\n box-shadow: none;\n }\n }\n }\n\n // Round — group + toggles become pill-shaped.\n &.round {\n border-radius: 17px;\n\n .adw-toggle {\n border-radius: calc(17px - var(--group-padding));\n padding-left: calc(15px - var(--group-padding));\n padding-right: calc(15px - var(--group-padding));\n }\n }\n\n // Flat — no group background; the active toggle uses a subtle fill instead of\n // the raised white chip.\n &.flat {\n --group-padding: 0px;\n\n padding: 0;\n background: none;\n\n .adw-toggle {\n border-radius: var(--button-radius);\n\n &.active {\n background-color: var(--button-active-color);\n color: inherit;\n box-shadow: none;\n\n &:hover {\n background-color: var(--button-active-color);\n }\n }\n }\n\n &.round .adw-toggle {\n border-radius: 17px;\n }\n }\n}\n","// _switch.scss — the <gtk-switch> control: a track, a hidden checkbox and a\n// sliding knob. UNSCOPED, which is the whole point of the partial.\n//\n// WHY IT IS ITS OWN FILE. These rules used to live inside `_switch_row.scss`,\n// nested under `adw-switch-row { … }` — so `.adw-switch` did not exist anywhere\n// else, and the moment a second widget needed a toggle it could not use it.\n// `_expander_row.scss` therefore carried a character-for-character copy of the\n// whole block (same 44×24 box, same hidden input, same 20px knob, same\n// `translateX(20px)`, same focus ring) under a different class name. Two copies\n// of a control is how a hover state gets fixed in one of them.\n//\n// FIDELITY, RECORDED RATHER THAN \"FIXED\": the 44×24 track with the 20px knob is\n// `refs/adwaita-web/adwaita-web/scss/_switch.scss`'s geometry, NOT libadwaita's.\n// libadwaita draws `switch` as a 3px-padded trough around a 20px slider with\n// `border-radius: 14px` (refs/libadwaita/src/stylesheet/widgets/_switch.scss:3-4,\n// :24-26) — about 26px tall, not 24, and correspondingly narrower. What ships\n// here is the vendored web port's box, unchanged by the extraction; changing the\n// geometry is a visual decision for a separate change, and citing libadwaita for\n// numbers that came from somewhere else would be the misreading the conformance\n// header warns about.\n//\n// Reference: refs/adwaita-web/adwaita-web/scss/_switch.scss (the geometry that ships)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_switch.scss:3-4,20-26 (the geometry that does not, + the disabled treatment)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components; lifted out of\n// `adw-switch-row {}` so <gtk-switch> is usable anywhere.\n\n.adw-switch {\n position: relative;\n display: inline-block;\n width: 44px;\n height: 24px;\n flex-shrink: 0;\n\n // The real control: focusable and keyboard-toggleable, but never painted —\n // the slider below is what the user sees and clicks.\n input {\n opacity: 0;\n width: 0;\n height: 0;\n position: absolute;\n }\n}\n\n.adw-switch-slider {\n position: absolute;\n cursor: pointer;\n inset: 0;\n background-color: var(--switch-off-bg);\n border-radius: 12px;\n transition: background-color 0.15s ease-out;\n\n &::before {\n content: \"\";\n position: absolute;\n height: 20px;\n width: 20px;\n left: 2px;\n bottom: 2px;\n background-color: var(--switch-knob-bg);\n border-radius: 50%;\n transition: transform 0.15s ease-out;\n box-shadow: 0 1px 2px rgb(0 0 0 / 20%);\n }\n}\n\n// The KNOB follows `active` — GTK moves the handle from the user's own position\n// (gtkswitch.c:795-798), which is `Gtk.Switch:active`.\n.adw-switch input:checked + .adw-switch-slider::before {\n transform: translateX(20px);\n}\n\n// The TROUGH follows `state`. GTK raises and clears the `:checked` state flag from\n// `gtk_switch_set_state` (gtkswitch.c:853-856) — NOT from `active` — and libadwaita\n// paints `switch:checked` from it (refs/libadwaita/src/stylesheet/widgets/_switch.scss:\n// 41-55). That separation is the whole point of the two booleans: a switch whose\n// backend has not caught up yet shows the user where they put it (knob) over where the\n// thing actually is (trough).\n.adw-switch.checked .adw-switch-slider {\n background-color: var(--accent-bg-color);\n}\n\n.adw-switch input:focus-visible + .adw-switch-slider {\n outline: 2px solid var(--accent-color);\n outline-offset: 2px;\n}\n\n// libadwaita dims the whole widget (`filter: Opacity(var(--disabled-opacity))`,\n// _switch.scss:20-22), and `--disabled-opacity` is a real token here now — it\n// used to be stood in for by `--dim-opacity`, which is a different number and\n// moves the OTHER way under high contrast.\n.adw-switch.disabled {\n opacity: var(--disabled-opacity);\n\n .adw-switch-slider {\n cursor: not-allowed;\n }\n}\n","// _entry.scss — gtk-entry / .adw-entry text input (e.g. a browser URL bar).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// <gtk-entry> hosts an inner <input class=\"adw-entry\">; it fills its flex slot.\ngtk-entry {\n display: flex;\n flex: 1;\n min-width: 0;\n}\n\n.adw-entry {\n box-sizing: border-box;\n width: 100%;\n min-height: 34px;\n margin: 0;\n padding: 5px 12px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--entry-bg-color);\n color: var(--view-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n // NO FRAME. `%entry_basic` (_entries.scss:1-11) draws a fill and a radius and\n // nothing else: the one-pixel border appears ONLY under `prefers-contrast: more`\n // (:13-15). The frame sat here unconditionally, so every entry — entry, search entry,\n // password entry, the text view — read as an outlined box where libadwaita draws a\n // flat grey one. Confirmed against the native reference: a focused entry carries the\n // accent ring, an unfocused one carries no edge at all.\n transition: box-shadow 0.1s ease;\n\n &::placeholder {\n color: var(--view-fg-color);\n opacity: var(--dim-opacity);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n // Dimmed disabled state, mirroring .adw-button:disabled.\n &:disabled {\n opacity: 0.45;\n cursor: default;\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--entry-border-color);\n\n &:hover {\n box-shadow: inset 0 0 0 1px var(--entry-border-hover-color);\n }\n }\n}\n","// _search_entry.scss — <gtk-search-entry>: the same `entry` box with a magnifying glass\n// leading and a clear button trailing.\n//\n// libadwaita has no `entry.search` rule at all: `Gtk.SearchEntry`'s CSS node is `entry`\n// carrying the `.search` STYLE CLASS (gtksearchentry.c:884), and every rule that reaches it\n// is one `_entries.scss` already states for `entry` (:1-96) — the box, the focus ring, the\n// icons at 70%, and their `&.right { margin-left: 6px }`. So this partial is those same\n// rules applied to the two extra nodes this widget has, and it deliberately adds nothing of\n// its own: a rule that could select `entry.search` but does not is a rule that rots, which\n// is the reasoning `_progress_bar.scss` records for `progressbar.vertical`.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-96\n// Reference: refs/gtk/gtk/gtksearchentry.c:884 (the `.search` style class, and the CSS node name `entry`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-search-entry {\n display: flex;\n flex: 1;\n min-width: 0;\n align-items: center;\n box-sizing: border-box;\n min-height: 34px;\n padding: 0 9px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n background-clip: padding-box;\n caret-color: currentColor;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n\n // `@include focus-ring($focus-state: ':focus-within')` (_entries.scss:17). The host is the\n // focusable node here rather than a wrapping box, so it is the host's own focus that\n // paints the ring — which is the same ring `:focus-within` draws, one node further out.\n &:focus-within {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n .adw-entry {\n flex: 1;\n min-width: 0;\n min-height: auto;\n padding: 0 6px;\n background-color: transparent;\n box-shadow: none;\n\n &:focus,\n &:focus-visible {\n box-shadow: none;\n }\n }\n\n // `> image { opacity: 70%; &.left { margin-right: 6px } }` (_entries.scss:42-61)\n .adw-search-entry-icon {\n flex: none;\n margin-right: 6px;\n opacity: 70%;\n color: inherit;\n\n @media (prefers-contrast: more) {\n opacity: 85%;\n }\n }\n\n .adw-search-entry-clear {\n flex: none;\n margin-left: 6px;\n opacity: 70%;\n color: inherit;\n\n @media (prefers-contrast: more) {\n opacity: 85%;\n }\n\n &:hover {\n opacity: 100%;\n }\n\n &:active {\n opacity: 80%;\n }\n }\n}","// _password_entry.scss — <gtk-password-entry>: an `entry.password` box with a Caps Lock\n// warning leading and a peek button trailing.\n//\n// libadwaita styles `entry` and `entry.password` in ONE partial (_entries.scss:1-96), and the\n// password half is four rules: the entry shape itself, `> image { opacity: 70% }` for the\n// icons inside an entry (:42-61), and `&.password image.caps-lock-indicator { opacity:\n// $dimmer_opacity }` (:63-69). Everything else here is the box this package's\n// `_entry.scss` already gives `gtk-entry`, restated because the Caps Lock indicator is a\n// TEXT glyph rather than a masked icon and would otherwise take the entry's own padding.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-96\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-password-entry {\n display: flex;\n flex: 1;\n min-width: 0;\n align-items: center;\n box-sizing: border-box;\n min-height: 34px;\n padding: 0 9px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n background-clip: padding-box;\n caret-color: currentColor;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n\n // The entry shape `_entry.scss` gives the inner input, narrowed to this widget's own parts.\n .adw-entry {\n flex: 1;\n min-width: 0;\n min-height: auto;\n padding: 6px 0;\n background-color: transparent;\n box-shadow: none;\n\n &:focus,\n &:focus-visible {\n box-shadow: none;\n }\n }\n\n // `&.password image.caps-lock-indicator { opacity: $dimmer_opacity }` (:63-69). The glyph\n // is text — `caps-lock-symbolic` is in no icon theme this renderer can compile — so it is\n // DIMMED rather than masked, and it carries the canonical name in `data-icon-name`.\n .adw-password-entry-caps-lock {\n flex: none;\n margin-right: 6px;\n color: currentColor;\n opacity: 0.45;\n font-size: var(--font-size-base);\n line-height: 1;\n\n @media (prefers-contrast: more) {\n opacity: 0.6;\n }\n }\n\n // `> image { … &.right { margin-left: 6px } }` (:42-61): the icons inside an entry are at\n // 70% and go to 100% on hover, which is the rule the peek button is a `gtk-image` for.\n .adw-password-entry-peek {\n flex: none;\n margin-left: 6px;\n opacity: 70%;\n color: inherit;\n\n @media (prefers-contrast: more) {\n opacity: 85%;\n }\n\n &:hover {\n opacity: 100%;\n }\n\n &:active {\n opacity: 80%;\n }\n }\n}","// _separator.scss — <gtk-separator>: a one-pixel rule, and the `.spacer` variant that draws\n// nothing and only keeps its distance.\n//\n// libadwaita's whole rule is `separator { background: $border_color; min-width: 1px;\n// min-height: 1px }` plus `.spacer` (_misc.scss:21-31). GTK gives the widget its extent from\n// the orientation: a horizontal separator is 1px tall and as wide as it is given, a vertical\n// one the reverse. A flex or block parent hands that width through `align-self: stretch`,\n// which is why the cross-axis size is `auto` rather than a number.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:21-31\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-separator {\n display: block;\n flex: none;\n align-self: stretch;\n background: var(--border-color);\n min-width: 1px;\n min-height: 1px;\n\n &.horizontal {\n height: 1px;\n }\n\n &.vertical {\n width: 1px;\n }\n\n &.spacer {\n background: none;\n\n &.horizontal {\n min-width: 12px;\n }\n\n // The generic `.spacer` in `_style_classes.scss` also floors the WIDTH at 12px for an\n // element with no orientation; a vertical separator's width is its 1px, so say so.\n &.vertical {\n min-width: 1px;\n min-height: 12px;\n }\n }\n}\n","// _text.scss — the three GTK widgets whose content is text: `<gtk-text>`,\n// `<gtk-text-view>` and `<gtk-editable-label>`.\n//\n// ONE PARTIAL, because upstream's rules for them are three small blocks in two files that\n// are about the same two things — libadwaita paints a `text` node either as `%view`\n// (`_views.scss:1-18`, `textview > text` at :23-29) or, inside an editable label, as the\n// same view pair (`_labels.scss:94-97`) — and the entry metrics (`_entries.scss:4-11`,\n// `19-28`) that `<gtk-text>` shares with the entry it is the delegate of. Where the text\n// NODE is the thing being styled upstream and the WIDGET is the element here, the inner\n// control carries the rule and the host carries the layout.\n//\n// WHAT UPSTREAM DOES NOT STYLE, and this file does not either: a standalone `text` node has\n// no rule of its own in libadwaita — `%entry` is written for `entry`, and a `Gtk.Text` is\n// only ever seen as an entry's delegate (`gtktext.c:78-91`) — so the metrics below are the\n// ENTRY's, which is the widget this one is a delegate of, not an invention. `text[.read-only]`\n// is a selector hook with no rule behind it (`_views.scss` has none, `gtktext.c:155-167`\n// documents the node), so the class is applied and an author may style it.\n//\n// `:backdrop` and `:disabled` are the two states upstream reaches for that this port has no\n// state for, the same trade `_labels.scss` records for `<gtk-label>`.\n//\n// The font stack is `inherit` rather than a second `--font-family` declaration, so that the\n// `.monospace` CLASS — libadwaita's own (`_labels.scss:81-84`), which `<gtk-text-view>` puts\n// on its HOST — reaches the inner control through the cascade instead of a copied rule.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:1-18,20-45\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss:1-11,81-84,90-97\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-28\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// <gtk-text> hosts an inner <input class=\"adw-text\">; it fills its flex slot, and\n// `propagate-text-width` is the C's \"grow and shrink with the content\" made a layout.\ngtk-text {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n\n // `gtk_text_set_propagate_text_width` (gtktext.c:7400-7420): the widget's width follows\n // its text, which is the input's own `size` mechanism, so the HOST only has to stop\n // stretching to its container.\n &.propagate-text-width {\n width: fit-content;\n max-width: 100%;\n }\n\n .adw-text {\n box-sizing: border-box;\n width: 100%;\n // `%entry_basic`'s three metrics (_entries.scss:4-6).\n min-height: 34px;\n padding: 5px 9px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--entry-bg-color);\n // `%view`'s colours: `text` is a view wherever libadwaita styles it\n // (_views.scss:1-18), and an entry is one (_entries.scss:9).\n color: var(--view-fg-color);\n font-family: inherit;\n font-size: inherit;\n caret-color: currentColor;\n\n // `entry > text > placeholder { @extend .dimmed }` (_entries.scss:19-22).\n &::placeholder {\n color: var(--view-fg-color);\n opacity: var(--dim-opacity);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n}\n\n// `<gtk-text-view>` hosts a <textarea>. GTK's own property doc for the margins says what a\n// text view's spacing IS — \"In CSS terms, the value set here is padding, and it is applied in\n// ADDITION to the padding from the theme\" (gtktextview.c:1050-1057) — so the four margin\n// attributes are four custom properties the element writes, and the padding below is the sum.\ngtk-text-view {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n\n // `textview { caret-color: currentColor }` (_views.scss:21): the caret is the inner\n // control's, and `cursor-visible` is what turns it off there.\n .adw-text-view {\n box-sizing: border-box;\n width: 100%;\n margin: 0;\n // `top-margin` and friends, ADDED to the theme's own padding (gtktextview.c:1050-1057).\n // The four are custom properties so the sum stays here and the element writes pixels.\n --adw-text-view-margin-top: 0px;\n --adw-text-view-margin-end: 0px;\n --adw-text-view-margin-bottom: 0px;\n --adw-text-view-margin-start: 0px;\n padding-top: calc(6px + var(--adw-text-view-margin-top));\n padding-right: calc(6px + var(--adw-text-view-margin-end));\n padding-bottom: calc(6px + var(--adw-text-view-margin-bottom));\n padding-left: calc(6px + var(--adw-text-view-margin-start));\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n font-family: inherit;\n font-size: inherit;\n overflow: auto;\n resize: vertical;\n\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n\n // `&.inline` (_views.scss:31-36): an inline text view has no surface of its own, which is\n // how a text view behaves inside a row or a page of prose. An AUTHOR class, as upstream:\n // nothing in the element sets it.\n &.inline .adw-text-view {\n background-color: transparent;\n color: inherit;\n }\n}\n\n// `<gtk-editable-label>` is `stack > { label, entry }`, one of them visible\n// (gtkeditablelabel.c:66-73): an inline row, and the entry inside it wears the view colours\n// upstream writes for that node (_labels.scss:94-97).\ngtk-editable-label {\n display: inline-flex;\n align-items: baseline;\n max-width: 100%;\n // Focus follows the WIDGET, not the entry, while the label is showing\n // (gtkeditablelabel.c:377-388), so the host owns the focus ring.\n border-radius: var(--button-radius);\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n .adw-editable-label-label {\n // A primary click starts editing (gtkeditablelabel.c:193-215), and GTK drags the\n // label's own text out of it (gtkeditablelabel.c:272-291), so it is selectable text.\n cursor: text;\n user-select: text;\n }\n\n .adw-editable-label-entry {\n box-sizing: border-box;\n margin: 0;\n padding: 2px 4px;\n border: none;\n border-radius: var(--button-radius);\n // `editablelabel > stack > text` (_labels.scss:94-97), verbatim as a pair.\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n font-family: inherit;\n font-size: inherit;\n caret-color: currentColor;\n\n &:focus,\n &:focus-visible {\n outline: none;\n }\n }\n\n // `GtkEditableLabel:editable` FALSE leaves the label a label — the C's actions are\n // disabled with it (gtkeditablelabel.c:414-427), so a click does nothing.\n &[editable='false'] .adw-editable-label-label {\n cursor: default;\n }\n}","// _search_bar.scss — `<gtk-search-bar>`, the strip that reveals a search entry.\n//\n// The whole of libadwaita's rule is `searchbar > revealer > box` plus a `.close` button\n// (_toolbars.scss:113-159): the box is a HEADER BAR surface — the same `--headerbar-bg-color`\n// pair and the same 1px shade along its bottom edge as `adw-header-bar` draws\n// (`_header-bar.scss`) — and the strip sits at the bottom of a window, so that edge is the\n// one that separates it from the content.\n//\n// THE REVEALER IS THE STATE. `search-mode-enabled` IS `reveal-child` (gtksearchbar.c:183-205,\n// 512-517), so the strip animates its own height and the element drives nothing else. One\n// grid row that goes `0fr` → `1fr` is the one CSS mechanism that animates to a height the\n// CONTENT decides; `max-height` would be a guess at that height, and `display: none` would\n// not animate at all.\n//\n// TWO RULES ARE DELIBERATELY ABSENT. `:backdrop` — the dimmed variant libadwaita draws when\n// the window is unfocused (_toolbars.scss:125-133) — has no state here: this port has no\n// toplevel whose focus it could follow. And `%toolbar`'s reset rules (_toolbars.scss:5-66)\n// only classify the BUTTON classes inside a toolbar, which `<gtk-button>` already owns\n// (`_button.scss`).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss:109-185 (searchbar)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-search-bar {\n display: grid;\n // THE REVEALER (`reveal-child`). `0fr` clips the box to nothing without taking it out of\n // the layout, which is what a GTK revealer does; `1fr` gives the box its own height.\n grid-template-rows: 0fr;\n transition: grid-template-rows 200ms ease;\n\n &.revealed {\n grid-template-rows: 1fr;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n\n .adw-search-bar-box {\n // The clip the `0fr` row needs, and the header-bar surface libadwaita puts on it\n // (_toolbars.scss:115-122).\n overflow: hidden;\n min-height: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 6px 7px 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 -1px var(--separator-color);\n }\n }\n\n // The `GtkCenterBox` the C wraps the child in (gtksearchbar.c:378-386): the entry takes\n // the free space, the close button sits at its end.\n .adw-search-bar-center {\n display: flex;\n align-items: center;\n gap: 6px;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n // `button.close` (_toolbars.scss:137-153): a 18px round flat button, with the 10px/4px\n // ltr margins upstream writes and the 4px/10px rtl mirror.\n .adw-search-bar-close {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 18px;\n min-height: 18px;\n margin-left: 10px;\n margin-right: 4px;\n padding: 4px;\n border: none;\n border-radius: 50%;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &[hidden] {\n display: none;\n }\n }\n\n // `&:dir(rtl)` (_toolbars.scss:150-153) — the margins swap sides, not the order.\n &:dir(rtl) .adw-search-bar-close {\n margin-left: 4px;\n margin-right: 10px;\n }\n\n // `searchbar.inline` (_toolbars.scss:156-158) drops the header-bar surface, which is what\n // an author adds when the strip sits inside a page rather than at a window's edge.\n &.inline .adw-search-bar-box {\n background-color: transparent;\n color: inherit;\n box-shadow: none;\n padding-bottom: 6px;\n }\n}","// _drawing.scss — <gtk-drawing-area>, and the page's other hand-drawn surfaces.\n//\n// THERE IS NO UPSTREAM FILE TO PORT. `GtkDrawingArea` sets no CSS name of its own, so\n// its node is the default `widget` node (gtkwidget.c:1982), and libadwaita's stylesheet\n// has no rule for it — nor for `glarea`, which sets no name either, nor for\n// `graphicsoffload`, whose only rule is the widget-node layout GTK gives a bin. So this\n// partial is GEOMETRY, and every value in it is transcribed from a measure function in\n// the C rather than from a stylesheet upstream does not have. Saying that is the point:\n// the rules below are not a re-skin, they are the measurement written out.\n//\n// CONTENT-WIDTH IS A FLOOR, NOT A SIZE. `gtk_drawing_area_measure` returns\n// `content_width` as the minimum AND the natural width (gtkdrawingarea.c:210-231), so a\n// parent may hand the area MORE than it asked for — which is what `width: <length>`\n// means for a block box — and cannot hand it less, which is `min-width`. The zero default\n// is \"no intrinsic size\", and `auto` is the block box's own answer to that.\n//\n// Reference: refs/gtk/gtk/gtkdrawingarea.c:210-231,240-267\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-drawing-area {\n display: block;\n // The natural half: a parent with room to spare gives the area more, and a parent\n // without gives it exactly the floor below.\n width: var(--adw-drawing-width, auto);\n height: var(--adw-drawing-height, auto);\n // The minimum half — the same number, which is why both read one custom property.\n min-width: var(--adw-drawing-width, 0);\n min-height: var(--adw-drawing-height, 0);\n\n // The cairo region GTK hands the draw function is the whole allocation\n // (gtkdrawingarea.c:248-262), so the canvas is the whole box rather than a scaled\n // child of it.\n .adw-drawing-area-canvas {\n display: block;\n width: 100%;\n height: 100%;\n }\n}\n\n// <gtk-gl-area> — `GtkGLArea` sets no CSS name (no `gtk_widget_class_set_css_name` in\n// gtkglarea.c), so its node is the generic `widget` node and libadwaita has no rule for\n// it. It also has NO measure function, which is the rule that shapes what follows: the\n// area reports no intrinsic size on either axis, so a parent gives it one.\ngtk-gl-area {\n display: block;\n position: relative;\n\n .adw-gl-area-canvas {\n display: block;\n width: 100%;\n height: 100%;\n }\n\n // `gtk_gl_area_draw_error_screen` (:701-723): the error message laid out across the\n // widget's width and centred vertically — `pango_layout_set_width (width *\n // PANGO_SCALE)` and `PANGO_ALIGN_CENTER`, at `(height - layout_height) / 2`. The\n // canvas stays behind it, as GTK's snapshot replaces a frame's contents rather than\n // the widget's node.\n .adw-gl-area-error {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n padding: 12px;\n }\n}\n// <gtk-graphics-offload> — `GTK_TYPE_BIN_LAYOUT` (gtkgraphicsoffload.c:290) gives the\n// child the whole allocation, and the black rectangle `black_background` paints over that\n// allocation BEFORE the child (:222-229) is a BACKGROUND rather than a layer: what the\n// letterbox bars need is the wrapper black exactly where the child does not cover it.\ngtk-graphics-offload {\n display: block;\n position: relative;\n // No `overflow: hidden` here: GTK's subsurface is rectangular and a rounded corner or a\n // clip is one of the things that PROHIBITS offload (:66-68), so clipping this box would\n // be the very condition the widget exists to avoid. It does not clip.\n .adw-graphics-offload-child {\n display: block;\n width: 100%;\n height: 100%;\n }\n}\n","// _drag_icon.scss — <gtk-drag-icon>: the one widget whose CSS node libadwaita styles for\n// the WHOLE widget rather than for one state.\n//\n// `gtk_widget_class_set_css_name (widget_class, \"dnd\")` (gtkdragicon.c:383) is the whole\n// of the widget's styling, and libadwaita's only rule on that node is a foreground colour\n// (`_common.scss:30-32`). The second rule naming it — `dnd tab` in `_tab-view.scss` — is a\n// `GtkTabView` tab being dragged out of a tab view, which is that widget's node to style,\n// not a property of this one.\n//\n// EVERYTHING ELSE HERE IS GEOMETRY, and each value says which part of the C it stands in\n// for. The box is FIXED-POSITIONED because a drag icon has no parent to lay out in: it is\n// a `GtkRoot` with its own surface (:106-108), and `gtk_drag_icon_move_resize` (:138-150)\n// does the one thing a layout would have done — put the icon where the pointer is, at the\n// child's preferred size (`:180-188`).\n//\n// Reference: refs/gtk/gtk/gtkdragicon.c:106-108,138-150,180-188,380,386-390\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:30-32\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-drag-icon {\n // `dnd { color: var(--window-fg-color) }` — the whole of libadwaita's rule, and the\n // reason a drag icon's LABEL is the window foreground rather than its own.\n color: var(--window-fg-color);\n // `gtk_widget_set_can_target (self, FALSE)` (:386-390) has no CSS of its own, but this\n // is the layer it describes: an icon that is pointed at takes no pointer event.\n pointer-events: none;\n // The drag surface is a root of its own (:106-108), so it is placed against the\n // VIEWPORT rather than a parent box. The element writes the position itself, on every\n // `dragover` — which is `gtk_drag_icon_move_resize` (:138-150) on the surface.\n position: fixed;\n left: 0;\n top: 0;\n // Above the window chrome and below the toasts, which is where a drag image belongs: it\n // is over the window it was dragged out of, and under a toast that arrived after it.\n z-index: 5000;\n // `surface_compute_size` (:180-188) sizes the surface to the child's PREFERRED size, so\n // the icon is exactly as big as what it carries: `max-content` is the one CSS length that\n // measures content rather than a box.\n width: max-content;\n height: max-content;\n\n // The `GtkColorSwatch` `createWidgetForValue` builds for a `GdkRGBA`\n // (gtkdragicon.c:544-553), which is a square of the colour it carries — nothing else,\n // because `set_can_drag`/`set_can_drop` are FALSE and the two states are the only thing\n // a swatch has that this one does not need. The large size is `ICON_SIZE_LARGE`, which\n // is the 32px `.large-icons` sets (_common.scss:38-41).\n .adw-drag-icon-swatch {\n display: block;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n }\n}","// _overlay.scss — <gtk-overlay>: a main child, and siblings stacked on top of it.\n//\n// libadwaita has NO `_overlay.scss`: `grep` over `src/stylesheet/widgets/` finds no\n// `overlay` node rule, because an overlay draws nothing of its own — GTK's whole CSS\n// node contract for it is the `overlay` name plus the `.left` / `.right` / `.top` /\n// `.bottom` classes an edge-aligned child is given (gtkoverlay.c:66-71). So this partial\n// is LAYOUT, not a look, and the geometry it encodes is `gtk_overlay_get_child_position`\n// (gtkoverlay.c:130-196) rather than a style.\n//\n// · `.adw-overlay-child` is `display: contents` so the main child is laid out as a\n// DIRECT child of the host and the overlay takes its size — which is exactly\n// gtk_overlay_compute_expand and the \"sizes are those of its main child\" rule\n// (gtkoverlay.c:56-58, :291-308). A wrapper that generated a box would put a\n// layout node between the overlay and the child, and the child's own `hexpand`\n// would have to be re-implemented here.\n// · `.adw-overlay-layer` is the box an overlay child is placed in. `inset: 0` over\n// the whole host is the C's `graphene_rect_init (&bounds, 0, 0, width, height)`\n// (gtkoverlay.c:214-216), and `display: flex` is what lets a child's own\n// `[halign]` / `[valign]` auto-margin rules place it — `gtk_overlay_get_child_position`\n// reads nothing but those two properties.\n// · `align-items: stretch` is `GTK_ALIGN_FILL` on the cross axis, the default for\n// `GtkWidget:valign`. A child that names a `valign` carries an auto cross margin,\n// and a flex item with an auto cross margin does NOT stretch (CSS Flexbox § 9.4),\n// which is precisely the branch the C takes for START, CENTER and END.\n// · `pointer-events: none`, re-enabled per child: GTK hands an event to the widget\n// whose allocation contains it, so an overlay child that is smaller than the overlay\n// must not make the main child unreachable underneath it.\n//\n// The `:not([halign])` guard on the main axis is the whole of `GTK_ALIGN_FILL` there —\n// `flex-grow` WITHOUT it would be cancelled by the auto margin `_widget.scss` gives a\n// child that names an alignment, since free space is handed to flex-grow first and only\n// the remainder reaches an auto margin. Specificity has to beat `_widget.scss`'s\n// `[halign='start']` (0,1,0), which `:not([halign])` lifts this rule to.\n//\n// Reference: refs/gtk/gtk/gtkoverlay.c (get_child_position, the `overlay` CSS node)\n// Reference: refs/gtk/gtk/gtkoverlaylayout.c (gtk_overlay_child_allocate, clip bounds)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-overlay {\n display: block;\n position: relative;\n}\n\n.adw-overlay-child {\n // The main child, in the host's own flow — see the header.\n display: contents;\n}\n\n.adw-overlay-layer {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: stretch;\n justify-content: flex-start;\n pointer-events: none;\n\n > * {\n // GTK delivers an event to the widget whose ALLOCATION it lands in (gtkoverlay.c:150-193),\n // so only the overlay child's own box takes input.\n pointer-events: auto;\n }\n\n // GTK_ALIGN_FILL on the main axis: the child grows to the overlay's whole allocation.\n > *:not([halign]) {\n flex: 1 1 auto;\n }\n}\n","// _revealer.scss — <gtk-revealer>: the box that clips while its child slides or folds.\n//\n// libadwaita gives the revealer node NO rule of its own — `grep -rn revealer\n// src/stylesheet/` returns the one `actionbar > revealer > box` chain in `_toolbars.scss` —\n// so there is no look to copy and this partial is the CLIP.\n//\n// `overflow: hidden` is `GTK_OVERFLOW_HIDDEN`, which `gtk_revealer_start_animation` sets\n// for the four plain slide types and releases when the position lands\n// (gtkrevealer.c:230-236, :243-249). It is unconditional here instead, which differs\n// nowhere a reader can see: at a settled position the clip box is the child's own size, so\n// there is nothing to clip — and it has to be always, because a revealer that collapsed to\n// `display: none` at position 0 would hide its child from the accessibility tree too, and\n// the widget's doc section says the child stays in it whatever the state\n// (gtkrevealer.c:61-63).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (`actionbar > revealer`)\n// Reference: refs/gtk/gtk/gtkrevealer.c (GTK_OVERFLOW_HIDDEN, gtk_revealer_snapshot)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-revealer {\n display: block;\n // `gtk_revealer_measure` answers the CHILD's minimum and natural, scaled — so the\n // revealer's own size is the child's, and a block-level host would stretch to its parent\n // instead. `fit-content` is `min(max-content, available)`, which is the pair of numbers a\n // GTK size request is, and a flex parent can still grow it because `flex-basis: auto`\n // reads this value.\n width: fit-content;\n max-width: 100%;\n overflow: hidden;\n}\n\n// The box the element sizes to `ceil(natural × scale)`. It has to be a real box — the\n// height it is given is the revealer's own measured height in the C.\n.adw-revealer-clip {\n display: block;\n}\n","// _paned.scss — <gtk-paned>: two panes, and the hairline between them.\n//\n// This is libadwaita's `_paned.scss` transposed onto the element. Upstream styles the CSS\n// NODE TREE `paned > separator[.wide]` (gtkpaned.c:88-98) rather than a tag, so the selector\n// here is the element and the handle class it carries:\n//\n// · the rule draws NOTHING with a background — `background: none` upstream — and paints\n// the rule as an INSET BOX SHADOW on the leading edge, `inset 1px 0 $border_color` for a\n// horizontal paned in an LTR row and the mirrored `-1px` under RTL. `<gtk-separator>`'s\n// own partial fills its background instead, which is why the handle is a plain box with\n// the `separator` class rather than a `<gtk-separator>`: upstream's two selectors can\n// then mean different things, as they do in GTK.\n// · `.wide` is `gtk_paned_set_wide_handle` adding the class to the handle node\n// (gtkpaned.c:2566), and upstream widens the node itself to 5px rather than fattening a\n// 1px rule — so the rule's shadow moves to BOTH edges.\n//\n// The HIT AREA is the part upstream has no CSS for: `gtk_paned_handle_contains` insets the\n// node's border rect by `- HANDLE_EXTRA_SIZE` (6px) on every side unless the handle is wide\n// (gtkpanedhandle.c:49, :60-73), and `initiates_touch_drag` adds 50px more for a touch\n// sequence (gtkpaned.c:862-884). A `::before` with negative insets is the same rectangle\n// without moving the rule, and a pseudo-element is not itself an event target, so the events\n// land on the handle.\n//\n// `.adw-paned-child` is a flex column and its adopted child fills it, which is the pattern\n// `adw-navigation-view` / `adw-navigation-split-view` already use for the pane bins they\n// build themselves. `min-height: 0` / `min-width: 0` on the child is what lets a pane's\n// scroll container shrink inside the divider instead of pushing it.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_paned.scss\n// Reference: refs/gtk/gtk/gtkpanedhandle.c (HANDLE_EXTRA_SIZE, gtk_paned_handle_contains)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-paned {\n display: flex;\n flex-direction: row;\n min-height: 0;\n min-width: 0;\n\n &.vertical {\n flex-direction: column;\n }\n}\n\ngtk-paned > .adw-paned-child {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n\n > * {\n flex: 1 1 auto;\n min-width: 0;\n min-height: 0;\n }\n}\n\ngtk-paned > .adw-paned-handle {\n position: relative;\n flex: none;\n // The 1px (or 5px) node `gtk_paned_handle_new` measures with\n // `gtk_widget_measure (handle_widget, orientation, -1, NULL, &handle_size, …)`.\n min-width: 1px;\n min-height: 1px;\n // Upstream's `background: none` — the rule below is an inset shadow, not a fill, which is\n // what leaves the two separators (this one and `<gtk-separator>`) free to differ.\n background: none;\n\n &.wide {\n min-width: 5px;\n min-height: 5px;\n }\n\n // `graphene_rect_inset (&area, -HANDLE_EXTRA_SIZE, -HANDLE_EXTRA_SIZE)`.\n &::before {\n content: '';\n position: absolute;\n inset: -6px;\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 2px;\n }\n}\n\ngtk-paned.horizontal > .adw-paned-handle {\n &:dir(ltr) {\n box-shadow: inset 1px 0 var(--border-color);\n }\n\n &:dir(rtl) {\n box-shadow: inset -1px 0 var(--border-color);\n }\n\n &.wide {\n &:dir(ltr) {\n box-shadow:\n inset 1px 0 var(--border-color),\n inset -1px 0 var(--border-color);\n }\n\n &:dir(rtl) {\n box-shadow:\n inset -1px 0 var(--border-color),\n inset 1px 0 var(--border-color);\n }\n }\n}\n\ngtk-paned.vertical > .adw-paned-handle {\n box-shadow: inset 0 1px var(--border-color);\n\n &.wide {\n box-shadow:\n inset 0 1px var(--border-color),\n inset 0 -1px var(--border-color);\n }\n}\n\n// `gtk_widget_set_cursor_from_name (handle_widget, \"col-resize\")` (gtkpaned.c:1527) — the\n// C picks it from the handle node's own orientation, which the classes carry.\ngtk-paned.horizontal > .adw-paned-handle {\n cursor: col-resize;\n}\n\ngtk-paned.vertical > .adw-paned-handle {\n cursor: row-resize;\n}\n","// _expander.scss — <gtk-expander>: the disclosure title, its arrow, and the row beneath.\n//\n// libadwaita's `_expanders.scss` is TWO selectors — the `expander` node and\n// `expander-widget` — and the element has to keep them apart, because they are different\n// nodes: `expander` is the ARROW and `expander-widget` is the widget. So the arrow is the\n// `.adw-expander-arrow` box and the widget is the tag.\n//\n// THE ARROW is upstream's whole rule, with `-gtk-icon-source` as a mask swap:\n//\n// min-width/min-height 16px `.adw-icon`'s own size, so this repeats it only to say the\n// node has no intrinsic size of its own;\n// pan-end-symbolic the closed glyph;\n// pan-end-symbolic-rtl `:dir(rtl)`, as upstream's second `-gtk-icon-source`;\n// pan-down-symbolic `:checked`, which this stylesheet spells `.checked` — and\n// `gtk_expander_set_expanded` sets the pseudoclass on the\n// arrow, not on the widget (gtkexpander.c:897-900);\n// disabled `Opacity(var(--disabled-opacity))`.\n//\n// The `:disabled` line has nothing to bite on here, because a custom element is never\n// `:disabled` — the widget is a plain GtkWidget with no insensitive state of its own, and\n// upstream's rule exists for the `expander` node when a `Gtk.TreeView` row disables it.\n// It is written against `[disabled]` so an author who puts the attribute there gets\n// upstream's dimming rather than nothing.\n//\n// THE TITLE is `expander-widget > box > title` (`_expanders.scss:13-28`): a 6px radius, the\n// focus ring, and the arrow at 70% until the title is hovered or pressed. The box between\n// them is `.adw-expander-box`, so the selector chain is the node tree rather than a\n// coincidence.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_expanders.scss\n// Reference: refs/libadwaita/src/stylesheet/_drawing.scss (the focus-ring mixin: a 2px\n// outline at offset -2px, which is what `outline` below spells out)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-expander {\n display: block;\n\n > .adw-expander-box {\n display: flex;\n flex-direction: column;\n }\n\n > .adw-expander-box > .adw-expander-title {\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n min-height: 30px;\n padding: var(--spacing-xs) var(--spacing-m);\n border-radius: 6px;\n cursor: pointer;\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n // `focus-ring (\"> box > title\")` with its default `$width: 2px` and `$offset: -$width`.\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n .adw-expander-arrow {\n opacity: 0.7;\n }\n\n &:hover .adw-expander-arrow,\n &:active .adw-expander-arrow {\n opacity: 1;\n }\n }\n\n > .adw-expander-box > .adw-expander-content {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n }\n}\n\n.adw-expander-arrow {\n min-width: 16px;\n min-height: 16px;\n flex-shrink: 0;\n // `expander { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic') }`. The element sets\n // `icon-name=\"pan-end\"`, so the `.checked` and `:dir(rtl)` rules below are the two\n // `-gtk-icon-source` overrides — same three glyphs, same two conditions.\n mask-image: var(--icon-pan-end);\n -webkit-mask-image: var(--icon-pan-end);\n\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n // `&:checked { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic') }`\n &.checked {\n mask-image: var(--icon-pan-down);\n -webkit-mask-image: var(--icon-pan-down);\n }\n}\n\n:dir(rtl) .adw-expander-arrow:not(.checked) {\n // `&:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl') }` — upstream\n // states the RTL glyph on its own line, BEFORE the `:checked` one, so `:checked` wins for\n // an RTL expander that is open. The `:not(.checked)` keeps that order without relying on\n // it.\n mask-image: var(--icon-pan-end-rtl);\n -webkit-mask-image: var(--icon-pan-end-rtl);\n}\n","// _checks.scss — <gtk-check-button> AND <adw-radio>, in ONE partial.\n//\n// WHY ONE FILE FOR TWO ELEMENTS. Upstream's\n// `refs/libadwaita/src/stylesheet/widgets/_checks.scss` merges them deliberately:\n// everything but the corner radius and the glyph is a shared `check, radio { … }`\n// block (:20-65), and the indeterminate dash is re-declared for BOTH at the end\n// (:79-81). There is no `_radio.scss` upstream to mirror. `refs/adwaita-web` does\n// split them into `_checkbox.scss` + `_radio.scss`, and the split is exactly where\n// it drifted: its two indicators grew different sizes, different border treatments\n// and different selection-mode rules, and only one of them has a hover state.\n//\n// TWO PLACES THE VENDORED WEB PORT DISAGREES WITH LIBADWAITA. libadwaita is\n// followed in both:\n//\n// 1. INDETERMINATE. `refs/adwaita-web/adwaita-web/scss/_checkbox.scss` has no\n// indeterminate state at all — no dash, no third glyph, nothing. libadwaita\n// paints it with the same accent fill as checked (:52-60) and its own dash\n// glyph (:79-81). Ported.\n// 2. THE CHECKED RADIO. `refs/adwaita-web/adwaita-web/scss/_radio.scss:22-33`\n// colours only the BORDER and the dot with `--accent-color`, leaving the\n// indicator's background as the view colour. libadwaita FILLS the whole\n// control with `--accent-bg-color` and draws the bullet in\n// `--accent-fg-color` (:54-55) — the same treatment the checkbox gets, which\n// is the point of the shared block. Ported.\n//\n// THE GLYPHS ARE LIBADWAITA'S OWN ASSETS. GTK draws them with\n// `-gtk-icon-source: -gtk-recolor(url(\"assets/check.svg\"))` (:70, :76, :80),\n// which has no CSS spelling. The path data below is copied from\n// `refs/libadwaita/src/stylesheet/assets/{check,bullet,dash}.svg` and painted as\n// a mask filled with `currentColor` — the same technique `_icon.scss` already\n// uses, and what makes `-gtk-recolor` work here: the shared block sets\n// `color: var(--accent-fg-color)` on a checked indicator, so the glyph follows.\n// `bullet.svg` carries a `transform=\"translate(-381 -339)\"` on a path whose\n// commands after the first are all relative, so the translation is folded into\n// the absolute `M` (388,342 → 7,3) and nothing else changes.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_checks.scss (all of it)\n// Reference: refs/libadwaita/src/stylesheet/assets/{check,bullet,dash}.svg (the three glyphs)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:280-286 (the trough colours)\n// Reference: refs/adwaita-web/adwaita-web/scss/{_checkbox,_radio}.scss (the vendored port's split, NOT followed — see above)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Implemented as Web Components for @gjsify/adwaita-web; the GTK\n// icon sources are re-expressed as CSS masks.\n\n// assets/check.svg\n$check-glyph: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='black' d='m 12.599609,2.1992188 a 1,1 0 0 0 -1.40039,0.2011718 L 5.890625,9.4765625 2.7070313,6.2929687 a 1,1 0 0 0 -1.4140626,0 1,1 0 0 0 0,1.4140625 l 4,3.9999998 A 1.0001,1.0001 0 0 0 6.8007812,11.599609 L 12.800781,3.5996094 A 1,1 0 0 0 12.599609,2.1992188 Z'/%3E%3C/svg%3E\");\n// assets/bullet.svg\n$bullet-glyph: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='black' d='M 7 3 c -2.207 0 -4 1.793 -4 4 s 1.793 4 4 4 c 2.208 0 4 -1.793 4 -4 s -1.792 -4 -4 -4 z'/%3E%3C/svg%3E\");\n// assets/dash.svg\n$dash-glyph: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='black' d='M 3 5 A 2 2 0 0 0 1 7 A 2 2 0 0 0 3 9 L 11 9 A 2 2 0 0 0 13 7 A 2 2 0 0 0 11 5 Z'/%3E%3C/svg%3E\");\n\n// `checkbutton { … }` (:3-18) — the host is the button, not the indicator.\ngtk-check-button,\nadw-radio {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 4px; // border-spacing: 4px (:4)\n padding: 3px; // (:6)\n border-radius: 9px; // $check_radius + 3px (:5)\n cursor: pointer;\n user-select: none;\n\n // The real control: focusable and keyboard-operable, never painted. The\n // indicator below is what the user sees; the host handles the pointer.\n .adw-check-input {\n position: absolute;\n width: 0;\n height: 0;\n margin: 0;\n opacity: 0;\n }\n\n // `check, radio { … }` (:20-31), shared by both elements.\n .adw-check-indicator {\n // GTK sizes the CONTENT box (`min-width`/`min-height: 14px`, :22-23) and\n // grows the drawn control with `padding: 3px` (:26), i.e. 20x20. Opting out\n // of the ADR-0010 descendant border-box pin keeps that arithmetic — and\n // keeps `checkbutton.selection-mode`'s one-line `padding: 7px` (:87)\n // working exactly as it does upstream instead of needing a second number.\n box-sizing: content-box;\n width: 14px;\n height: 14px;\n padding: 3px;\n flex-shrink: 0;\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 15%, transparent); // $trough_color\n transition:\n background 200ms ease-out,\n box-shadow 200ms ease-out;\n\n @media (prefers-contrast: more) {\n // $trough_color_hc (_colors.scss:284) stands in for $border_color: this\n // package defines no `--border-opacity`, and the two are the same 30%\n // mix of currentColor in the light theme.\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 30%, transparent);\n }\n\n // The glyph layer. No mask until a state supplies one, so an unchecked\n // control paints nothing here.\n &::after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n // Transparent until a state supplies a glyph: an unmasked currentColor box is a\n // solid square, which is what an unchecked control used to paint.\n background-color: transparent;\n mask-repeat: no-repeat;\n mask-position: center;\n mask-size: 14px; // -gtk-icon-size: 14px (:25)\n -webkit-mask-repeat: no-repeat;\n -webkit-mask-position: center;\n -webkit-mask-size: 14px;\n }\n }\n\n // `&:not(:checked):not(:indeterminate) { &:hover / &:active }` (:33-50).\n // Hover and active live on the HOST here — the indicator is 20px inside a\n // control whose label is part of the target, exactly as `checkbutton` is.\n &:not([checked]):not([indeterminate]):not([disabled]) {\n &:hover .adw-check-indicator {\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 20%, transparent); // $trough_hover_color\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 60%, transparent);\n }\n }\n\n &:active .adw-check-indicator {\n background-color: color-mix(in srgb, currentColor 25%, transparent); // $trough_active_color\n box-shadow: none;\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 60%, transparent);\n }\n }\n }\n\n // `&:checked, &:indeterminate { … }` (:52-60) — ONE block for both states, so\n // they differ only in the glyph.\n &[checked] .adw-check-indicator,\n &[indeterminate] .adw-check-indicator {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n box-shadow: none;\n }\n\n // GTK's `background-image: image(<colour>)` (:58-59) is a flat fill; a\n // two-stop gradient of one colour is its CSS spelling, as `_button_row.scss`\n // already does.\n &[checked]:not([disabled]),\n &[indeterminate]:not([disabled]) {\n &:hover .adw-check-indicator {\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 10%, transparent),\n color-mix(in srgb, currentColor 10%, transparent)\n );\n }\n\n &:active .adw-check-indicator {\n background-image: linear-gradient(rgb(0 0 6 / 20%), rgb(0 0 6 / 20%));\n }\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:62-64).\n &[disabled] {\n cursor: not-allowed;\n opacity: var(--disabled-opacity);\n }\n\n // `@include focus-ring()` on `checkbutton` (:8). The ring follows the real\n // control's focus, not the host's, so keyboard focus is what shows it.\n .adw-check-input:focus-visible ~ .adw-check-indicator {\n outline: 2px solid var(--accent-color);\n outline-offset: 2px;\n }\n}\n\n// `check { border-radius: $check_radius }` (:67-68)\ngtk-check-button .adw-check-indicator {\n border-radius: 6px;\n}\n\n// `radio { border-radius: 100% }` (:73-74)\nadw-radio .adw-check-indicator {\n border-radius: 100%;\n}\n\n// `check:checked` → check.svg (:70) / `radio:checked` → bullet.svg (:76)\ngtk-check-button[checked] .adw-check-indicator::after {\n background-color: currentColor;\n mask-image: $check-glyph;\n -webkit-mask-image: $check-glyph;\n}\n\nadw-radio[checked] .adw-check-indicator::after {\n background-color: currentColor;\n mask-image: $bullet-glyph;\n -webkit-mask-image: $bullet-glyph;\n}\n\n// `check, radio { &:indeterminate { … dash.svg } }` (:79-81). Upstream this is a\n// SEPARATE rule after both `:checked` blocks at equal specificity, so the dash\n// wins over the check/bullet on a control that is both. Same order, same\n// specificity, same outcome here — and the same precedence `resolveCheckState`\n// in `@gjsify/adwaita-core` encodes for the a11y value.\ngtk-check-button[indeterminate] .adw-check-indicator::after,\nadw-radio[indeterminate] .adw-check-indicator::after {\n background-color: currentColor;\n mask-image: $dash-glyph;\n -webkit-mask-image: $dash-glyph;\n}\n\n// `checkbutton.selection-mode { … }` (:83-95) — the big round check used in a\n// selection-mode header bar.\ngtk-check-button.selection-mode,\nadw-radio.selection-mode {\n border-radius: 100px;\n\n .adw-check-indicator {\n padding: 7px;\n border-radius: 100px;\n }\n\n // `label { &:dir(ltr) { margin-right: 6px } &:dir(rtl) { margin-left: 6px } }`\n // (:91-94) — one logical property covers both directions.\n .adw-check-label {\n margin-inline-end: 6px;\n }\n}\n","// _spin_button.scss — <gtk-spin-button>: an entry-shaped box with a decrement and an\n// increment arrow inside it.\n//\n// libadwaita merges this into `_entries.scss`'s shape: `spinbutton { @extend %entry }`\n// (:1-2), so the OUTER box is an entry — `min-height: 34px`, the 9px horizontal padding,\n// `$button_radius` and `$button_color` — and only the two ARROWS are styled here. That is\n// why the partial below adds no background of its own and why the arrows are `.image-button`\n// with `border-radius: 0` and a hairline of their own.\n//\n// THE CHILD ORDER THE `&:last-child` / `&:first-child` RULES BELOW DEPEND ON is\n// `Gtk.SpinButton`'s, not the one a spinner usually draws: C parents its children as text,\n// down, up (gtkspinbutton.c:1091-1126) and the box layout lays them out in that order, so\n// the horizontal widget reads `text ▼ ▲` and the vertical one `▲ text ▼`. The element\n// re-parents on an orientation change exactly as `gtk_spin_button_set_orientation` does\n// (gtkspinbutton.c:1290-1299), so the selectors below select what they select on a desktop:\n// the up arrow hugs the rounded end, whichever end that is.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_spin-button.scss:1-76\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-19 (%entry)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `> text { @extend .dimmed; > placeholder { @extend .dimmed } }` is the entry's own rule\n// (_entries.scss:19-28) and this package states it on `.adw-entry` instead; the placeholder\n// colour is the browser's.\n@use 'labels';\n\ngtk-spin-button {\n // `spinbutton { @extend %entry; @extend .numeric; }` (:1-3), taken apart: this package's\n // `_entry.scss` writes the entry shape as the `.adw-entry` CLASS on an `<input>` rather\n // than as a placeholder every node can extend, so the eight declarations `%entry`\n // contributes are written out here and `.numeric` is @extended on the text instead.\n display: flex;\n flex: 1;\n min-width: 0;\n align-items: center;\n box-sizing: border-box;\n min-height: 34px;\n padding: 0 9px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n background-clip: padding-box;\n caret-color: currentColor;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (_entries.scss:40)\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n // The numeric text. `.numeric` is `spinbutton`'s own `@extend .numeric` (:3).\n .adw-spin-button-text {\n @extend .numeric;\n\n flex: 1;\n box-sizing: border-box;\n min-width: 0;\n padding: 6px;\n border: none;\n outline: none;\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n\n &:focus-visible {\n outline: none;\n }\n\n &::placeholder {\n @extend .dimmed;\n }\n }\n\n // `> button.image-button.up` and `.down` (:9-24) — `:not` there upstream only to outrank\n // the list button styling, which has no counterpart here; the flat treatment does.\n .image-button {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n margin: 0;\n padding: 4px;\n border: none;\n border-radius: 0;\n background-color: transparent;\n color: inherit;\n box-shadow: none;\n border-style: solid;\n border-width: 0;\n border-color: color-mix(in srgb, currentColor 10%, transparent);\n\n @media (prefers-contrast: more) {\n border-color: color-mix(in srgb, currentColor 50%, transparent);\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n // `update_buttons_sensitivity` (gtkspinbutton.c:1214-1226) disables an arrow that has\n // no room to move, and a disabled button has to LOOK it: libadwaita's `&:disabled`\n // dimming is on the widget, which is here.\n &:disabled {\n opacity: var(--disabled-opacity);\n cursor: default;\n }\n }\n\n &:not(.vertical) {\n .adw-spin-button-text {\n min-width: 28px;\n }\n\n .image-button {\n min-height: 16px;\n min-width: 22px;\n padding-top: 0;\n padding-bottom: 0;\n border-left-width: 1px;\n\n &:dir(rtl) {\n border-left-width: 0;\n border-right-width: 1px;\n }\n\n // The up arrow is the LAST child in a horizontal box (see the file header), so it is\n // the one that carries the rounded right end — and `:dir(rtl)` mirrors it.\n &:dir(ltr):last-child {\n border-radius: 0 var(--button-radius) var(--button-radius) 0;\n }\n\n &:dir(rtl):last-child {\n border-radius: var(--button-radius) 0 0 var(--button-radius);\n }\n }\n }\n\n &.vertical {\n flex-direction: column;\n padding: 9px 0;\n\n .adw-spin-button-text {\n min-height: 30px;\n min-width: 30px;\n padding: 0;\n text-align: center;\n }\n\n // The up arrow is FIRST here and the down arrow LAST, so the two rules land on the two\n // ends the way they do vertically on a desktop.\n .image-button {\n &:first-child {\n border-bottom-width: 1px;\n border-radius: var(--button-radius) var(--button-radius) 0 0;\n }\n\n &:last-child {\n border-top-width: 1px;\n border-radius: 0 0 var(--button-radius) var(--button-radius);\n }\n }\n }\n}","// _scale.scss — <gtk-scale>: the trough, its highlighted part, the fill level's second\n// bar, the knob and the value text.\n//\n// WHAT CAME FROM WHERE, and the one thing that did not come from anywhere:\n//\n// The trough and highlight are libadwaita's `%scale_trough` / `%scale_highlight`\n// (_scale.scss:1-17) with GTK's own `GTK_CSS` colour values inlined —\n// `_colors.scss:280-289` gives `$trough_color` 15% of `currentColor`,\n// `$trough_color_hc` 30%, `$trough_hover_color` 20%, `$trough_hover_color_hc` 40%, and\n// `$slider_color` as `color-mix (white 80%, var (--view-bg-color))`, the same two the\n// package's `_progress_bar.scss` already inlines for the same reason.\n//\n// The ONE NUMBER WITH NO CITABLE LINE is the trough's 4px thickness: `%scale_trough`\n// sets only the radius and the colour, because in GTK that thickness comes from the\n// TOOLKIT's Adwaita theme — `gtk-adwaita-theme`, a repository beside `refs/gtk`, not\n// inside it. It is a thickness; nothing else in this partial or in the element's\n// behaviour depends on it.\n//\n// The VALUE'S PLACE comes from GTK's own `gtk_scale_allocate` (gtkscale.c:373-421),\n// which is not a stylesheet at all: the four `value-pos` cases pick an edge of the\n// widget for the value, and `gtk_scale_get_range_border` (:1239-1272) keeps the trough\n// out of it. The container axis below is that switch.\n//\n// NOT PORTED, each because nothing here can select it — the same reasoning\n// `_progress_bar.scss` records for `progressbar.vertical`:\n// · the value's placement ON THE KNOB. `gtk_scale_allocate_value` (gtkscale.c:388-425)\n// centres it on the slider for `top`/`bottom` and on the trough for `left`/`right`, which\n// a flow layout cannot reach for either — `align-self: center` is the cross-axis centre,\n// the one half that needs no knowledge of the value's own width. It shows only once the\n// value is off the middle of its range.\n// · the `> marks` blocks and `.marks-before` / `.marks-after` (:98-111, :114-124,\n// :152-170, :212-226). Those style classes are added ONLY by `gtk_scale_add_mark()` /\n// `clear_marks()` (gtkscale.c:1638, :1696-1721), which have been deprecated since\n// GTK 4.10; a scale without marks has no marks node and no class.\n// · the `.fine-tune` blocks (:137-150, :197-210). `.fine-tune` is a `GtkRange` style\n// class it adds for the duration of a Shift-held drag (gtkrange.c:1799-1801), and\n// `<gtk-scale>`'s pointer handling does not run that zoom state.\n// · the `.color` variant (:229-250), which `Gtk.ScaleButton` adds to ITSELF; the\n// standalone `Gtk.Scale` node never carries it.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scale.scss:1-251\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:280-289\n// Reference: refs/gtk/gtk/gtkscale.c (gtk_scale_allocate_value, update_value_position,\n// gtk_scale_get_range_border), refs/gtk/gtk/gtkrange.c (clamp_dimensions)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `> value` @extends `.dimmed` and `.numeric` exactly as the scale's value node does.\n@use 'labels';\n\ngtk-scale {\n display: flex;\n flex: 1;\n min-width: 10px;\n min-height: 10px;\n padding: 12px;\n\n // THE CONTAINER AXIS FOLLOWS `value-pos`, NOT THE ORIENTATION. GTK's\n // `gtk_scale_allocate` (gtkscale.c:373-421) puts the value BESIDE the trough for\n // `left`/`right` and ABOVE or BELOW it for `top`/`bottom` — for BOTH orientations,\n // because those four are the cross-axis ends of a horizontal scale and the main-axis\n // ends of a vertical one. Measured, not read off the switch: a 628px horizontal scale\n // with `draw-value` and `value-pos: top` allocates the value at `y=0` above a trough\n // that starts at `y=29` (`gtk_scale_get_range_border`, gtkscale.c:1239-1272), and the\n // same scale with `left` allocates the value at `x=0`, `y=0`, ON THE TROUGH'S LINE.\n //\n // The value node is the scale's FIRST child upstream — `gtk_scale_set_draw_value`\n // (gtkscale.c:1097-1101) does `gtk_widget_insert_after (…, GTK_WIDGET (scale), NULL)`,\n // ahead of the trough `gtk_range_init` appended — and `update_value_position`\n // (gtkscale.c:1042-1073) only ever puts a position class on it. Here the DOM runs\n // trough-then-value, so the two positions that mean \"ahead of the trough in the flow\"\n // upstream — `top` and `left` — are the ones that need the axis REVERSED. The four HOST\n // classes carry the same four names, so one `value-pos` attribute decides the axis as well\n // as the value node's own margins.\n &.value-top,\n &.value-bottom {\n flex-direction: column;\n align-items: stretch;\n\n // GTK centres the value on the KNOB for these two\n // (`value_alloc.x = slider_center_x - value_alloc.width / 2`, gtkscale.c:391, :397),\n // which the flow layout cannot reach — the cross-axis centre is what is left, and it\n // is the one half that does not need the value's width.\n .adw-scale-value {\n align-self: center;\n }\n }\n\n &.value-top {\n flex-direction: column-reverse;\n }\n\n &.value-left,\n &.value-right {\n flex-direction: row;\n // GTK centres the value on the trough (`value_alloc.y = trough_center_y -\n // value_alloc.height / 2`, gtkscale.c:376, :382), which for one line of children is\n // `align-items: center`.\n align-items: center;\n\n .adw-scale-value {\n flex: 0 0 auto;\n }\n }\n\n &.value-left {\n flex-direction: row-reverse;\n }\n\n // WHERE THE VALUE SITS BESIDE THE TROUGH, the value takes its width off the track and the\n // trough takes what is left — `gtk_scale_get_range_border` (gtkscale.c:1239-1272) shrinks\n // the trough's allocation by the value's, never the other way round. The axis there is the\n // scale's OWN, which is why `flex: 1` has to be asked for by orientation: the trough is an\n // empty bar whose only size is what the layout gives it.\n &.horizontal.value-left,\n &.horizontal.value-right,\n &.vertical.value-top,\n &.vertical.value-bottom {\n .adw-scale-trough {\n flex: 1 1 auto;\n }\n }\n\n // The other two pairs leave the trough across the cross axis, where `stretch` reaches it on\n // its own — except for a vertical one under `align-items: center` above.\n &.vertical.value-left,\n &.vertical.value-right {\n .adw-scale-trough {\n align-self: stretch;\n }\n }\n\n .adw-scale-trough {\n // %scale_trough (_scale.scss:1-10)\n position: relative;\n display: flex;\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n transition:\n background 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),\n box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n // %scale_highlight (_scale.scss:12-17) — the coloured part of the backing bit.\n .adw-scale-highlight {\n position: absolute;\n border-radius: 99px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n transition:\n background 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),\n box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n }\n\n // `> fill` (:43-47): a SECOND trough-styled bar for a media player's buffered range,\n // which is why it is not the highlight the `has-origin` block owns.\n .adw-scale-fill {\n position: absolute;\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n // `> slider` (:49-59). The negative margin is upstream's own comment: \"the slider is\n // inside the trough, so to make it bigger there's a negative margin\".\n .adw-scale-slider {\n position: absolute;\n min-width: 20px;\n min-height: 20px;\n margin: -8px;\n border-radius: 100%;\n background-color: color-mix(in srgb, white 80%, var(--view-bg-color));\n box-shadow:\n 0 0 0 1px rgb(0 0 6 / 10%),\n 0 2px 4px rgb(0 0 6 / 20%);\n transition: background 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n }\n\n // The element positions the knob by its CENTRE (`gtk_scale_init` fixes the slider size,\n // so `coord_to_value` divides the trough alone by it), hence the translate on both axes\n // and the fact that only ONE of `left` / `bottom` is ever written.\n &.horizontal {\n .adw-scale-trough {\n height: 4px;\n min-height: 4px;\n }\n\n .adw-scale-highlight,\n .adw-scale-fill {\n top: 0;\n bottom: 0;\n }\n\n .adw-scale-slider {\n top: 50%;\n transform: translate(-50%, -50%);\n }\n }\n\n &.vertical {\n .adw-scale-trough {\n width: 4px;\n min-width: 4px;\n // The trough is a fixed-width BAR and the axis above is the cross axis, so it must\n // not stretch: `align-items: stretch` on a column would give it the full width.\n align-self: center;\n }\n\n .adw-scale-highlight,\n .adw-scale-fill {\n right: 0;\n left: 0;\n }\n\n .adw-scale-slider {\n left: 50%;\n transform: translate(-50%, 50%);\n }\n }\n\n // `&:hover, &:active { > trough { … } }` (:62-78). `currentColor` on the highlight is\n // the accent FOREGROUND, which is why upstream's 10% wash lands as a light film.\n &:hover,\n &:active {\n .adw-scale-trough {\n background-color: color-mix(in srgb, currentColor 20%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n }\n\n .adw-scale-highlight {\n background-image: image(color-mix(in srgb, currentColor 10%, transparent));\n }\n\n .adw-scale-slider {\n background-color: white;\n }\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:80-91)\n &[disabled] {\n opacity: var(--disabled-opacity);\n\n .adw-scale-slider {\n box-shadow:\n 0 0 0 1px rgb(0 0 6 / 10%),\n 0 2px 4px transparent;\n }\n }\n\n // `> value { @extend .dimmed; @extend .numeric; }` (:93-96) — literally upstream's two\n // lines, now that `.dimmed` and `.numeric` exist here as the same utility classes.\n .adw-scale-value {\n @extend .dimmed;\n @extend .numeric;\n\n // `> value.top { margin-bottom: $_marks_size }` / `.bottom { margin-top: … }` /\n // `.left { margin-right: 9px }` / `.right { margin-left: 9px }` (:126-135). The marks\n // they were sized against are not ported; the offsets themselves still decide where the\n // value sits beside the trough.\n &.top {\n margin-bottom: 12px;\n }\n\n &.bottom {\n margin-top: 12px;\n }\n\n &.left {\n margin-right: 9px;\n }\n\n &.right {\n margin-left: 9px;\n }\n }\n\n // A keyboard-focused scale draws the ring on the KNOB, as `@include focus-ring(\"> trough >\n // slider\", $offset: 0)` does upstream (:29). The host is the focusable node, so its\n // `:focus-visible` is what stands in for the slider's.\n &:focus-visible {\n outline: none;\n\n .adw-scale-slider {\n outline: 2px solid var(--accent-color);\n outline-offset: 0;\n }\n }\n}","// _progress_bar.scss — <gtk-progress-bar>, the determinate partner to\n// <adw-spinner>.\n//\n// TWO SOURCES, AND WHICH HALF CAME FROM WHICH — the two disagree, so this is not\n// bookkeeping:\n//\n// GEOMETRY + COLOUR + THE OSD VARIANT come from\n// `refs/libadwaita/src/stylesheet/widgets/_progress-bar.scss`: an 8px trough\n// (:6), the 99px `$_progress-radius` (:33-35), the `%scale_trough` /\n// `%scale_highlight` placeholders it shares with the scale\n// (`_scale.scss:1-17`), the `> trough.empty > progress { all: unset }` rule\n// that makes a zero fraction draw NOTHING rather than a 0px sliver (:85), and\n// the `.osd` variant — a 2px bar with no trough, for under a header bar\n// (:59-83).\n//\n// THE INDETERMINATE ANIMATION comes from\n// `refs/adwaita-web/adwaita-web/scss/_progressbar.scss:25-66`, because\n// libadwaita has NO CSS equivalent: GTK animates a pulsing block from C\n// (`gtk_progress_bar_pulse`), so the stylesheet has nothing to copy. Its\n// keyframes and its `prefers-reduced-motion` fallback are the only parts taken\n// from there. Its GEOMETRY is NOT: it draws a 6px bar with a 3px radius and\n// has no trough placeholder, no OSD variant and no text node, so copying its\n// numbers would put a bar in this package that matches neither source.\n//\n// NOT PORTED, deliberately: `progressbar.vertical` (:10-15) and the four\n// `progress.{left,right,top,bottom}` corner-radius rules (:37-55). Both exist\n// for orientations and trough-splitting `<gtk-progress-bar>` does not expose —\n// there is no `orientation` attribute — and a rule nothing can ever select is a\n// rule that rots.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_progress-bar.scss:5-6,17-21,23-25,27-35,59-85\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scale.scss:1-17 (%scale_trough, %scale_highlight)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:280-286 (the trough colours)\n// Reference: refs/adwaita-web/adwaita-web/scss/_progressbar.scss:25-66 (indeterminate keyframes + reduced-motion fallback ONLY)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Implemented as a Web Component for @gjsify/adwaita-web.\n\n// `.dimmed` / `.numeric`, which the text node @extends exactly as upstream does.\n@use 'labels';\n\ngtk-progress-bar {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-xs);\n // `progressbar.horizontal > trough { min-width: 150px }` (:5) is a WIDGET\n // minimum in GTK, so it belongs on the element rather than on the trough.\n min-width: 150px;\n\n .adw-progress-bar-trough {\n // %scale_trough (_scale.scss:1-10)\n position: relative;\n display: flex;\n overflow: hidden;\n height: 8px; // :6 — `&, > progress { min-height: 8px }`\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n transition: background 200ms ease-out;\n\n @media (prefers-contrast: more) {\n // $trough_color_hc (_colors.scss:284)\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n .adw-progress-bar-progress {\n // %scale_highlight (_scale.scss:12-17) + $_progress-radius (:33-35)\n height: 100%;\n border-radius: 99px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n transition:\n width 200ms ease-out,\n background 200ms ease-out;\n }\n\n // `> text { @extend .dimmed; @extend .numeric; font-size: smaller; }` (:17-21)\n // — literally upstream's three lines, now that `.dimmed` and `.numeric` exist\n // here as the same utility classes they are there.\n .adw-progress-bar-text {\n @extend .dimmed;\n @extend .numeric;\n\n font-size: smaller;\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:23-25).\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n // Fill from the far end. GTK spells this `:inverted`; flexbox handles the\n // writing direction, so nothing here needs an RTL branch.\n &[inverted] .adw-progress-bar-trough {\n justify-content: flex-end;\n }\n\n // `> trough.empty > progress { all: unset }` (:85) — at fraction 0 the\n // indicator DISAPPEARS instead of drawing a rounded 0px stub.\n .adw-progress-bar-trough.empty .adw-progress-bar-progress {\n all: unset;\n }\n\n // The `.osd` variant (:59-83): a hairline bar with no trough at all, the way\n // it is drawn under a header bar. `[osd]` is the attribute this element takes;\n // `.osd` is libadwaita's DOCUMENTED spelling for the same variant, and\n // `_style_classes.scss` excludes `gtk-progress-bar` from the generic OSD\n // surface exactly so the class lands here instead of turning the bar into a\n // dark translucent box.\n &[osd],\n &.osd {\n min-width: 2px;\n\n .adw-progress-bar-trough {\n height: 2px;\n border-radius: 0;\n background-color: transparent;\n box-shadow: none;\n }\n\n .adw-progress-bar-progress {\n border-radius: 0;\n }\n }\n\n // Indeterminate. The block leaves the flex flow and bounces across the trough;\n // this is the ONLY part of the widget taken from the vendored web port, since\n // GTK pulses from C and its stylesheet has no equivalent to copy.\n &[pulsing] .adw-progress-bar-progress {\n position: absolute;\n inset-block: 0;\n width: 30%;\n animation: adw-progress-bar-indeterminate 1.5s infinite ease-in-out;\n\n // `_progressbar.scss:42-49` — with motion suppressed the block stops moving\n // and fills the trough, so the bar still reads as \"busy\" and not as \"0%\".\n @media (prefers-reduced-motion: reduce) {\n left: 0;\n width: 100%;\n animation: none;\n }\n }\n}\n\n// refs/adwaita-web/adwaita-web/scss/_progressbar.scss:53-66, verbatim offsets.\n// `left` rather than `inset-inline-start`: the port animates a physical offset,\n// and a keyframe that flipped with the writing direction would no longer be the\n// animation being cited.\n@keyframes adw-progress-bar-indeterminate {\n 0% {\n left: -35%;\n width: 30%;\n }\n\n 50% {\n left: 50%;\n width: 40%;\n }\n\n 100% {\n left: 105%;\n width: 30%;\n }\n}\n","// _level_bar.scss — <gtk-level-bar>: the trough, the block, and the four colours the\n// offset classes select.\n//\n// THE GEOMETRY IS libadwaita's, VERBATIM, because this widget has no other styling\n// anywhere: refs/libadwaita/src/stylesheet/widgets/_level-bar.scss is the only\n// stylesheet that touches a `levelbar` node, and it is entirely radii, sizes and\n// block colours.\n//\n// WHAT C SUPPLIES INSTEAD. `levelbar > trough > block` is GTK's node tree\n// (gtklevelbar.c:99-116) — the element writes `.adw-level-bar-trough` and\n// `.adw-level-bar-block` with `.filled` / `.empty` plus the offset's class, because the\n// offsets are a RUNTIME list (`gtk_level_bar_add_offset_value`, gtklevelbar.c:1395-1411)\n// and no stylesheet can enumerate what an application adds. The four colours below are\n// therefore written for the classes GTK itself installs: `low`, `high`, `full`\n// (:1058-1060), and an application's own offset reaches them the same way.\n//\n// CONTINUOUS IS TWO NODES, NOT ONE. GTK allocates the empty level full size and paints\n// the filled one over it (gtklevelbar.c:344-362, :424-461), and the filled node is NOT\n// allocated at all when the value is 0 (:429-430) — which is why this partial positions\n// both absolutely inside the trough instead of flowing them, and why `overflow: hidden`\n// stands in for GTK's rounded clip.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_level-bar.scss:1-93\n// Reference: refs/gtk/gtk/gtklevelbar.c:99-116,285-303,344-362,424-461,467-524\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// $_levelbar_size (level-bar.scss:1)\n$levelbar-size: 8px;\n// $_levelbar_border_radius (level-bar.scss:2)\n$levelbar-radius: 99px;\n\ngtk-level-bar {\n display: flex;\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:5-7).\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n .adw-level-bar-trough {\n // `> trough { padding: 0 }` (:67-68) — the trough is the whole box, not a padded\n // container around a smaller trough.\n padding: 0;\n position: relative;\n display: flex;\n // The rounded clip `gtk_snapshot_push_rounded_clip` puts on a progress node\n // (gtkprogressbar.c:462-465), and the reason a value past `max-value` is cut off\n // here rather than drawn beyond the end.\n overflow: hidden;\n width: 100%;\n }\n\n .adw-level-bar-block {\n position: absolute;\n border-radius: $levelbar-radius;\n }\n\n // The unfilled level, which is what `block.empty` paints ($trough_color,\n // level-bar.scss:85-92) — the same 15%-of-currentColor mix the scale trough uses\n // (_scale.scss:1-10) and the 30% one under high contrast.\n .adw-level-bar-block.empty {\n inset: 0;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n\n // The block colours (`> trough > block`, :71-93). `&:not(.empty)` is upstream's own\n // selector, kept as written: it is what lets an offset an application invents paint in\n // the accent without a rule of its own.\n .adw-level-bar-block {\n &.low {\n background-color: var(--warning-bg-color);\n }\n\n &:not(.empty) {\n background-color: var(--accent-bg-color);\n }\n\n &.full {\n background-color: var(--success-bg-color);\n }\n\n &.high {\n background-color: var(--accent-bg-color);\n }\n }\n\n // `&.horizontal` (:9-35): 8px tall, one filled level in proportion to the interval.\n &.horizontal {\n .adw-level-bar-trough {\n height: $levelbar-size;\n }\n\n .adw-level-bar-block {\n min-height: $levelbar-size;\n }\n\n .adw-level-bar-block.filled {\n inset-block: 0;\n inset-inline-start: 0;\n // `(cur_value - min_value) / (max_value - min_value)` (gtklevelbar.c:434-435).\n width: calc(var(--level-fraction, 0) * 100%);\n }\n\n // `if (inverted) block_area.x += width - block_area.width` (:447-448).\n &[inverted] .adw-level-bar-block.filled {\n inset-inline-start: auto;\n inset-inline-end: 0;\n }\n }\n\n // `&.vertical` (:38-64): the same bar across the other axis.\n &.vertical {\n .adw-level-bar-trough {\n height: 100%;\n }\n\n .adw-level-bar-block {\n min-width: $levelbar-size;\n }\n\n .adw-level-bar-block.filled {\n inset-inline: 0;\n inset-block-start: 0;\n height: calc(var(--level-fraction, 0) * 100%);\n }\n\n // `if (inverted) block_area.y += height - block_area.height` (:455-456).\n &[inverted] .adw-level-bar-block.filled {\n inset-block-start: auto;\n inset-block-end: 0;\n }\n }\n\n // DISCRETE IS FLOW, NOT ABSOLUTE. GTK lays the blocks out in one run and divides the\n // trough between them (gtklevelbar.c:467-524); libadwaita puts a 2px gap between them\n // and a 26px minimum (:20-35 horizontal, :50-64 vertical), with the outer corners\n // rounded and the inner ones square.\n &.discrete {\n .adw-level-bar-block {\n position: relative;\n inset: auto;\n flex: 1 1 0;\n border-radius: 0;\n }\n\n &.horizontal {\n .adw-level-bar-trough {\n gap: 2px;\n }\n\n .adw-level-bar-block {\n min-width: 26px;\n\n &:first-child {\n border-radius: $levelbar-radius 0 0 $levelbar-radius;\n }\n\n &:last-child {\n border-radius: 0 $levelbar-radius $levelbar-radius 0;\n }\n }\n }\n\n &.vertical {\n .adw-level-bar-trough {\n flex-direction: column;\n gap: 2px;\n }\n\n .adw-level-bar-block {\n min-height: 26px;\n\n &:first-child {\n border-radius: $levelbar-radius $levelbar-radius 0 0;\n }\n\n &:last-child {\n border-radius: 0 0 $levelbar-radius $levelbar-radius;\n }\n }\n }\n }\n}\n","// _list_view.scss — <gtk-list-view>, and the ROW rules its two relatives reuse.\n//\n// UNSCOPED on purpose: `gridview > child` and `columnview > listview > row` are the same\n// selectable, activatable surface as `listview > row`, and upstream writes them as one\n// set of colours in `_lists.scss` and `_views.scss`. The shared half is the\n// `adw-list-selectable` MIXIN below, which `_grid_view.scss` and `_column_view.scss`\n// include rather than restate — the hover/active/selected quartet is four colours per\n// state and a drifted copy is four wrong ones. A mixin and not a `%placeholder`: a\n// placeholder extended across a `@use` boundary emits into the module that DECLARED it,\n// which would put the grid's and the column view's selectors inside this file's output.\n//\n// The colour tokens are libadwaita's own, spelled with this package's variables:\n// `$view_hover_color` is `currentColor 4%`, `$view_active_color` `currentColor 8%` and\n// `$view_selected_color` `var(--accent-bg-color) 25%` (_colors.scss:274-276).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:5-45, 74-95 (listview, row)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:47-50 (rubberband)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:263-276 (the four tokens)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The hover / active / selected quartet every item surface in the three views wears.\n@mixin adw-list-selectable {\n background-clip: padding-box;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 4%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 8%, transparent);\n }\n\n &.selected {\n background-color: color-mix(in srgb, var(--accent-bg-color) 25%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n}\n\n// The band is positioned against the row container, which is why every view's row\n// container is a containing block.\n.adw-rubberband {\n position: absolute;\n border: 1px solid var(--accent-color);\n background-color: color-mix(in srgb, var(--accent-color) 20%, transparent);\n pointer-events: none;\n}\n\n// The node a factory's label lands in, in all three views.\n.adw-list-item-label {\n display: block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\ngtk-list-view {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n background-clip: padding-box;\n\n .adw-list-view-rows {\n // `position: relative` is the rubber band's containing block, not decoration.\n position: relative;\n display: flex;\n flex-direction: column;\n }\n\n &.horizontal .adw-list-view-rows {\n flex-direction: row;\n }\n\n .adw-list-view-row {\n @include adw-list-selectable;\n\n // `listview > row { padding: 2px }` (_lists.scss:16-19).\n padding: 2px;\n box-sizing: border-box;\n }\n\n // `.separators` is the class GTK adds for `show-separators`; upstream draws the rule on\n // the BOTTOM of every row but the separator itself, and on the LEFT when horizontal.\n &.separators:not(.horizontal) .adw-list-view-row:not(:last-child) {\n border-bottom: 1px solid var(--border-color);\n }\n\n &.separators.horizontal .adw-list-view-row:not(:last-child) {\n border-right: 1px solid var(--border-color);\n }\n}\n","// _grid_view.scss — <gtk-grid-view>: the same selectable items as a list view, reflowed\n// into equal columns.\n//\n// Upstream writes `flowbox > flowboxchild, gridview > child` as ONE rule — the same\n// padding, the same `$button_radius` corner and the same four state colours a list row\n// has — so this partial includes `adw-list-selectable` from `_list_view.scss` and adds\n// only the two things a grid has: the track container and the cell floor the column\n// count is computed against.\n//\n// THE `min-width` IS LOAD-BEARING, not cosmetic. `gtk-grid-view.ts` reads it as the item\n// size for `gridViewColumns` — GTK's `GTK_SCROLL_MINIMUM` branch — because the rendered\n// width is `1fr`, i.e. the answer the count already produced. An author who wants wider\n// cells sets `min-width` on `.adw-grid-view-child` and the count follows.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:52-91 (gridview > child)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'list_view';\n\ngtk-grid-view {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n\n .adw-list-view-rows {\n position: relative;\n display: grid;\n // Replaced per measurement by `_applyColumns`; one column is what a view with\n // nothing to measure shows.\n grid-template-columns: repeat(1, 1fr);\n gap: 6px;\n }\n\n .adw-grid-view-child {\n @include list_view.adw-list-selectable;\n\n // `gridview > child { padding: 3px; border-radius: $button_radius }`.\n padding: 3px;\n border-radius: var(--button-radius);\n box-sizing: border-box;\n min-width: 120px;\n text-align: center;\n }\n}\n","// _column_view.scss — <gtk-column-view>: a header of column buttons over the same rows a\n// list view draws, with one cell per column.\n//\n// Every number here is upstream's: the header button's `3px 6px` padding and its\n// `border-left: 1px solid transparent` (which `.column-separators` then COLOURS rather\n// than adds, so turning separators on cannot shift the layout), the cells' `8px 6px`, and\n// the header text at 40% of `currentColor` rising to 70% on hover\n// (_column-view.scss:12-48).\n//\n// `.separators` is deliberately the SAME class a list view uses: `show-row-separators` is\n// passed straight through to the inner list view upstream, whose node then carries\n// `.separators` — so the rule reads `columnview.separators > row`, one hop shorter than\n// the C's node tree and with the same meaning.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_column-view.scss:1-112\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss (.caption-heading)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'list_view';\n\ngtk-column-view {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n\n .adw-column-view-header {\n display: grid;\n }\n\n .adw-column-view-header-cell {\n display: flex;\n align-items: center;\n gap: 6px;\n // `> header > button { padding: 3px 6px; border-radius: 0; background: transparent }`.\n padding: 3px 6px;\n border: 0;\n border-left: 1px solid transparent;\n border-radius: 0;\n background: transparent;\n font: inherit;\n font-size: var(--font-size-small);\n font-weight: 700;\n text-align: start;\n color: color-mix(in srgb, currentColor 40%, transparent);\n cursor: pointer;\n\n &:first-child {\n border-left-width: 0;\n }\n\n &:hover {\n color: color-mix(in srgb, currentColor 70%, transparent);\n }\n\n &:active {\n color: currentColor;\n }\n\n // A column with no sorter is not a button in any useful sense: upstream simply never\n // activates it, and the cursor is what says so here.\n &:disabled {\n cursor: default;\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n }\n\n .adw-column-view-header-title {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n // `sort-indicator { min-height: 16px; min-width: 16px }`, drawn as pan-up when\n // ascending — here one `go-down` icon turned over, the substitution the element header\n // records.\n .adw-column-view-sort-indicator {\n flex: none;\n margin-inline-start: auto;\n\n &.ascending {\n transform: rotate(180deg);\n }\n }\n\n .adw-list-view-rows {\n position: relative;\n display: flex;\n flex-direction: column;\n }\n\n .adw-column-view-row {\n @include list_view.adw-list-selectable;\n\n // `> listview > row { padding: 0 }` — the padding moved to the cells.\n display: grid;\n padding: 0;\n box-sizing: border-box;\n }\n\n .adw-column-view-cell {\n padding: 8px 6px;\n box-sizing: border-box;\n border-left: 1px solid transparent;\n\n &:first-child {\n border-left-width: 0;\n }\n }\n\n &.column-separators {\n .adw-column-view-cell,\n .adw-column-view-header-cell {\n border-left-color: var(--border-color);\n }\n }\n\n &.separators .adw-column-view-row:not(:last-child) {\n border-bottom: 1px solid var(--border-color);\n }\n}\n","// _tree_expander.scss — <gtk-tree-expander>: the indents and the disclosure arrow in\n// front of a tree row's contents.\n//\n// libadwaita gives the widget itself ONE declaration — `treeexpander { border-spacing:\n// 4px }` (_column-view.scss:128-130), which is the gap between the indents, the expander\n// and the child — and styles the arrow through the generic `expander` node: a 16×16 box\n// drawn with `pan-end-symbolic`, turning to `pan-down-symbolic` when `:checked`\n// (_expanders.scss:1-10).\n//\n// An INDENT has no rule upstream at all: `GtkBuiltinIcon` with css-name `indent` draws\n// nothing and occupies the icon's own 16px. That is why the indent below is a fixed box\n// rather than a margin on the child — the child keeps its own box, and an expandable row\n// and its leaf sibling line up because they have the SAME number of boxes in front of\n// them, which is the whole point of `indent-for-icon`.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_column-view.scss:128-130\n// Reference: refs/libadwaita/src/stylesheet/widgets/_expanders.scss:1-10\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-tree-expander {\n display: flex;\n align-items: center;\n // `border-spacing: 4px` between every node the widget holds.\n gap: 4px;\n box-sizing: border-box;\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n border-radius: var(--button-radius);\n }\n\n .adw-tree-expander-indent {\n flex: none;\n display: block;\n // The `indent` node is an icon-sized box that draws nothing.\n width: 16px;\n height: 16px;\n }\n\n .adw-tree-expander-icon {\n flex: none;\n opacity: 0.7;\n transform: rotate(0deg);\n transition: transform 0.2s ease-out;\n cursor: pointer;\n\n // `:checked` turns pan-end into pan-down; one quarter turn is the same picture.\n &.expanded {\n transform: rotate(90deg);\n }\n\n &:hover {\n opacity: 1;\n }\n }\n\n &[aria-disabled='true'] .adw-tree-expander-icon {\n filter: opacity(var(--disabled-opacity));\n }\n}\n","// _picture.scss — <gtk-picture>: the fit box, and the isolation boundary.\n//\n// libadwaita has NO `_picture.scss` of its own. Its only `picture` rule is a conditional\n// inside a card's selector (`refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:216`,\n// `&.card > picture`), because a picture needs no styling of its own until a card asks for\n// rounded corners. So everything structural below comes from the C, and the header of\n// `gtk-picture.ts` says which C.\n//\n// WHY `object-fit` GOES ON THE CHILD AND NOT HERE. The four `GtkContentFit` members ARE\n// the four CSS `object-fit` values, including `scale-down` (gtkpicture.c:162-167), so the\n// mapping is exact rather than approximate — but `object-fit` applies to a REPLACED element's\n// content box, and `<gtk-picture>` is a `<div>` with no content of its own. The element\n// therefore writes `--gtk-picture-content-fit` and this rule hands it down with the explicit\n// `inherit` keyword, which takes the parent's computed value whether or not the property is\n// an inherited one.\n//\n// `can-shrink` IS THE MEASURE, AND `min-content` IS ITS OPPOSITE. A picture that may shrink\n// reports a minimum of ZERO on both axes whatever the paintable is (gtkpicture.c:245-248);\n// a picture that may not asks the paintable for a CONCRETE minimum — its own minimum at the\n// style's icon size (gtkpicture.c:249-254) — which is what `min-content` is for a replaced\n// element with an intrinsic size. The class is set from the NORMALIZED property, so a\n// `can-shrink=\"false\"` attribute and `canShrink = false` agree, and an absent attribute is\n// TRUE (the C's own default, gtkpicture.c:554) rather than falling into the `min-content`\n// branch by accident.\n//\n// `isolation: isolate` IS `gtk_snapshot_push_isolation`. The property brackets the snapshot\n// (gtkpicture.c:148-149, :203-204), which stops the paintable's alpha compositing against\n// whatever is behind the widget WITHOUT changing how the widget is positioned or sized —\n// `contain: paint` would also establish a boundary and would additionally make the element a\n// containing block for fixed and absolutely positioned descendants, which\n// `push_isolation` does not do.\n//\n// `overflow: hidden` is not a styling choice: it is `gtk_widget_set_overflow (widget,\n// GTK_OVERFLOW_HIDDEN)` in `init` (gtkpicture.c:557), which is what makes `cover` clip its\n// overflow instead of painting outside the box.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:216 (the only upstream\n// `picture` rule, a card's conditional rounded corner)\n// Reference: refs/gtk/gtk/gtkpicture.c:146-205,245-254,538-557\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-picture {\n display: inline-flex;\n\n // `gtk_widget_set_overflow (widget, GTK_OVERFLOW_HIDDEN)` (gtkpicture.c:557).\n overflow: hidden;\n\n // `GtkPicture:isolate-contents` (gtkpicture.c:538-549, :555) as the stacking boundary\n // `gtk_snapshot_push_isolation` creates (gtkpicture.c:148-149).\n isolation: isolate;\n\n // The content fit, handed to the replaced child below. `fill` is the C's first branch\n // (gtkpicture.c:146) and the initial value of the custom property, so a picture with no\n // `content-fit` written yet and no stylesheet loaded behaves like the C's default arm\n // rather than like a broken one.\n --gtk-picture-content-fit: fill;\n\n &:not(.can-shrink) {\n // `gtk_picture_measure`'s `else` arm (gtkpicture.c:249-254): the paintable's own\n // concrete minimum, which is `min-content` for a replaced element.\n min-width: min-content;\n min-height: min-content;\n }\n\n // The four `GtkContentFit` members are the four CSS values (gtkpicture.c:146-205). The\n // replaced-element list is what `GdkPaintable` can stand in for here: an image, a video\n // frame (which is exactly what `<gtk-video>` puts inside its own picture), a canvas, an\n // inline SVG.\n > :is(img, video, canvas, picture, svg) {\n object-fit: var(--gtk-picture-content-fit);\n\n // The element is `display: inline-flex`, so a replaced child is a flex item and gets\n // `min-width: auto` — the same \"never smaller than my content\" floor a flex row gives,\n // which would defeat `can-shrink` before `min-content` was ever consulted.\n min-width: 0;\n min-height: 0;\n }\n}\n","// _inscription.scss — <gtk-inscription>: a flex row whose two pseudo-elements are `xalign`,\n// and whose four custom properties are the size request the C measures in characters and\n// lines.\n//\n// `GtkInscription`'s CSS NAME IS `label` (gtkinscription.c:780), so libadwaita's whole\n// `label {}` cascade reaches it — which means there is no `inscription` block in\n// `refs/libadwaita/src/stylesheet/` to port and none is invented here. `_labels.scss` already\n// styles every class on this node (`.dimmed`, `.numeric`, `.title-1`), and the element\n// carries the same two of those: the `tnum` in `text-overflow` is the label's own.\n//\n// THE FOUR COUNTS ARE `ch` AND `lh`, NOT PIXELS. `gtk_inscription_measure_width` multiplies\n// `min_chars` by the font's average character width and returns\n// `MAX (min_chars, nat_chars)` for the natural (gtkinscription.c:347-348);\n// `measure_height` does the same over a line height (gtkinscription.c:383-384). CSS `ch` IS\n// the advance width of the `0` glyph — the same \"average character\" Pango measures — and `lh`\n// IS the line box, which is `line_pixels`. So the element sets these four and this rule\n// applies them; `--gtk-inscription-width` carries the `MAX` because\n// `labelWidthCharsExtent` already encodes it in `@gjsify/adwaita-core`.\n//\n// THE `auto` FALLBACK IS THE ZERO CASE, AND IT IS NOT THE SAME AS `0`. Both measures\n// return NOTHING when the two counts are zero at once (gtkpicture's sibling,\n// gtkinscription.c:344-345, :378-379) — the inscription does not participate in sizing, and\n// its minimum is whatever the widget already had. `min-width: 0ch` would be a very\n// different, much smaller widget, so the element writes `auto` and this rule leaves the\n// declaration off entirely when it sees it.\n//\n// `xalign`'s SPACERS. GTK places the text at `xalign * (width − text width)` inside the\n// allocation (the same `gtk_label_get_layout_location` arithmetic, transcribed for this\n// widget in `gtk-inscription.ts`'s header). Flexbox's `flex-grow` takes a ratio, so\n// splitting the free space between `::before` and `::after` in the ratio\n// `xalign : 1 − xalign` IS that formula. The default is 0 (gtkinscription.c:67, :791), so\n// out of the box `::before` has zero growth and all the free space lands before the text —\n// which is what a caption under a centred icon wants, with no flex rule of its own.\n//\n// `yalign` IS `--gtk-inscription-align-items`, NOT A SECOND SPACER PAIR. CSS gives\n// `align-items` three keywords and no continuum the way `flex-grow` gives `xalign` one, and\n// `labelYalignAlignItems` (`@gjsify/adwaita-core`) maps to the nearest of the three. That\n// is a DECLARED divergence and `_labels.scss`'s header states it at length for\n// `<gtk-label>`; it is the same declaration here and is not re-argued.\n//\n// `white-space: pre` BECAUSE THE STRING IS TEXT AND A NEWLINE IS A NEWLINE. Pango keeps a\n// newline and a run of spaces, and an inscription that does not wrap is as wide as its\n// text. There is no `[wrap]` attribute on this widget — unlike `<gtk-label>`, an inscription\n// always has a box to lay out in, because that is what it is FOR — so `pre-wrap` is the\n// base rule and `white-space: pre` is not needed at all. The wrap-mode rules below change\n// where a line MAY break, which is a different question from whether one exists.\n//\n// `overflow-wrap: anywhere` IS THE DEFAULT HERE, NOT AN OPT-IN. The pspec says so in its own\n// comment (gtkinscription.c:738-740): unlike `GtkLabel`, the default is\n// `PANGO_WRAP_WORD_CHAR`, because an inscription reserves a box of a known character count\n// and a word longer than that box has to break inside it. `word` therefore needs a rule to\n// turn the default OFF, and `char` needs one to break anywhere. This is the reverse of\n// `_labels.scss`, where `word` is the browser's un-overridden behaviour and needs none —\n// a deliberate inversion, and the reason it reads the other way round.\n//\n// `text-overflow` NEEDS A BOX, WHICH IS WHY `overflow` IS NOT `visible`. CSS only ellipsises\n// a block container with a constrained width, so the same `overflow: hidden` `_labels.scss`\n// puts on its clamp is here — unconditionally, because `text-overflow` is a property of\n// this widget with `clip` as its default rather than an ellipsize a label opts into. With\n// `clip` the value `labelEllipsizeOverflowValue` supplies is `clip`, so nothing disappears\n// silently; with any of the three `ellipsize-*` members it is `ellipsis`, the one truncating\n// value CSS has, which is the declared `start`/`middle` divergence\n// `labelEllipsizeOverflowValue`'s own doc comment carries.\n//\n// Reference: refs/gtk/gtk/gtkinscription.c:59-69,338-412,726-777,780\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss (the `label {}` cascade this\n// widget's CSS name selects)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-inscription {\n display: flex;\n\n // `gtk_inscription_measure_width`/`_height` in `ch` and `lh`\n // (gtkinscription.c:347-348, :383-384), with the element's `auto` standing for the C's\n // \"both counts are zero, this widget does not participate in sizing\" case\n // (gtkinscription.c:344-345, :378-379).\n min-width: var(--gtk-inscription-min-ch, auto);\n width: var(--gtk-inscription-width, auto);\n min-height: var(--gtk-inscription-min-lh, auto);\n height: var(--gtk-inscription-height, auto);\n\n // `--gtk-inscription-align-items` is `labelYalignAlignItems` — nearest-of-three, the\n // DECLARED divergence `_labels.scss`'s header explains.\n align-items: var(--gtk-inscription-align-items, center);\n\n // An inscription always has a box, so it always wraps; `white-space: pre-wrap` keeps a\n // newline and a run of spaces as Pango does while still honouring the wrap below.\n white-space: pre-wrap;\n // CSS ellipsises only inside a box with a constrained width.\n overflow: hidden;\n text-overflow: var(--gtk-inscription-text-overflow, clip);\n\n // GTK's `xalign * (width − text width)`, as a `flex-grow` ratio pair.\n &::before,\n &::after {\n content: '';\n flex-shrink: 1;\n flex-basis: 0;\n }\n\n &::before {\n flex-grow: var(--gtk-inscription-xalign, 0);\n }\n\n &::after {\n flex-grow: calc(1 - var(--gtk-inscription-xalign, 0));\n }\n\n // `PANGO_WRAP_WORD_CHAR` is the pspec DEFAULT (gtkinscription.c:738-740), so `anywhere`\n // is the base rule and the other two nicks are the overrides — the reverse of\n // `_labels.scss`, where `word` is the browser's own behaviour.\n overflow-wrap: anywhere;\n\n &[wrap-mode='word'] {\n overflow-wrap: normal;\n }\n\n // Pango's CHAR is \"break anywhere\", which is CSS `break-all` — the same mapping\n // `_labels.scss:112-126` states for `<gtk-label>`, from the same two CSS declarations.\n &[wrap-mode='char'] {\n word-break: break-all;\n }\n}\n","// _video.scss — <gtk-video>: the overlay, the big circular play glyph, and the controls\n// bar that reveals itself for three seconds.\n//\n// libadwaita styles `GtkVideo` in ONE place, and it is three lines\n// (refs/libadwaita/src/stylesheet/widgets/_misc.scss:74-81):\n//\n// video {\n// & image.osd {\n// min-width: 64px;\n// min-height: 64px;\n// border-radius: 32px;\n// }\n// }\n//\n// Those three values are kept VERBATIM below, and the reason they are interesting is that\n// they are a `.circular` button at a LARGER size: libadwaita's own circular button is 34px\n// with a 9999px radius (refs/libadwaita/src/stylesheet/widgets/_buttons.scss:311-319), and\n// the video's icon is 64px with a 32px radius — half its own width, which for a circle is\n// the same shape at twice the size. So the radius here is `min-width / 2` and not the 9999px\n// the button uses, and that difference is upstream's, not a porting shortcut.\n//\n// The `.osd` HALF is `%osd` (refs/libadwaita/src/stylesheet/_common.scss:43-60): the\n// on-screen-display surface — a translucent dark plate, a near-white foreground and the\n// accent colours recomputed to sit on it. `_style_classes.scss` already owns `.osd` for every\n// widget, so the icon here gets it for free and nothing in this partial restates it.\n//\n// The controls bar wears `.osd` AND `.bottom` (refs/gtk/gtk/ui/gtkvideo.ui). `.osd` is the\n// half with a rule — the same `%osd` surface — and `.bottom` is a PLACEMENT class with no\n// libadwaita rule anywhere: `grep` over `refs/libadwaita/src/stylesheet/` finds `bottom`\n// only on `bottom-sheet`, `bottom-bar`, `notebook.bottom` and `colorchooser.bottom`, none of\n// which is a video. It is GTK's own hint from the template and it is honoured here as the\n// vertical placement it plainly is — the bar sits at the end of the cross axis — with the\n// padding the `.osd` toolbar takes (12px, refs/libadwaita/src/stylesheet/widgets/\n// _toolbars.scss:96-100).\n//\n// THE REVEALER IS A TRANSITION, NOT A TOGGLE WITH A DELAY. `gtk_video_reveal_controls`\n// (gtkvideo.c:125-133) reveals a `GtkRevealer` and arms a 3 s timeout that hides it again,\n// and the motion controller re-arms on every movement — so the bar is out after three\n// seconds of stillness, not three seconds after the first movement, and the element's\n// `revealControls()` re-arms for the same reason. The `transition` below is the revealer's\n// own cross-fade, and `.revealed` is the only state selector: there is no `hidden` to fight\n// because the revealer never leaves the layout.\n//\n// `graphics-offload` HAS NO RULE, AND SAYS SO. `GtkGraphicsOffload` moves a subtree into a\n// shared GL texture so it and its neighbours composite on the GPU; CSS has no such\n// mechanism, so the class the element sets is deliberately UNSTYLED. A page may target it,\n// nothing in this package does, and the property is observed rather than listed as a gap in\n// `check-adwaita-element-properties.mjs` — the property is read and written faithfully, what\n// it does not buy is a faster composite.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:74-81 (the whole GtkVideo\n// block), _common.scss:43-60 (`%osd`), _buttons.scss:311-319 (`.circular`),\n// _toolbars.scss:96-100 (`.toolbar.osd`)\n// Reference: refs/gtk/gtk/ui/gtkvideo.ui (the `.osd .circular` icon, the `.osd .bottom`\n// controls, the 3 s reveal), gtkvideo.c:125-133\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-video {\n position: relative;\n display: block;\n overflow: hidden;\n\n // The overlay of ui/gtkvideo.ui: the media underneath, the icon over it, the revealer\n // over that.\n .adw-video-surface {\n position: relative;\n display: flex;\n\n > video {\n width: 100%;\n height: 100%;\n object-fit: contain;\n }\n }\n\n // `ui/gtkvideo.ui`'s `overlay_icon`: `halign`/`valign` 3, i.e. FILL, which is what makes\n // it centred in an overlay on both axes — GTK's own `GTK_ALIGN_FILL` on an overlay child\n // stretches it, and this is the web's answer for \"fill the overlay and centre inside it\".\n .adw-video-overlay-icon {\n position: absolute;\n inset: 0;\n margin: auto;\n\n // `min-width: 64px; min-height: 64px; border-radius: 32px` — libadwaita's own three\n // lines for `video image.osd` (_misc.scss:76-80). The radius is half the width, which is\n // the same shape `.circular` gives at 34px (_buttons.scss:311-319) at twice the size.\n min-width: 64px;\n min-height: 64px;\n border-radius: 32px;\n\n // `GtkImage`'s icon inside the button, and `icon-size` 2 in the template\n // (ui/gtkvideo.ui) is GTK's dialog-scale — which is the 64px above.\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n border: none;\n // A GtkImage with `has-frame` unset inside an OSD plate: the plate IS the surface, so\n // the button adds no background of its own.\n background: none;\n color: inherit;\n cursor: pointer;\n\n // `gtk_video_update_playing` (gtkvideo.c:665) sets the icon's VISIBILITY to\n // `!playing`, so this is `visibility` rather than `display`: the icon keeps its box and\n // the OSD plate under it is unaffected either way, which is what `[hidden]` would also\n // give — but `hidden` is the UA rule and this one is the C's.\n &[hidden] {\n visibility: hidden;\n }\n }\n\n // `ui/gtkvideo.ui`'s `controls_revealer`: a `GtkRevealer` with `valign` 2 (END) and\n // `transition-type` 1 (CROSS-FADE), and `measure` 1 so the bar is allocated even while\n // hidden — which is why this is an opacity transition and not `display: none`.\n .adw-video-controls-revealer {\n position: absolute;\n inset: auto 0 0 0;\n opacity: 0;\n pointer-events: none;\n transition: opacity 150ms ease-out;\n\n &.revealed {\n opacity: 1;\n pointer-events: auto;\n }\n\n // `.osd .bottom` (ui/gtkvideo.ui). The bar is `osd` — the `%osd` surface from\n // `_common.scss:43-60` — with the padding a standalone OSD toolbar takes: 12px against\n // the 6px of a plain one (_toolbars.scss:91-102).\n gtk-media-controls {\n padding: 12px;\n }\n }\n\n // Playing hides the overlay icon and shows nothing over the frames. Declared as a class so\n // a page can see the state without reading the icon's `hidden`, and because GTK's own state\n // is a widget VISIBILITY (gtkvideo.c:665) rather than a style class.\n &.playing .adw-video-overlay-icon {\n pointer-events: none;\n }\n\n // `GtkVideo:graphics-offload` — deliberately UNSTYLED. See the header.\n}\n","// _media_controls.scss — <gtk-media-controls>: a box of six pixels' spacing, two labels in\n// tabular figures, and a range input.\n//\n// libadwaita has NO `_media-controls.scss`. `GtkMediaControls` is styled only through the\n// `.osd` and `.bottom` classes `ui/gtkvideo.ui` puts on it, which is what `_video.scss` has\n// already spent itself on: the `%osd` surface (_common.scss:43-60) and the 12px padding a\n// standalone OSD toolbar takes (_toolbars.scss:96-100). So this partial is the C's layout\n// and nothing else — the six numbers below are all the template says.\n//\n// THE TEMPLATE'S `spacing` 6 IS THE ONLY LAYOUT PROPERTY THAT SURVIVES.\n// `box { spacing: 6 }` in `ui/gtkmediacontrols.ui` becomes the gap between the play button,\n// the time box and the volume button. Nothing else in the template is a spacing: the time\n// box has none of its own, and the labels sit against the scale with no gap at all, which is\n// why `gap` is applied to the OUTER box only.\n//\n// `font-variant-numeric: tabular-nums` IS BOTH LABELS' `font-features \"tnum=1\"`. That\n// attribute on each label (`ui/gtkmediacontrols.ui`) is the only reason the class exists, and\n// it is load-bearing rather than cosmetic: a position counting 9→10 must not change the\n// width of the string, or the seek scale beside it shifts sideways once a second. The same\n// declaration `_labels.scss` applies to the `.numeric` utility class reaches a\n// `Gtk.Label`; this widget's labels are spans of the element's own tree, so the class is\n// applied here.\n//\n// THE SEEK SCALE IS `<input type=\"range\">` WITH GTK'S ADJUSTMENT SPELLED OUT.\n// `time_adjustment` is `upper` 10, `step-increment` 1, `page-increment` 10\n// (`ui/gtkmediacontrols.ui`), and every real duration arrives by resetting the adjustment's\n// range to the media's own — so `min` 0, `max` the duration in seconds and `step` 1 second.\n// `page-increment` 10 has no HTML equivalent: a range input's Page key moves by ten STEPS,\n// not by ten units, which is a different thing and cannot be made to agree. That is the one\n// adjustment property that does not survive, and it is worth naming rather than leaving to be\n// discovered.\n//\n// THE VOLUME SLIDE IS THE OTHER ADJUSTMENT, AND IT IS A DIFFERENT SHAPE.\n// `volume_adjustment` is `upper` 1, `step-increment` 0.1, `page-increment` 1, `value` 1 —\n// full scale in tenths — so `min` 0, `max` 1, `step` 0.1. It lives in the volume button's\n// popover because `GtkVolumeButton` IS a menu button with an adjustment popover; the\n// popover surface is `_popovers.scss`'s, reused through the `.adw-popover` class rather than\n// restated here.\n//\n// `.insensitive` IS THE TEMPLATE'S `sensitive` 0. `ui/gtkmediacontrols.ui` sets it on the\n// whole box, and `gtk_media_controls_set_sensitive` is what re-enables it — so a controls\n// bar with no stream attached is inert, which is the state the element renders by default.\n// GTK's `:disabled` opacity is `_buttons.scss`'s `$disabled-opacity`, and the same token is\n// used here for the whole bar rather than per button, because in the C the insensitivity is\n// the CONTAINER's.\n//\n// Reference: refs/gtk/gtk/ui/gtkmediacontrols.ui (the node tree and both adjustments)\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:43-60 (`%osd`, applied by\n// `_video.scss`), widgets/_toolbars.scss:96-100 (the `.osd` toolbar's 12px padding)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss (`:disabled` opacity)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-media-controls {\n display: flex;\n align-items: center;\n color: var(--window-fg-color);\n\n // `box { sensitive: 0; spacing: 6 }` (ui/gtkmediacontrols.ui).\n gap: 6px;\n\n // `gtk_media_controls_set_sensitive` — the container's own insensitivity, which is where\n // the template puts it. Same token `_buttons.scss` uses for a `:disabled` button.\n &.insensitive,\n &:disabled {\n opacity: var(--disabled-opacity);\n }\n\n .adw-media-controls-box {\n display: flex;\n flex: 1;\n gap: 6px;\n align-items: center;\n min-width: 0;\n }\n\n // `play_button` is a `GtkButton` with `has-frame` 0 — a flat button — and so is the\n // `volume_button` beside it. `.adw-flat` is this package's flat-button class; `_button.scss`\n // owns the shape, and nothing here restates it.\n .adw-media-controls-button {\n flex-shrink: 0;\n }\n\n // `time_box` — the middle `GtkBox`, `hexpand` on the scale inside it.\n .adw-media-controls-time-box {\n display: flex;\n flex: 1;\n align-items: center;\n min-width: 0;\n }\n\n // BOTH labels' `font-features \"tnum=1\"` (ui/gtkmediacontrols.ui). Tabular figures, so a\n // position counting 9→10 does not resize its own string and shift the scale sideways.\n .adw-media-controls-time-label,\n .adw-media-controls-duration-label {\n // `font-variant-numeric: tabular-nums` is a UTILITY class on a label in libadwaita\n // (`_labels.scss`); it is applied here directly because these are spans of this element's\n // own tree rather than `<gtk-label>`s a consumer styled.\n font-variant-numeric: tabular-nums;\n // The two labels must never be squeezed: they are the numbers the seek bar is read\n // against, and a truncated `-1:02:03` is worse than a narrower scale.\n flex-shrink: 0;\n padding: 0 2px;\n }\n\n // `seek_scale` — the `GtkScale`, `hexpand` 1 and `restrict-to-fill-level` 0.\n .adw-media-controls-seek-scale {\n flex: 1;\n min-width: 0;\n accent-color: var(--accent-color);\n }\n\n // The volume button is a POSITIONING context for its own popover, which is what makes the\n // surface sit below the button rather than beside the bar — `GtkVolumeButton` is a\n // `GtkMenuButton`, so the surface hangs off its anchor.\n .adw-media-controls-volume-button {\n position: relative;\n }\n\n // `<gtk-popover>` is this package's ONE popover surface and `_popover.scss`'s header says\n // why: three hand-rolled copies of the plate disagreed with libadwaita and with each\n // other before it was lifted out. So the volume slide goes in a real one and this partial\n // states nothing about its shape — only that it hangs from the button and does not take\n // clicks meant for the slide.\n .adw-media-controls-volume-popover {\n top: calc(100% + 6px);\n left: 50%;\n // `_popover.scss`'s own `$popover-gap`, restated here rather than imported: the gap is\n // the DISTANCE from anchor to surface, which is a property of the anchor's positioning\n // and belongs to the widget that owns the anchor.\n transform: translateX(-50%);\n }\n\n .adw-media-controls-volume-scale {\n width: 120px;\n accent-color: var(--accent-color);\n }\n}\n","// _list_box.scss — <gtk-list-box> and its rows, the elements GTK names `list` and `row`.\n//\n// The `list` NODE and the `row` NODE, because upstream writes them as one block and because\n// libadwaita styles them against EACH OTHER: the separator rule is\n// `&.separators:not(.horizontal) > row:not(.separator)` (_lists.scss:29-32), which is a rule\n// about the list's class and the row's own — a port that styled the rows alone could not\n// express it at all.\n//\n// `<gtk-list-box>` IS NOT AN ORIENTABLE, which is worth the header repeating: `GtkListBase` is\n// (gtklistbase.c:2070) and `<gtk-list-view>` therefore takes an `orientation`, while\n// `GtkListBox` has no such property and its rows always run down. So the\n// `&.horizontal` arm of the upstream separator rule has no counterpart here, and the partial\n// draws only the vertical half.\n//\n// The colour tokens are libadwaita's own, spelled with this package's variables:\n// `$view_hover_color` is `currentColor 4%`, `$view_active_color` `currentColor 8%` and\n// `$view_selected_color` `var(--accent-bg-color) 25%` (_colors.scss:263-276).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:5-38 (list), :47-95 (row)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-list-box {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n background-clip: padding-box;\n\n // `listview, list { border-color: $border_color }` (_lists.scss:10) — the upstream rule\n // names a COLOUR and nothing else, because GTK draws a border only where a width or a\n // style is set alongside it. So a bare list has no frame, and that is what this is: the\n // frame used to sit here unconditionally, which made every list read as a card where\n // libadwaita draws one only for `list.boxed-list` (_lists.scss:520) — `Adw.PreferencesGroup`\n // carries that one, through `%card` (_preferences.scss:83), so nothing needed it here.\n border-color: var(--border-color);\n\n &.view:disabled {\n color: var(--view-fg-color);\n }\n}\n\ngtk-list-box-row {\n display: block;\n box-sizing: border-box;\n background-clip: padding-box;\n // `listview > row { padding: 2px }` (_lists.scss:16-19).\n padding: 2px;\n\n &.activatable {\n cursor: pointer;\n }\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 4%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 8%, transparent);\n }\n\n // `row &:selected { background-color: $view_selected_color }` (_lists.scss:92-94), with the\n // hover and active shades over it (_lists.scss:83-89).\n &.selected {\n background-color: color-mix(in srgb, var(--accent-bg-color) 25%, transparent);\n }\n\n &.selected:hover {\n background-color: color-mix(in srgb, var(--accent-bg-color) 40%, transparent);\n }\n\n &.selected:active {\n background-color: color-mix(in srgb, var(--accent-bg-color) 50%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n}\n\n// `.separators` is the class GTK adds for `show-separators` (gtklistbox.c:4127-4134), and the\n// rule goes on every row but the last — upstream `> row:not(.separator)`, and a\n// `<gtk-separator>` row is not one, so the port's `:last-child` is the same exclusion without\n// giving the separator a class GTK would then have to know about.\ngtk-list-box.separators > gtk-list-box-row:not(:last-child) {\n border-bottom: 1px solid var(--border-color);\n}","// _flow_box.scss — <gtk-flow-box> and its cells, the elements GTK names `flowbox` and\n// `flowboxchild`.\n//\n// Upstream writes `flowbox > flowboxchild, gridview > child` as ONE rule (_views.scss:52-91):\n// the same 3px padding, the same `$button_radius` corner, the same focus ring and the same four\n// state colours — and `<gtk-grid-view>` already wears the grid half in `_grid_view.scss`, which\n// `@include`s `adw-list-selectable` from `_list_view.scss` for exactly that reason. The cell\n// here therefore includes the same mixin rather than restating four colours, because a drifted\n// copy is four wrong ones and the hover-over-selected pair is the pair nobody checks by eye.\n//\n// `flex-flow: row wrap` IS the allocation. GTK hands each child a slot on a running line in\n// the given orientation and starts a new one when the next would not fit\n// (gtkflowbox.c:1640-1900), and a wrapping flex line with a per-child size share is that rule\n// expressed in the browser's own layout language: `max-width: 100% / max-children-per-line`\n// caps how many can share a line, and `min-width: 100% / min-children-per-line` is\n// `min-children-per-line`, whose own documented job is that \"a reasonably small height will be\n// requested for the overall minimum width of the box\" (gtkflowbox.c:3747-3755).\n//\n// `homogeneous` is `flex: 1 1 0` — GTK's \"all children should be allocated the same size\"\n// (:3736-3739), which in a wrapping line is exactly equal growth from a zero basis.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:1-16 (.view), :52-91\n// (flowbox > flowboxchild), :88-91 (flowbox, gridview disabled)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'list_view';\n\ngtk-flow-box {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n\n // The line container. `--adw-flow-box-*` are written by `gtk-flow-box.ts` from the\n // properties, so the stylesheet stays declarative and a `homogeneous` write is one class.\n display: flex;\n flex-flow: row wrap;\n gap: var(--adw-flow-box-row-spacing, 0px) var(--adw-flow-box-column-spacing, 0px);\n\n &.vertical {\n flex-flow: column wrap;\n }\n\n &.view:disabled {\n color: var(--view-fg-color);\n }\n}\n\ngtk-flow-box-child {\n @include list_view.adw-list-selectable;\n\n display: block;\n box-sizing: border-box;\n // `flowbox > flowboxchild { padding: 3px; border-radius: $button_radius }`\n // (_views.scss:52-56).\n padding: 3px;\n border-radius: var(--button-radius);\n // The line share. A browser lays the children out, so this is where GTK's\n // `min`/`max-children-per-line` and `homogeneous` are honoured — and the share has to\n // LEAVE ROOM FOR THE SPACING. `100% / N` alone does not: N children then need N shares\n // PLUS the (N-1) gaps between them, so the row overflows by the gaps and the browser\n // breaks it one child early. Measured on the gallery's flow box — `min-children-per-line`\n // 2, `max` 4, a 6px spacing in a 320px box — the share came out at 50% (160px), two\n // children plus one gap came to 326px, and the box showed ONE child per line where\n // libadwaita packs four. The share is therefore (100% - (N-1) × spacing) / N.\n max-width: calc(\n (100% - (var(--adw-flow-box-max-children-per-line, 7) - 1) *\n var(--adw-flow-box-column-spacing, 0px)) / var(--adw-flow-box-max-children-per-line, 7)\n );\n min-width: calc(\n (100% - (var(--adw-flow-box-min-children-per-line, 1) - 1) *\n var(--adw-flow-box-column-spacing, 0px)) / var(--adw-flow-box-min-children-per-line, 1)\n );\n cursor: pointer;\n}\n\ngtk-flow-box.vertical > gtk-flow-box-child {\n // The same arithmetic down the other axis, against the ROW spacing.\n max-height: calc(\n (100% - (var(--adw-flow-box-max-children-per-line, 7) - 1) *\n var(--adw-flow-box-row-spacing, 0px)) / var(--adw-flow-box-max-children-per-line, 7)\n );\n max-width: none;\n min-height: calc(\n (100% - (var(--adw-flow-box-min-children-per-line, 1) - 1) *\n var(--adw-flow-box-row-spacing, 0px)) / var(--adw-flow-box-min-children-per-line, 1)\n );\n min-width: 0;\n}\n\ngtk-flow-box.homogeneous > gtk-flow-box-child {\n flex: 1 1 0;\n}","// _calendar.scss — <gtk-calendar>: the `calendar` node, its header, and the grid of\n// `day-name` / `week-number` / `day-number` labels.\n//\n// libadwaita's block is 58 lines and almost all of it is state: `:checked` for a MARKED day,\n// `:selected` for the SELECTED one, `.today` for today's, `.other-month` for the spill. The\n// port spells those as four classes off one element — `gtk-calendar.ts` raises the same four\n// widget state flags `calendar_update_day_labels` does (gtkcalendar.c:1015-1046) — and the\n// selectors below are the same four, in the same specificity order, so the cascade resolves\n// the way the C's stylesheet resolves it.\n//\n// THE CASCADE ORDER MATTERS and it is why the rules are not merged: `label.today` sets an\n// inset box-shadow and then CANCELS it under `:selected` (_calendar.scss:24-30), and\n// `.day-number:checked` sets a 30% accent tint that `:selected` then replaces with the solid\n// accent (_calendar.scss:37-51). A merged rule that applied `:checked` last would tint the\n// selected day, which is exactly what upstream avoids.\n//\n// `font-variant-numeric: tabular-nums` is the load-bearing line for a grid of day numbers: the\n// column widths come from the widest number, and proportional digits would make 1 narrower than\n// 8 and the whole grid breathe as the month changes.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_calendar.scss:1-58\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-calendar {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n background-clip: padding-box;\n // `calendar { border: 1px solid $border_color }` (_calendar.scss:4).\n border: 1px solid var(--border-color);\n border-radius: var(--window-radius);\n font-variant-numeric: tabular-nums;\n\n &.view:disabled {\n color: var(--view-fg-color);\n }\n}\n\n.adw-calendar-header {\n display: flex;\n align-items: center;\n gap: 2px;\n padding: 4px;\n // `> header { border-bottom: 1px solid $border_color }` (_calendar.scss:12).\n border-bottom: 1px solid var(--border-color);\n}\n\n.adw-calendar-month {\n font-weight: bold;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.adw-calendar-year {\n // The C measures the year label once and adds 10px so \"changing the year does not increase\n // the calendar width\" (gtkcalendar.c:853-858) — a fixed slot is the same promise.\n flex: 0 0 auto;\n font-weight: bold;\n}\n\n.adw-calendar-nav-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: 0 0 auto;\n // `@extend %button_basic_flat` with `border-radius: 0` (_calendar.scss:15-16).\n border-radius: 0;\n\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n}\n\n.adw-calendar-grid {\n display: grid;\n // Column 0 is the week-number column upstream (gtkcalendar.c:786-790), and it exists whether\n // or not the numbers are shown, so the day names and the days line up under it either way.\n grid-template-columns: auto repeat(7, 1fr);\n // `> grid { padding-left: 3px; padding-bottom: 3px }` (_calendar.scss:21-22).\n padding: 3px 0 3px 3px;\n}\n\n.adw-calendar-day-name,\n.adw-calendar-week-number,\n.adw-calendar-week-spacer {\n // `margin-top: 3px; margin-right: 3px` (_calendar.scss:34-35), applied to the labels.\n margin-top: 3px;\n margin-right: 3px;\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n text-align: center;\n}\n\n.adw-calendar-week-number,\n.adw-calendar-week-spacer {\n // The week-number column is the day names' share of a cell: a number is narrower than a name,\n // and letting it size itself would make the grid jitter between a wide and a narrow month.\n max-width: 2.5em;\n}\n\n.adw-calendar-cell {\n // `> label { margin-top: 3px; margin-right: 3px }` and `.day-number { padding: 3px }`\n // (_calendar.scss:32-38).\n margin-top: 3px;\n margin-right: 3px;\n padding: 3px;\n border: none;\n border-radius: 0;\n background: none;\n color: inherit;\n font: inherit;\n font-variant-numeric: inherit;\n line-height: 1;\n text-align: center;\n cursor: pointer;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 6%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 12%, transparent);\n }\n\n &:focus-visible,\n &.focused {\n // `@include focus-ring($focus-state: ':focus')` (_calendar.scss:33) — the C focuses the\n // LABEL rather than the grid, which is what `.focused` is on this port.\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // `:checked` — `background-color: color-mix(… var(--accent-bg-color) 30%, transparent)`\n // (_calendar.scss:39-43), the MARKED day.\n &.marked {\n border-radius: var(--button-radius);\n background-color: color-mix(in srgb, var(--accent-bg-color) 30%, transparent);\n }\n\n // `:selected { background-color: var(--accent-bg-color); color: var(--accent-fg-color) }`\n // (_calendar.scss:45-50), and it comes AFTER `:checked` so the selected day is not tinted.\n &.selected {\n border-radius: var(--button-radius);\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n }\n\n // `.other-month { color: color-mix(in srgb, currentColor 30%, transparent) }`\n // (_calendar.scss:53-55), the leading and trailing spill.\n &.other-month {\n color: color-mix(in srgb, currentColor 30%, transparent);\n }\n\n // `label.today { box-shadow: inset 0 0 0 -2px $border_color }` (_calendar.scss:24-25) — an\n // inset rule, not a border, so it does not change the cell's size.\n &.today {\n box-shadow: inset 0 -2px var(--border-color);\n }\n\n // `label.today:selected { box-shadow: none }` (_calendar.scss:27-29): the selected day's\n // accent fill IS the emphasis, so today's underline steps aside rather than doubling up.\n &.today.selected {\n box-shadow: none;\n }\n\n &[disabled] {\n // `lower_limit_reached` / `upper_limit_reached` blank those cells and make them\n // insensitive (gtkcalendar.c:1004-1015), so there is nothing to dim — just nothing.\n background: none;\n cursor: default;\n }\n}","// _preferences.scss — adw-preferences-group styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_preferences.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_preferences.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'style_classes';\n\nadw-preferences-group {\n display: block;\n\n // An author `display` beats the UA `[hidden] { display: none }` regardless of\n // specificity, so without this a group hidden through the DOM `hidden`\n // property would keep rendering — the search treats it as invisible\n // (`is_visible_group`), and the two must agree.\n &[hidden] {\n display: none;\n }\n\n // The header is a flex row: a title/description label column on the left\n // (stretches to fill) and the optional header-suffix on the trailing edge.\n .adw-preferences-group-header {\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n padding: var(--spacing-xs) 2px;\n\n // An author `display` beats the UA `[hidden] { display: none }` no matter\n // the specificity, so `headerEl.hidden = true` did NOTHING here: an empty\n // group kept its header box and its padding.\n &[hidden] {\n display: none;\n }\n\n // libadwaita's own metrics, keyed off `is_single_line`:\n // `> box.header:not(.single-line) { margin-bottom: 6px }` and\n // `> box.single-line { min-height: 34px }`\n // (refs/libadwaita/src/stylesheet/widgets/_preferences.scss:6-13). A\n // title-only or suffix-only header is one line tall and needs the height\n // floor instead of the gap below it.\n &:not(.single-line) {\n margin-bottom: 6px;\n }\n\n &.single-line {\n min-height: 34px;\n }\n }\n\n .adw-preferences-group-labels {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n min-width: 0;\n }\n\n .adw-preferences-group-suffix {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n }\n\n .adw-preferences-group-title {\n font-size: var(--font-size-base);\n font-weight: 700;\n margin: 0;\n color: var(--window-fg-color);\n }\n\n // Dimmed description line below the title.\n .adw-preferences-group-description {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n margin: 0;\n color: var(--window-fg-color);\n }\n\n // A preferences group's list IS a boxed list — same card surface, same clip\n // for the rounding of the first and last row. It used to carry its own copy of\n // the five card declarations.\n .adw-preferences-group-listbox {\n @extend %card;\n\n overflow: hidden;\n }\n}\n","// _preferences_row.scss — <adw-preferences-row>, the base of every boxed-list row.\n//\n// The row is a GTK `row` node inside the group's list, so its box comes from two places\n// in `_lists.scss`: `row` itself (a focus ring, `background-clip: padding-box`, and the\n// hover/active/selected colours under `.activatable`) and `list > row { padding: 2px }`\n// (:23-25). The metrics below are this package's shared row floor — the 50px minimum and\n// the card-fg hairline every `_row.scss` row uses — because libadwaita's own row height\n// is its theme's and a browser needs the number written down.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:1-90 (`row`, `list > row`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_preferences.scss (the group's card)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components — the GTK `row` node\n// becomes the tag, and `:selected` becomes the row surface `<adw-preferences-group>`'s\n// list box already paints.\n\nadw-preferences-row {\n display: flex;\n align-items: center;\n min-height: 50px;\n padding: var(--spacing-s) var(--spacing-m);\n gap: var(--spacing-m);\n background-clip: padding-box;\n color: var(--card-fg-color);\n // The hairline between rows, which `_lists.scss` draws as\n // `&:not(.horizontal) > row:not(.separator) { border-bottom: 1px solid $border_color }`\n // (:32-34) — on the row, from the list it belongs to.\n border-bottom: 1px solid var(--card-shade-color);\n\n // `Gtk.Label:selectable` is `user-select: text`, and the element writes it on the\n // title span itself; this is the row-level floor so a copyable title survives a\n // stylesheet that resets selection.\n .adw-row-title {\n user-select: none;\n\n // A row with NO content section has a `hidden` one, and `[hidden]` is\n // `display: none !important` — so the row's free space belongs to no part at all and\n // `tooltip-text`, which rides a part (`src/row-tooltip.ts`), reaches only the label's\n // own width. Taking that space moves it into a box that draws nothing: the label is\n // start-aligned and the content's items are `flex-end`, so nothing on screen moves.\n &:has(~ .adw-preferences-row-content[hidden]) {\n flex: 1 1 auto;\n }\n }\n\n // The slot the `child` property lands in: the preference's own controls, which sit\n // after the title and take the rest of the row.\n .adw-preferences-row-content {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n flex: 1 1 auto;\n min-width: 0;\n justify-content: flex-end;\n }\n\n &:last-child {\n border-bottom: none;\n }\n}\n","// _card.scss — adw-card styling.\n//\n// The card SURFACE (colours, radius, elevation) is `%card` in\n// `_style_classes.scss`, shared with the documented `.card` class and with\n// `.boxed-list`; this element adds only what makes it an element: a block box\n// and the padding a bare `.card` deliberately does not have.\n//\n// Reference: refs/adwaita-web/adwaita-web/scss/_card.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:197-236\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'style_classes';\n\nadw-card,\n.adw-card {\n @extend %card;\n\n display: block;\n padding: var(--spacing-l);\n overflow: hidden;\n}\n","// _data_grid.scss — adw-data-grid: a slim, aligned numeric grid for genuinely\n// tabular data (an accounting BWA / P&L statement, invoice line-items). The web\n// mirror of the native Gtk.Grid the Buchhaltung app fills for its financial\n// statements — labels left, amounts right-aligned with tabular figures so\n// columns of numbers line up, plus the section / subtotal / total emphasis a\n// statement needs. NOT a Gtk.ColumnView (no sorting, no zebra striping); boxed\n// lists stay the default for record lists. Uses CSS subgrid so each row is a\n// real element (hover, hairline rules, activation) while columns stay aligned.\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss (separator / card / dim tokens)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (boxed-list density)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss:13-15,81-88 (.dimmed / .monospace / .numeric)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// `.dimmed` / `.monospace` / `.numeric`. This file used to declare\n// `font-variant-numeric: tabular-nums` twice, inline a whole monospace font\n// stack, and dim its header row with a raw `opacity: var(--dim-opacity)` — i.e.\n// three private copies of utilities libadwaita publishes. It composes them now,\n// the way upstream's own `_progress-bar.scss:17-21` composes the same two.\n@use 'labels';\n\n.adw-data-grid {\n display: block;\n box-sizing: border-box;\n color: var(--card-fg-color);\n font-size: var(--font-size-base);\n\n // Optional title above the grid.\n .adw-data-grid-caption {\n font-size: var(--font-size-heading);\n font-weight: 700;\n color: var(--window-fg-color);\n margin: 0 0 var(--spacing-s);\n padding: 0 var(--spacing-xs);\n }\n\n // Horizontal scroll is CONTAINED here — a wide statement (many month columns)\n // scrolls sideways within the grid instead of overflowing the page.\n .adw-data-grid-scroll {\n overflow-x: auto;\n overflow-y: hidden;\n }\n\n // The grid owns the column tracks; each row is a subgrid spanning them, so\n // figures in the same column line up across every row. `min-width: max-content`\n // keeps columns from crushing — they overflow into the scroller instead.\n .adw-data-grid-table {\n display: grid;\n box-sizing: border-box;\n width: 100%;\n min-width: max-content;\n // grid-template-columns is set inline from the column descriptors.\n }\n\n .adw-data-grid-row {\n display: grid;\n grid-template-columns: subgrid;\n grid-column: 1 / -1;\n align-items: center;\n }\n\n // Airy Adwaita cell density (matching the boxed-list row rhythm), single-line.\n .adw-data-grid-cell {\n box-sizing: border-box;\n min-width: 0;\n padding: var(--spacing-s) var(--spacing-m);\n white-space: nowrap;\n text-align: left;\n\n &.align-end {\n text-align: right;\n }\n\n &.align-center {\n text-align: center;\n }\n\n // Tabular figures are the WHOLE POINT vs a boxed list — numbers line up.\n // `numeric` needs no rule at all: the cell carries the bare class, so\n // libadwaita's own `.numeric` (_labels.scss:86-88) already applies.\n // A mono cell is monospace AND tabular, so it composes both.\n &.mono {\n @extend .monospace;\n @extend .numeric;\n }\n }\n\n // Header row — dim, small, uppercase caps with a hairline underline (Adwaita\n // list-column headings), never sortable.\n .adw-data-grid-row.header {\n .adw-data-grid-cell {\n @extend .dimmed;\n\n font-size: var(--font-size-small);\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n border-bottom: 1px solid var(--separator-color);\n }\n }\n\n // A section header spans all columns as a bold group title (a BWA's sections).\n .adw-data-grid-row.variant-section {\n .section-cell {\n font-weight: 700;\n color: var(--window-fg-color);\n padding-top: var(--spacing-m);\n }\n }\n\n // A subtotal is bold with a hairline rule above it (Gesamtleistung, Rohertrag…).\n .adw-data-grid-row.variant-subtotal {\n border-top: 1px solid var(--separator-color);\n\n .adw-data-grid-cell {\n font-weight: 700;\n }\n }\n\n // The final total is bold with a STRONGER rule above (the accounting result —\n // Betriebsergebnis), plus a thin rule below to evoke the ruled grand-total line.\n .adw-data-grid-row.variant-total {\n border-top: 2px solid var(--separator-color);\n border-bottom: 1px solid var(--separator-color);\n\n .adw-data-grid-cell {\n font-weight: 800;\n color: var(--window-fg-color);\n }\n }\n\n // Optional interactive rows (master-detail). Hairline separators only where\n // Adwaita would — NOT zebra striping — so no default row borders; the hover /\n // focus affordance carries the interaction.\n .adw-data-grid-row.interactive {\n cursor: pointer;\n border-radius: var(--button-radius);\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n }\n}\n","// _bin.scss — <adw-bin>, the one-child container.\n//\n// libadwaita has NO `bin` node: `adw_bin_class_init` sets no CSS name and the\n// stylesheet never mentions one (the widget's whole rule is the layout manager, and\n// `GtkBinLayout` gives the child the widget's entire allocation). So the only rule here\n// is the block box that allocation needs, and the one cross-axis stretch that says\n// \"the child fills the bin\" — a `GtkBinLayout` gives its child the bin's height too,\n// which a block child would otherwise size to its own content.\n//\n// Reference: refs/libadwaita/src/adw-bin.c:123 (GtkBinLayout)\n// Reference: refs/gtk/gtk/gtkbinlayout.c:81 (`gtk_bin_layout_allocate` hands the child the\n// allocation on both axes)\n// Copyright (c) GNOME contributors (GTK, libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-bin {\n display: block;\n\n // One child, and it fills — `gtk_bin_layout_allocate` allocates the whole widget to\n // its single child. `:only-child` rather than `> *` because a bin keeps ONE\n // (`adw_bin_set_child` unparents the one it replaces), so the case where the selector\n // could match two is one the element has already refused.\n > :only-child {\n block-size: 100%;\n }\n}\n","// _clamp.scss — adw-clamp styling.\n//\n// The element itself is deliberately UNCAPPED and full-width: it is the box the\n// tightening curve is evaluated against, so it has to keep reporting the\n// AVAILABLE width. The cap and the centring live on the children, written by the\n// element from `clampAllocate` (see src/elements/adw-clamp.ts) — an element that\n// capped itself would feed its own capped width back into its ResizeObserver.\n//\n// Reference: refs/libadwaita/src/adw-clamp-layout.c (adw_clamp_layout_allocate)\n// Reference: refs/adwaita-web/adwaita-web/scss/_clamp.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-clamp {\n display: block;\n width: 100%;\n}\n","// _stack.scss — <gtk-stack>: one visible child out of many, with the animated\n// change between them.\n//\n// Upstream libadwaita styles the stack itself NOT AT ALL: `stack` appears in exactly\n// two rules of the whole stylesheet — `notebook > stack:not(:only-child)` for the\n// background (refs/libadwaita/src/stylesheet/widgets/_notebook.scss:213-215) and the\n// `stackswitcher`/`placessidebar` drop-target carve-out\n// (refs/libadwaita/src/stylesheet/_common.scss:81-89). Everything visible about a stack\n// is GTK's own node contract, which C declares: the `stack` css name and the GROUP\n// accessible role (gtkstack.c:1067-1068), the child that is laid out at all\n// (:2778-2831), the overlapping pair a transition paints (:1509-1519, :2662-2700) and\n// the measured size (:2833-2945). What follows is that contract written as CSS, with the\n// two libadwaita rules that reach a stack carried over verbatim where they apply.\n//\n// `<gtk-stack-switcher>` and `<gtk-stack-sidebar>` extend this same partial: libadwaita\n// styles their internals out of `_buttons.scss` and `_sidebars.scss` respectively, so the\n// three widgets share one stylesheet the way upstream shares three files.\n//\n// Reference: refs/gtk/gtk/gtkstack.c\n// Reference: refs/libadwaita/src/stylesheet/widgets/_notebook.scss:213-215\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-stack {\n display: flex;\n box-sizing: border-box;\n position: relative;\n min-width: 0;\n min-height: 0;\n\n // GTK allocates every child the stack's own size and lays out only the visible one\n // (gtkstack.c:2778-2831), so a page is a stretched box: `flex: 1 1 auto` plus the\n // cross-axis stretch `align-items: stretch` already gives. A page with a size\n // request of its own keeps it — `flex-basis: auto` is what makes the basis the\n // content rather than 0.\n > .adw-stack-page {\n box-sizing: border-box;\n flex: 1 1 auto;\n min-width: 0;\n min-height: 0;\n\n &:not(.visible-page) {\n display: none;\n }\n\n // An animated page is positioned, because two pages overlap for its duration\n // (gtkstack.c:1509-1519 keeps `last_visible_child` alive until the tracker is\n // AFTER, and the snapshot node paints both, :2662-2700).\n &.transitioning-in,\n &.transitioning-out {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n }\n }\n\n // `hhomogeneous` is TRUE by default (gtkstack.c:981-987), and the measure pass then\n // looks at the VISIBLE child alone on that axis (gtkstack.c:2899-2905) — the stack is\n // as big as the current page. Turned off, the stack is as big as the LARGEST page,\n // which is `max-content` on the cross axis and `flex: 1 1 auto` along the main one.\n &:not([hhomogeneous]) > .adw-stack-page {\n flex: 0 1 auto;\n width: max-content;\n max-width: 100%;\n }\n\n &:not([vhomogeneous]) > .adw-stack-page {\n height: max-content;\n max-height: 100%;\n }\n\n // `interpolate-size` (gtkstack.c:2148-2172) smooths the SIZE change too, by\n // interpolating the measured min/natural between the two pages (gtkstack.c:2847-2859,\n // :2935-2943). A browser negotiates one layout, so the analogue is a CSS transition\n // on the stack's own box for the duration of the page change — which is the same\n // promise, reached through the mechanism this renderer actually has.\n &[interpolate-size] {\n transition-property: width, height;\n transition-duration: var(--stack-transition-duration, 200ms);\n transition-timing-function: cubic-bezier(0.2, 0, 0, 1);\n }\n}\n\n// ── Transitions ────────────────────────────────────────────────────────────\n// `transition-duration` is the progress tracker's length (gtkstack.c:1408-1411) and\n// `transition-running` is the flag the tick callback sets and clears\n// (gtkstack.c:1283-1286, :1313-1315). Every animation below is therefore written for\n// the FORWARD direction and mirrored by `animation-direction: reverse` for a backward\n// one — which is what `get_simple_transition_type` decides in C (gtkstack.c:1539-1556),\n// the incoming page sitting after the outgoing one meaning forward.\n// The mixins take the property/value PAIRS as a map and interpolate whole declarations,\n// because a declaration list cannot be interpolated into a `from { … }` block: `@content`\n// would be the way to accept declarations, but the keyframe names then cannot vary.\n@mixin stack-transition($name, $in-from, $in-to, $out-from, $out-to) {\n &[data-transition-type='#{$name}'] > .adw-stack-page.transitioning-in {\n animation-name: stack-in-#{$name};\n animation-duration: var(--stack-transition-duration, 200ms);\n animation-fill-mode: both;\n }\n\n &[data-transition-type='#{$name}'] > .adw-stack-page.transitioning-out {\n animation-name: stack-out-#{$name};\n animation-duration: var(--stack-transition-duration, 200ms);\n animation-fill-mode: both;\n }\n\n @keyframes stack-in-#{$name} {\n from {\n @each $prop, $value in $in-from {\n #{$prop}: $value;\n }\n }\n\n to {\n @each $prop, $value in $in-to {\n #{$prop}: $value;\n }\n }\n }\n\n @keyframes stack-out-#{$name} {\n from {\n @each $prop, $value in $out-from {\n #{$prop}: $value;\n }\n }\n\n to {\n @each $prop, $value in $out-to {\n #{$prop}: $value;\n }\n }\n }\n}\n\n@mixin stack-transition-in-only($name, $in-from, $in-to) {\n &[data-transition-type='#{$name}'] > .adw-stack-page.transitioning-in {\n animation-name: stack-in-#{$name};\n animation-duration: var(--stack-transition-duration, 200ms);\n animation-fill-mode: both;\n }\n\n @keyframes stack-in-#{$name} {\n from {\n @each $prop, $value in $in-from {\n #{$prop}: $value;\n }\n }\n\n to {\n @each $prop, $value in $in-to {\n #{$prop}: $value;\n }\n }\n }\n}\n\n// CROSSFADE — GTK_STACK_TRANSITION_TYPE_CROSSFADE (gtkstack.c:98): both pages are on\n// screen at once and their opacity is interpolated (gtkstack.c:2432-2454).\n@include stack-transition(crossfade, (opacity: 0), (opacity: 1), (opacity: 1), (opacity: 0));\n\n// SLIDE — `slide-right` … `slide-down` (gtkstack.c:99-102). The outgoing page LEAVES in\n// the named direction and the incoming one arrives from the opposite side, which is why\n// one pair of keyframes covers both (gtkstack.c:2597-2660).\n@include stack-transition(\n slide-right,\n (transform: translateX(-100%)),\n (transform: translateX(0)),\n (transform: translateX(0)),\n (transform: translateX(100%))\n);\n@include stack-transition(\n slide-left,\n (transform: translateX(100%)),\n (transform: translateX(0)),\n (transform: translateX(0)),\n (transform: translateX(-100%))\n);\n@include stack-transition(\n slide-up,\n (transform: translateY(100%)),\n (transform: translateY(0)),\n (transform: translateY(0)),\n (transform: translateY(-100%))\n);\n@include stack-transition(\n slide-down,\n (transform: translateY(-100%)),\n (transform: translateY(0)),\n (transform: translateY(0)),\n (transform: translateY(100%))\n);\n\n// THE TWO-WAY TYPES HAVE NO RULES OF THEIR OWN. `slide-left-right`, `slide-up-down`,\n// the four `over-*-*` pairs and `rotate-left-right` (gtkstack.c:103-106, :118) are\n// resolved by `get_simple_transition_type` into ONE of the one-directional types above,\n// before the animation starts (gtkstack.c:1546-1561, :1162-1200) — so the element\n// writes `slide-left` or `slide-right` into `data-transition-type` and never the\n// two-way nick. That is C's own arrangement, and it is why this partial has no\n// direction attribute to key on.\n\n// OVER-… — the incoming page slides IN OVER the outgoing one, which stays put\n// (gtk_stack_snapshot_over, gtkstack.c:2456-2513).\n@include stack-transition-in-only(over-up, (transform: translateY(100%)), (transform: translateY(0)));\n@include stack-transition-in-only(over-down, (transform: translateY(-100%)), (transform: translateY(0)));\n@include stack-transition-in-only(over-left, (transform: translateX(100%)), (transform: translateX(0)));\n@include stack-transition-in-only(over-right, (transform: translateX(-100%)), (transform: translateX(0)));\n\n// UNDER-… — the incoming page slides in UNDERNEATH the outgoing one, which therefore\n// gets the z-index it does not have for OVER (gtkstack.c:2456-2513).\n@include stack-transition-in-only(under-up, (transform: translateY(100%)), (transform: translateY(0)));\n@include stack-transition-in-only(under-down, (transform: translateY(-100%)), (transform: translateY(0)));\n@include stack-transition-in-only(under-left, (transform: translateX(100%)), (transform: translateX(0)));\n@include stack-transition-in-only(under-right, (transform: translateX(-100%)), (transform: translateX(0)));\n\n// The stacking order is the whole difference between OVER and UNDER, and it is a single\n// declaration: the outgoing page stays above the incoming one for UNDER, and below it\n// for OVER.\ngtk-stack[data-transition-type^='over-'] > .adw-stack-page.transitioning-in {\n z-index: 1;\n}\n\ngtk-stack[data-transition-type^='under-'] > .adw-stack-page.transitioning-out {\n z-index: 1;\n}\n\n// ROTATE — `rotate-left` / `rotate-right` / `rotate-left-right` (gtkstack.c:116-118):\n// a Y-axis rotation of the crossfade, `perspective` standing in for GTK's 3D context.\n@include stack-transition-in-only(\n rotate-left,\n (transform: perspective(800px) rotateY(90deg)),\n (transform: perspective(800px) rotateY(0deg))\n);\n@include stack-transition-in-only(\n rotate-right,\n (transform: perspective(800px) rotateY(-90deg)),\n (transform: perspective(800px) rotateY(0deg))\n);\n\n// CUBE (gtkstack.c:107) and the transition's `NONE`: no animation, so nothing to write.\n// `gtk_stack_start_transition` skips the whole tracker when the effective type is NONE\n// or the duration is 0 (gtkstack.c:1400-1403), which is what the element does too — the\n// `transition-running` attribute is simply never set.\n// ── Gtk.StackSwitcher ──────────────────────────────────────────────────────\n// A linked row of toggle buttons, one per page (gtkstackswitcher.c:277-300), and C puts\n// the `.linked` class on the switcher itself (gtkstackswitcher.c:49-57) so the buttons\n// share one rounded group instead of being individually rounded.\ngtk-stack-switcher {\n display: flex;\n box-sizing: border-box;\n min-width: 0;\n\n > .adw-stack-switcher-button {\n display: inline-flex;\n flex: 1 1 0;\n min-width: 0;\n align-items: center;\n justify-content: center;\n gap: 6px;\n box-sizing: border-box;\n margin: 0;\n padding: 3px 12px;\n min-height: 30px;\n border: 1px solid var(--border-color, var(--separator-color));\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background-color 150ms ease-in-out, color 150ms ease-in-out;\n\n // `.linked` (gtkstackswitcher.c:49-57): the inner corners lose their radius and\n // the neighbours' borders collapse, so the row reads as one control. This is the\n // same shape `_linked.scss` builds for `.linked > button` in libadwaita.\n &:first-child {\n border-start-start-radius: var(--button-radius);\n border-end-start-radius: var(--button-radius);\n }\n\n &:last-child {\n border-start-end-radius: var(--button-radius);\n border-end-end-radius: var(--button-radius);\n }\n\n &:not(:first-child) {\n border-inline-start-width: 0;\n }\n\n &:not(:last-child) {\n border-inline-end-width: 0;\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The active button is the SELECTED page: `on_button_toggled` drives the stack's\n // selection from the toggle (gtkstackswitcher.c:117-133), so the checked styling\n // has to sit on the same state. `_buttons.scss` gives the checked button the\n // `--button-active-color` fill, and the switcher's own padding is widened by\n // 6px on each side for the needs-attention dot (_buttons.scss:282-292).\n &.active {\n background-color: var(--button-active-color);\n color: var(--window-fg-color);\n }\n\n &:disabled {\n opacity: var(--strong-disabled-opacity, 0.45);\n\n > * {\n opacity: 1;\n }\n }\n\n .adw-stack-switcher-title {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .adw-stack-switcher-icon {\n flex: none;\n width: 16px;\n height: 16px;\n }\n\n // `%needs_attention` (_buttons.scss:294-300, _sidebars.scss:101-105): a 6px dot\n // behind the label, drawn rather than themed, because a custom SVG mask has no\n // libadwaita counterpart to borrow.\n &.needs-attention::after {\n content: '';\n display: inline-block;\n width: 6px;\n height: 6px;\n margin-inline-start: 6px;\n border-radius: 50%;\n background-color: var(--accent-bg-color);\n }\n }\n\n // `icon-button` vs `text-button` (gtkstackswitcher.c:158-176): an icon-only button\n // gets a square min-width, a titled one a 100px floor (`&.text-button { min-width:\n // 100px }`, _buttons.scss:296).\n &[data-button-mode='icon'] > .adw-stack-switcher-button {\n min-width: 34px;\n }\n\n &[data-button-mode='text'] > .adw-stack-switcher-button {\n min-width: 100px;\n }\n\n // `GtkStackSwitcher` is a `GtkOrientable` (gtkstackswitcher.c:47), so the row can be\n // vertical — the C installs a GtkBoxLayout whose orientation follows the property\n // (:500-513).\n &[orientation='vertical'] {\n flex-direction: column;\n\n > .adw-stack-switcher-button {\n flex: 0 1 auto;\n\n &:not(:first-child) {\n border-inline-start-width: 1px;\n border-inline-end-width: 1px;\n border-top-width: 0;\n }\n\n &:not(:last-child) {\n border-bottom-width: 0;\n }\n }\n }\n}\n\n// ── Gtk.StackSidebar ───────────────────────────────────────────────────────\n// `stacksidebar row` — a vertical list of the stack's pages\n// (refs/libadwaita/src/stylesheet/widgets/_sidebars.scss:95-108): 10px 4px padding, a\n// label inset by 6px, and the same `.needs-attention` treatment. The rows live in a\n// `.navigation-sidebar` list (gtkstacksidebar.c:155), which is the list libadwaita\n// already styles — so the list's own background comes from there and this partial only\n// gives the ROW its metrics.\ngtk-stack-sidebar {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow-y: auto;\n\n > .adw-stack-sidebar-list {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n }\n\n > .adw-stack-sidebar-list > .adw-stack-sidebar-row {\n display: flex;\n align-items: center;\n gap: 6px;\n box-sizing: border-box;\n padding: 10px 4px;\n min-height: 36px;\n border: none;\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The row carries the selection, exactly as a `GtkListBoxRow` does\n // (gtkstacksidebar.c:317-338 selects and unselects rows).\n &.selected {\n background-color: var(--button-active-color);\n color: var(--window-fg-color);\n }\n\n .adw-stack-sidebar-title {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n // `> label { padding-left: 6px; padding-right: 6px }`\n // (_sidebars.scss:97-100), here as padding so the ellipsis measures right.\n padding: 0 6px;\n }\n\n // `%needs_attention` (_sidebars.scss:101-105): a 6px dot in front of the label,\n // drawn as a gradient because a custom SVG mask has no libadwaita counterpart\n // to borrow.\n &.needs-attention .adw-stack-sidebar-title {\n background-image: radial-gradient(circle, var(--accent-bg-color) 6px, transparent 6px);\n background-size: 6px 6px;\n background-repeat: no-repeat;\n background-position: left center;\n }\n }\n}\n\n// ── Gtk.Notebook ───────────────────────────────────────────────────────────\n// A stack with its own tab bar on one edge — which libadwaita styles in full, in\n// ONE file, because the tab strip is styled as part of the notebook rather than as a\n// widget of its own: refs/libadwaita/src/stylesheet/widgets/_notebook.scss.\n//\n// The node tree is C's and libadwaita's: `notebook > header > tabs > tab` for the strip\n// and `notebook > stack:not(:only-child)` for the page area (_notebook.scss:4-10,\n// :213-215). The `:not(:only-child)` on the page area is there for a \"hidden\" notebook\n// whose header is the stack's only sibling — the element reproduces the intent directly,\n// by giving the page area its background only when the header is there too.\n//\n// `show-border` IS a CSS CLASS in C and not a branch of this rule: `gtk_notebook_set_show_border`\n// adds `.frame` and clearing the property removes it (gtknotebook.c:6134-6146), and this\n// stylesheet carries libadwaita's rule for that class already — `frame, .frame { border: 1px\n// solid $border_color }` (widgets/_misc.scss:4-7), ported whole into `_style_classes.scss` — so\n// the element toggles the class and nothing here restates it. Its own docs say the bevel only\n// shows when the TABS are not (gtknotebook.c:6125-6131), which is what the header's border below\n// does to it.\n@each $pos, $edge, $shadow in (\n ('top', 'bottom', 'inset 0 -4px'),\n ('bottom', 'top', 'inset 0 4px'),\n ('left', 'right', 'inset -4px 0'),\n ('right', 'left', 'inset 4px 0'),\n) {\n // The header's border is on the edge FACING the pages — `&.top { border-bottom-style:\n // solid }` and its three siblings (_notebook.scss:12-58) — and the tab strip is pulled\n // onto it by the negative margin just below, so the tab's own inset shadow lands ON the\n // border line. Written as four rules rather than nested under `&`, because the edge is a\n // property of the NOTEBOOK and a tab is three levels down from it.\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header {\n border-#{$edge}-style: solid;\n }\n\n // `> tabs { margin-bottom: -2px }` on `.top` (_notebook.scss:15, and its siblings): the\n // strip overlaps the border by one more pixel, so a 37 px tab makes a 37 px header.\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header > .adw-notebook-tabs {\n margin-#{$edge}: -2px;\n }\n\n // `:hover` and `:checked` each get the same inset, in the border colour and in the\n // accent respectively (_notebook.scss:17-19 and its three siblings). The shadow is a\n // whole `box-shadow` value rather than a bare inset, so it is interpolated whole.\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab:hover {\n box-shadow: #{$shadow} var(--border-color, var(--separator-color));\n }\n\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab.active {\n box-shadow: #{$shadow} var(--accent-bg-color);\n }\n}\n\ngtk-notebook {\n display: flex;\n box-sizing: border-box;\n min-width: 0;\n min-height: 0;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n\n // `tab-pos` decides the EDGE, not the document order, so the two directions are one\n // `flex-direction` each rather than a re-ordering of the children — and RTL swaps left\n // and right (`get_effective_tab_pos`, gtknotebook.c:1741-1756), which is what the\n // `data-tab-pos` the element reflects is for.\n &[data-tab-pos='top'] {\n flex-direction: column;\n }\n\n &[data-tab-pos='bottom'] {\n flex-direction: column-reverse;\n }\n\n &[data-tab-pos='left'] {\n flex-direction: row;\n }\n\n &[data-tab-pos='right'] {\n flex-direction: row-reverse;\n }\n\n > .adw-notebook-header {\n flex: none;\n box-sizing: border-box;\n padding: 1px;\n\n // `border-width: 1px` with no style, so that only the edge `@each` above turns\n // solid is drawn: a GTK border is `none` until something says otherwise\n // (_notebook.scss:6-9).\n border-width: 1px;\n border-style: none;\n border-color: var(--border-color, var(--separator-color));\n background-clip: padding-box;\n\n // `gtk_widget_set_visible (header_widget, show_tabs)` (gtknotebook.c:5467).\n &[hidden] {\n display: none;\n }\n }\n\n // `> tabs { margin: -1px }` (_notebook.scss:11) plus the four-pixel inner padding\n // `_notebook.scss:165-207`, which keep the strip off the header's own padding and off\n // the border `@each` drew on the facing edge.\n > .adw-notebook-header > .adw-notebook-tabs {\n display: flex;\n align-items: stretch;\n margin: -1px;\n padding: 0 4px;\n\n // `scrollable`'s arrows are not ported (gtknotebook.c:1139-1148), so the strip\n // overflows and scrolls instead of the two arrow buttons GTK scrolls with.\n overflow-x: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n &::-webkit-scrollbar {\n display: none;\n }\n }\n\n // The two vertical edges turn the strip: the padding and the margin that were\n // horizontal become vertical, and so does the overflow (_notebook.scss:188-207).\n &[data-tab-pos='left'] > .adw-notebook-header > .adw-notebook-tabs,\n &[data-tab-pos='right'] > .adw-notebook-header > .adw-notebook-tabs {\n flex-direction: column;\n padding: 4px 0;\n overflow-x: visible;\n overflow-y: auto;\n }\n\n // …and the four-pixel gap between two tabs, which was `margin-left/right: 4px` on the\n // horizontal edges and is `margin-top/bottom: 4px` on the vertical ones\n // (_notebook.scss:181-183, mirrored at :197-199).\n &[data-tab-pos='left'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab,\n &[data-tab-pos='right'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n margin: 4px 0;\n }\n\n > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n // GTK's `min-height`/`min-width` size the CONTENT box, so the padding comes on top:\n // 30 + 3 + 4 = 37 high, 30 + 2 * 12 = 54 wide, measured on a native Gtk.Notebook.\n box-sizing: content-box;\n\n // `min-height: 30px; min-width: 30px; padding: 3px 12px; font-weight: normal`\n // (_notebook.scss:117-124) and the four-pixel gap `margin-left/right: 4px`\n // (_notebook.scss:181-183, mirrored at :197-199).\n min-width: 30px;\n min-height: 30px;\n margin: 0 4px;\n padding: 3px 12px;\n border: none;\n border-radius: var(--button-radius);\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: normal;\n line-height: 1;\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background-color 150ms ease-in-out, box-shadow 150ms ease-in-out;\n\n // `tab-fill` (TRUE by default, gtknotebook.c:672-681) only decides whether an\n // EXPANDED tab fills the space it was given; without `tab-expand` a tab keeps its\n // natural width, which the native measurement shows (54 px, not stretched).\n flex: 0 0 auto;\n\n &.expand {\n flex: 1 1 0;\n min-width: 0;\n }\n\n // `$hover_color` (color-mix in srgb currentColor 7%, transparent), the pair\n // `&:hover, &:active` sets (_notebook.scss:126-128, _colors.scss:268).\n &:hover,\n &:active {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n // `:checked` on the tab, which C sets when the page becomes current\n // (gtknotebook.c:5466) — `$selected_color` behind it (_colors.scss:270) and the\n // accent underline of `_notebook.scss:19` in front of it.\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n }\n\n // The focus ring, `focus-ring(\"> header > tabs > tab:checked\", $offset: -2px)`\n // (_notebook.scss:3).\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // A page whose child is hidden takes its tab with it\n // (`gtk_widget_set_visible (page->tab_label, … && gtk_widget_get_visible\n // (page->child))`, gtknotebook.c:4117-4118), which is what `tab.hidden` reflects.\n &[hidden] {\n display: none;\n }\n }\n\n // `&.top > tabs > tab { padding-bottom: 4px }` and its mirror (_notebook.scss:209-210).\n &:not([data-tab-pos]) > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab,\n &[data-tab-pos='top'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n padding-bottom: 4px;\n }\n\n &[data-tab-pos='bottom'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n padding-top: 4px;\n }\n\n // The page area, which is a GtkStack inside the C (`gtk_stack_set_visible_child` at\n // gtknotebook.c:5476) and so is one visible child here. `notebook > stack:not(:only-\n // child)` gives it the view background (_notebook.scss:213-215).\n > .adw-notebook-page {\n box-sizing: border-box;\n flex: 1 1 auto;\n min-width: 0;\n min-height: 0;\n\n &:not(.visible-page) {\n display: none;\n }\n }\n\n // `enable-popup`'s menu (gtknotebook.c:6420-6462 builds it, :2684-2692 pops it up),\n // as a DOM listbox over the page.\n > .adw-notebook-menu {\n position: absolute;\n z-index: 20;\n box-sizing: border-box;\n min-width: 160px;\n padding: var(--spacing-xs) 0;\n border-radius: var(--window-radius);\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 2px 8px 2px rgba(0, 0, 0, 0.06);\n }\n\n > .adw-notebook-menu > .adw-notebook-menu-item {\n display: block;\n box-sizing: border-box;\n width: 100%;\n min-height: 30px;\n margin: 0 var(--spacing-xs) 2px;\n padding: 3px 14px;\n border: none;\n border-radius: var(--button-radius);\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n\n &:hover,\n &[aria-selected='true'] {\n background-color: var(--button-active-color);\n }\n }\n}\n","// _clamp_scrollable.scss — <adw-clamp-scrollable>.\n//\n// The widget has NO node of its own: `adw_clamp_scrollable_class_init` ends with\n// `set_layout_manager_type(ADW_TYPE_CLAMP_LAYOUT)` and `set_css_name(\"clamp\")`\n// (adw-clamp-scrollable.c:328-329), so it draws exactly what `<adw-clamp>` draws — which\n// is nothing, since there is no `clamp {}` block in the libadwaita stylesheet either. A\n// clamp measures; the cap and the `small`/`medium`/`large` classes are written onto the\n// CHILD by the element, out of `clampAllocate`.\n//\n// What this element adds is `overflow`. In C the CHILD is the `Gtk.Scrollable` and four\n// `g_object_bind_property` calls forward the adjustments onto it\n// (adw-clamp-scrollable.c:440-455); a DOM scrollport is the element itself, so the\n// scrolling moves one level up and the element writes `overflow-x`/`overflow-y` from\n// `hscroll-policy`/`vscroll-policy`. This rule is the floor for an author who set\n// neither policy — GTK's default is GTK_POLICY_AUTOMATIC, which shows a scrollbar only\n// when there is something to scroll, which is `auto` here.\n//\n// Reference: refs/libadwaita/src/adw-clamp-scrollable.c:328-329 (the `clamp` node)\n// Reference: refs/libadwaita/src/adw-clamp-layout.c (adw_clamp_layout_allocate — the\n// size classes the element stamps on the child)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components; the scrollport is the\n// element where C's is the child, for the reason the element's header records.\n\nadw-clamp-scrollable {\n display: block;\n overflow: auto;\n}\n","// _spinner.scss — the two spinners: <adw-spinner> and <gtk-spinner>. ONE partial\n// because upstream merges them too (refs/libadwaita/src/stylesheet/widgets/\n// _spinner.scss styles `spinner` and `image.spinner` in the same file), and because\n// they are two answers to one question rather than two widgets.\n//\n// Almost nothing is left for <adw-spinner> on purpose. The ring is an SVG the element\n// draws per frame from `@gjsify/adwaita-core`'s `spinnerArc`, because the arc BREATHES\n// (2.7 to 102.8 degrees) and CSS cannot express that: the `border-top-color`\n// chase this file used to carry was a fixed 90-degree quarter-circle at 0.8s\n// against libadwaita's 1.2s, with a hardcoded grey track and square-cut ends.\n//\n// What CSS still owns is the box: the element is `size × size` and the ring is\n// centred inside it, which is how a 200px spinner shows a 64px ring\n// (adw-spinner.c:95-99 hands the widget's real size to the paintable, which caps\n// only the radius).\n//\n// There is deliberately NO `prefers-reduced-motion` rule for it. The C opts out of the\n// animation setting explicitly (`adw_animation_set_follow_enable_animations_setting\n// (…, FALSE)`, adw-spinner-paintable.c:537) — a frozen busy indicator reads as a\n// hang. This file used to stop the animation there.\n//\n// Reference: refs/libadwaita/src/adw-spinner.c\n// Reference: refs/libadwaita/src/adw-spinner-paintable.c\n// Reference: refs/adwaita-web/adwaita-web/scss/_spinner.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-spinner {\n // The element writes the measured box onto `style` when it upgrades; these are\n // the values in force until then, which are Adwaita's own minimum\n // (adw-spinner.c:14, reported as both minimum and natural at :78-81).\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 16px;\n height: 16px;\n // The arc strokes `currentColor` — `gtk_widget_get_color` (:432), the widget's\n // TEXT colour, never the accent. The track is the same colour at 15%, which\n // the SVG applies as `stroke-opacity`.\n color: inherit;\n\n svg {\n display: block;\n // The ring never grows past its own diameter, so an over-large box centres\n // it rather than stretching it.\n flex: none;\n }\n}\n\n// <gtk-spinner> is the GTK picture, and it is CSS's job in a way the Adw one is not:\n// `process-working-symbolic.svg` is a STATIC quarter arc on a faint ring, and all\n// `GtkSvg` does is turn it (gtkspinner.c:158-171). So the geometry is fixed here and\n// only the rotation is animated — which is why this widget needs no per-frame ticker\n// and no `spinnerArc`.\ngtk-spinner {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n // GTK measures the `icon-size` CSS property and reports it as BOTH minimum and\n // natural (gtkspinner.c:110-123); 16px is that icon's own intrinsic size.\n width: 16px;\n height: 16px;\n color: inherit;\n\n // `spinner:disabled { opacity: var(--disabled-opacity) }`\n // (refs/libadwaita/src/stylesheet/widgets/_spinner.scss:1-3).\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n .adw-spinner-ring {\n display: block;\n width: 100%;\n height: 100%;\n overflow: visible;\n }\n\n // Both strokes are `url(#gpa:foreground)` in the icon, i.e. the widget's text colour;\n // `stroke-width: 2` and round caps are the icon's own, on a 16-unit viewBox.\n .adw-spinner-track,\n .adw-spinner-arc {\n fill: none;\n stroke: currentColor;\n stroke-width: 2;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n\n // The icon's track path carries `stroke-opacity: 0.2`.\n .adw-spinner-track {\n stroke-opacity: 0.2;\n }\n\n // GTK puts the `:checked` pseudoclass on the node while `spinning` is set\n // (gtkspinner.c:59-63), which is the only thing that distinguishes the turning arc\n // from the standing one; the element writes `.checked` for exactly that.\n //\n // THE PERIOD IS THIS PORT'S. `GtkSvg` cycles the `.gpa`'s frames on the frame clock\n // and the frame count lives in the icon, not in `gtkspinner.c`, so one turn per second\n // is the honest place to land rather than a number quoted from nowhere.\n &.checked .adw-spinner-arc {\n animation: gtk-spinner-rotate 1s linear infinite;\n transform-origin: center;\n }\n\n // Under reduced motion GTK loads `sand-watch.svg` — a STATIC hourglass — instead of\n // the turning arc (gtkspinner.c:145-161). A browser has no icon loader, so the\n // equivalent is holding the arc still. Note this is the OPPOSITE of <adw-spinner>\n // above, and deliberately so.\n @media (prefers-reduced-motion: reduce) {\n &.checked .adw-spinner-arc {\n animation: none;\n }\n }\n}\n\n@keyframes gtk-spinner-rotate {\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n}\n","// _shortcut_label.scss — <adw-shortcut-label> and its keycaps.\n//\n// TWO SOURCES, AND WHY ONLY ONE IS FOLLOWED. libadwaita styles the widget in\n// `_shortcuts-dialog.scss:33-58`: a 6px `border-spacing` at both levels (between\n// the boxes AND between the keycaps inside one), keycaps filled with 10% of the\n// current colour, an inset bottom shadow that reads as a key's edge, a 6px\n// radius, 6px padding and a 20px minimum width — plus `> .dimmed { padding: 6px\n// 0 }` so a separator lines up with the caps beside it.\n//\n// `refs/adwaita-web/adwaita-web/scss/_shortcut_label.scss` styles ONE outlined\n// tag for the whole shortcut: monospace, a border, small text, and an empty\n// `kbd, .keycap {}` block with a comment saying the real thing has per-keycap\n// styling. It is a placeholder for this widget, not a port of it, so nothing is\n// taken from it — the geometry above is libadwaita's.\n//\n// The keycap fill is `currentColor`-relative, so a shortcut label inside a\n// dimmed or coloured context stays legible without a second token.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_shortcuts-dialog.scss:33-58\n// Reference: refs/adwaita-web/adwaita-web/scss/_shortcut_label.scss (NOT followed — see above)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components; GTK's\n// `border-spacing` on a box becomes flex `gap`.\n\nadw-shortcut-label {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n border-radius: 6px;\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // One combination — the keycaps of a single accelerator. Its own 6px gap is\n // the second `border-spacing` in `&, > box { border-spacing: 6px }` (:37-39).\n .adw-shortcut-label-keys {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n }\n\n .keycap {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n min-width: 20px;\n padding: 6px;\n border-radius: 6px;\n background: color-mix(in srgb, currentColor 10%, transparent);\n box-shadow: inset 0 -2px var(--card-shade-color);\n\n @media (prefers-contrast: more) {\n box-shadow:\n inset 0 -2px var(--card-shade-color),\n 0 0 0 1px var(--border-color);\n }\n }\n\n // The `L` / `R` of a sided modifier key — `%s <small><b>%s</b></small>` in the\n // C (adw-shortcut-label.c:195), i.e. smaller and bold, riding along inside the\n // same keycap rather than being a cap of its own.\n .adw-shortcut-label-side {\n margin-inline-start: 2px;\n font-size: 82%;\n font-weight: 700;\n // `<sub>` lowers the baseline by default; the marker is part of the key's\n // label, not a subscript of a formula.\n vertical-align: baseline;\n bottom: 0;\n }\n\n // `> .dimmed { padding: 6px 0 }` (:55-57) — the separators and the\n // disabled-text placeholder, aligned with the keycaps' text.\n > .dimmed {\n padding: 6px 0;\n }\n}\n","// _avatar.scss — adw-avatar styling (round, initials or fallback icon).\n// Reference: refs/adwaita-web/adwaita-web/scss/_avatar.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_avatar.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-avatar {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n border-radius: 50%;\n overflow: hidden;\n box-sizing: border-box;\n font-weight: 700;\n user-select: none;\n background-color: rgba(127, 127, 127, 0.25);\n color: var(--window-fg-color);\n\n .adw-avatar-text {\n line-height: 1;\n text-align: center;\n }\n\n .adw-avatar-icon {\n background-color: currentColor;\n opacity: 0.7;\n -webkit-mask-size: contain;\n mask-size: contain;\n }\n\n // `custom-image`. The avatar's own `border-radius: 50%` + `overflow: hidden`\n // already clip it, so the image only has to FILL the box — `cover`, not\n // `contain`, because GTK scales the paintable to the widget and crops inside a\n // rounded clip, where `contain` would letterbox a non-square photo inside the\n // circle.\n .adw-avatar-custom-image {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n}\n","// _banner.scss — adw-banner styling (full-width accent message strip).\n// Reference: refs/adwaita-web/adwaita-web/scss/_banner.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (AdwBanner)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-banner {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--spacing-m);\n padding: var(--spacing-xs) var(--spacing-m);\n width: 100%;\n box-sizing: border-box;\n // Adw.Banner uses a neutral elevated surface, not the accent colour.\n background-color: var(--sidebar-bg-color);\n color: var(--window-fg-color);\n\n // Adw.Banner stays hidden until revealed.\n &:not(.revealed) {\n display: none;\n }\n\n // The title is a `.heading` label and the button a plain GTK text button\n // (adw-banner.ui:25, :29), so the title is bold and the button 34px tall with the 17px\n // `.text-button` sides. Both were lighter here, and the banner stood 8px shorter than\n // GTK's render of the gallery's banner `.blp`.\n .adw-banner-title {\n flex: 1 1 auto;\n min-width: 0;\n font-size: var(--font-size-base);\n font-weight: 700;\n }\n\n .adw-banner-button {\n flex-shrink: 0;\n box-sizing: border-box;\n min-height: 34px;\n border: none;\n border-radius: var(--button-radius);\n padding: 5px 17px;\n background: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n cursor: pointer;\n\n &:hover {\n background: var(--button-hover-color);\n }\n\n // `button-style` (Since 1.7). ADW_BANNER_BUTTON_SUGGESTED adds\n // `.suggested-action` to the banner button (adw-banner.c:769), which is the\n // shared accent appearance — the same declaration `.adw-button.suggested-action`\n // carries, restated here because the banner button is not an `.adw-button`.\n &.suggested-action {\n background: var(--accent-bg-color);\n color: var(--accent-fg-color);\n\n &:hover {\n background: var(--accent-color);\n }\n }\n }\n}\n","// _status_page.scss — adw-status-page styling (centered empty state).\n// Reference: refs/adwaita-web/adwaita-web/scss/_status_page.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss (AdwStatusPage)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// THE METRICS ARE UPSTREAM'S, measured against a GTK render of the gallery's status page\n// `.blp`. They were the vendored web port's — a 96px icon, an 18pt title, the description\n// capped at 32ch and 12px gaps all round — and beside GTK the page was a different\n// composition: the description wrapped at 290px where GTK sets it on one line, and the child\n// sat 61px higher. `_misc.scss` (statuspage) has a 36px 12px margin, 12px between icon,\n// title and description, 24px more under the icon, `.title-1` for the title and 36px\n// between that column and the child; `adw-status-page.ui` clamps the column at AdwClamp's\n// default 600px.\nadw-status-page {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n text-align: center;\n gap: 12px;\n padding: 36px 12px;\n color: var(--window-fg-color);\n\n .adw-status-page-icon {\n width: 128px;\n height: 128px;\n margin-bottom: 24px;\n background-color: currentColor;\n opacity: 0.45;\n -webkit-mask-size: contain;\n mask-size: contain;\n }\n\n // `.title-1` (`_labels.scss`), restated: each partial compiles on its own, so an\n // `@extend` across them finds no target.\n .adw-status-page-title {\n font-weight: 800;\n font-size: 181%;\n max-width: 600px;\n }\n\n .adw-status-page-description {\n font-size: var(--font-size-base);\n opacity: var(--dim-opacity);\n max-width: 600px;\n }\n\n // 36px from the column, of which the flex gap already gives 12.\n .adw-status-page-child {\n margin-top: 24px;\n }\n\n // `.compact` — the documented smaller status page, for a sidebar or a popover\n // (style-classes.md \"Compact Status Page\"): margins 24px 12px, the icon 96px with 12px\n // under it, `.title-2`, and 12px to the child (`_misc.scss`, statuspage.compact).\n &.compact {\n padding: 24px 12px;\n\n .adw-status-page-icon {\n width: 96px;\n height: 96px;\n margin-bottom: 12px;\n }\n\n .adw-status-page-title {\n font-size: 136%;\n }\n\n .adw-status-page-child {\n margin-top: 12px;\n }\n }\n}\n","// _row.scss — Shared base styling for rows in preferences groups.\n// Reference: refs/adwaita-web/adwaita-web/scss/_row_types.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (AdwActionRow, row.entry)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-switch-row,\nadw-combo-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-height: 54px;\n padding: 0 var(--spacing-m);\n gap: var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n}\n\n// A `tooltip-text` part must cover the ROW, not just the label text inside it: the browser\n// resolves a tooltip by walking UP from the hovered node, so a part that stops at the text's\n// own height lets the walk reach the host — whose `title` is the row's LABEL — over the rest\n// of the widget. Measured on a 54px `adw-action-row`: the label text is 18px of it. The\n// marker is `applyRowTooltip`'s (`src/row-tooltip.ts`); stretching changes nothing drawn,\n// because these columns centre their own children.\n[data-row-tooltip] {\n align-self: stretch;\n}\n\n// Shared title/subtitle text column used by every row type (action/switch/\n// combo/spin). The title is the primary label; the subtitle is dimmed and\n// hidden when empty.\n.adw-row-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n}\n\n// NO `.adw-row-title` default HERE, deliberately. `.adw-row-title` is also the class\n// `<adw-entry-row>` and `<adw-preferences-row>` put on their titles, so a global\n// `white-space: nowrap` here silently made those two rows un-wrapping too — a change\n// to row types this feature was never scoped to. Each row type that wants a wrapping\n// title says so in its own partial at its own specificity (see `_action_row.scss`,\n// `_expander_row.scss`); a global default can only ever be the losing side of that.\n.adw-row-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--card-fg-color);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n// Trailing edit pencil shared by editable rows (entry/password) — the\n// Adw.EntryRow edit affordance. Dimmed; clicking focuses the entry.\n//\n// The BOX is upstream's, rule for rule: `row.entry > .editable-area > .edit-icon`\n// (_lists.scss:194-196) is a 24px floor with 5px of padding around the glyph inside it. The\n// glyph stays 16px and centred here (`.adw-icon` centres its mask), so the box settles at\n// exactly that 24px — GTK's own measures 40x34 because the toolkit's `adw-entry-edit-symbolic`\n// is 30x24. That gap is the theme's ICON SIZE, not this rule.\n//\n// NOT PORTED from the same block, each for a reason rather than for want of a selector:\n// · the 6px margin-start on `.edit-icon` (:198-200). These rows already keep the pencil off\n// the text with `gap: var(--spacing-m)` = 12px, which is upstream's own arithmetic — 6px\n// of `.editable-area` padding plus this 6px — so adding the margin would make it 18px.\n// · the same 24px box on `.indicator`, which is only on the host through a per-subclass\n// class (`${prefix}-indicator`); the caps-lock warning it belongs to needs a real Caps\n// Lock source, which this port has no event for.\n.adw-row-edit {\n flex-shrink: 0;\n min-width: 24px;\n min-height: 24px;\n padding: 5px;\n color: var(--card-fg-color);\n opacity: 0.55;\n cursor: pointer;\n}\n\n// Utility separator (used by content layouts)\n.adw-separator-vertical {\n width: 1px;\n align-self: stretch;\n background-color: var(--card-shade-color);\n flex-shrink: 0;\n}\n","// _action_row.scss — adw-action-row styling (title/subtitle + prefix/suffix).\n// Reference: refs/adwaita-web/adwaita-web/scss/_action_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-action-row,\nadw-switch-row,\nadw-combo-row,\nadw-spin-row {\n // These row types inherit from AdwActionRow upstream and have\n // title-lines/subtitle-lines properties. Match libadwaita: wrap by default\n // (GtkLabel with wrap=true, lines=0), clamp via CSS custom property when\n // title-lines/subtitle-lines > 0. See adw-action-row.ui lines 54-61, 70-81.\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 54px;\n padding: 0 var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n color: var(--card-fg-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n &.activatable {\n cursor: pointer;\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n .adw-action-row-prefix,\n .adw-action-row-suffix,\n .adw-switch-row-prefix {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n flex-shrink: 0;\n }\n\n // The text column's own rule is `_row.scss`'s shared `.adw-row-text` — one spelling\n // for all five rows, so the clamp selectors below can name it too.\n\n // Title/subtitle WRAP BY DEFAULT, matching libadwaita's GtkLabel wrap=true,\n // lines=0. The typography is this row type's own (it was here before the wrap); only\n // `white-space` moves, and `overflow`/`text-overflow` are left to the clamped state\n // below, where the ellipsis has a line count to truncate to.\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n .adw-row-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n // Clamped state — enabled by JS toggling .adw-row-clamp on the text container.\n .adw-row-text.adw-row-clamp {\n .adw-row-title,\n .adw-row-subtitle {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: var(--adw-row-ellipsize-overflow, ellipsis);\n }\n\n .adw-row-title {\n -webkit-line-clamp: var(--adw-row-title-lines, 1);\n }\n\n .adw-row-subtitle {\n -webkit-line-clamp: var(--adw-row-subtitle-lines, 1);\n }\n }\n}\n\n// `.property` SWAPS the emphasis of a row: the title becomes the small dimmed\n// label and the subtitle carries the value at full weight — a read-only property\n// rather than an action (style-classes.md \"Property Rows\", `_lists.scss:426-455`).\n//\n// It is written against the shared `.adw-row-title` / `.adw-row-subtitle` nodes,\n// so it works on every row type that renders them (action, expander header,\n// entry, switch), which is the same reach upstream gives it.\nadw-action-row.property,\nadw-expander-row.property {\n .adw-row-title {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n }\n\n .adw-row-subtitle {\n font-size: var(--font-size-base);\n opacity: 1;\n }\n\n // `.monospace` on a property row monospaces the VALUE only — the label and any\n // suffix widget stay in the UI font (`_lists.scss:445-455`). Put `.monospace`\n // on the list instead to get all of it.\n &.monospace {\n font-family: inherit;\n font-size: inherit;\n\n .adw-row-subtitle {\n font-family: var(--monospace-font-family);\n font-size: var(--monospace-font-size);\n }\n }\n}\n","// _entry_row.scss — adw-entry-row styling (inline editable boxed-list row).\n// Reference: refs/adwaita-web/adwaita-web/scss/_entry_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-entry-row {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 50px;\n padding: 0 var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n // Focus ring matching libadwaita's row focus (inset accent outline).\n &:focus-within {\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n // Filled Adw.EntryRow layout: a small floating title above the value,\n // both left-aligned in a column.\n .adw-entry-row-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n gap: 1px;\n }\n\n .adw-row-title {\n font-size: var(--font-size-small);\n color: var(--card-fg-color);\n opacity: var(--dim-opacity);\n }\n\n .adw-entry-row-input {\n width: 100%;\n min-width: 0;\n border: none;\n background: transparent;\n color: var(--card-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: left;\n outline: none;\n padding: 0;\n }\n}\n","// _switch_row.scss — adw-switch-row styling.\n//\n// The TOGGLE is not here: it is `<gtk-switch>` and `scss/_switch.scss`. It used\n// to be, nested under `adw-switch-row {`, which is exactly why `.adw-switch` was\n// unreachable from anywhere else and `_expander_row.scss` grew a\n// character-for-character copy of it.\n//\n// Reference: refs/adwaita-web/adwaita-web/scss/_switch_row.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-switch-row {\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n }\n\n // Adw.SwitchRow is an AdwActionRow upstream (adw-switch-row.c:50), so it inherits\n // `add_prefix` and the box that carries it. Same rules as `.adw-action-row-prefix`:\n // a fixed-size icon must not be squeezed by the text column, which grows.\n .adw-switch-row-prefix {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n flex-shrink: 0;\n }\n}\n","// _combo_row.scss — adw-combo-row styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_combo_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (AdwComboRow)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-combo-row {\n position: relative;\n cursor: pointer;\n\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n pointer-events: none;\n }\n\n // Hidden <select> overlay — stretches across the row to capture clicks\n // anywhere. The visual dropdown arrow is rendered by .adw-row-value::after\n // below, so the select itself doesn't need a background image.\n select {\n appearance: none;\n -webkit-appearance: none;\n background-color: transparent;\n border: none;\n padding: 6px 24px 6px 8px;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n cursor: pointer;\n text-align: right;\n position: absolute;\n inset: 0;\n opacity: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -1px;\n }\n\n option {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n }\n }\n\n .adw-row-value {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n opacity: var(--dim-opacity);\n display: flex;\n align-items: center;\n gap: 4px;\n\n // Dropdown arrow — rendered via CSS mask so `currentColor` drives the\n // fill, making the icon theme-aware (matches libadwaita's dark theme).\n // Using background-image with a data-URI SVG would NOT resolve\n // `currentColor` in most browsers.\n //\n // `model_changed` (adw-combo-row.c:187-195) hides the arrow box entirely on\n // a model of one item or none, so the row stops presenting itself as a\n // chooser. `[data-presents-chooser='false']` below is that rule; the element\n // publishes the attribute and disables the overlaid <select> alongside.\n &::after {\n content: \"\";\n display: inline-block;\n width: 12px;\n height: 12px;\n background-color: currentColor;\n -webkit-mask-image: var(--icon-go-down);\n mask-image: var(--icon-go-down);\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-size: contain;\n mask-size: contain;\n -webkit-mask-position: center;\n mask-position: center;\n }\n }\n}\n\n// A model with one item or none: no arrow, and the row is not activatable\n// (`model_changed`, adw-combo-row.c:187-195). Written as its own block rather\n// than a modifier inside `.adw-row-value` so the two selectors that draw the\n// arrow and the one that removes it read at the same specificity depth.\nadw-combo-row[data-presents-chooser='false'] {\n .adw-row-value::after {\n display: none;\n }\n\n select {\n cursor: default;\n }\n}\n","// _spin_row.scss — adw-spin-row styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_spin_button.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_spin-button.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (the `row.spin` block,\n// :241-275, which is what the two stepper buttons are)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n//\n// NOT PORTED, and why:\n// - `%button_basic`'s focus ring (`_buttons.scss:25`). `row.spin`'s OWN rule already\n// takes the ring away from the entry (`&, &:focus { outline: none }`, :246-248) and\n// asks the ROW to draw one instead (`row.entry, row.spin { @include focus-ring(...) }`,\n// :277-279), so a per-button ring would double it.\n// - `&:disabled { filter: Opacity(var(--disabled-opacity)) }` and the\n// `&:disabled spinbutton > button… { filter: none }` that cancels it for these two\n// buttons (:264-274). The port's steppers never get disabled: `AdwSpinRow` clamps at\n// the bounds instead, and there is no `.disabled` to filter.\n// - `font-weight: bold` from `%button_basic` (:23) — the glyphs here are text nodes, and\n// `+`/`−` at bold weight is a different glyph size, not a bolder one.\n// - The ENTRY still differs from upstream and is left alone here: `row.spin spinbutton`\n// sets `background: none; box-shadow: none` (:242-244), so the native row's number\n// field is flat card white, while `.adw-spin-control input` below still paints a\n// 10% grey fill and a 9px radius. A native pixel run over the row finds nothing but\n// white between the title and the first stepper. That is the input's deviation, not\n// the steppers', and it is a separate fix.\n\nadw-spin-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-height: 54px;\n padding: 0 var(--spacing-m);\n gap: var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n }\n}\n\n.adw-spin-control {\n display: flex;\n align-items: center;\n // `border-spacing: 6px` (refs/libadwaita/src/stylesheet/widgets/_lists.scss:242). GTK\n // spreads the spinbutton's three boxes with it, so this is the 6px between the entry and\n // the first stepper AND the 6px between the two — which, with the 2px margins below,\n // is the 10px the native circles actually stand apart.\n gap: 6px;\n\n // `row.spin spinbutton > button.image-button.up/.down` (_lists.scss:250-262) extends\n // `%button_basic` AND `%circular_button` (_buttons.scss:19-27, :312-320). It was a\n // 32px rounded SQUARE on a transparent background, so both steppers read as flat\n // 32px squares beside a GTK render of the same `.blp`. Measured natively\n // (Adw.SpinRow, libadwaita 1.9.3, light, `Adw.PreferencesGroup` capture): each button is\n // allocated 34x50 with min = nat, its painted area a 30px circle of flat\n // rgb(235,235,235) with an rgb(47,47,52) glyph. 34x50 = the 30px floor plus\n // `margin: 10px 2px`; and in a 54px row those margins put the circle at y=12..41,\n // which is exactly where the native capture paints it.\n button {\n // A FLOOR, not a size: upstream sets `min-width`/`min-height`, and a glyph wider than\n // 30px grows the circle rather than overflowing it.\n min-width: 30px;\n min-height: 30px;\n margin: 10px 2px;\n padding: 0;\n border: none;\n // `%circular_button`'s `border-radius: 9999px`, beating `%button_basic`'s\n // `var(--button-radius)`, which is what the 32px square drew before.\n border-radius: 9999px;\n // `%button_basic` pulls in `%button_basic_raised`'s background through the same nested\n // `@at-root`, so these buttons are FILLED at rest — this is upstream's\n // `$button_color` (_buttons.scss:1), the mix that resolves to the measured 235.\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n color: var(--card-fg-color);\n cursor: pointer;\n font-size: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n\n // `$button_hover_color` / `$button_active_color` (_buttons.scss:2-3). The rest state\n // was transparent, so only the hover existed before and it was an unblended grey.\n &:hover {\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n input {\n width: 56px;\n text-align: center;\n border: none;\n border-radius: var(--button-radius);\n background: rgba(128, 128, 128, 0.1);\n color: var(--card-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n padding: 4px 2px;\n\n &:focus {\n outline: 2px solid var(--accent-color);\n outline-offset: -1px;\n }\n }\n}\n","// _button_row.scss — adw-button-row styling (a boxed-list row that acts as a\n// button: centered title + optional start icon, with suggested/destructive\n// recoloring).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (row.button)\n// Reference: refs/adwaita-web/adwaita-web/scss/_button_row.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-button-row {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n // libadwaita: `row.button > box { min-height: 40px; margin: 0 12px }` (_lists.scss:458-462),\n // and the row around it measures 44 in a GTK render of the gallery's button-row `.blp`.\n // It was a plain row's 50 here, so the button row stood 6px taller than GTK's.\n min-height: 44px;\n padding: 0 var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n color: var(--card-fg-color);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n &:last-child {\n border-bottom: none;\n }\n\n // Contents are centered as a group (libadwaita's GtkBox halign:center), with\n // the start icon hugging the title via a small gap (border-spacing 6px).\n .adw-button-row-contents {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n min-width: 0;\n // The row centres its one button (`justify-content: center` above), so without this the\n // contents box is exactly as wide as the button and `tooltip-text` reaches only that\n // much of the row. Growing it and letting its own `justify-content: centre` do the\n // centring draws the same button in the same place.\n flex: 1 1 auto;\n }\n\n .adw-button-row-title {\n font-size: var(--font-size-base);\n font-weight: 700;\n text-align: center;\n color: inherit;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // Default (no style class): button-like hover/active feedback.\n &.activatable {\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Suggested action — accent-coloured, full-bleed (no separator line).\n &.suggested-action {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n border-bottom: none;\n\n &.activatable {\n &:hover {\n background-color: var(--accent-bg-color);\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 10%, transparent),\n color-mix(in srgb, currentColor 10%, transparent)\n );\n }\n\n &:active {\n background-color: var(--accent-bg-color);\n background-image: linear-gradient(rgba(0, 0, 6, 0.2), rgba(0, 0, 6, 0.2));\n }\n }\n }\n\n // Destructive action — red, same full-bleed treatment as suggested.\n &.destructive-action {\n background-color: var(--destructive-bg-color);\n color: var(--destructive-fg-color);\n border-bottom: none;\n\n &.activatable {\n &:hover {\n background-color: var(--destructive-bg-color);\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 10%, transparent),\n color-mix(in srgb, currentColor 10%, transparent)\n );\n }\n\n &:active {\n background-color: var(--destructive-bg-color);\n background-image: linear-gradient(rgba(0, 0, 6, 0.2), rgba(0, 0, 6, 0.2));\n }\n }\n }\n}\n","// _expander_row.scss — adw-expander-row styling (disclosure header + nested rows).\n// Reference: refs/adwaita-web/adwaita-web/scss/_expander_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (AdwExpanderRow)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-expander-row {\n display: block;\n border-bottom: 1px solid var(--card-shade-color);\n color: var(--card-fg-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n // Header — styled like an activatable action row.\n .adw-expander-row-header {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 50px;\n padding: var(--spacing-s) var(--spacing-m);\n cursor: pointer;\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Title/subtitle WRAP BY DEFAULT, matching libadwaita's GtkLabel wrap=true,\n // lines=0 — stated HERE, at this row's own specificity, because `_row.scss` carries\n // a `white-space: nowrap` default for `.adw-row-subtitle` and an inherited one reaches\n // the title. A rule that only turns `white-space` on inside the clamp selector cannot\n // make a row wrap by DEFAULT: the clamp is the minority state.\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n .adw-row-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n // Clamped state — JS toggles `.adw-row-clamp` on the TEXT COLUMN, the same node and\n // the same class `_action_row.scss` keys off; reading it off the header instead never\n // matched anything.\n .adw-row-text.adw-row-clamp {\n .adw-row-title,\n .adw-row-subtitle {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: var(--adw-row-ellipsize-overflow, ellipsis);\n }\n\n .adw-row-title {\n -webkit-line-clamp: var(--adw-row-title-lines, 1);\n }\n\n .adw-row-subtitle {\n -webkit-line-clamp: var(--adw-row-subtitle-lines, 1);\n }\n }\n\n // The text column takes the free space so prefix/suffix widgets, the enable\n // switch and the chevron sit at their respective edges.\n .adw-expander-row-header > .adw-row-text {\n flex: 1;\n min-width: 0;\n }\n\n // Header prefix / suffix widget slots (Adw.ExpanderRow add_prefix/add_suffix).\n .adw-expander-row-prefix,\n .adw-expander-row-suffix {\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n flex-shrink: 0;\n }\n\n // Disclosure chevron — points down when collapsed, flips up when expanded,\n // matching libadwaita's Adw.ExpanderRow arrow.\n .adw-expander-row-chevron {\n opacity: var(--dim-opacity);\n transform: rotate(0deg);\n transition: transform 0.2s ease-out;\n flex-shrink: 0;\n }\n\n &.expanded .adw-expander-row-chevron {\n transform: rotate(180deg);\n }\n\n // The optional enable switch is `<gtk-switch>` and needs no geometry of its\n // own — `.adw-expander-row-enable-switch` is a query/override hook only. This\n // block used to be a character-for-character copy of the switch row's toggle\n // (44×24 box, hidden input, 20px knob, translateX(20px), focus ring), because\n // `.adw-switch` was nested inside `adw-switch-row {` and unreachable from here.\n\n // Disclosed content — a nested listbox of rows, hidden until expanded. The\n // nested surface is slightly inset/recessed, the way libadwaita draws it.\n .adw-expander-row-content {\n display: none;\n flex-direction: column;\n background-color: var(--window-bg-color);\n border-top: 1px solid var(--card-shade-color);\n\n &.expanded {\n display: flex;\n }\n\n // Nested rows: indent the text column and keep the hairline separators,\n // dropping the last one (the content area's own edge closes it off).\n > adw-action-row,\n > adw-entry-row,\n > adw-switch-row,\n > adw-combo-row,\n > adw-spin-row {\n padding-left: var(--spacing-xl);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n }\n }\n}\n","// _password_entry_row.scss — adw-password-entry-row styling (masked entry row\n// with a trailing peek toggle). Mirrors _entry_row.scss (the password row is a\n// specialization of the entry row) and adds the flat peek button.\n// Reference: refs/adwaita-web/adwaita-web/scss/_entry_row.scss (no password variant upstream)\n// Reference: refs/libadwaita/src/adw-password-entry-row.c\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-password-entry-row {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 50px;\n padding: var(--spacing-xs) var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n // Focus ring matching libadwaita's row focus (inset accent outline).\n &:focus-within {\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n // Filled Adw.EntryRow layout: a small floating title above the value,\n // both left-aligned in a column.\n .adw-password-entry-row-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n gap: 1px;\n }\n\n .adw-row-title {\n font-size: var(--font-size-small);\n color: var(--card-fg-color);\n opacity: var(--dim-opacity);\n }\n\n .adw-password-entry-row-input {\n width: 100%;\n min-width: 0;\n border: none;\n background: transparent;\n color: var(--card-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: left;\n outline: none;\n padding: 0;\n\n // Slightly wider tracking for the masked dots, like the native entry.\n &[type='password'] {\n letter-spacing: 0.125em;\n }\n }\n\n // Trailing peek toggle — flat circular icon button, vertically centred.\n .adw-password-entry-row-toggle {\n flex-shrink: 0;\n align-self: center;\n }\n}\n","// _toast.scss — adw-toast and adw-toast-overlay styling.\n// adw-toast-overlay wraps content and layers transient `.adw-toast` banners over\n// the bottom of its own bounds (the Adw.ToastOverlay model). Each banner carries\n// a title, an optional action button and a CSS-drawn \"×\" close button, and slides\n// up on show / down on dismiss (mirroring Adw.Toast).\n// Reference: refs/adwaita-web/adwaita-web/scss/_toast.scss\n// Reference: refs/adwaita-web/adwaita-web/scss/_toast_overlay.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss (Toasts)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-toast-overlay {\n position: relative;\n display: block;\n\n // The wrapped content (Adw.ToastOverlay :child) occupies the overlay's box.\n .adw-toast-overlay-content {\n width: 100%;\n height: 100%;\n }\n\n // The toast slot: layered over the bottom edge of the overlay and centered,\n // the way AdwToastOverlay floats a toast above its child. Like\n // Adw.ToastOverlay only ONE toast is mounted at a time (the queue lives in\n // `@gjsify/adwaita-core`); the flex column keeps it centered and lets an\n // outgoing `.hiding` strip finish its exit transition in place.\n .adw-toast-overlay-toasts {\n position: absolute;\n bottom: var(--spacing-m);\n left: 50%;\n transform: translateX(-50%);\n z-index: 9999;\n display: flex;\n flex-direction: column-reverse;\n gap: var(--spacing-s);\n align-items: center;\n pointer-events: none;\n }\n}\n\n.adw-toast {\n background-color: #3d3846;\n color: #ffffff;\n padding: var(--spacing-s) var(--spacing-m);\n border-radius: var(--card-radius);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.25);\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n width: max-content;\n max-width: 400px;\n min-height: 36px;\n pointer-events: auto;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n\n opacity: 0;\n transform: translateY(100%) scale(0.9);\n transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1),\n transform 0.2s cubic-bezier(0, 0, 0.2, 1);\n will-change: transform, opacity;\n\n &.visible {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n &.hiding {\n opacity: 0;\n transform: translateY(100%) scale(0.9);\n transition-duration: 0.15s;\n transition-timing-function: cubic-bezier(0.4, 0, 1, 1);\n }\n\n .adw-toast-content-wrapper {\n flex: 1 1 auto;\n min-width: 0;\n }\n\n .adw-toast-title {\n font-weight: normal;\n line-height: 1.3;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // Action button — a flat pill tinted with the accent color so it reads as\n // suggested against the dark toast surface (Adw.Toast:button-label).\n .adw-toast-action-button {\n flex-shrink: 0;\n box-sizing: border-box;\n margin: 0;\n padding: 4px var(--spacing-m);\n border: none;\n border-radius: var(--button-radius);\n background-color: rgba(255, 255, 255, 0.12);\n color: #ffffff;\n font-family: inherit;\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: rgba(255, 255, 255, 0.2);\n }\n\n &:active {\n background-color: rgba(255, 255, 255, 0.26);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n\n // Close affordance — `window-close-symbolic` in a 24px circle, as upstream builds it\n // (adw-toast-widget.ui:64). The element supplies the <gtk-image>; this only places it.\n .adw-toast-close-button {\n box-sizing: border-box;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 9999px;\n background-color: transparent;\n color: #ffffff;\n cursor: pointer;\n opacity: 0.7;\n transition:\n background-color 150ms ease-in-out,\n opacity 150ms ease-in-out;\n\n &:hover {\n opacity: 1;\n background-color: rgba(255, 255, 255, 0.12);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n}\n","// _toolbar_view.scss — adw-toolbar-view styling (content framed by top/bottom bars).\n// Reference: refs/adwaita-web/adwaita-web/scss/_toolbar_view.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-toolbar-view {\n display: flex;\n flex-direction: column;\n min-height: 0;\n min-width: 0;\n flex: 1 1 auto;\n // Positioning context for the extend-content-to-*-edge overlays below.\n position: relative;\n\n .adw-toolbar-view-top,\n .adw-toolbar-view-bottom {\n flex-shrink: 0;\n display: flex;\n flex-direction: column;\n }\n\n .adw-toolbar-view-content {\n flex: 1 1 auto;\n min-height: 0;\n min-width: 0;\n overflow: auto;\n display: flex;\n flex-direction: column;\n background-color: var(--window-bg-color);\n }\n\n // THE CONTENT WIDGET FILLS THE CONTENT RECT. `adw_toolbar_view_size_allocate`\n // (adw-toolbar-view.c:390-397) hands `self->content` the whole rect between the\n // bars, and a GTK widget that wants less of it says so through its own\n // alignment. This port collects the content into a flex COLUMN, where an item\n // declaring no `flex-grow` is content-sized instead, so the child stopped\n // wherever its content did and the pane below it stayed empty. Measured on the\n // docs Navigation Split View preview: a 293px sidebar pane holding a 176px\n // `adw-sidebar`, i.e. 117px of window-coloured dead strip under the last row,\n // and beside it a status page top-aligned in a pane it was supposed to centre in.\n // The web storybook had been papering over it in its own sheet\n // (`.sb-sidebar-scroll { flex: 1 1 auto }`), deleted now that the widget carries\n // it: a per-consumer copy is what a missing widget rule looks like from the\n // outside, and it keeps the widget green while the next consumer hits the same\n // wall.\n //\n // `:only-child` because Adw.ToolbarView HAS one content widget. Several stacked\n // children are this port's own extension, and GTK defines no distribution for\n // them, so inventing one here would be a claim rather than a copy.\n //\n // NO `min-height: 0` alongside it, deliberately: the automatic minimum size is\n // already the right answer per child. A scroller (`adw-sidebar`, any\n // `overflow: auto` box) gets an automatic minimum of 0 and shrinks to scroll\n // itself, as its GtkScrolledWindow would; a status page keeps its content-based\n // minimum, so a pane too short to hold it scrolls THIS box instead of crushing a\n // centred column into overflow its reader cannot scroll back up to.\n .adw-toolbar-view-content > :only-child {\n flex: 1 1 auto;\n }\n\n // …UNLESS IT ASKED FOR LESS. A content widget with a `valign` other than fill is\n // allocated its natural height and placed by that alignment (`_widget.scss`'s auto\n // margin), which a growing flex item cannot be: the grow claims the free space before\n // an auto margin sees any. Measured on the gallery's navigation view, whose `.blp`\n // centres a pill button in a toolbar view: GTK drew it 44px tall mid-pane, this port\n // stretched it over the whole 293px content rect.\n .adw-toolbar-view-content > :only-child:is([valign='start'], [valign='end'], [valign='center']) {\n flex-grow: 0;\n }\n\n // top-bar-style / bottom-bar-style: an opaque background plus a persistent\n // shadow, which `.border` swaps for a hairline (adw-toolbar-view.c:1011-1024,\n // _toolbars.scss `> .top-bar.raised`).\n .adw-toolbar-view-top.raised,\n .adw-toolbar-view-bottom.raised {\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n }\n\n .adw-toolbar-view-top.raised {\n box-shadow:\n 0 1px var(--headerbar-shade-color),\n 0 2px 4px var(--headerbar-shade-color);\n\n &.border {\n box-shadow: 0 1px var(--headerbar-shade-color);\n }\n }\n\n .adw-toolbar-view-bottom.raised {\n box-shadow:\n 0 -1px var(--headerbar-shade-color),\n 0 -2px 4px var(--headerbar-shade-color);\n\n &.border {\n box-shadow: 0 -1px var(--headerbar-shade-color);\n }\n }\n\n // A bar in a toolbar view is INLINE — `%headerbar-inline` → `%headerbar-flat`:\n // no background of its own, no separator, the content's foreground\n // (_toolbars.scss :313-317, _header-bar.scss :110-147). That is what makes a\n // flat-style view read as ONE surface with the bar sitting in it rather than as\n // a bar bolted on top of a pane, and it is why the shading below is the ONLY\n // thing that ever draws a line between them.\n //\n // Not folded into `%headerbar` itself: a header bar used as a WINDOW titlebar\n // keeps its own background and shade, which is what `adw-header-bar` outside a\n // toolbar view still renders.\n .adw-toolbar-view-top,\n .adw-toolbar-view-bottom {\n &:not(.raised) adw-header-bar {\n background: none;\n color: inherit;\n box-shadow: none;\n }\n }\n\n // The scroll shading under a FLAT bar belongs to the SCROLLER, not to the view:\n // upstream's selector is `toolbarview.undershoot-top scrolledwindow`, and GTK\n // draws that node only while the scroller is off the edge. Drawn from the view\n // instead — which is what this did — the fade is unconditional, so every flat\n // bar sat behind a permanent hairline that native shows only after scrolling.\n // `_scrolling.scss` + `src/scroll-shading.ts` now own it, per scroller.\n}\n\n// extend-content-to-*-edge: the content spans the full height and the bar is\n// drawn OVER it, which is `content_offset = 0` / `content_height = height` in\n// adw_toolbar_view_size_allocate (adw-toolbar-view.c:390-397).\nadw-toolbar-view[extend-content-to-top-edge] > .adw-toolbar-view-top,\nadw-toolbar-view[extend-content-to-bottom-edge] > .adw-toolbar-view-bottom {\n position: absolute;\n left: 0;\n right: 0;\n}\n\nadw-toolbar-view[extend-content-to-top-edge] > .adw-toolbar-view-top {\n top: 0;\n}\n\nadw-toolbar-view[extend-content-to-bottom-edge] > .adw-toolbar-view-bottom {\n bottom: 0;\n}\n","// _scrollbar.scss — <gtk-scrollbar>: libadwaita's trough, slider and the two overlay\n// variants, with GTK's `range` level collapsed.\n//\n// THE SELECTOR REWRITE, and why it is not a guess. libadwaita addresses\n// `scrollbar > range > trough > slider` (`_scrolling.scss:6-8`) because `GtkScrollbar` builds\n// a `GtkRange` and parents it to itself (gtkscrollbar.c:263-278). There is no `<gtk-range>`\n// element in this package — `Gtk.Range` is the ancestor of `GtkScale` and `Gtk.Scrollbar` and\n// is documented through them — so the trough-and-slider pair IS the node below the range and\n// the two class names stand in for the two GTK nodes. Everything else is upstream's\n// declaration in upstream's order: the trough's `margin: 9px` (and the 8px it gives back on\n// the cross axis, `_scrolling.scss:38-48`), the slider's `$_slider_width: 8px`, its\n// `border: 8px solid transparent` with `background-clip: padding-box` — which is how an 8px\n// dot becomes a 24px pill — and the `$_slider_min_length: 40px` floor.\n//\n// THE BAR'S BOX IS THE TROUGH'S MARGINS, 24px on the cross axis, and the slider's negative\n// margin is what centres it: the border box is 24px where the trough is 8px, so\n// `top: 0; margin-top: -8px` puts the visible 8px exactly on the trough. `GtkScrollbar`\n// measures its range to the trough's size and its own allocation is what is left, so the\n// numbers here are the same ones GTK adds up.\n//\n// THE SLIDER'S LENGTH IS COMPUTED, not written here. `gtk_range_compute_slider_position`\n// derives it from `page_size / (upper - lower)` and its position from\n// `(value - lower) / (upper - lower - page_size)`, and the element writes both as\n// `--adw-scrollbar-size` / `--adw-scrollbar-position` in px. That is why the slider is\n// absolutely positioned rather than sized by a percentage: the two fractions have DIFFERENT\n// denominators, and a percentage of the trough is the wrong unit for either.\n//\n// `--scrollbar-outline-color` is upstream's own token and this package does not define it,\n// so every use falls back to the window foreground — the outline exists to keep an overlay\n// indicator legible over whatever is beneath it, which is the job the foreground does.\n\n$_slider_min_length: 40px;\n$_slider_width: 8px;\n$_scrollbar_transition: all 200ms linear;\n\ngtk-scrollbar {\n position: relative;\n display: block;\n flex: none;\n color: var(--window-fg-color);\n touch-action: none;\n\n // The cross axis, which is the trough's own 8px plus the 8px margin on each side.\n &.horizontal {\n height: $_slider_width + 16px;\n }\n\n &.vertical {\n width: $_slider_width + 16px;\n }\n\n // `> range > trough` — the trough is the whole node and the slider rides inside it.\n .adw-scrollbar-trough {\n position: absolute;\n margin: 9px;\n border-radius: 99px;\n transition: $_scrollbar_transition;\n\n > .adw-scrollbar-slider {\n position: absolute;\n min-width: $_slider_width;\n min-height: $_slider_width;\n margin: -8px;\n border: 8px solid transparent;\n border-radius: 99px;\n background-clip: padding-box;\n transition: $_scrollbar_transition;\n background-color: color-mix(in srgb, currentColor 20%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 60%, transparent);\n }\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 60%, transparent);\n }\n\n &:active {\n background-color: currentColor;\n }\n }\n }\n }\n\n &.horizontal > .adw-scrollbar-trough {\n top: 8px;\n right: 9px;\n bottom: 8px;\n left: 9px;\n\n // `&.horizontal > range > trough > slider { min-width: $_slider_min_length }`, as a floor\n // on the computed length rather than a minimum: the element writes the WIDTH, and\n // upstream's `MIN (width, trough_width)` with the slider's own floor in front of it is\n // exactly `max()`.\n > .adw-scrollbar-slider {\n top: 0;\n left: 0;\n height: $_slider_width;\n width: max(var(--adw-scrollbar-size, #{$_slider_min_length}), #{$_slider_min_length});\n transform: translateX(var(--adw-scrollbar-position, 0));\n }\n }\n\n &.vertical > .adw-scrollbar-trough {\n top: 9px;\n right: 8px;\n bottom: 9px;\n left: 8px;\n\n // The vertical twin of the rule above — `min-height`, in libadwaita's own words.\n > .adw-scrollbar-slider {\n top: 0;\n left: 0;\n width: $_slider_width;\n height: max(var(--adw-scrollbar-size, #{$_slider_min_length}), #{$_slider_min_length});\n transform: translateY(var(--adw-scrollbar-position, 0));\n }\n }\n\n // `&:disabled { opacity: 0 }` on the slider upstream, which is what an INOPERABLE bar\n // looks like — `gtk_widget_set_sensitive (FALSE)` reaches the slider through the widget.\n // Nothing in GTK makes a scrollbar insensitive on its own, so nothing here sets\n // `disabled` either: the rule stands for an author that writes it, which is what the\n // `[disabled]` selector (and not `:disabled`) is for — a custom element carrying\n // `disabled` is not one the UA's `:disabled` matches.\n &[disabled] {\n pointer-events: none;\n\n .adw-scrollbar-slider {\n opacity: 0;\n }\n }\n\n // `> range.fine-tune > trough > slider` — the accent, which upstream paints for a range that\n // is being FINE-TUNED, which in GTK is what `update_zoom_state` turns on: while Shift is\n // held (gtkrange.c:1793-1804).\n &.fine-tune > .adw-scrollbar-trough > .adw-scrollbar-slider {\n &,\n &:hover,\n &:active {\n background-color: color-mix(in srgb, var(--accent-color) 60%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: var(--accent-color);\n }\n }\n }\n\n // `.overlay-indicator` — `setup_indicator`'s class, which is what turns GTK's permanent\n // scrollbar into the \"narrow, auto-hiding indicator\" (`_scrolling.scss:56-118`). It sits\n // OVER the content, so the trough keeps no background and the slider carries an outline to\n // stay legible against whatever is beneath it. The opacity is `indicator_start_fade`'s,\n // driven by `--adw-indicator-opacity` and transitioned over the fade duration.\n &.overlay-indicator {\n z-index: 2;\n background: none;\n box-shadow: none;\n padding: 0;\n opacity: var(--adw-indicator-opacity, 1);\n transition: opacity 1000ms linear;\n\n > .adw-scrollbar-trough {\n outline: 1px solid transparent;\n\n > .adw-scrollbar-slider {\n outline: 1px solid color-mix(in srgb, var(--scrollbar-outline-color, var(--window-fg-color)) 60%, transparent);\n outline-offset: -8px;\n\n @media (prefers-contrast: more) {\n outline: 1px solid var(--scrollbar-outline-color, var(--window-fg-color));\n }\n }\n }\n\n &:not(.hovering) > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-width: 3px;\n min-height: 3px;\n outline-color: color-mix(in srgb, var(--scrollbar-outline-color, var(--window-fg-color)) 35%, transparent);\n\n @media (prefers-contrast: more) {\n outline-color: color-mix(in srgb, var(--scrollbar-outline-color, var(--window-fg-color)) 60%, transparent);\n }\n }\n\n &.hovering > .adw-scrollbar-trough {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 25%, transparent);\n }\n }\n\n &.horizontal {\n > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-width: $_slider_min_length;\n }\n\n &.hovering > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-height: $_slider_width;\n }\n\n &:not(.hovering) > .adw-scrollbar-trough {\n margin-top: 4px;\n margin-bottom: 4px;\n }\n }\n\n &.vertical {\n > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-height: $_slider_min_length;\n }\n\n &.hovering > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-width: $_slider_width;\n }\n\n &:not(.hovering) > .adw-scrollbar-trough {\n margin-left: 4px;\n margin-right: 4px;\n }\n }\n }\n}","// _viewport.scss — <gtk-viewport>: the scrollport a `GtkScrolledWindow` puts its child in.\n//\n// LIBADWAITA STYLES NOTHING HERE, and that is the whole file's justification for existing:\n// `_scrolling.scss` has rules for `scrollbar` and for `scrolledwindow` and none for\n// `viewport`, because GTK gives the node no surface to paint (gtkviewport.c:353). What is\n// below is therefore the CSS of the NODE GTK builds — the measurement, the clipping and the\n// one allocation `gtk_viewport_size_allocate` performs — and each declaration says which half\n// of it it is.\n//\n// THE CHILD IS ALLOCATED ITS NATURAL SIZE. GTK measures the child and hands it that\n// (gtkviewport.c:517-560), so content wider than the window scrolls sideways instead of being\n// squeezed into it. A flex container whose items are `flex: none` is that rule in CSS:\n// `flex-basis: auto` sizes an item to its content and `flex-shrink: 0` keeps it there, and\n// `align-items: flex-start` stops the cross axis from stretching it to fill.\n//\n// THE SCROLLING IS THE PLATFORM'S. GTK's viewport translates its child by the adjustment\n// instead of scrolling it, and the browser's equivalent of a scrollport that scrolls is a\n// scroll container — with the SCROLLBAR hidden, because in GTK those belong to the scrolled\n// window (which builds them, gtkscrolledwindow.c:4356-4363) and never to the viewport. The one\n// consequence worth writing down is the momentum after a touch release: GTK's\n// `GtkKineticScrolling` is a deceleration curve a page cannot hand a browser, so what a reader\n// gets is the platform's own — see `GtkScrolledWindow:kinetic-scrolling`.\n//\n// `overflow: auto`, not `hidden`: a browser clamps either way, but only `auto` runs the\n// platform's momentum and rubber-banding, which is the whole of what a touch scroll does here.\n\ngtk-viewport {\n display: flex;\n // A COLUMN, which is a statement about markup rather than about GTK: a GtkViewport holds\n // exactly ONE child, so a row and a column are the same layout there. Markup can hand a\n // viewport several children, and stacking them is the arrangement every one of them came\n // for — a row would lay ten labels side by side, which is the one answer no reader of a\n // scrollable expects. A single child is unaffected by the direction.\n flex-direction: column;\n align-items: flex-start;\n justify-content: flex-start;\n overflow: auto;\n // Both axes' scrollbars, hidden — `-webkit-scrollbar` for the engine that honours\n // `scrollbar-width: none` only since 121, the pairing `_carousel.scss` already uses.\n scrollbar-width: none;\n\n &::-webkit-scrollbar {\n display: none;\n }\n\n // `flex: none` is `flex: 0 0 auto` — GTK's \"the child's natural size, not less\".\n > * {\n flex: none;\n }\n}","// _scrolled_window.scss — <gtk-scrolled-window>: the allocation GTK's\n// `gtk_scrolled_window_allocate_child` / `allocate_scrollbar` pair performs.\n//\n// THE PLACEMENT IS A GRID of two cells and one corner, because that is what\n// `gtk_scrolled_window_allocate_scrollbar` (gtkscrolledwindow.c:3227-3305) computes: the\n// content takes what is left after each bar has taken its edge, and which edge that is comes\n// from two booleans the C derives from `window-placement`.\n//\n// · `is_top` — `window-placement` is `top-left` or `top-right` — decides whether the\n// HORIZONTAL bar is on the far (bottom) row or the near (top) one.\n// · `is_left = ltr != is_start` — `is_start` being the same corner's left half — decides\n// whether the VERTICAL bar is on the end edge or the start one. The direction half is\n// `:dir(rtl)` here rather than a class, because C reads it off the widget and CSS reads it\n// off the document.\n//\n// The third corner cell is `junction`, the node GTK draws where two bars meet\n// (gtkscrolledwindow.c:134-135); libadwaita paints nothing there, and neither does this — an\n// empty grid cell is the same absence with no node to hold it.\n//\n// AN OVERLAY INDICATOR IS LAID OUT INSIDE THE CONTENT, not beside it. That is\n// `priv->use_indicators` in the same function (gtkscrolledwindow.c:3255-3300): the bar's\n// allocation starts at the content's far edge MINUS the bar's own thickness, so it lies over\n// the content instead of shrinking it. Hence the second template — positioned against the\n// window, which is `position: relative` here for the reason GTK's is a child of the\n// scrolledwindow node.\n//\n// `.frame` is `GtkScrolledWindow:has-frame`, which its own CSS-node documentation spells out:\n// \"It gets a .frame style class added when `has-frame` is TRUE\" (gtkscrolledwindow.c:122-124).\n// The rule behind the class is libadwaita's `_misc.scss:4-7`, which `_style_classes.scss`\n// already carries, so no selector for it is repeated here.\n\ngtk-scrolled-window {\n position: relative;\n display: grid;\n // GTK asks its parent for as little as it can: `gtk_scrolled_window_measure` reports the\n // child's minimum only under `POLICY_NEVER` (gtkscrolledwindow.c:1846-1895) and the bars'\n // own thickness otherwise. `minmax(0, 1fr)` is that request — a track that may collapse to\n // nothing rather than one that demands its content's height, which is what\n // `gtk_widget_set_size_request` lets an author override afterwards.\n grid-template-columns: minmax(0, 1fr) auto;\n grid-template-rows: minmax(0, 1fr) auto;\n min-width: 0;\n min-height: 0;\n // GTK GIVES THIS WIDGET AN ALLOCATION from its parent and never decides its own size:\n // `gtk_scrolled_window_measure` reports the child's MINIMUM and the bars' own thickness\n // (gtkscrolledwindow.c:1846-1895), and `size_allocate` fills whatever it is\n // given. A browser scrolled window needs the same from its author — a height, a\n // `flex-basis`, a parent track — because an auto-height box grows with its content and then\n // has nothing to scroll. `flex: 1 1 0%` is that allocation for the ordinary case of a\n // window in a column, and it is 0 in an auto-height column, so an author who wants the\n // natural size writes one.\n flex: 1 1 0%;\n overflow: hidden;\n\n > gtk-viewport {\n grid-area: 1 / 1;\n }\n\n // The vertical bar spans BOTH rows, which is `gtk_widget_size_allocate` giving it the\n // whole content height (gtkscrolledwindow.c:3295-3305) minus whatever the horizontal bar\n // takes when that one is a layout neighbour rather than an overlay.\n > gtk-scrollbar.vertical {\n grid-row: 1 / 3;\n grid-column: 2;\n justify-self: end;\n }\n\n > gtk-scrollbar.horizontal {\n grid-column: 1 / 3;\n grid-row: 2;\n align-self: end;\n }\n\n // `is_top` false: the horizontal bar takes the NEAR row, and the content is what is left.\n &.bottom-left,\n &.bottom-right {\n grid-template-rows: auto minmax(0, 1fr);\n\n > gtk-scrollbar.horizontal {\n grid-row: 1;\n align-self: start;\n }\n }\n\n // `is_left` true: the vertical bar takes the START column.\n &.top-right,\n &.bottom-right {\n grid-template-columns: auto minmax(0, 1fr);\n\n > gtk-scrollbar.vertical {\n grid-column: 1;\n justify-self: start;\n }\n }\n\n // The direction half of `is_left = ltr != is_start`: everything the C inverts under RTL.\n &:dir(rtl) {\n grid-template-columns: auto minmax(0, 1fr);\n\n > gtk-scrollbar.vertical {\n grid-column: 1;\n justify-self: start;\n }\n\n &.top-right,\n &.bottom-right {\n grid-template-columns: minmax(0, 1fr) auto;\n\n > gtk-scrollbar.vertical {\n grid-column: 2;\n justify-self: end;\n }\n }\n }\n\n // The overlay case, which is the whole of what `use_indicators` changes in the allocation:\n // both bars leave the grid and lie over the content.\n &.overlay-scrolling > gtk-scrollbar.overlay-indicator {\n position: absolute;\n\n &.vertical {\n inset-block: 0;\n right: 0;\n }\n\n &.horizontal {\n inset-inline: 0;\n bottom: 0;\n }\n }\n}","// _window_handle.scss — <gtk-window-handle>: the box GTK's `GtkBinLayout` gives the child.\n//\n// `gtk_window_handle_class_init` sets `GTK_TYPE_BIN_LAYOUT` and the `windowhandle` CSS name\n// (gtkwindowhandle.c:553-554), and libadwaita has NO rule for either — the widget contributes\n// no surface, a shadow or a border, only the titlebar's gestures. `display: contents` is that\n// in CSS: the child keeps its own box, participates in its PARENT's layout as if the handle\n// were not there, and a titlebar strip can go anywhere a header bar goes without moving\n// anything around it.\n//\n// `user-select: none` is the one declaration that is not C: a titlebar is dragged, not\n// selected, and GTK's drag gesture swallows the text selection a browser would otherwise\n// start on the way to a triple click.\n\ngtk-window-handle {\n display: contents;\n\n // The drag belongs to the strip, not to the text inside it, and a double click on the\n // title is the `toggle-maximize` gesture rather than a word selection.\n user-select: none;\n}","// _scrolling.scss — GtkScrolledWindow's edge indicators.\n//\n// The two states are drawn by ONE pseudo-element per edge, because they cannot be\n// live at once: an undershoot means content is hidden past the edge, an overshoot\n// means the position is past it. `src/scroll-shading.ts` decides which, and carries\n// the overshoot's size in `--adw-overshoot`.\n//\n// Both boxes are sticky with a negative margin of their own height, so they weld to\n// the scrollport edge and consume no layout — an absolutely positioned child of a\n// scroll container scrolls away with the content instead of staying at the edge.\n//\n// Reference: refs/libadwaita/src/stylesheet/_drawing.scss (undershoot/overshoot mixins)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scrolling.scss\n// Reference: refs/gtk/gtk/gtkscrolledwindow.c (UNDERSHOOT_SIZE, MAX_OVERSHOOT_DISTANCE)\n// Copyright (c) GNOME contributors (GTK, libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web.\n\n// `UNDERSHOOT_SIZE` — the band the node is allocated. Mostly transparent: the\n// gradient over it is done after 4px.\n$undershoot_size: 40px;\n\n// The shade both gradients start from — `color-mix(… var(--shade-color) 75% …)`.\n$undershoot_shade: color-mix(in srgb, var(--shade-color) 75%, transparent);\n\n.adw-scroll-shaded {\n // The two indicator boxes exist for every shaded scroller and stay invisible\n // until a state class turns them on, so nothing has to be inserted or removed\n // while scrolling.\n &::before,\n &::after {\n content: '';\n display: block;\n position: sticky;\n z-index: 1;\n flex-shrink: 0;\n pointer-events: none;\n height: 0;\n background: none;\n box-shadow: none;\n }\n\n &::before {\n top: 0;\n }\n\n &::after {\n bottom: 0;\n }\n\n // --- Undershoot: \"there is content past this edge\" ---\n //\n // A 1px line at the very edge plus a 4px fade, both at 75% of the shade colour.\n // Constant size: it says THAT content is hidden, never how much.\n &.undershoot-top::before {\n height: $undershoot_size;\n margin-bottom: -$undershoot_size;\n box-shadow: inset 0 1px $undershoot_shade;\n background: linear-gradient(to bottom, $undershoot_shade, transparent 4px);\n }\n\n &.undershoot-bottom::after {\n height: $undershoot_size;\n margin-top: -$undershoot_size;\n box-shadow: inset 0 -1px $undershoot_shade;\n background: linear-gradient(to top, $undershoot_shade, transparent 4px);\n }\n\n // --- Overshoot: \"there is nothing past this edge\" ---\n //\n // Two stacked radial gradients in the CURRENT text colour — a tight 3% band at\n // the edge over a soft 50% wash — sized to how far past the edge the position\n // was pushed. `--adw-overshoot` is set per scroller by the shading controller.\n &.overshoot-top::before,\n &.overshoot-bottom::after {\n height: var(--adw-overshoot, 0px);\n background-repeat: no-repeat;\n box-shadow: none;\n // The spring-back: the size is driven from JS, the fade rides the transition\n // so releasing the wheel eases out instead of cutting.\n transition: height 200ms ease-out, opacity 200ms ease-out;\n }\n\n &.overshoot-top::before {\n margin-bottom: calc(var(--adw-overshoot, 0px) * -1);\n background-image:\n radial-gradient(farthest-side at top, color-mix(in srgb, currentColor 12%, transparent) 85%, transparent),\n radial-gradient(farthest-side at top, color-mix(in srgb, currentColor 5%, transparent), transparent);\n background-size: 100% 3%, 100% 50%;\n background-position: top;\n }\n\n &.overshoot-bottom::after {\n margin-top: calc(var(--adw-overshoot, 0px) * -1);\n background-image:\n radial-gradient(farthest-side at bottom, color-mix(in srgb, currentColor 12%, transparent) 85%, transparent),\n radial-gradient(farthest-side at bottom, color-mix(in srgb, currentColor 5%, transparent), transparent);\n background-size: 100% 3%, 100% 50%;\n background-position: bottom;\n }\n\n @media (prefers-reduced-motion: reduce) {\n &.overshoot-top::before,\n &.overshoot-bottom::after {\n transition: none;\n }\n }\n}\n","// _wrap_box.scss — adw-wrap-box styling (a box that wraps its children onto new\n// lines, the web analog of flexbox `flex-wrap: wrap`). Mirrors Adw.WrapBox.\n// Reference: refs/adwaita-web/adwaita-web/scss/_wrap_box.scss\n// Reference: refs/libadwaita/src/adw-wrap-box.c / adw-wrap-layout.c (Adw.WrapBox)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// Direction, gaps, `justify-content` and `align-content` are driven imperatively\n// by the component from its attributes — these are the libadwaita defaults\n// (horizontal, packed to the start of each line, lines wrapping downwards from\n// the top). A wrap box is a pure layout container, so it carries no background\n// of its own; children handle their own theming.\nadw-wrap-box {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n justify-content: flex-start;\n // Each child is allocated the FULL cross extent of its line — `h = line_size`\n // in adw-wrap-layout.c:746-751 — which is `stretch`, the flexbox default. The\n // port used to write `flex-start` here and drive it from `align`, which is a\n // MAIN-axis property in libadwaita and belongs on `justify-content`.\n align-items: stretch;\n align-content: flex-start;\n}\n\n// `wrap-policy`, published by the component as a custom property. The FALLBACK\n// is the load-bearing part: it is `ADW_WRAP_NATURAL`, libadwaita's default\n// (adw-wrap-box.c:491-495), where CSS defaults `flex-shrink` to 1 — so a wrap\n// box that has not upgraded yet, or one whose policy is unset, draws Adwaita's\n// choice rather than the cascade's.\nadw-wrap-box > * {\n flex-shrink: var(--adw-wrap-box-child-shrink, 0);\n}\n\n// FILL grows the children and keeps the spacing constant\n// (adw-wrap-layout.c:317-319, :326-341); SPREAD deliberately does NOT, so the\n// gaps take the leftover instead. `data-line-justify` is the mode the component\n// resolved for a COMPLETE line.\n//\n// A lone child is excluded because it is not on a complete line: a box with one\n// element child has exactly one line, and that line is the final one — see\n// below.\nadw-wrap-box[data-line-justify='fill'] > *:not(:only-child) {\n flex-grow: 1;\n}\n\n// `:only-child` is the one line-membership fact CSS knows without a layout pass,\n// and libadwaita treats that line as the LAST one. Both justified modes stretch\n// it: FILL by definition, SPREAD because its \"keep the children at their minimum\n// size\" branch is guarded by `n_children > 1` (adw-wrap-layout.c:338), so a lone\n// child is stretched regardless (adw-wrap-box.c:349-352).\nadw-wrap-box[data-last-line-justify='fill'] > :only-child,\nadw-wrap-box[data-last-line-justify='spread'] > :only-child {\n flex-grow: 1;\n}\n\n// The final line, when it is NOT justified (`justify-last-line` unset — the C\n// default, adw-wrap-box.c:379-381): a generated flex item absorbs that line's\n// leftover space, so it packs at the start of the main axis the way an\n// un-justified line does, while `justify-content: space-between` keeps spreading\n// the complete lines above it. `::after` is the only per-line hook flexbox\n// offers, and it lands on the final line by construction.\n//\n// The negative main-axis margin cancels exactly the one gap the filler would\n// otherwise add, so an exactly-full line can never be pushed into a new one.\nadw-wrap-box[data-line-justify='spread'][data-last-line-justify='none']::after {\n content: '';\n flex: 1 0 0;\n min-width: 0;\n min-height: 0;\n margin-left: calc(-1 * var(--adw-wrap-box-child-spacing, 0px));\n}\n\n// A vertical box packs along the block axis, so the gap to cancel is the one\n// before the filler in that direction.\nadw-wrap-box[orientation='vertical'][data-line-justify='spread'][data-last-line-justify='none']::after {\n margin-left: 0;\n margin-top: calc(-1 * var(--adw-wrap-box-child-spacing, 0px));\n}\n","// _panes.scss — `.sidebar-pane` / `.content-pane` / `.overlay-pane`.\n//\n// These are libadwaita STYLE CLASSES, not private markup of one widget. Both\n// split views document them as their CSS node tree\n// (adw-navigation-split-view.c:157-165, adw-overlay-split-view.c:136-152) and\n// both apply them to their pane bins, which makes them the supported hook an\n// app themes a pane through. They lived nowhere in this stylesheet, so each\n// split view hard-coded `--sidebar-bg-color` onto its own private pane div\n// instead — with two consequences.\n//\n// The first is that an app writing the documented selector styles nothing, and\n// gets no error saying so. Our own docs site is the evidence: every split-view\n// example carried `class=\"sidebar\"` on the sidebar toolbar view, hand-written\n// by someone reaching for exactly this, matching no rule in the build.\n//\n// The second is a rendering defect, because the class is not constant — it is\n// how the widget says which of its states a pane is in. A collapsed overlay\n// sidebar is an `.overlay-pane`, on the WINDOW background, not the sidebar one\n// (adw-overlay-split-view.c:718-741); a collapsed navigation split view has no\n// pane bins at all, its pages being ordinary navigation pages. Painting the\n// sidebar colour at every width, as the private rules did, got both wrong.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss (.sidebar-pane, .overlay-pane)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n.sidebar-pane {\n background-color: var(--sidebar-bg-color);\n color: var(--sidebar-fg-color);\n}\n\n// A pane nested inside another sidebar pane defers to it rather than stacking a\n// second tint (`.sidebar-pane .sidebar-pane`, _sidebars.scss). libadwaita also\n// recolours the MIDDLE pane of a three-pane setup through\n// `--secondary-sidebar-*`; that needs a split view nested in a split view to\n// mean anything, and no such composition is rendered yet, so the tokens are\n// defined (they are public API an app may already reference) and the selector\n// is left for whoever builds the composition that can test it.\n.sidebar-pane .sidebar-pane {\n background-color: transparent;\n color: inherit;\n}\n\n// `.content-pane` deliberately has NO rule here. libadwaita gives it no colour\n// of its own — the window shows through — and writing `transparent` would be a\n// claim, not a copy: it would override the `--window-bg-color` the navigation\n// split view sets on its own content pane for the case where the view is not a\n// window's direct child. The class is still applied, because being able to\n// select it is the point.\n\n// Collapsed: the sidebar floats ABOVE the content as a temporary panel, and\n// libadwaita gives it the window colours rather than the sidebar ones — a panel\n// over the content is not the same surface as a pane beside it.\n.overlay-pane {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n","// _overlay_split_view.scss — adw-overlay-split-view styling.\n//\n// The GEOMETRY is no longer here. It used to be four `transform: translateX(±100%)`\n// rules keyed on `.collapsed` / `.show-sidebar` / `.sidebar-end`, which can only\n// express the two END STATES of a reveal — so `show-progress` was 0 or 1, the\n// five `OVERLAY_SWIPE_*` conformance tables shipped unexercised, and the docked\n// hide slid the wrong way for an `end` sidebar because the JS wrote `marginRight`\n// whichever edge the pane was on.\n//\n// The element now writes the pane rect per frame from\n// `layoutOverlaySplitView`, which is continuous and knows the edge (including\n// under RTL, where a `start` sidebar is drawn on the RIGHT —\n// `get_start_or_end`, adw-overlay-split-view.c:227-234). What is left here is\n// what CSS genuinely owns: the box model, the stacking, and the transition that\n// smooths a programmatic toggle.\n//\n// Reference: refs/libadwaita/src/adw-overlay-split-view.c\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented as Web Component for @gjsify/adwaita-web.\n\nadw-overlay-split-view {\n display: flex;\n flex-direction: row;\n flex: 1;\n min-height: 0;\n position: relative;\n overflow: hidden;\n\n // NO background here. The pane colour comes from the `.sidebar-pane` /\n // `.overlay-pane` class the element toggles (see _panes.scss), because which\n // of the two a pane is in is exactly what decides its colour — hard-coding\n // `--sidebar-bg-color` on this private class painted a collapsed overlay,\n // which libadwaita puts on the window background, as though it were docked.\n // A flex column, as the content pane is, so the pane's widget fills it: GTK allocates the\n // sidebar the whole pane. A block pane sized a toolbar view by its content, and the\n // gallery's `.blp` sidebar list stopped 130px above the pane's bottom edge.\n .adw-osv-sidebar {\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n flex-shrink: 0;\n z-index: 10;\n align-self: stretch;\n // Only `opacity` transitions. The offset is driven per frame, so animating\n // it here would fight the swipe: a gesture would lag its own finger.\n transition: opacity 0.2s ease;\n }\n\n // THE CONTAINER MINIMUM, as CSS spells it. `measure_uncollapsed`\n // (adw-overlay-split-view.c:558-563) is `trunc(sidebar_min * progress) +\n // content_min`, and a flex row reaches exactly that on its own PROVIDED the\n // content is allowed to claim its own minimum: the sidebar is `flex-shrink: 0`\n // with a `min-width` of `sidebar_min`, so the sum is the container's floor.\n //\n // `min-width: 0` was here instead — the flex idiom for \"let this be crushed so\n // an ellipsis can happen\" — which is precisely how the content pane could be\n // squeezed to nothing while the sidebar kept its whole width. A child that\n // needs to truncate can still ask for `min-width: 0` itself; the PANE may not.\n //\n // Not computed in JS: a measured number would need the content's min-content\n // size, which the DOM does not expose without a reflow, and the first attempt\n // used `scrollWidth` — the pane's CURRENT width — which pinned the view at\n // whatever it happened to be and stopped it responding to its breakpoint.\n .adw-osv-content {\n flex: 1;\n min-width: min-content;\n min-height: 0;\n display: flex;\n flex-direction: column;\n align-self: stretch;\n }\n\n // Docked — the sidebar sits in the flex row and the hidden part is taken off\n // its own edge by a negative margin the element computes.\n &:not(.collapsed) .adw-osv-sidebar {\n position: relative;\n }\n\n // Docked + sidebar-end — dock the sidebar to the far side of the content\n // (the Adw.OverlaySplitView { sidebar-position: end } layout). flex `order`\n // flips the visual order without changing the slotting DOM order.\n &:not(.collapsed).sidebar-end {\n .adw-osv-content {\n order: 1;\n }\n\n .adw-osv-sidebar {\n order: 2;\n }\n }\n\n // THE DIVIDER FOLLOWS THE VISUAL SIDE, not the logical one. `_sidebars.scss`\n // makes it `:dir()` × `.end` (:21-39), which is exactly the product\n // `.sidebar-at-visual-start` already carries: under RTL a `start` sidebar is\n // drawn on the right and its divider belongs on its left edge.\n &:not(.collapsed) {\n .adw-osv-sidebar {\n border-inline-end: none;\n border-inline-start: none;\n }\n\n &.sidebar-at-visual-start .adw-osv-sidebar {\n border-right: 1px solid var(--separator-color);\n }\n\n &:not(.sidebar-at-visual-start) .adw-osv-sidebar {\n border-left: 1px solid var(--separator-color);\n }\n }\n\n // Overlay (collapsed) — the sidebar floats above the content at the absolute\n // offset the element writes into `left`, which is the only property that can\n // carry a mid-swipe position.\n &.collapsed .adw-osv-sidebar {\n position: absolute;\n top: 0;\n bottom: 0;\n box-shadow: 0 0 12px rgb(0 0 0 / 25%);\n }\n\n // THE TWO RESTING STATES ARE CSS. Everything BETWEEN them is JS.\n //\n // Dropping these is what shipped the docs-site regression. The offset is\n // driven per frame from `layoutOverlaySplitView` — but a view that has never\n // been measured drives nothing, and an absolutely-positioned pane with no\n // `left` resolves to `left: 0` at full opacity. So a HIDDEN sidebar was\n // painted over the content at the wrong edge, on a page whose slideshow\n // builds each slide inside `display: none` and moves it in, so the first\n // measurement never arrived and this fallback was the whole rendering.\n //\n // Not a second copy of the arithmetic: 0% and 100% ARE the two ends the JS\n // interpolates between, and neither of them needs a pixel to say. The element\n // clears its inline placement whenever it has no measurement, which is what\n // hands control back to these rules instead of stranding a stale offset.\n &.collapsed {\n // Revealed: flush against the edge the pane is drawn on.\n &.sidebar-at-visual-start .adw-osv-sidebar {\n left: 0;\n right: auto;\n }\n\n &:not(.sidebar-at-visual-start) .adw-osv-sidebar {\n left: auto;\n right: 0;\n }\n\n // Hidden: entirely off that same edge, and untouchable while it is there.\n &:not(.show-sidebar) {\n .adw-osv-sidebar {\n opacity: 0;\n pointer-events: none;\n }\n\n &.sidebar-at-visual-start .adw-osv-sidebar {\n left: auto;\n right: 100%;\n }\n\n &:not(.sidebar-at-visual-start) .adw-osv-sidebar {\n left: 100%;\n right: auto;\n }\n }\n }\n\n // Docked and hidden — the pane takes no room in the row. The JS expresses\n // this as a negative margin so it can animate; unmeasured, the end state is\n // simply a pane of no width.\n &:not(.collapsed):not(.show-sidebar) .adw-osv-sidebar {\n width: 0;\n min-width: 0;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n }\n\n // Backdrop — the click-outside shield. `hidden` is the element's, off\n // `shieldVisible`; the OPACITY is the shadow-helper progress, so it fades with\n // the reveal instead of appearing whole.\n .adw-osv-backdrop {\n display: none;\n }\n\n &.collapsed .adw-osv-backdrop:not([hidden]) {\n display: block;\n position: absolute;\n inset: 0;\n background: rgb(0 0 0 / 30%);\n z-index: 9;\n transition: opacity 0.2s ease;\n }\n}\n\n// Sidebar content layout helper — wraps the sidebar's children with the\n// standard Adwaita spacing scale (12px padding, 12px gap between groups).\n.adw-sidebar-content {\n padding: var(--spacing-m);\n display: flex;\n flex-direction: column;\n gap: var(--spacing-m);\n}\n\n// Sidebar toggle button — sidebar-show-symbolic icon via CSS mask\n.adw-sidebar-toggle-icon::after {\n content: '';\n position: absolute;\n inset: 0;\n background-color: currentColor;\n -webkit-mask-image: var(--icon-sidebar-show);\n mask-image: var(--icon-sidebar-show);\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-size: 16px 16px;\n mask-size: 16px 16px;\n -webkit-mask-position: center;\n mask-position: center;\n pointer-events: none;\n}\n","// _navigation_split_view.scss — adw-navigation-split-view styling (docked sidebar).\n//\n// Visibility is `data-pane-visible`, written by the element from\n// `update_navigation_stack` (adw-navigation-split-view.c:342-405), not from the\n// two flags. Two of that table's rules are not expressible as\n// `.collapsed.show-content`: a LONE child stays visible whatever `show-content`\n// says (:389-401), and with `sidebar-position: end` the CONTENT is the root page\n// so the sidebar is pushed ON TOP of it rather than replacing it. This file used\n// to key off the flags and got both wrong — a collapsed view with only a sidebar\n// rendered blank.\n//\n// Reference: refs/adwaita-web/adwaita-web/docs/widgets/navigationsplitview.md\n// Reference: refs/libadwaita/src/adw-navigation-split-view.c\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-navigation-split-view {\n display: flex;\n flex-direction: row;\n min-height: 0;\n min-width: 0;\n flex: 1 1 auto;\n\n // NO background here — it comes from the `.sidebar-pane` class the element\n // applies while DOCKED (see _panes.scss). Collapsed, libadwaita builds no\n // pane bins at all and the sidebar is an ordinary full-window navigation\n // page; a background nailed to this private class made it sidebar-coloured\n // at every width.\n .adw-nsv-sidebar {\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex-shrink: 0;\n }\n\n // The container MINIMUM, as CSS spells it: `measure_uncollapsed`\n // (adw-navigation-split-view.c:264-267) is `sidebar_min + content_min`, which\n // a flex row reaches by itself once the content may claim its own minimum.\n // `min-width: 0` — the flex idiom for \"let this be crushed\" — was here, which\n // is how the content pane could be squeezed to nothing while the sidebar,\n // being `flex-shrink: 0`, kept its whole width.\n .adw-nsv-content {\n display: flex;\n flex-direction: column;\n min-width: min-content;\n min-height: 0;\n flex: 1 1 auto;\n background-color: var(--window-bg-color);\n }\n\n // A pane's page fills the pane, as GTK allocates it the whole pane. The two panes are\n // flex columns and an `<adw-navigation-page>` is a block, so a page in one — which is\n // what a `.blp` writes, `sidebar: Adw.NavigationPage { … }` — was sized by its content:\n // the gallery's sidebar list stopped 118px short of the pane it sat in. Its child fills\n // it in turn, the way `.adw-navigation-page > *` does inside a navigation view.\n .adw-nsv-sidebar > adw-navigation-page,\n .adw-nsv-content > adw-navigation-page {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n\n > * {\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n\n // `sidebar-position: end` docks the sidebar past the content. flex `order`\n // flips the visual order without changing the slotting DOM order.\n &.sidebar-end {\n .adw-nsv-content {\n order: 1;\n }\n\n .adw-nsv-sidebar {\n order: 2;\n }\n }\n\n // THE DIVIDER FOLLOWS THE VISUAL SIDE. `_sidebars.scss:1293-1302` makes it\n // `:dir()` × `.end`, which is the product `.sidebar-at-visual-start` carries:\n // under RTL a `start` sidebar is drawn on the right and its divider belongs on\n // its left edge. A fixed `border-right` drew it on the wrong side for half the\n // four combinations.\n &.sidebar-at-visual-start .adw-nsv-sidebar {\n border-right: 1px solid var(--separator-color);\n }\n\n &:not(.sidebar-at-visual-start) .adw-nsv-sidebar {\n border-left: 1px solid var(--separator-color);\n }\n\n // Collapsed: whichever pane the STACK puts on top fills the view, and the\n // other is not rendered at all.\n &.collapsed {\n [data-pane-visible='false'] {\n display: none;\n }\n\n .adw-nsv-sidebar[data-pane-visible='true'] {\n flex: 1 1 auto;\n max-width: none;\n border-right: none;\n border-left: none;\n }\n }\n}\n","// _carousel.scss — adw-carousel + its dot/line page indicators.\n//\n// A horizontal scroll-snap pager (adw-carousel) plus two indicator widgets that\n// bind to it. The indicators reproduce libadwaita's snapshot drawing as CSS: a\n// per-marker `--adw-carousel-progress` (0 = inactive, 1 = focused) lerps between\n// the inactive and selected size/opacity exactly as AdwCarousel does.\n//\n// Dots: DOTS_RADIUS 3 → DOTS_RADIUS_SELECTED 4 (6px → 8px), DOTS_SPACING 7,\n// DOTS_OPACITY 0.3 → DOTS_OPACITY_SELECTED 0.9, active fill = accent.\n// Lines: LINE_LENGTH 35, LINE_WIDTH 3, LINE_SPACING 5, LINE_OPACITY 0.3 →\n// LINE_OPACITY_ACTIVE 0.9, active fill = accent.\n//\n// Reference: refs/libadwaita/src/adw-carousel.c\n// Reference: refs/libadwaita/src/adw-carousel-indicator-dots.c\n// Reference: refs/libadwaita/src/adw-carousel-indicator-lines.c\n// Reference: refs/adwaita-web/adwaita-web/scss/_carousel_indicators.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-carousel {\n display: block;\n overflow: hidden;\n // A carousel's own width is its parent's to give, never its pages laid end to end. The\n // track is a row of full-width pages, so its max-content width is their SUM, and a\n // carousel in a stretching box (the gallery's `.blp`) pushed that box 274px past its\n // window. GTK measures a carousel by its widest page; CSS has no \"max of the children\"\n // for a scrolling row, so the width comes from outside, as a filled GTK allocation does.\n contain: inline-size;\n\n .adw-carousel-track {\n display: flex;\n flex-direction: row;\n height: 100%;\n overflow-x: auto;\n scroll-snap-type: x mandatory;\n // Hide the scrollbar — the carousel is paged, not scrolled by chrome.\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n &::-webkit-scrollbar {\n display: none;\n }\n }\n\n // `100%` is the FALLBACK basis, used until the element has measured its pages:\n // libadwaita gives every page the largest natural size capped at the carousel\n // (adw-carousel.c:748-765), which is only 100% when a page asks for it all. The\n // element narrows `flex-basis` to the measured size and pads the track by the\n // half-gap that leaves, so the neighbours peek in as they do in GTK.\n //\n // `center` and not `start` for the same reason: the strip is drawn centred\n // (:801), and centre-snapping is what makes the track padding cancel out of the\n // scroll offset, leaving `scrollLeft = position * distance` exactly true.\n //\n // `min-width: 0` because a flex item floors at its own min-content size: without\n // it a page whose content is wider than the carousel keeps that width instead of\n // being capped at it, and GTK allocates the capped one (:754) and clips.\n .adw-carousel-page {\n flex: 0 0 100%;\n min-width: 0;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n scroll-snap-align: center;\n scroll-snap-stop: always;\n }\n}\n\n// Shared layout for both indicator kinds — a centered, horizontally-laid-out\n// row of markers (matching the AdwCarouselIndicator* widgets).\nadw-carousel-indicator-dots,\nadw-carousel-indicator-lines {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-xs);\n\n // The clickable marker resets the button chrome — the visible shape is drawn\n // by the per-kind rules below.\n button {\n appearance: none;\n -webkit-appearance: none;\n margin: 0;\n padding: 0;\n border: none;\n background: none;\n cursor: pointer;\n flex: 0 0 auto;\n }\n}\n\n// Dots — DOTS_SPACING 7px between centers; base diameter 6px (radius 3) growing\n// to 8px (radius 4) on the focused dot, opacity ramping 0.3 → 0.9.\nadw-carousel-indicator-dots {\n gap: 7px;\n\n .adw-carousel-dot {\n width: 8px;\n height: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n // The painted disc lives in ::before so the 8px hit-target stays constant\n // while the visible dot grows from 6px → 8px with progress.\n &::before {\n content: '';\n display: block;\n // 6px + (8px - 6px) * progress\n width: calc(6px + 2px * var(--adw-carousel-progress, 0));\n height: calc(6px + 2px * var(--adw-carousel-progress, 0));\n border-radius: 50%;\n background-color: var(--window-fg-color);\n // 0.3 + (0.9 - 0.3) * progress\n opacity: calc(0.3 + 0.6 * var(--adw-carousel-progress, 0));\n transition:\n width 0.2s ease,\n height 0.2s ease,\n opacity 0.2s ease,\n background-color 0.2s ease;\n }\n\n &.active::before {\n background-color: var(--window-fg-color);\n }\n }\n}\n\n// Lines — LINE_LENGTH 35px, LINE_WIDTH 3px, LINE_SPACING 5px; opacity ramps\n// 0.3 → 0.9; the active line recolors to the accent.\nadw-carousel-indicator-lines {\n gap: 5px;\n\n .adw-carousel-line {\n width: 35px;\n height: 3px;\n border-radius: 1.5px;\n background-color: var(--window-fg-color);\n // 0.3 + (0.9 - 0.3) * progress\n opacity: calc(0.3 + 0.6 * var(--adw-carousel-progress, 0));\n transition:\n opacity 0.2s ease,\n background-color 0.2s ease;\n\n &.active {\n background-color: var(--window-fg-color);\n }\n }\n}\n","// _tab_bar.scss — <adw-tab-bar>, libadwaita's tab bar as the separate widget it is: a\n// headerbar-coloured strip holding one chip per page, with an action widget on either\n// side of the chips and a two-pixel overflow bar underneath them.\n//\n// The chip rules below are the SAME declarations `scss/_tab_view.scss` writes for\n// `<adw-tab-view>`'s merged bar, from the same upstream block: `tabbar` / `tabbox` / `tab`\n// in refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:1-95 with the chip's own\n// metrics from :154-176. Two copies rather than one shared partial, and deliberately so —\n// the merged bar is what every existing `<adw-tab-view>` test measures (it queries\n// `.adw-tab-bar` inside the view), so lifting its rules into a placeholder both selectors\n// `@extend` would change the compiled stylesheet for a widget this package did not touch.\n// The chip's own MARKUP is shared instead, in src/tab-chip.ts, which is where a change to\n// what a chip contains belongs.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss (tabbar .box,\n// tabbox + its separator / revealer > indicator, tab, tabbox.single-tab tab,\n// .start-action / .end-action, %tabbar-inline)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:270 ($selected_color, the 10% the\n// selected chip and the hover/active terms above it are mixed from)\n// Copyright (c) 2024-2025 Alice Mikhaylenko / Purism SPC. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-tab-bar {\n display: flex;\n align-items: stretch;\n flex-shrink: 0;\n box-sizing: border-box;\n // `padding: 1px; padding-top: 0` — the strip's own 1px inset, which is where the\n // separator between it and the view below comes from.\n padding: 0 1px 1px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n // libadwaita's inset bottom shade under the bar.\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n // The strip is the ONE scroll window in the widget: `AdwTabBox` sits in a\n // `GtkScrolledWindow`, and pinned tabs stay outside it.\n overflow-x: auto;\n scrollbar-width: none;\n\n &[hidden] {\n display: none;\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 -1px var(--border-color);\n }\n\n // `%tabbar-inline`, the `.inline` style class (adw-tab-bar.c:65-69): the bar looks like\n // part of an AdwHeaderBar by default, and this removes its background so it can sit in\n // another context instead.\n &.inline {\n background-color: transparent;\n color: inherit;\n box-shadow: none;\n padding-bottom: 0;\n }\n\n // `AdwBin`s either side of the box (adw-tab-bar.ui). The two `padding-*-: 0` rules are\n // libadwaita's `:dir()` pair for exactly this: the action widget sits flush against the\n // chips on the side it is on, which logical properties say once instead of twice.\n .adw-tab-bar-start-action,\n .adw-tab-bar-end-action {\n flex-shrink: 0;\n box-sizing: border-box;\n padding: 6px 5px;\n\n &:empty {\n display: none;\n }\n }\n\n .adw-tab-bar-start-action {\n padding-inline-end: 0;\n }\n\n .adw-tab-bar-end-action {\n padding-inline-start: 0;\n }\n\n .adw-tab-box {\n display: flex;\n align-items: stretch;\n flex: 1 1 auto;\n // `padding-bottom: 6px; padding-top: 6px; min-height: 34px`.\n padding: 6px 0;\n min-height: 34px;\n }\n\n // `inverted` — the box lays its children out the other way round, which is what puts a\n // non-pinned tab's close button at the BEGINNING and its indicator at the end\n // (adw-tab-bar.c:636-644).\n &[inverted] .adw-tab-box {\n flex-direction: row-reverse;\n }\n\n // A single tab draws no background at all (`tabbox.single-tab tab`, :79-87).\n &.single-tab .adw-tab {\n &,\n &:hover,\n &:active {\n background: none;\n }\n }\n\n // `revealer > indicator` (:44-55): the two-pixel accent bar under the chips, shown\n // exactly while the strip cannot show them all.\n .adw-tab-box-overflow {\n flex: none;\n align-self: center;\n min-width: 2px;\n border-radius: 2px;\n margin: 3px 6px;\n background-color: color-mix(in srgb, var(--accent-color) 50%, transparent);\n\n &[hidden] {\n display: none;\n }\n\n @media (prefers-contrast: more) {\n background-color: var(--accent-color);\n }\n }\n\n // --- a single tab ------------------------------------------------------------\n // `tabbar, dnd > tab` (:154-176) for the metrics, `tab` (:56-77) for the states.\n .adw-tab {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n // `min-height: 26px; padding: 4px`.\n min-height: 26px;\n padding: 4px;\n margin: 0;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n line-height: 1;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background 150ms ease-in-out;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n\n // `:selected` is libadwaita's, and `$selected_color` is the currentColor 10% mix\n // (_colors.scss:270); the two hover/active terms under it are the 13% and the 19%.\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n\n @media (prefers-contrast: more) {\n &:hover,\n &:active,\n &.active {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n }\n\n // The thin separators between tabs (`tabbox > separator`, :29-38), hidden next to the\n // selected or the hovered one — which is `update_separators` in the element.\n .adw-tab + .adw-tab::before {\n content: '';\n position: absolute;\n left: 0;\n top: 3px;\n bottom: 3px;\n width: 1px;\n background-color: currentColor;\n opacity: 0.2;\n transition: opacity 150ms ease-in-out;\n pointer-events: none;\n }\n\n .adw-tab.active + .adw-tab::before,\n .adw-tab + .adw-tab.active::before,\n .adw-tab:hover + .adw-tab::before,\n .adw-tab + .adw-tab:hover::before {\n opacity: 0;\n }\n\n .adw-tab-title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n }\n\n .adw-tab-icon,\n .adw-tab-indicator {\n flex-shrink: 0;\n // `indicator` (:166-172): the two-pixel accent underline, which is the page's own\n // attention indicator and NOT the overflow bar above.\n width: 16px;\n height: 16px;\n\n &[hidden] {\n display: none;\n }\n }\n\n // `AdwTabPage:loading` swaps the icon image for the SAME paintable `Adw.Spinner` uses, so\n // the chip mounts a real `<adw-spinner>` rather than a second ring drawn in CSS.\n .adw-tab-spinner {\n flex: none;\n\n &[hidden] {\n display: none;\n }\n }\n\n // A pinned tab is a single-glyph chip: libadwaita hides both the title and the close\n // button at construction (adw-tab.c:645-650), and `tabCloseVisible` carries the same rule\n // in the element.\n .adw-tab.pinned {\n padding: 0 4px;\n\n .adw-tab-title {\n display: none;\n }\n }\n\n // `AdwTabPage:needs-attention` — the accent underline libadwaita animates in.\n .adw-tab.needs-attention::after {\n content: '';\n position: absolute;\n bottom: 2px;\n left: 50%;\n width: 12px;\n height: 2px;\n transform: translateX(-50%);\n border-radius: 1px;\n background-color: var(--accent-bg-color);\n }\n\n // The close affordance: `button.image-button` inside a tab (:158-164) — a 24px round\n // button with no fill of its own. Presence is decided in JS by `tabCloseVisible`.\n .adw-tab-close {\n box-sizing: border-box;\n flex-shrink: 0;\n position: relative;\n min-width: 24px;\n min-height: 24px;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 99px;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n opacity: 0.7;\n transition:\n background-color 150ms ease-in-out,\n opacity 150ms ease-in-out;\n\n &[hidden] {\n display: none;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--button-hover-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 9px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n }\n\n // `expand-tabs` — chips stretch to fill the strip evenly instead of sitting at their\n // minimum size (adw-tab-bar.c:622-634, delegated to the tab box).\n &[expand-tabs] .adw-tab {\n flex: 1 1 0;\n max-width: 200px;\n }\n}","// _tab_view.scss — adw-tab-view styling (a dynamic tabbed container with a tab\n// bar header; one page visible at a time). The bar is a headerbar-colored strip\n// of rounded chips; the selected chip is raised onto the view background, the\n// way libadwaita draws AdwTabBar over an AdwTabView.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss (tabbar/tabbox/tab)\n// Reference: refs/adwaita-web/adwaita-web/scss/_tabs.scss\n// Copyright (c) 2020-2022 Purism SPC / GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-tab-view {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n // --- Tab bar (the AdwTabBar strip) ---\n // Faithful port of libadwaita's `tabbar` (refs/libadwaita _tab-view.scss +\n // _colors.scss): a headerbar-colored box with an inset bottom shade; tabs\n // FILL their slot as rounded rects and use the currentColor alpha fills —\n // selected 10% (hover 13%, active 19%), plain hover 7%, active 16%.\n .adw-tab-bar {\n display: flex;\n align-items: stretch;\n flex-shrink: 0;\n box-sizing: border-box;\n padding: 0 1px 1px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n // libadwaita's inset bottom shade under the bar.\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n overflow-x: auto;\n scrollbar-width: none;\n\n &[hidden] {\n display: none;\n }\n }\n\n .adw-tab-box {\n display: flex;\n align-items: stretch;\n flex: 1 1 auto;\n padding: 4px 0;\n }\n\n // --- A single tab ---\n .adw-tab {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n max-width: 200px;\n min-height: 30px;\n margin: 0;\n padding: 0 var(--spacing-m);\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n line-height: 1;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The selected tab — libadwaita's currentColor alpha fill covering the\n // whole tab slot (NOT a raised chip on the view background).\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n }\n\n // Thin separators between tabs, hidden next to the selected or hovered tab\n // (libadwaita tabbox > separator + its .hidden state).\n .adw-tab + .adw-tab::before {\n content: '';\n position: absolute;\n left: 0;\n top: 3px;\n bottom: 3px;\n width: 1px;\n background-color: currentColor;\n opacity: 0.2;\n transition: opacity 150ms ease-in-out;\n pointer-events: none;\n }\n\n .adw-tab.active + .adw-tab::before,\n .adw-tab + .adw-tab.active::before,\n .adw-tab:hover + .adw-tab::before,\n .adw-tab + .adw-tab:hover::before {\n opacity: 0;\n }\n\n .adw-tab-title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n }\n\n // --- Icon + indicator slots (AdwTab update_icons) ---\n // Both are mask-image spans carrying `adw-icon adw-icon--<name>`; the element\n // toggles `hidden` from `tabIconState`, whose rules decide which of the two\n // shows — on a pinned tab the indicator REPLACES the icon.\n // Reference: refs/libadwaita/src/adw-tab.c (update_icons, :171-198)\n .adw-tab-icon,\n .adw-tab-indicator {\n flex-shrink: 0;\n width: 16px;\n height: 16px;\n\n &[hidden] {\n display: none;\n }\n }\n\n // `AdwTabPage:loading` swaps the icon image for an `AdwSpinnerPaintable`\n // (`update_icons`, adw-tab.c:172-190) — the SAME paintable `Adw.Spinner` uses.\n // So the tab mounts a real `<adw-spinner>` in the icon's slot and this block\n // only places it. It used to restate `border: 2px`,\n // `rgba(127, 127, 127, 0.25)` and `0.8s` under a comment claiming the geometry\n // and keyframes were adw-spinner's and \"not a second copy of them\" — which is\n // how it inherited every spinner defect independently.\n .adw-tab-spinner {\n flex: none;\n\n &[hidden] {\n display: none;\n }\n }\n\n // A pinned tab is a single-glyph chip: libadwaita hides both the title and the\n // close button at construction (refs/libadwaita/src/adw-tab.c:645-650). The\n // close button is gated in JS by `tabCloseVisible`, which carries the same rule.\n .adw-tab.pinned {\n padding: 0 var(--spacing-xs);\n\n .adw-tab-title {\n display: none;\n }\n }\n\n // `AdwTabPage:needs-attention` — the accent underline libadwaita animates in\n // (refs/libadwaita/src/adw-tab.c update_needs_attention).\n .adw-tab.needs-attention::after {\n content: '';\n position: absolute;\n bottom: 2px;\n left: 50%;\n width: 12px;\n height: 2px;\n transform: translateX(-50%);\n border-radius: 1px;\n background-color: var(--accent-bg-color);\n }\n\n // --- Close affordance (CSS-drawn \"×\"; `window-close` ships, see adw-tab-view.ts) ---\n // Presence is decided in JS by `tabCloseVisible` — `(hovering && fullyVisible)\n // || selected || dragging`, and never on a pinned tab (adw-tab.c:124, :645-650)\n // — which is why the `[hidden]` rule below is load-bearing rather than cosmetic.\n .adw-tab-close {\n box-sizing: border-box;\n flex-shrink: 0;\n position: relative;\n width: 18px;\n height: 18px;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 9999px;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n opacity: 0.7;\n transition:\n background-color 150ms ease-in-out,\n opacity 150ms ease-in-out;\n\n &[hidden] {\n display: none;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--button-hover-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 9px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n }\n\n // Adw.TabBar `expand-tabs` — tabs stretch to fill the bar evenly.\n &[expand-tabs] .adw-tab {\n flex: 1 1 0;\n max-width: none;\n }\n\n // Web-specific escape hatch: static tab sets (e.g. documentation command\n // tabs) render no close affordance.\n &[no-close] .adw-tab-close {\n display: none;\n }\n\n // Single-tab bars draw no tab background (libadwaita keeps a lone tab\n // non-interactive-looking).\n .adw-tab-bar.single-tab .adw-tab {\n &,\n &:hover,\n &:active {\n background: none;\n }\n }\n\n // --- Pages (the AdwTabView content area) ---\n .adw-tab-view-pages {\n flex: 1 1 auto;\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n }\n\n .adw-tab-page {\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n overflow: auto;\n\n &[hidden] {\n display: none;\n }\n\n &.active-page {\n display: block;\n }\n }\n}\n","// _view_switcher.scss — adw-view-switcher styling: an adaptive, tab-style\n// switcher (single `viewswitcher` node) above a content area showing one page\n// at a time. Buttons are always icon + label, laid out side by side (`.wide`)\n// or stacked (`.narrow`), matching libadwaita's policy style classes.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_view-switcher.scss (AdwViewSwitcher)\n// Reference: refs/adwaita-web/adwaita-web/scss/_viewswitcher.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-switcher {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n\n // The segmented button bar — the single `viewswitcher` node in libadwaita.\n // Homogeneous tabs (equal width via flex:1) with a small gutter between them.\n .adw-view-switcher-bar {\n display: flex;\n align-items: stretch;\n gap: 3px; // libadwaita's `border-spacing: 3px`\n min-height: 34px;\n }\n\n // Each tab is a flat, transparent toggle that lights up with a subtle\n // neutral fill when hovered and a slightly stronger one while selected.\n .adw-view-switcher-button {\n box-sizing: border-box;\n display: inline-flex;\n flex: 1 1 0; // homogeneous — every tab gets equal width\n // `min-width: auto` is the flex-item default, and it floors every tab at\n // its own min-content width, so a long title made ITS tab wider than the\n // others and homogeneity silently stopped holding at exactly the widths\n // where it matters. GTK's homogeneous box has no such floor\n // (adw-view-switcher.c:475) and the labels ellipsize instead\n // (adw-view-switcher-button.ui:42), which is what the 0 restores.\n min-width: 0;\n align-items: center;\n justify-content: center;\n margin: 0;\n padding: 2px 12px;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1.2;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n // A page with neither title nor icon has NO button at all\n // (adw-view-switcher.c:178), spelled here as the `hidden` attribute.\n // Re-assert it as an AUTHOR rule: the UA `[hidden] { display: none }`\n // loses to this block's own author `display: inline-flex` (cascade ORIGIN\n // beats specificity), so without this a hidden button stays on screen.\n &[hidden] {\n display: none;\n }\n\n .adw-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n .adw-view-switcher-label {\n // Same min-content floor as the button, one level down: without it the\n // `overflow: hidden` box never shrinks, so the ellipsis never appears\n // and the label pushes its tab wide instead.\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // AdwIndicatorBin's badge — the unread count, or a bare dot when only\n // `needs-attention` is set.\n // Reference: refs/libadwaita/src/adw-indicator-bin.c\n .adw-view-switcher-indicator {\n display: inline-flex;\n box-sizing: border-box;\n align-items: center;\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 8px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 1;\n\n &[hidden] {\n display: none;\n }\n\n &.needs-attention {\n min-width: 6px;\n width: 6px;\n height: 6px;\n padding: 0;\n border-radius: 3px;\n }\n }\n\n // AdwViewSwitcherButton is a `.flat` GtkToggleButton\n // (adw-view-switcher-button.ui:5-7), so its five states are\n // `%button_basic_flat`'s currentColor alpha ladder, NOT the filled-button\n // tokens: hover 7% / pressed 16%, and checked 10% / 13% / 19%\n // (_buttons.scss:250-269 over _colors.scss:268-272). The same ladder the\n // tab bar and the sidebar rows already spell out.\n //\n // It used to spend the FILLED-button tokens here: `--button-active-color`\n // (.19 light / .22 dark) for the selected tab AND for its hover, and\n // `--button-hover-color` (.13 / .15) for an unselected hover. Two defects\n // in one rule. The selected tab sat at the shade upstream keeps for HELD\n // DOWN, so it read as permanently pressed; and pinning its hover to that\n // same value left the selected tab answering the pointer with nothing.\n // Those tokens are also a FIXED rgba, so unlike the ladder they do not\n // follow the foreground of whatever bar the switcher was dropped into.\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The selected view: a neutral fill over the whole tab. libadwaita leaves\n // the foreground alone here, so no accent recolouring of icon or label.\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n }\n\n // Wide policy — icon and label side by side.\n &.wide .adw-view-switcher-button {\n flex-direction: row;\n gap: var(--spacing-xs);\n }\n\n // Narrow policy — icon stacked above a smaller label, the compact layout\n // libadwaita drops to in a header bar at narrow window widths.\n &.narrow {\n .adw-view-switcher-bar {\n min-height: 6px;\n }\n\n .adw-view-switcher-button {\n flex-direction: column;\n gap: 1px;\n // The narrow box carries NO horizontal padding upstream: only\n // `padding-top: 4px`, and the 3px per side plus the 2px below sit on\n // the LABEL (_view-switcher.scss:15-24). Aggregated onto the button\n // here because this port has no separate box node between button and\n // label, which is the same geometry for every label at least as wide\n // as the 16px icon. Overriding only the vertical halves left the wide\n // policy's `2px 12px` standing, so a narrow tab spent 24px on side\n // padding where libadwaita spends 6px.\n padding: 4px 3px 2px;\n font-size: 0.75rem;\n\n .adw-view-switcher-label {\n min-height: 18px;\n line-height: 18px;\n }\n }\n }\n\n // The paired content area showing the active page: the Adw.ViewStack half of\n // this composite, and it draws NOTHING. libadwaita's recommended arrangement\n // is an AdwToolbarView whose top bar holds the switcher and whose `content`\n // is the bare AdwViewStack (adw-view-switcher.c:41-73); no rule in\n // `_view-switcher.scss`, `_toolbars.scss` or `_views.scss` frames that stack,\n // and the standalone `adw-view-stack` element here says the same in its own\n // words.\n //\n // It used to be a card: a 1px separator outline, a 12px radius, a 9px gap\n // under the row and 12px of padding inside. On a page that gives the switcher\n // its full width, that outline runs down the container's own left and right\n // edges with its corners curling away from them, which reads as a broken\n // frame rather than as a view. libadwaita has no line between the row and the\n // content at all: a FLAT top bar (the default, adw-toolbar-view.c:731) has no\n // background and no shade, and the only shading that ever appears is the\n // scroller's undershoot, which `_scrolling.scss` owns per scroller for the\n // reason `_toolbar_view.scss` records.\n //\n // `display: flex` is load-bearing, not decoration: this box is the stack, and\n // `adw-view-stack` is a flex COLUMN for the same reason. Without it the box\n // stays block-level, its child's `flex: 1 1 auto` below has no flex container\n // to answer and is silently inert, and the visible page keeps stopping at its\n // own text in a pane many times its height.\n .adw-view-switcher-content {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // Mirrors `.adw-view-stack-child`: the visible page is handed the whole\n // content area, which is what lets a status page centre itself in it the way\n // AdwViewStack allocates to its visible child.\n .adw-view-switcher-page {\n display: none;\n\n &.active-view {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n}\n","// _inline_view_switcher.scss — adw-inline-view-switcher styling (a compact view\n// switcher: a toggle-group-style bar of one toggle per page over a single\n// stacked content area, with the active toggle drawn as the raised Adwaita\n// active-toggle chip). The bar's per-display-mode sizing (labels / icons / both)\n// mirrors libadwaita's `inline-view-switcher > toggle-group.{labels,icons,both}`.\n// Reference: refs/libadwaita/src/adw-inline-view-switcher.c (AdwInlineViewSwitcher)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toggle-group.scss (inline-view-switcher > toggle-group)\n// Reference: refs/adwaita-web/adwaita-web/scss/_viewswitcher.scss\n// Copyright (c) 2023 Maximiliano Sandoval / 2024 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The active toggle uses a white-on-fg \"raised\" chip — the same tokens the\n// toggle-group uses (defined there; _theme.scss overrides them for dark).\n\nadw-inline-view-switcher {\n // libadwaita's ---group-padding: a small inset so the active chip floats\n // inside the group's pill, leaving a hairline of group background around it.\n --group-padding: 3px;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n\n // The switcher bar — a toggle-group pill, sized to its content.\n .adw-inline-view-switcher-group {\n display: inline-flex;\n box-sizing: border-box;\n align-items: stretch;\n gap: var(--group-padding);\n padding: var(--group-padding);\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n }\n\n // Each toggle is a button-shaped chip with the group's inner radius.\n .adw-inline-view-switcher-toggle {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n min-width: 34px;\n min-height: 28px;\n margin: 0;\n padding: 4px 11px;\n border: none;\n border-radius: calc(var(--button-radius) - var(--group-padding));\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease,\n box-shadow 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // The active toggle — a raised white chip, the way libadwaita draws it.\n &.active {\n background-color: var(--active-toggle-bg-color);\n color: var(--active-toggle-fg-color);\n box-shadow:\n 0 1px 3px 1px rgba(0, 0, 6, 0.07),\n 0 2px 6px 2px rgba(0, 0, 6, 0.03);\n\n &:hover {\n background-color: var(--active-toggle-bg-color);\n }\n }\n }\n\n // The switcher's symbolic icon — a currentColor mask, sized like a toolbar\n // icon (matches the .adw-icon base used across @gjsify/adwaita-web).\n .adw-inline-view-switcher-icon {\n display: inline-block;\n width: 16px;\n height: 16px;\n flex: none;\n background-color: currentColor;\n mask-size: contain;\n mask-repeat: no-repeat;\n mask-position: center;\n -webkit-mask-size: contain;\n -webkit-mask-repeat: no-repeat;\n -webkit-mask-position: center;\n }\n\n .adw-inline-view-switcher-label {\n white-space: nowrap;\n }\n\n // AdwIndicatorBin's badge — the unread count, or a bare dot when only\n // `needs-attention` is set.\n // Reference: refs/libadwaita/src/adw-indicator-bin.c\n .adw-inline-view-switcher-indicator {\n display: inline-flex;\n box-sizing: border-box;\n align-items: center;\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 8px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 1;\n\n // Author rule, not the UA one: the `display: inline-flex` above is also\n // an author rule and would otherwise keep an empty badge on screen\n // (cascade ORIGIN beats specificity — the same trap the bar hit).\n &[hidden] {\n display: none;\n }\n\n &.needs-attention {\n min-width: 6px;\n width: 6px;\n height: 6px;\n padding: 0;\n border-radius: 3px;\n }\n }\n\n // The stacked content area below the bar — exactly one page is visible.\n .adw-inline-view-switcher-pages {\n width: 100%;\n }\n\n .adw-inline-view-switcher-page {\n &:not(.active-view) {\n display: none;\n }\n }\n\n // Per-display-mode sizing, mirroring libadwaita's\n // inline-view-switcher > toggle-group.{icons,labels,both}.\n .adw-inline-view-switcher-group.icons .adw-inline-view-switcher-toggle {\n min-width: 34px;\n padding-left: 0;\n padding-right: 0;\n }\n\n .adw-inline-view-switcher-group.labels .adw-inline-view-switcher-toggle {\n min-width: calc(18px + var(--group-padding) * 2);\n }\n\n // Round — group + toggles become pill-shaped.\n &.round {\n .adw-inline-view-switcher-group {\n border-radius: 17px;\n }\n\n .adw-inline-view-switcher-toggle {\n border-radius: calc(17px - var(--group-padding));\n padding-left: calc(15px - var(--group-padding));\n padding-right: calc(15px - var(--group-padding));\n }\n }\n\n // Flat — no group background; the active toggle uses a subtle fill instead\n // of the raised white chip.\n &.flat {\n --group-padding: 0px;\n\n .adw-inline-view-switcher-group {\n padding: 0;\n background: none;\n }\n\n .adw-inline-view-switcher-toggle {\n border-radius: var(--button-radius);\n\n &.active {\n background-color: var(--button-active-color);\n color: inherit;\n box-shadow: none;\n\n &:hover {\n background-color: var(--button-active-color);\n }\n }\n }\n\n &.round .adw-inline-view-switcher-toggle {\n border-radius: 17px;\n }\n }\n}\n","// _view_stack.scss — adw-view-stack styling: a standalone named-page content\n// container that shows exactly one page at a time (the web counterpart of\n// Adw.ViewStack, decoupled from any switcher). It carries no chrome of its own —\n// a paired adw-view-switcher-bar (or a header-bar switcher) drives selection.\n// Reference: refs/libadwaita/src/adw-view-stack.c (AdwViewStack)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-stack {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n // vexpand-equivalent — fill the space a switcher shell allots to content.\n flex: 1 1 auto;\n min-height: 0;\n\n // Exactly one child is shown; the rest are laid out of flow. `hidden` is set\n // in JS too, but the class keeps the visible page a flex child that grows.\n .adw-view-stack-child {\n display: none;\n\n &.active-view {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n}\n","// _view_switcher_bar.scss — adw-view-switcher-bar styling: the narrow BOTTOM\n// bar of homogeneous icon-over-label buttons bound to an adw-view-stack (the web\n// counterpart of Adw.ViewSwitcherBar). It sits at the window bottom with a top\n// hairline over a headerbar-toned surface, mirroring libadwaita's `.narrow`\n// view-switcher inside an actionbar. The active button's label is accent-tinted.\n// Reference: refs/libadwaita/src/adw-view-switcher-bar.c (AdwViewSwitcherBar)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_view-switcher.scss (.narrow policy)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (actionbar top border)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-switcher-bar {\n display: block;\n\n // `revealed` drives visibility by toggling the `hidden` attribute\n // (_applyRevealed → this.hidden). Re-assert display:none for [hidden] as an\n // AUTHOR rule: the UA `[hidden] { display: none }` loses to this block's own\n // author `display: block` (cascade ORIGIN beats specificity), so without this\n // an unrevealed bar would stay visible. Author + higher specificity → wins.\n &[hidden] {\n display: none;\n }\n\n box-sizing: border-box;\n // The bottom bar over a headerbar-toned surface with a top hairline (the\n // libadwaita `actionbar` inset top border), NOT a bottom border.\n background-color: var(--headerbar-bg-color);\n border-top: 1px solid var(--separator-color);\n padding: 7px 0; // libadwaita `viewswitcherbar > box` vertical padding\n\n // The homogeneous button row — every button gets equal width.\n .adw-view-switcher-bar-box {\n display: flex;\n align-items: stretch;\n // The `.narrow` view-switcher drops to a 6px min-height (icon-over-label).\n min-height: 6px;\n }\n\n // Each button — icon stacked above a small label, a flat transparent toggle\n // that fills on hover/active and marks the selected page with an accent\n // label (the neutral fill stays the same across states, like libadwaita).\n .adw-view-switcher-bar-button {\n box-sizing: border-box;\n display: inline-flex;\n flex: 1 1 0; // homogeneous — equal width\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 1px;\n margin: 0;\n padding: 4px 3px 2px;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: 0.75rem;\n font-weight: 700;\n line-height: 1.2;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n // Same cascade trap as the bar itself: a page with neither title nor\n // icon has no button (adw-view-switcher.c:178), and the UA\n // `[hidden] { display: none }` loses to this block's author\n // `display: inline-flex` unless it is re-asserted here.\n &[hidden] {\n display: none;\n }\n\n .adw-view-switcher-bar-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n .adw-view-switcher-bar-label {\n min-height: 18px;\n line-height: 18px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // AdwIndicatorBin's badge — see refs/libadwaita/src/adw-indicator-bin.c.\n .adw-view-switcher-bar-indicator {\n display: inline-flex;\n box-sizing: border-box;\n align-items: center;\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 8px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 1;\n\n &[hidden] {\n display: none;\n }\n\n &.needs-attention {\n min-width: 6px;\n width: 6px;\n height: 6px;\n padding: 0;\n border-radius: 3px;\n }\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The selected page — its label turns accent-coloured. (The icon stays\n // theme-fg, matching the NS twin's documented fidelity note.)\n &.active {\n color: var(--accent-color);\n\n .adw-view-switcher-bar-label {\n color: var(--accent-color);\n }\n }\n }\n}\n","// _tab_button.scss — <adw-tab-button>.\n//\n// libadwaita's whole `tabbutton` block is three rules (_buttons.scss:647-663): the count\n// is `font-weight: 800` at `font-size: 10.5px`, dropping to `8px` under `.small`, and the\n// indicator sits a pixel back from the leading edge (`translate(-1px, 1px)` in LTR,\n// mirrored in RTL) so it does not touch the plate's stroke. The button itself is a\n// `.image-button` — `min-width: 24px` and 5px of padding either side (_buttons.scss:\n// 66-70) — which is where the counter's 24px outer box comes from.\n//\n// THE PLATE IS CSS, and that is what the two libadwaita glyphs are: `adw-tab-counter.svg`\n// is a 14×14 `rx≈2.94` rect with `stroke-width: 2` and NO fill, and `adw-tab-overflow.svg`\n// is that same rect plus one decorative mark. Both ship in `refs/libadwaita/src/icons/`\n// rather than in an icon theme, so neither is a `@gjsify/adwaita-icons` export and neither\n// could be compiled into the stylesheet — a border and a border-radius is the whole of\n// the counter glyph, and the overflow mark is an ellipsis, which is the shape libadwaita\n// puts between the two digits of a count it is not going to draw.\n//\n// The indicator is `AdwIndicatorBin`'s, whose own rule is in `_view-switcher.scss:83-104`:\n// a 6px dot in `color-mix(currentColor 40%, transparent)` with a 2px margin, turning to\n// `--accent-color` under `.needs-attention`.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss:66-70, 647-663\n// Reference: refs/libadwaita/src/stylesheet/widgets/_view-switcher.scss:83-104\n// (`indicatorbin > indicator`, and `.needs-attention`)\n// Reference: refs/libadwaita/src/icons/adw-tab-counter.svg, adw-tab-overflow.svg\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components — the `GtkImage` under the\n// `GtkLabel` becomes the plate span, and the icon itself is drawn.\n\nadw-tab-button {\n // The `.image-button` numbers, over the `.adw-button` defaults it inherits from the\n // shared button surface (34px and 14px of padding otherwise).\n .adw-button {\n min-width: 24px;\n min-height: 24px;\n padding: 0 5px;\n }\n\n // The `AdwIndicatorBin`: the glyph with the count over it, and the dot beside both.\n .adw-tab-button-indicatorbin {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n }\n\n // The glyph: adw-tab-counter.svg's rounded rectangle, 16×16, a 2px stroke, no fill.\n .adw-tab-button-plate {\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border: 2px solid currentColor;\n border-radius: 3px;\n }\n\n .adw-tab-button-label {\n // \"We're intentionally using pixels here, as this label is a part of the icon\"\n // (_buttons.scss:650) — which is why these are px and not the em-derived sizes the\n // rest of the stylesheet uses.\n position: absolute;\n font-weight: 800;\n font-size: 10.5px;\n line-height: 16px;\n text-align: center;\n width: 16px;\n\n &.small {\n font-size: 8px;\n }\n }\n\n .adw-tab-button-indicator {\n position: absolute;\n top: 0;\n inset-inline-start: 0;\n min-width: 6px;\n min-height: 6px;\n border-radius: 100px;\n margin: 2px;\n background: color-mix(in srgb, currentColor 40%, transparent);\n\n // `&.needs-attention > indicator { background: var(--accent-color) }`\n // (_view-switcher.scss:100-102).\n &.needs-attention {\n background: var(--accent-color);\n }\n }\n\n // The overflow mark, for a count of a hundred pages or more — the label is hidden\n // there, exactly as `update_icon` hides it.\n .adw-tab-button-indicatorbin.overflow .adw-tab-button-plate::after {\n content: '\\22ef';\n font-size: 8px;\n line-height: 12px;\n display: block;\n text-align: center;\n }\n}\n","// _tab_overview.scss — <adw-tab-overview>: the grid of tab thumbnails that covers an\n// <adw-tab-view>. Closed, the element is just the view; open, a toolbar-view surface\n// sits on top with a header bar, a search strip, the two grids and the empty states.\n//\n// The rules are libadwaita's own, ported node for node:\n// · `tabthumbnail { border-radius: $card_radius + 4px; > box { margin: 6px } }`\n// · the `.needs-attention` gizmo: 12px accent dot, `border-radius: 8px`, `margin: 3px`,\n// offset `translate(8px, -8px)` from the leading top corner\n// · the `.card > picture` outline (`$window_outline_color`, offset -1px, card radius)\n// · a PINNED thumbnail paints the card with `--thumbnail-bg-color`/`-fg-color`\n// · the close/indicator buttons: no plate at rest, a 24px `--thumbnail-bg-color` disc\n// behind the 24px symbolic, tinted further toward `currentColor` on hover and active\n// · `taboverview > .overview`: the overview colours, and `.new-tab-button { margin: 18px }`\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:187-300\n// Reference: refs/libadwaita/src/adw-tab-overview.ui (the node tree this mirrors)\n// Copyright (c) 2021-2022 Purism SPC / GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components. `adw-tab-unpin-symbolic`\n// and `adw-tab-new-symbolic` are libadwaita-BUNDLED glyphs with no mask class, so the\n// unpin mark is drawn here and the new-tab button uses the theme's `list-add`.\n\nadw-tab-overview {\n display: block;\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n\nadw-tab-overview > .adw-tab-overview-child {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n box-sizing: border-box;\n}\n\nadw-tab-overview > .adw-tab-overview-child.background {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n\nadw-tab-overview > .adw-tab-overview-toolbar[hidden] {\n display: none;\n}\n\nadw-tab-overview > .adw-tab-overview-toolbar {\n position: absolute;\n inset: 0;\n z-index: 2;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n // `taboverview > .overview`\n color: var(--overview-fg-color);\n background-color: var(--overview-bg-color);\n animation: adw-tab-overview-in 200ms cubic-bezier(0, 0, 0.2, 1);\n}\n\n@keyframes adw-tab-overview-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\nadw-tab-overview .overview-header-bar {\n flex-shrink: 0;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n}\n\nadw-tab-overview .overview-header-bar[hidden] {\n display: none;\n}\n\nadw-tab-overview .overview-title-buttons {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n min-height: 24px;\n}\n\nadw-tab-overview .overview-title-buttons.start {\n margin-inline-end: auto;\n}\n\nadw-tab-overview .overview-title-buttons.end {\n margin-inline-start: auto;\n}\n\nadw-tab-overview .overview-title-buttons[hidden] {\n display: none;\n}\n\nadw-tab-overview .overview-title {\n flex: 1 1 auto;\n min-width: 0;\n font-weight: bold;\n text-align: center;\n}\n\nadw-tab-overview .search-button,\nadw-tab-overview .secondary-menu-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 24px;\n min-height: 24px;\n padding: 0;\n}\n\nadw-tab-overview .search-button[hidden],\nadw-tab-overview .secondary-menu-button[hidden] {\n display: none;\n}\n\n// The GtkSearchBar's revealer (`searchbar > revealer > box`, _toolbars.scss:113-185):\n// seven pixels of vertical padding around the entry.\nadw-tab-overview .overview-search-bar {\n flex-shrink: 0;\n padding: 7px 0;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n}\n\nadw-tab-overview .overview-search-bar[hidden] {\n display: none;\n}\n\nadw-tab-overview .overview-search-clamp {\n box-sizing: border-box;\n width: 100%;\n max-width: 400px;\n margin-inline: auto;\n padding-inline: var(--spacing-m);\n}\n\nadw-tab-overview .overview-search-entry {\n box-sizing: border-box;\n width: 100%;\n font: inherit;\n color: inherit;\n}\n\nadw-tab-overview .adw-tab-overview-content {\n position: relative;\n display: flex;\n flex: 1 1 auto;\n min-height: 0;\n box-sizing: border-box;\n}\n\nadw-tab-overview .adw-tab-overview-scroll {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-l);\n flex: 1 1 auto;\n min-height: 0;\n padding: var(--spacing-l);\n box-sizing: border-box;\n overflow-y: auto;\n scrollbar-width: thin;\n}\n\nadw-tab-overview .adw-tab-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));\n gap: var(--spacing-l);\n align-content: start;\n}\n\nadw-tab-overview .adw-tab-grid[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-grid:focus-visible {\n outline: none;\n}\n\nadw-tab-overview .overview-empty-state,\nadw-tab-overview .overview-search-empty-state {\n position: absolute;\n inset: 0;\n background-color: var(--overview-bg-color);\n color: var(--overview-fg-color);\n}\n\nadw-tab-overview .overview-empty-state[hidden],\nadw-tab-overview .overview-search-empty-state[hidden] {\n display: none;\n}\n\nadw-tab-overview .new-tab-button {\n position: absolute;\n inset-inline: 0;\n bottom: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n // `.new-tab-button { margin: 18px }`\n margin: 18px;\n padding: 6px 18px;\n box-sizing: border-box;\n}\n\nadw-tab-overview .new-tab-button[hidden] {\n display: none;\n}\n\nadw-tab-overview .new-tab-button-icon {\n width: 16px;\n height: 16px;\n flex: none;\n}\n\n// --- The thumbnail (adw-tab-thumbnail.ui) ---------------------------------\n\nadw-tab-overview .adw-tab-thumbnail {\n // `tabthumbnail { border-radius: $card_radius + 4px }`\n border-radius: calc(var(--card-radius, 12px) + 4px);\n}\n\nadw-tab-overview .adw-tab-thumbnail > .contents {\n // `> box { margin: 6px }` — the 6px gap a GtkBox's vertical spacing also produces.\n display: flex;\n flex-direction: column;\n gap: 6px;\n margin: 6px;\n}\n\nadw-tab-overview .adw-tab-thumbnail:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n}\n\nadw-tab-overview .adw-tab-thumbnail .thumbnail {\n position: relative;\n box-sizing: border-box;\n}\n\nadw-tab-overview .adw-tab-thumbnail .card {\n position: relative;\n display: flex;\n aspect-ratio: 16 / 10;\n box-sizing: border-box;\n overflow: hidden;\n border-radius: var(--card-radius, 12px);\n background-color: var(--thumbnail-bg-color);\n color: var(--thumbnail-fg-color);\n transition: box-shadow 200ms cubic-bezier(0, 0, 0.2, 1);\n}\n\nadw-tab-overview .adw-tab-thumbnail:not(.selected) .card {\n box-shadow: 0 1px 2px rgb(0 0 6 / 8%);\n}\n\nadw-tab-overview .adw-tab-thumbnail.selected .card {\n box-shadow: 0 0 0 2px var(--accent-color);\n}\n\n// `.card > picture { outline: 1px solid $window_outline_color; outline-offset: -1px }`\nadw-tab-overview .adw-tab-thumbnail .picture {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n padding: var(--spacing-m);\n outline: 1px solid var(--window-outline-color, rgb(0 0 6 / 50%));\n outline-offset: -1px;\n border-radius: var(--card-radius, 12px);\n}\n\n// The stand-in for `GtkPicture`'s `GdkPaintable`: GTK paints the page widget into a\n// texture (`adw_tab_page_get_paintable`), which no browser can do. The title is drawn\n// where the portrait was, in the thumbnail's own dimmed colour.\nadw-tab-overview .adw-tab-thumbnail .picture-portrait {\n font-weight: 800;\n font-size: 1.05em;\n line-height: 1.2;\n text-align: center;\n opacity: 0.55;\n overflow-wrap: anywhere;\n}\n\n// `&.pinned .card { background-color: var(--thumbnail-bg-color); color: … }`\nadw-tab-overview .adw-tab-thumbnail .card {\n background-color: transparent;\n color: inherit;\n}\n\nadw-tab-overview .adw-tab-thumbnail .needs-attention {\n position: absolute;\n inset-inline-end: 0;\n top: 0;\n // `&:dir(ltr) { transform: translate(8px, -8px) }`\n transform: translate(calc(var(--spacing-xs) * -1), calc(var(--spacing-xs) * -1));\n pointer-events: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .needs-attention[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .needs-attention > .gizmo {\n display: block;\n background-color: var(--accent-color);\n min-width: 12px;\n min-height: 12px;\n border-radius: 8px;\n margin: 3px;\n box-shadow: 0 1px 2px color-mix(in srgb, var(--accent-color) 40%, transparent);\n}\n\nadw-tab-overview .adw-tab-thumbnail .icon-title-box {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n min-width: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-icon {\n flex: none;\n width: 16px;\n height: 16px;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-icon[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-spinner {\n flex: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-label {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n// `> image { margin: 6px; min-width/min-height: 24px; border-radius: 9999px;\n// background-color: color-mix(in srgb, var(--thumbnail-bg-color) 75%, transparent) }`\nadw-tab-overview .adw-tab-thumbnail .tab-close-button,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator {\n position: absolute;\n top: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 99px;\n background: none;\n box-shadow: none;\n color: inherit;\n cursor: pointer;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button {\n inset-inline-end: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-indicator {\n inset-inline-start: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button[hidden],\nadw-tab-overview .adw-tab-thumbnail .tab-indicator[hidden],\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-icon,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator-icon {\n width: 24px;\n height: 24px;\n margin: 6px;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--thumbnail-bg-color, currentColor) 75%, transparent);\n transition: background-color 150ms ease-in-out;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button:hover .tab-close-icon,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator:hover .tab-indicator-icon {\n background-color: color-mix(\n in srgb,\n var(--thumbnail-bg-color, currentColor) calc(0.9 * 75%),\n currentColor calc(0.1 * 75%)\n );\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button:active .tab-close-icon,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator:active .tab-indicator-icon {\n background-color: color-mix(\n in srgb,\n var(--thumbnail-bg-color, currentColor) calc(0.8 * 75%),\n currentColor calc(0.2 * 75%)\n );\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-icon[hidden],\nadw-tab-overview .adw-tab-thumbnail .tab-indicator-icon[hidden] {\n display: none;\n}\n\n// `adw-tab-unpin-symbolic`: a libadwaita-bundled glyph with no mask class. The pin is a\n// filled wedge with a stem, drawn here so the thumbnail says what C's says.\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon {\n position: absolute;\n top: 0;\n inset-inline-end: 0;\n box-sizing: border-box;\n width: 36px;\n height: 36px;\n margin: 0;\n padding: 0;\n border: none;\n background: none;\n color: inherit;\n cursor: pointer;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon::before {\n content: \"\";\n display: block;\n width: 24px;\n height: 24px;\n margin: 6px;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--thumbnail-bg-color, currentColor) 75%, transparent);\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon::after {\n content: \"\";\n position: absolute;\n top: 14px;\n inset-inline-end: 15px;\n width: 10px;\n height: 8px;\n background-color: currentColor;\n clip-path: polygon(50% 0, 100% 100%, 0 100%);\n}\n\n// `inverted` puts the close/unpin button at the START and the indicator at the END\n// (adw-tab-overview.c:1626-1634).\nadw-tab-overview .adw-tab-thumbnail.inverted .tab-close-button,\nadw-tab-overview .adw-tab-thumbnail.inverted .tab-unpin-icon {\n inset-inline-end: auto;\n inset-inline-start: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail.inverted .tab-indicator {\n inset-inline-start: auto;\n inset-inline-end: 0;\n}\n\n@media (prefers-contrast: more) {\n adw-tab-overview .adw-tab-thumbnail .picture {\n outline-color: var(--window-outline-color-hc, rgb(0 0 6 / 75%));\n }\n\n adw-tab-overview .adw-tab-thumbnail .card {\n box-shadow: 0 0 0 1px rgb(0 0 6 / 50%);\n }\n\n adw-tab-overview .adw-tab-thumbnail .tab-close-icon,\n adw-tab-overview .adw-tab-thumbnail .tab-indicator-icon,\n adw-tab-overview .adw-tab-thumbnail .tab-unpin-icon::before {\n box-shadow: 0 0 0 1px currentColor;\n }\n}","// _view_switcher_sidebar.scss — <adw-view-switcher-sidebar>: an <adw-sidebar> driven\n// from an <adw-view-stack>'s page list. libadwaita styles exactly ONE thing of its own —\n// the row indicator, and only the number/dot shape inside it — because the sidebar look\n// comes from `_sidebars.scss` and this element drives that widget rather than\n// reimplementing it.\n//\n// Ported from `view-switcher-sidebar .indicator` (adw-view-switcher-sidebar.c:133-181):\n// · `background: color-mix(in srgb, currentColor 40%, transparent)`, `border-radius: 999px`\n// · `min-width/min-height: 1.6em`, `font-weight: bold`, `font-size: smaller`\n// · `.dot` shrinks it to 8×8 — the unread mark with no count\n// · `> label` is white with 6px of padding each side\n// · `.needs-attention` swaps in `--accent-bg-color`/`--accent-fg-color`\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss:250-277\n// Reference: refs/libadwaita/src/adw-view-switcher-sidebar.c:104-112, :133-181, :225-249\n// Copyright (c) 2025 GNOME Foundation Inc. (libadwaita). LGPLv2.1-or-later.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-switcher-sidebar {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n min-height: 0;\n color: inherit;\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-box {\n position: relative;\n display: flex;\n flex: 1 1 auto;\n min-height: 0;\n}\n\nadw-view-switcher-sidebar > adw-sidebar {\n flex: 1 1 auto;\n min-height: 0;\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-placeholder {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n background-color: var(--sidebar-bg-color, var(--window-bg-color));\n color: var(--sidebar-fg-color, var(--window-fg-color));\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-placeholder[hidden] {\n display: none;\n}\n\n// `&:not(.page).empty statuspage { @extend .compact }` — the empty state is compact in\n// sidebar mode and a full page in `page` mode, where it is one of several boxed pages.\nadw-view-switcher-sidebar.page > .view-switcher-sidebar-placeholder {\n position: static;\n margin: var(--spacing-m);\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-prefix,\nadw-view-switcher-sidebar > .view-switcher-sidebar-suffix {\n flex-shrink: 0;\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-prefix:empty,\nadw-view-switcher-sidebar > .view-switcher-sidebar-suffix:empty,\nadw-view-switcher-sidebar > .view-switcher-sidebar-placeholder:empty {\n display: none;\n}\n\n// --- The row indicator ----------------------------------------------------\n\nadw-view-switcher-sidebar .indicator {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n box-sizing: border-box;\n min-width: 1.6em;\n min-height: 1.6em;\n margin-inline-start: auto;\n border-radius: 999px;\n background: color-mix(in srgb, currentColor 40%, transparent);\n font-weight: bold;\n font-size: smaller;\n line-height: 1;\n}\n\nadw-view-switcher-sidebar .indicator[hidden] {\n display: none;\n}\n\nadw-view-switcher-sidebar .indicator.dot {\n min-width: 8px;\n min-height: 8px;\n}\n\nadw-view-switcher-sidebar .indicator > label,\nadw-view-switcher-sidebar .indicator > .numeric {\n color: white;\n padding-left: 6px;\n padding-right: 6px;\n}\n\nadw-view-switcher-sidebar .indicator.needs-attention {\n background: var(--accent-bg-color);\n}\n\nadw-view-switcher-sidebar .indicator.needs-attention > label,\nadw-view-switcher-sidebar .indicator.needs-attention > .numeric {\n color: var(--accent-fg-color);\n}","// _navigation_view.scss — adw-navigation-view styling (a page-based navigation\n// container; one page visible at a time, controlled with push/pop). The visible\n// page fills the view on the window background; an automatic back button is\n// drawn flat at the start of the visible page's header bar.\n// Reference: refs/libadwaita/src/adw-navigation-view.c (css node \"navigation-view\")\n// Reference: refs/adwaita-web/adwaita-web/docs/widgets/navigationview.md\n// Copyright (c) 2022-2023 Purism SPC / GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-navigation-view {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n position: relative;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n // The page stack — fills the view when it is given a height, and MEASURES the\n // visible page when it is not. A flex column rather than a positioning\n // context: the page is an in-flow item, so its content reaches the view.\n .adw-navigation-view-pages {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n position: relative;\n box-sizing: border-box;\n min-height: 0;\n overflow: hidden;\n }\n\n // A single navigation page — the visible one fills the view, the rest are\n // `display: none`.\n //\n // IN FLOW, not absolute. It was `position: absolute; inset: 0` under a comment\n // saying it had to be \"so a transition can overlap two pages\" — but two pages\n // never overlap here: `adw-navigation-view.ts` marks every page but the\n // visible one `[hidden]`, which is `display: none` below, and the push\n // animation runs on `.visible-page` alone. So the absolute positioning bought\n // an overlap that does not happen, and what it cost was the HEIGHT: an\n // absolutely-positioned child contributes nothing to its parent, so the page\n // stack measured 0, the view above it measured 0, and the page — `inset: 0` of\n // a zero-height parent — measured 0 in turn. A closed circle.\n //\n // Inside a window that never showed, because a definite height arrived from\n // outside. `<adw-about-dialog>` is the case where none does: its sheet is\n // `position: fixed` with a width and no height, exactly as\n // `adw-about-dialog.ui` declares it (`content-width` 360, no content-height —\n // libadwaita takes the height from the content). The whole dialog rendered\n // invisible, with a header bar inside it genuinely measuring 47px.\n //\n // `flex: 1 1 auto` keeps the fill: given a height the page still grows into\n // it; without one it reports its content.\n .adw-navigation-page {\n box-sizing: border-box;\n position: relative;\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n overflow: auto;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n &[hidden] {\n display: none;\n }\n\n &.visible-page {\n display: flex;\n }\n\n // Let a page whose direct child fills (a toolbar-view / status-page)\n // stretch to the full height.\n > * {\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n\n // The injected automatic back button — flat, sits at the start of the visible\n // page's header bar (mirrors AdwHeaderBar's grown-in back button).\n .adw-navigation-back-button {\n flex-shrink: 0;\n }\n\n // Slide transition for the visible page when transitions are animated. The\n // entering page fades up from a slight horizontal offset (LTR push), matching\n // libadwaita's spring-driven slide closely enough for the web target.\n &.animated .adw-navigation-page.visible-page {\n animation: adw-navigation-page-in 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n }\n}\n\n@keyframes adw-navigation-page-in {\n from {\n opacity: 0;\n transform: translateX(12px);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n","// _bottom_sheet.scss — adw-bottom-sheet styling (a content area with a sheet\n// that slides up from the bottom edge over the content, with an overlaid drag\n// handle). Mirrors libadwaita's AdwBottomSheet CSS node tree: a persistent\n// content layer, a dimming layer that fades in over it while open (modal), and\n// the sheet itself anchored to the bottom edge with rounded top corners + the\n// pill-shaped drag handle.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_bottom-sheet.scss\n// (dimming / sheet box-shadow / drag-handle pill / dialog top radius)\n// Reference: refs/libadwaita/src/adw-bottom-sheet.c (open / modal / can-close)\n// Copyright (c) 2023-2024 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-bottom-sheet {\n display: block;\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n // --- Persistent content layer ---\n // A grid rather than a block, as GTK's content bin allocates its child the whole area and\n // lets the child's `halign` / `valign` place it (`_widget.scss`); a block container\n // resolves a vertical auto margin to zero.\n .adw-bottom-sheet-content {\n display: grid;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n }\n\n // --- Dimming layer (modal scrim over the content) ---\n // libadwaita: > dimming { background: shade-color × 2 }. Non-interactive +\n // transparent when the sheet is closed.\n .adw-bottom-sheet-dimming {\n position: absolute;\n inset: 0;\n box-sizing: border-box;\n background-color: rgba(0, 0, 6, 0.32);\n opacity: 0;\n visibility: hidden;\n pointer-events: none;\n transition:\n opacity 200ms ease,\n visibility 0s linear 200ms;\n\n &.visible {\n opacity: 1;\n visibility: visible;\n pointer-events: auto;\n transition:\n opacity 200ms ease,\n visibility 0s;\n }\n }\n\n // --- The slide-up sheet ---\n // Anchored to the bottom edge, full-width, rounded top corners (dialog\n // radius), slid off-screen when closed. The spring-driven AdwBottomSheet uses\n // a translate; the web port uses an eased transform for the same effect.\n .adw-bottom-sheet-sheet {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n box-sizing: border-box;\n max-height: 100%;\n overflow: auto;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n border-top-left-radius: var(--window-radius);\n border-top-right-radius: var(--window-radius);\n box-shadow:\n 0 0 14px 2px rgba(0, 0, 6, 0.03),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 0 1px rgba(0, 0, 0, 0.05);\n transform: translateY(100%);\n transition:\n transform 250ms ease,\n box-shadow 250ms ease;\n will-change: transform;\n }\n\n // --- Drag handle (overlaid pill at the top of the sheet) ---\n // libadwaita: > drag-handle { min-width 54px; min-height 6px; margin 15px;\n // border-radius 99px; background currentColor @ 25% }.\n // It is built with can_focus = FALSE and can_target = FALSE\n // (adw-bottom-sheet.c:1197-1198) — a decorative pill, not a button;\n // `pointer-events: none` is can_target in CSS. The `cursor: pointer` + focus\n // ring that used to sit here belonged to a close button this widget never had.\n .adw-bottom-sheet-drag-handle {\n flex-shrink: 0;\n box-sizing: border-box;\n width: 54px;\n min-height: 6px;\n height: 6px;\n margin: 15px auto;\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 25%, transparent);\n pointer-events: none;\n }\n\n .adw-bottom-sheet-sheet-body {\n box-sizing: border-box;\n }\n\n // --- Bottom bar (the collapsed form the sheet morphs out of) ---\n // libadwaita: > sheet > stack > button — a flat, radius-less button filling the bar,\n // with the sheet's top radius carried over, and `.inert` stripping only the feedback.\n // It is a real button because upstream's bin is one (adw-bottom-sheet.c:1203).\n .adw-bottom-sheet-bottom-bar {\n display: block;\n box-sizing: border-box;\n width: 100%;\n min-width: 0;\n min-height: 0;\n padding: 0;\n border: none;\n border-radius: 0;\n font: inherit;\n font-weight: inherit;\n color: inherit;\n background: none;\n box-shadow: none;\n cursor: pointer;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 5%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n }\n\n // can-open off. The button stays enabled and focusable — only the feedback goes,\n // because upstream refuses the click in the handler, not in the widget\n // (adw-bottom-sheet.c:2033-2036).\n &.inert {\n cursor: default;\n\n &:hover,\n &:active {\n background: none;\n }\n }\n }\n\n // --- Open state ---\n &.open .adw-bottom-sheet-sheet {\n transform: translateY(0);\n }\n\n // --- Bottom-bar state ---\n // The sheet bin sits at rest with only the bar exposed. This transform is the port's\n // `gtk_widget_set_child_visible` for the bin, so it is what `reveal-bottom-bar` takes\n // away: no class here, and the bin slides off screen with the bar still inside it.\n &.showing-bottom-bar .adw-bottom-sheet-sheet {\n transform: translateY(0);\n box-shadow:\n 0 0 0 1px rgba(0, 0, 6, 0.06),\n 0 2px 8px 2px rgba(0, 0, 6, 0.06),\n 0 3px 20px 10px rgba(0, 0, 6, 0.05);\n }\n\n // A non-modal sheet must not block the content beneath it.\n &:not(.modal) .adw-bottom-sheet-dimming {\n display: none;\n }\n}\n","// _sidebar.scss — adw-sidebar styling (a selectable navigation sidebar built\n// from titled sections of icon + title + subtitle items). In sidebar mode it\n// renders as the flat AdwSidebar navigation list (`.navigation-sidebar`); in\n// page mode it renders as boxed lists with a trailing chevron on each row (the\n// AdwPreferencesPage look the native widget switches to when collapsed).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss (.navigation-sidebar, sidebar)\n// Reference: refs/libadwaita/src/adw-sidebar.c (row/header/section structure)\n// Copyright (c) 2025 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-sidebar {\n display: block;\n box-sizing: border-box;\n overflow-y: auto;\n background-color: var(--sidebar-bg-color, var(--window-bg-color));\n color: var(--sidebar-fg-color, var(--window-fg-color));\n\n .adw-sidebar-list {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n // libadwaita's menu margins around the navigation list.\n padding: var(--spacing-xs) 0;\n }\n\n .adw-sidebar-section {\n display: flex;\n flex-direction: column;\n }\n\n // --- Section headers (heading or separator) ---\n .adw-sidebar-section-header {\n &[hidden] {\n display: none;\n }\n\n // Untitled section → a horizontal separator before its rows (the way the\n // AdwSidebar header stack shows its \"separator\" child).\n &.separator {\n height: 1px;\n margin: var(--spacing-xs) var(--spacing-s);\n background-color: var(--separator-color, var(--card-shade-color));\n }\n\n &.has-title {\n padding: var(--spacing-s) calc(var(--spacing-s) + 6px) var(--spacing-xs);\n\n // The first header sits flush with the top (mirrors `.header.first`).\n &.first {\n padding-top: 0;\n }\n }\n }\n\n .adw-sidebar-section-heading {\n font-size: var(--font-size-small);\n font-weight: 700;\n opacity: var(--dim-opacity);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // --- A single item row ---\n //\n // NO `width: 100%`. The list is a column flex container, so a row already\n // stretches to it — and stretching SUBTRACTS the row's own margins, which is\n // what puts the same 6px of air on both sides. `width: 100%` resolves against\n // the containing block INSTEAD, which does not know about the margins, so\n // every row came out 12px too wide: inset 6px on the left, hanging 6px past\n // the right edge with its rounded corners cut off by the pane. Visible on any\n // selected or hovered row, because only a filled row shows where it ends.\n .adw-sidebar-item {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 36px;\n // The native row has a context menu, so padding lives on the inner box and\n // the row itself carries the menu margin + radius.\n margin: 0 var(--spacing-xs) 2px;\n padding: 3px 14px;\n border: none;\n border-radius: var(--button-radius, 6px);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition:\n background-color 150ms ease-in-out,\n color 150ms ease-in-out;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color, var(--button-hover-color));\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // Selected row — a neutral filled highlight; libadwaita's AdwSidebar\n // selection is a subtle fill with the normal foreground, not accent.\n &.selected {\n background-color: var(--button-active-color);\n color: var(--window-fg-color);\n\n &:hover,\n &:active {\n background-color: var(--button-active-color);\n }\n }\n }\n\n .adw-sidebar-item-icon {\n flex-shrink: 0;\n\n &[hidden] {\n display: none;\n }\n }\n\n .adw-sidebar-item-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n .adw-sidebar-item-title {\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n &[hidden] {\n display: none;\n }\n }\n\n .adw-sidebar-item-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n &[hidden] {\n display: none;\n }\n }\n\n // The trailing chevron is only drawn in page (boxed-list) mode.\n .adw-sidebar-item-arrow {\n flex-shrink: 0;\n opacity: var(--dim-opacity);\n display: none;\n }\n\n // --- Page mode (boxed lists) ---\n // Sections become bordered, rounded cards (the AdwPreferencesGroup look) and\n // each row gains its trailing chevron; selection no longer fills the row with\n // the accent color, matching how the native widget drops the list selection\n // in page mode.\n &.page {\n .adw-sidebar-list {\n padding: var(--spacing-m);\n gap: var(--spacing-xs);\n }\n\n .adw-sidebar-section {\n border: 1px solid var(--card-shade-color);\n border-radius: var(--card-radius, 12px);\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n overflow: hidden;\n }\n\n .adw-sidebar-section-header.has-title {\n padding: var(--spacing-m) var(--spacing-xs) var(--spacing-xs);\n\n &.first {\n padding-top: var(--spacing-m);\n }\n }\n\n .adw-sidebar-item {\n margin: 0;\n padding: var(--spacing-s) var(--spacing-m);\n border-radius: 0;\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n &.selected {\n background-color: transparent;\n color: var(--card-fg-color);\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n }\n }\n\n .adw-sidebar-item-arrow {\n display: inline-block;\n }\n }\n}\n\n// `.navigation-sidebar` — the documented class a consumer puts on its OWN list\n// to get the sidebar look without `<adw-sidebar>`: transparent background,\n// rounded and padded items, and a NEUTRAL selection instead of an accent one\n// (style-classes.md \"Sidebars\", `_sidebars.scss:113-205`).\n//\n// `<adw-sidebar>` renders the same look from its own structure classes above; it\n// is not rewritten in terms of this class, because its rows carry an icon,\n// title, subtitle and arrow that a bare list does not have. What IS shared is\n// the metric: `$menu_margin` (6px) around the list and on each row, and\n// `$button_radius` corners.\n.navigation-sidebar {\n &,\n &.view,\n &.view:disabled {\n background-color: transparent;\n color: inherit;\n }\n\n &.background {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n }\n\n padding-top: var(--spacing-xs);\n // 6px minus the last row's own 2px margin, upstream's `$menu_margin - 2px`.\n padding-bottom: 4px;\n\n > * {\n margin: 0 var(--spacing-xs) 2px;\n padding: 3px 14px;\n border-radius: var(--button-radius);\n }\n\n > .activatable {\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n }\n\n > [aria-selected='true'],\n > .selected {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n}\n","// _gtk_about_dialog.scss — <gtk-about-dialog> styling: the GTK about window's own\n// layout, which is NOT libadwaita's `<adw-about-dialog>` (a navigation view of\n// preference rows) but a bold name over a 128px logo and a four-page stack, with a\n// stack switcher where the headerbar's title widget goes.\n//\n// The DIALOG itself (scrim, sheet, header, close button) is not restated here: it is\n// `<adw-dialog>`'s chrome, which this element inherits, so the rules below only cover\n// the parts `gtkaboutdialog.ui` declares and nothing styles upstream either.\n//\n// Reference: refs/gtk/gtk/ui/gtkaboutdialog.ui (the tree: 12px inner spacing, 5px\n// outer margins, 8px page spacing, the 400x100 stack, the framed scrolled pages)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:46-56\n// (`window.aboutdialog:not(.ssd-frame)`: a FLAT titlebar, and `image.large-icons`\n// at 128px — which is `icon-size: 2`, GTK's DIALOG size)\n// Reference: refs/gtk/gtk/gtkaboutdialog.c:1066-1082 (the bold name label, the\n// centre justification, the version label's own markup)\n// Copyright (c) 2008-2024 Red Hat, Inc. / The GTK authors. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-about-dialog {\n // The `.ui` spacing, verbatim: the outer box is 5px all round with 2px between the\n // two children (the head), and the head is 5px all round with 12px between the logo,\n // the name and the stack.\n .adw-gtk-about-dialog-box {\n display: flex;\n flex-direction: column;\n gap: 2px;\n padding: 5px;\n min-width: 320px;\n min-height: 220px;\n }\n\n .adw-gtk-about-dialog-head {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n padding: 5px;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // `image.large-icons` → 128px. The slot exists so the logo can be absent entirely\n // without the name moving up a line: `GtkImage` is a template child and is always\n // there in GTK, so the space above the name is always reserved.\n .adw-gtk-about-dialog-logo-slot {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 128px;\n }\n\n .adw-gtk-about-dialog-logo {\n width: 128px;\n height: 128px;\n // `icon-dropshadow` on the `.ui`'s logo image.\n filter: drop-shadow(0 1px 2px rgba(0, 0, 6, 0.25));\n }\n\n // `<span weight=\"bold\">` from `update_name_version`, centred like every label in the\n // box (`justify: 2`).\n .adw-gtk-about-dialog-name {\n font-weight: bold;\n font-size: 1.1em;\n text-align: center;\n user-select: text;\n }\n\n // `GtkStack` with `width-request: 400`, `height-request: 100`, and the crossfade\n // transition (16) at 600ms.\n .adw-gtk-about-dialog-stack {\n position: relative;\n display: flex;\n width: 100%;\n min-width: 300px;\n min-height: 100px;\n flex: 1 1 auto;\n }\n\n .adw-gtk-about-dialog-page {\n display: flex;\n flex-direction: column;\n gap: 8px;\n flex: 1 1 auto;\n justify-content: center;\n text-align: center;\n padding: 6px 12px;\n // The crossfade between pages: 600ms is the `.ui`'s `transition-duration`.\n animation: adw-gtk-about-dialog-page-in 600ms ease;\n }\n\n .adw-gtk-about-dialog-version,\n .adw-gtk-about-dialog-comments,\n .adw-gtk-about-dialog-copyright {\n // `wrap: 1` with `max-width-chars: 60` on the comments and copyright labels.\n max-width: 60ch;\n margin: 0 auto;\n }\n\n .adw-gtk-about-dialog-website,\n .adw-gtk-about-dialog-license,\n .adw-gtk-about-dialog-license-link {\n max-width: 60ch;\n margin: 0 auto;\n }\n\n // `GtkStackSwitcher` in the titlebar: a row of flat buttons, the visible page's\n // checked. No title text beside them, because the `.ui` declares none.\n .adw-gtk-about-dialog-switcher {\n display: flex;\n align-items: center;\n gap: 2px;\n }\n\n .adw-gtk-about-dialog-switcher-item {\n padding: 6px 12px;\n border-radius: 999px;\n font-weight: 500;\n color: var(--window-fg-color);\n background-color: transparent;\n border: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:checked,\n &.checked {\n background-color: var(--button-active-color);\n }\n }\n\n // The three framed pages: a scrolled window with `has-frame` around a `.view`\n // viewport, and the credits grid inside it.\n .adw-gtk-about-dialog-scrolled {\n flex: 1 1 auto;\n min-height: 0;\n overflow: auto;\n border: 1px solid var(--border-color);\n border-radius: 9px;\n background-color: var(--view-bg-color);\n }\n\n .adw-gtk-about-dialog-text {\n margin: 5px;\n // `GTK_WRAP_NONE` unless `wrap-license` asked for `GTK_WRAP_WORD`.\n white-space: pre;\n font-size: 0.9em;\n }\n\n .adw-gtk-about-dialog-text-view.wrap .adw-gtk-about-dialog-text {\n white-space: pre-wrap;\n }\n\n // `add_credits_section`: a two-column grid, headings right-aligned in column 0 and\n // people left-aligned in column 1, with 2px between rows and 8px between columns.\n .adw-gtk-about-dialog-credits-grid {\n display: grid;\n grid-template-columns: max-content 1fr;\n gap: 2px 8px;\n padding: 5px;\n align-items: center;\n }\n\n .adw-gtk-about-dialog-credits-heading {\n text-align: right;\n font-size: 0.9em;\n font-weight: 500;\n }\n\n .adw-gtk-about-dialog-credits-person {\n text-align: left;\n font-size: 0.9em;\n user-select: text;\n }\n}\n\n@keyframes adw-gtk-about-dialog-page-in {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}","// _emoji_chooser.scss — <gtk-emoji-chooser> styling, mirroring libadwaita's\n// `_emoji-chooser.scss` node for node.\n//\n// The upstream partial is short because GTK does the work: `popover.emoji-picker > contents`\n// gets no padding, the two boxes get theirs, and the section buttons are circular flat\n// image buttons. What it does NOT style is the list itself — GTK's `.view` scrolled\n// window and `GtkFlowBox` do that — so the flow box, the headings and the empty page are\n// spelled out here from the `.ui` instead (6px margins and spacing, a heading label per\n// section, and the `edit-find` glyph at 72px over \"No Results Found\").\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_emoji-chooser.scss:1-57\n// (`popover.emoji-picker > contents`, `.emoji-searchbar`, `.emoji-toolbar`,\n// `button.emoji-section.image-button` as a 32px circular flat button,\n// `popover.emoji-picker emoji` at `font-size: x-large` with 6px padding and\n// `$button_radius` corners, hover/active fills and a high-contrast outline,\n// `scrolledwindow.view` with undershoot shading)\n// Reference: refs/gtk/gtk/ui/gtkemojichooser.ui (6px margins and spacing, the headings,\n// the empty page's 72px glyph, `max-content-height: 320`)\n// Copyright (c) 2021-2024 The GTK authors. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-emoji-chooser {\n // `popover.emoji-picker > contents { padding: 0 }` — the surface carries no padding\n // of its own; the searchbar and the toolbar bring theirs.\n padding: 0;\n\n .emoji-picker-root {\n display: flex;\n flex-direction: column;\n min-width: 260px;\n }\n\n .emoji-searchbar {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px;\n }\n\n .emoji-search-icon {\n flex: 0 0 auto;\n }\n\n .emoji-search-entry {\n flex: 1 1 auto;\n min-width: 0;\n padding: 6px 8px;\n font: inherit;\n color: inherit;\n background-color: var(--entry-bg-color);\n border: 1px solid var(--entry-border-color);\n border-radius: 9px;\n\n &:focus {\n outline: none;\n border-color: var(--accent-color);\n }\n }\n\n .emoji-stack {\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n // `scrolledwindow.view` (`max-content-height: 320`) with the undershoot shading the\n // upstream rule draws at the two ends the scroll position is not at.\n .emoji-list {\n display: flex;\n flex-direction: column;\n gap: 6px;\n max-height: 320px;\n overflow-y: auto;\n padding: 6px;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n }\n\n .emoji-heading {\n font-weight: 500;\n text-align: start;\n padding: 2px 0;\n }\n\n // `GtkFlowBox` with `homogeneous: 1`: every emoji the same width, wrapping by row.\n .emoji-flowbox {\n display: flex;\n flex-wrap: wrap;\n gap: 2px;\n }\n\n // `popover.emoji-picker emoji` — `font-size: x-large`, 6px padding, the button radius.\n .emoji {\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 32px;\n min-height: 32px;\n padding: 6px;\n font-size: 1.5em;\n line-height: 1;\n border-radius: var(--button-radius);\n border: none;\n background-color: transparent;\n color: inherit;\n\n &:focus,\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n @media (prefers-contrast: more) {\n &:focus,\n &:hover,\n &:active {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n }\n\n .emoji-recent-box {\n margin-bottom: 2px;\n }\n\n // The `empty` stack page: `dim-label` throughout, the glyph at 72px.\n .emoji-empty {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n padding: 18px 12px;\n color: var(--dim-label-color, var(--window-fg-color));\n opacity: 0.6;\n }\n\n .emoji-empty-icon {\n width: 72px;\n height: 72px;\n }\n\n .emoji-empty-title {\n font-weight: bold;\n font-size: 1.4em;\n }\n\n .emoji-empty-hint {\n font-size: 0.95em;\n }\n\n // `emoji-toolbar`: 3px of padding, because the flow box children already carry 3px.\n .emoji-toolbar {\n display: flex;\n align-items: center;\n padding: 3px;\n border-top: 1px solid var(--separator-color);\n }\n\n // `button.emoji-section.image-button` — circular, flat, 32x32, unchecked by default and\n // checked for the section the list is scrolled into.\n .emoji-section {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n padding: 0;\n border: none;\n border-radius: 999px;\n background-color: transparent;\n color: inherit;\n\n &:hover:not(:disabled) {\n background-color: var(--button-hover-color);\n }\n\n &:checked,\n &.checked {\n background-color: var(--button-active-color);\n }\n\n &:disabled {\n opacity: 0.4;\n }\n }\n\n .emoji-section-icon {\n width: 16px;\n height: 16px;\n }\n\n // `show_variations` (:508-548): a `view`-backed box beside the emoji holding the six\n // variants, so the second click on an emoji with skin tones lands somewhere.\n .emoji-variations {\n position: absolute;\n z-index: 1;\n padding: 6px;\n border-radius: var(--button-radius);\n background-color: var(--popover-bg-color);\n color: var(--popover-fg-color);\n box-shadow:\n 0 1px 4px rgba(0, 0, 6, 0.2),\n 0 2px 8px rgba(0, 0, 6, 0.12);\n }\n\n .emoji-variations-row {\n display: flex;\n gap: 2px;\n }\n}","// _print_dialogs.scss — the two Unix print dialogs: <gtk-page-setup-unix-dialog> and\n// <gtk-print-unix-dialog>.\n//\n// Neither has a stylesheet of its own upstream: libadwaita restyles exactly three things\n// under `window.print` and one under `window.pagesetup`, and everything else is GTK\n// defaults — the `.dialog-action-area` spacing, the notebook, the grid, the frame. What is\n// below is therefore the `.ui` layout in CSS (the grid the page-setup dialog is, the\n// notebook the print dialog is) plus the four libadwaita rules that DO apply.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:6-13\n// (`.dialog-action-area { margin: 6px; border-spacing: 6px }`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:15-34\n// (`window.print:not(.ssd-frame)`: `drawing` colour and no background or padding,\n// `paper` WHITE with `background-clip: padding-box` and a 1px `$border_color` border,\n// a FLAT titlebar and a `.view` `.dialog-action-box`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:38-42\n// (`window.pagesetup:not(.ssd-frame)`: a FLAT titlebar)\n// Reference: refs/gtk/gtk/print/ui/gtkpagesetupunixdialog.ui (6px row / 12px column\n// spacing, 5px margins)\n// Reference: refs/gtk/gtk/print/ui/gtkprintunixdialog.ui (18px page margins and spacing,\n// 12px inside a group, the bold group headings, the framed printer list)\n// Copyright (c) 2006-2024 Red Hat, Inc. / The GTK authors. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// ---------------------------------------------------------------------------\n// GtkPageSetupUnixDialog — one grid, four rows.\n// ---------------------------------------------------------------------------\n\ngtk-page-setup-unix-dialog {\n .adw-page-setup-grid {\n display: grid;\n // The `.ui`'s own spacing: 6px between rows, 12px between columns, 5px of margin.\n grid-template-columns: max-content 1fr 1fr;\n gap: 6px 12px;\n padding: 5px;\n align-items: center;\n }\n\n .adw-page-setup-label {\n // `halign: 1`, `valign: 3` — right-aligned against its control, centred on it.\n text-align: end;\n align-self: center;\n }\n\n // `printer_combo` and `paper_size_combo` are `column-span 3` on a 4-column grid, so\n // they fill the three remaining tracks.\n .adw-page-setup-printer,\n .adw-page-setup-paper {\n grid-column: 2 / span 3;\n }\n\n // `paper_size_label` is the row that REPORTS the choice, and it sits under the combo.\n .adw-page-setup-size-label {\n grid-column: 2 / span 3;\n padding: 2px 0;\n font-weight: 500;\n }\n\n .adw-page-setup-orientation {\n grid-column: auto;\n }\n\n // The `.dialog-action-area`: margin 6px, border-spacing 6px, and the Apply button is\n // the dialog's default response.\n .adw-page-setup-actions {\n display: flex;\n gap: 6px;\n margin: 6px;\n padding: 0;\n }\n\n .adw-page-setup-apply {\n margin-left: auto;\n }\n}\n\n// ---------------------------------------------------------------------------\n// GtkPrintUnixDialog — a notebook over a frame, with the action area below.\n// ---------------------------------------------------------------------------\n\ngtk-print-unix-dialog {\n .adw-print-root {\n display: flex;\n flex-direction: column;\n min-width: 480px;\n }\n\n // The notebook's tab row, drawn as a switcher: a flat button per page.\n .adw-print-switcher {\n display: flex;\n gap: 2px;\n padding: 4px 4px 0;\n }\n\n .adw-print-switcher-item {\n padding: 6px 12px;\n border: none;\n border-radius: 999px;\n background-color: transparent;\n color: inherit;\n font-weight: 500;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:checked,\n &.checked {\n background-color: var(--button-active-color);\n }\n }\n\n .adw-print-panel {\n flex: 1 1 auto;\n min-height: 0;\n padding: 12px;\n overflow: auto;\n // `window.print`'s `.dialog-action-box` is a `.view`, and so is the page the notebook\n // shows around its controls.\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n }\n\n // General and Page Setup put two groups side by side; the rest are one column.\n .adw-print-columns {\n display: flex;\n gap: 18px;\n align-items: flex-start;\n }\n\n .adw-print-column {\n display: flex;\n flex-direction: column;\n gap: 18px;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n // One `frame_templateN`: a bold heading over a grid.\n .adw-print-group {\n display: flex;\n flex-direction: column;\n gap: 6px;\n }\n\n .adw-print-group-title {\n font-weight: bold;\n }\n\n .adw-print-group-body {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding-left: 12px;\n }\n\n .adw-print-grid-row {\n display: flex;\n gap: 12px;\n align-items: center;\n }\n\n .adw-print-label {\n text-align: end;\n }\n\n // The printer list: a framed, scrolled column of rows, each an icon and two lines.\n .adw-print-printer-list {\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 220px;\n max-height: 220px;\n overflow: auto;\n }\n\n .adw-print-printer-row {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n text-align: start;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &.checked {\n background-color: var(--button-active-color);\n }\n }\n\n .adw-print-printer-text {\n display: flex;\n flex-direction: column;\n min-width: 0;\n }\n\n .adw-print-printer-name {\n font-weight: bold;\n }\n\n .adw-print-printer-location {\n font-size: 0.9em;\n opacity: 0.7;\n }\n\n // `scrolledwindow` with `has-frame` around the printer list.\n .adw-print-frame {\n border: 1px solid var(--border-color);\n border-radius: 9px;\n background-color: var(--view-bg-color);\n padding: 6px;\n }\n\n // The collate / reverse page-order preview: four 32x40 thumbnails in two columns.\n .adw-print-collate-preview {\n display: grid;\n grid-template-columns: repeat(2, 32px);\n gap: 4px;\n\n &[data-second-column='false'] > :nth-child(n + 3) {\n display: none;\n }\n }\n\n // `page_layout_preview`: the `drawing` node — no background, no padding, the\n // foreground colour only — with the `paper` inside it.\n .adw-print-sheet-preview {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 6px;\n padding: 0;\n background: none;\n border: none;\n color: var(--window-fg-color);\n }\n\n .adw-print-paper {\n // `paper { background-color: white; color: RGB(0 0 6 / 80%);\n // background-clip: padding-box; border: 1px solid $border_color }` — white paper in\n // a dark dialog is the point of the preview.\n width: 110px;\n max-width: 100%;\n display: flex;\n background-color: white;\n color: rgba(0, 0, 6, 0.8);\n background-clip: padding-box;\n border: 1px solid var(--border-color);\n }\n\n .adw-print-number-up {\n display: grid;\n grid-template-columns: repeat(var(--adw-print-number-up-columns, 1), 1fr);\n grid-template-rows: repeat(var(--adw-print-number-up-rows, 1), 1fr);\n width: 100%;\n height: 100%;\n\n > span {\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 10px;\n }\n }\n\n .adw-print-sheet-caption {\n font-size: 0.85em;\n opacity: 0.8;\n }\n\n // The four option pages: the empty grids the backend's option widgets go into.\n .adw-print-options-grid {\n display: grid;\n grid-template-columns: max-content 1fr;\n gap: 6px 12px;\n padding: 12px;\n\n &[data-empty='true'] {\n // Nothing to show, and saying so beats an empty frame: the reader has to be able to\n // tell \"this page has no options\" from \"this page failed to render\".\n min-height: 64px;\n opacity: 0.6;\n font-style: italic;\n }\n }\n\n // `conflicts_widget` — an action bar, hidden until `mark_conflicts` raises it.\n .adw-print-conflicts {\n display: flex;\n align-items: center;\n gap: 6px;\n margin: 0 12px;\n padding: 6px 12px;\n border-radius: 9px;\n background-color: var(--warning-bg-color);\n color: var(--warning-color);\n }\n\n // `.dialog-action-area`: Preview / Cancel / Print, with Print as the default.\n .adw-print-actions {\n display: flex;\n gap: 6px;\n margin: 6px;\n padding: 0;\n }\n\n .adw-print-print {\n margin-left: auto;\n }\n\n // The pseudo-disabled rows the C reaches with `gtk_widget_set_sensitive (…, FALSE)`:\n // a GTK-insensitive widget is still focusable-ish and still legible, so it dims rather\n // than disappearing.\n .insensitive {\n opacity: 0.45;\n }\n\n input:disabled,\n gtk-drop-down[disabled] {\n opacity: 0.45;\n }\n}","// _about_dialog.scss — adw-about-dialog styling (a modal AdwDialog floating\n// sheet hosting the About navigation view: a full-cover scrim + a centred,\n// rounded, scrollable sheet box). Mirrors libadwaita's AdwDialog floating-sheet\n// node tree (dimming + rounded sheet with the outline + layered shadow) and the\n// AdwAboutDialog main page layout (large icon, title-1 name, dimmed developer\n// line, the version pill, then the navigation rows).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss\n// (floating-sheet > dimming / > sheet radius + box-shadow + outline)\n// Reference: refs/libadwaita/src/adw-about-dialog.ui (page tree, content-width 360)\n// Reference: refs/adwaita-web/adwaita-web/scss/_about_dialog.scss (web layout)\n// Copyright (c) 2022-2024 GNOME Foundation Inc. / Purism SPC (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-about-dialog {\n // The host is inert until presented; `.open` reveals the scrim + sheet.\n display: none;\n\n &.open {\n display: block;\n }\n\n // --- Full-cover modal scrim ---\n // libadwaita: floating-sheet > dimming { background shade-color × 2 }.\n .adw-about-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1000;\n background-color: rgba(0, 0, 6, 0.32);\n animation: adw-about-dialog-scrim-in 200ms ease;\n }\n\n // --- Centred floating sheet ---\n // libadwaita: floating-sheet > sheet { dialog radius; layered shadow; 1px\n // outline -1px offset }. content-width 360 → a comfortable ~360px sheet.\n .adw-about-dialog-sheet {\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1001;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n width: 360px;\n max-width: calc(100vw - 48px);\n max-height: calc(100vh - 48px);\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 14px 2px rgba(0, 0, 6, 0.03),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 0 1px rgba(0, 0, 0, 0.05);\n animation: adw-about-dialog-sheet-in 200ms cubic-bezier(0, 0, 0.2, 1);\n\n &:focus {\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n }\n }\n\n // The navigation view fills the sheet; each page is a column.\n adw-navigation-view,\n .adw-navigation-view-pages,\n .adw-navigation-page {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // --- Toolbar view (flat header bar over the window background + scroller) ---\n .adw-about-dialog-toolbar-view {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // The dialog header bar is flat: transparent over the window background, no\n // bottom separator (libadwaita: window.about headerbar.titlebar { flat }).\n adw-header-bar {\n background-color: transparent;\n box-shadow: none;\n min-height: 47px;\n }\n\n // The close button — a flat circular button drawing a \"×\" glyph: the generated\n // `.adw-icon--<name>` mask classes come from the ICONS map in scripts/build-scss.mjs,\n // which has no window-close entry (the SVG itself does exist in @gjsify/adwaita-icons).\n .adw-about-dialog-close {\n width: 34px;\n height: 34px;\n padding: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 18px;\n line-height: 1;\n\n &::before {\n content: '\\00d7'; // ×\n }\n }\n\n // --- Scrolling content area ---\n .adw-about-dialog-scroll {\n flex: 1 1 auto;\n min-height: 0;\n overflow-y: auto;\n overflow-x: hidden;\n }\n\n .adw-about-dialog-clamp {\n width: 100%;\n max-width: 360px;\n margin-inline: auto;\n box-sizing: border-box;\n }\n\n .adw-about-dialog-page-body {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: 0 var(--spacing-m) var(--spacing-l);\n }\n\n // --- Main page header title: hidden until the content scrolls ---\n // Mirrors AdwAboutDialog's update_headerbar_cb (show title once scrolled > 0).\n .main-page {\n adw-header-bar .adw-header-bar-title {\n opacity: 0;\n transition: opacity 150ms ease;\n }\n\n &.scrolled adw-header-bar .adw-header-bar-title {\n opacity: 1;\n }\n }\n\n // --- App icon (the large recessed glyph) ---\n .adw-about-dialog-icon {\n align-self: center;\n width: 96px;\n height: 96px;\n margin-top: var(--spacing-s);\n margin-bottom: var(--spacing-m);\n // Mask-driven .adw-icon skin scaled up to the about-dialog app-icon size.\n -webkit-mask-size: contain;\n mask-size: contain;\n background-color: currentColor;\n }\n\n // --- App name (title-1) ---\n .adw-about-dialog-name {\n align-self: center;\n text-align: center;\n font-size: 18pt;\n font-weight: 800;\n line-height: 1.2;\n margin-bottom: var(--spacing-xs);\n }\n\n // --- Developer / vendor line ---\n .adw-about-dialog-developer {\n align-self: center;\n text-align: center;\n font-size: var(--font-size-base);\n opacity: var(--dim-opacity);\n margin-bottom: var(--spacing-m);\n }\n\n // --- Version pill ---\n // libadwaita: .app-version { small accent chip }.\n .adw-about-dialog-version {\n align-self: center;\n padding: 2px 12px;\n margin-bottom: var(--spacing-l);\n border-radius: 99px;\n font-size: var(--font-size-small);\n line-height: 1.4;\n background-color: color-mix(in srgb, var(--accent-bg-color) 14%, transparent);\n color: var(--accent-color);\n }\n\n // --- Row groups (Details / Credits / Legal navigation, link rows) ---\n .adw-about-dialog-rows {\n width: 100%;\n margin-top: var(--spacing-m);\n\n & + .adw-about-dialog-rows {\n margin-top: var(--spacing-l);\n }\n }\n\n // The trailing chevron / link affordance on a navigation or link row.\n .adw-about-dialog-chevron {\n width: 16px;\n height: 16px;\n opacity: var(--dim-opacity);\n }\n\n // --- Subpage content (Details / Credits / Legal) ---\n .adw-about-dialog-comments {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-base);\n line-height: 1.5;\n text-align: start;\n white-space: pre-wrap;\n }\n\n .adw-about-dialog-copyright {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n text-align: center;\n }\n\n .adw-about-dialog-license {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n text-align: center;\n\n a {\n color: var(--accent-color);\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n }\n }\n}\n\n@keyframes adw-about-dialog-scrim-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes adw-about-dialog-sheet-in {\n from {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.95);\n }\n to {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n","// _alert_dialog.scss — adw-alert-dialog: a modal scrim + centred dialog box with\n// a bold heading, body text and a row/column of response buttons.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss (floating-sheet,\n// AdwDialog sheet shadow + radius)\n// Reference: refs/adwaita-web/adwaita-web/scss/_dialog.scss (alert layout)\n// Reference: refs/libadwaita/src/adw-alert-dialog.c (response button layout)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// Host: lay the scrim + box out as a full-cover overlay only while open.\nadw-alert-dialog {\n display: none;\n\n &.open {\n display: block;\n }\n}\n\n// The scrim — a fixed full-cover dimming layer behind the dialog box.\n.adw-alert-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1050;\n background-color: rgba(0, 0, 6, 0.32);\n // Centre the dialog box (the box is the scrim's flex child).\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-l);\n // Mirror the AdwDialog present transition (a quick fade + scale).\n animation: adw-alert-dialog-fade-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n}\n\n// The dialog box — the AdwDialog \"sheet\": rounded window-colored surface with a\n// soft shadow + hairline outline, centred above the scrim.\n.adw-alert-dialog-box {\n position: fixed;\n top: 50%;\n left: 50%;\n z-index: 1051;\n transform: translate(-50%, -50%);\n\n display: flex;\n flex-direction: column;\n\n box-sizing: border-box;\n width: 100%;\n max-width: 300px;\n max-height: calc(100vh - 2 * var(--spacing-xl));\n overflow: hidden;\n\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 14px 2px rgba(0, 0, 6, 0.03),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 0 1px rgba(0, 0, 0, 0.05);\n\n font-family: var(--font-family);\n\n animation: adw-alert-dialog-pop-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n}\n\n// Wider layout when responses are laid out horizontally (prefer-wide-layout).\n.adw-alert-dialog-box:has(.adw-alert-dialog-responses.horizontal) {\n max-width: 360px;\n}\n\n// The scrollable message area: heading + body + optional extra child.\n.adw-alert-dialog-message {\n display: flex;\n flex-direction: column;\n padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-l);\n overflow-y: auto;\n}\n\n.adw-alert-dialog-heading {\n margin: 0;\n // Matches the GTK .title-2 typography style (bold heading).\n font-size: 15pt;\n font-weight: 800;\n line-height: 1.3;\n text-align: center;\n}\n\n.adw-alert-dialog-body {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-base);\n line-height: 1.4;\n text-align: center;\n}\n\n// Extra child slot, displayed below the body.\n.adw-alert-dialog-child {\n margin-top: var(--spacing-m);\n\n &:empty {\n display: none;\n }\n}\n\n// Response button area. Vertical (stacked) by default; horizontal when the\n// dialog opts into the wide layout.\n.adw-alert-dialog-responses {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-s);\n padding: var(--spacing-m) var(--spacing-l) var(--spacing-l);\n\n &.horizontal {\n flex-direction: row;\n justify-content: stretch;\n\n .adw-alert-dialog-response {\n flex: 1 1 0;\n }\n }\n}\n\n// The response buttons — full-width pills within the stacked layout. They reuse\n// the .adw-button skin (incl. .suggested-action / .destructive-action), so only\n// the full width needs adding here. The default response is NOT accent-tinted —\n// libadwaita only colours suggested/destructive responses; the default one is\n// just the Enter-activated button and keeps the neutral button style.\n.adw-alert-dialog-response.adw-button {\n width: 100%;\n justify-content: center;\n}\n\n@keyframes adw-alert-dialog-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes adw-alert-dialog-pop-in {\n from {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.95);\n }\n to {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n","// _preferences_dialog.scss — adw-preferences-dialog styling (scrim + dialog box).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss (floating-sheet\n// scrim/dimming + sheet radius + box-shadow + outline)\n// Reference: refs/libadwaita/src/adw-preferences-dialog.ui (flat header + title)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-preferences-dialog {\n // Hidden until presented (the `open` class is toggled by the component). The\n // element itself contributes nothing to layout while closed.\n display: none;\n\n &.open {\n display: block;\n }\n\n // Full-cover scrim — a fixed dimming layer behind the dialog box. Adwaita\n // dims with `--shade-color` at double alpha (see _dialogs.scss `floating-sheet\n // > dimming`); --shade-color isn't in the adwaita-web token subset, so use the\n // equivalent neutral wash.\n .adw-preferences-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1000;\n background-color: rgba(0, 0, 6, 0.32);\n }\n\n // The centred floating dialog box. Mirrors `floating-sheet > sheet`: the\n // dialog radius (= --window-radius in Adwaita), the layered drop shadow and a\n // 1px window outline.\n .adw-preferences-dialog-box {\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1001;\n display: flex;\n flex-direction: column;\n width: min(var(--adw-dialog-content-width, 640px), calc(100vw - 48px));\n max-height: calc(100vh - 48px);\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 0 1px rgba(0, 0, 0, 0.05),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 14px 2px rgba(0, 0, 6, 0.03);\n }\n\n // Flat header bar — transparent over the window background (Adw's preferences\n // dialog header uses a flat AdwHeaderBar), title centred against the trailing\n // close button.\n .adw-preferences-dialog-header {\n display: flex;\n align-items: center;\n min-height: 47px;\n padding: 0 6px;\n flex-shrink: 0;\n }\n\n // Equal-width sides keep the title optically centred (strict centering).\n .adw-preferences-dialog-header-side {\n display: flex;\n align-items: center;\n flex: 1 1 0;\n min-width: 0;\n }\n\n .adw-preferences-dialog-header-side--end {\n justify-content: flex-end;\n }\n\n .adw-preferences-dialog-title {\n flex: 0 0 auto;\n font-weight: bold;\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 0 6px;\n }\n\n // Round flat close button drawing a CSS \"×\" glyph — same approach as\n // <adw-tab-view>, and for the sizing reason recorded there. `windowCloseSymbolic`\n // does ship, and is compiled.\n .adw-preferences-dialog-close {\n appearance: none;\n border: none;\n margin: 0;\n width: 28px;\n height: 28px;\n padding: 0;\n border-radius: 50%;\n background-color: transparent;\n color: var(--window-fg-color);\n cursor: pointer;\n position: relative;\n transition: background-color 0.1s ease;\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 12px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &.locked {\n opacity: var(--dim-opacity);\n cursor: default;\n }\n }\n\n // Scrolled body holding the stacked pages. Adwaita preferences pages sit on\n // the window background (the boxed-list groups carry their own card surface).\n .adw-preferences-dialog-body {\n flex: 1 1 auto;\n min-height: 0;\n overflow-y: auto;\n }\n\n // Clamped column of preferences groups — Adw.PreferencesPage clamps content to\n // a comfortable reading width and stacks groups with generous spacing.\n .adw-preferences-dialog-pages {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-xl);\n max-width: 600px;\n margin: 0 auto;\n padding: var(--spacing-xl) var(--spacing-m);\n\n // The dialog keeps the <adw-preferences-page> ELEMENTS rather than hoisting\n // their children out — the page's title / name / icon-name are what a\n // search-result subtitle and a view switcher read. The page therefore has\n // to be layout-transparent so its groups stay flex items of this column;\n // a custom element's default `display: inline` would collapse it.\n > adw-preferences-page {\n display: contents;\n\n // `display: contents` above beats the UA `[hidden] { display: none }`, so\n // a page hidden through the DOM `hidden` property would keep rendering\n // its groups while the search (which reads the same flag) had already\n // dropped it from the corpus.\n &[hidden] {\n display: none;\n }\n }\n }\n}\n","// _dialog.scss — adw-dialog: a generic adaptive dialog. A full-cover scrim with\n// a floating window-coloured \"sheet\" centred on wide viewports, re-anchored as a\n// bottom sheet (full-width, rounded top corners) on narrow ones. Mirrors the\n// AdwDialog floating-sheet + bottom-sheet presentations.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss (floating sheet)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_bottom-sheet.scss (bottom radius)\n// Copyright (c) 2023-2024 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// Bottom-sheet layout — shared by the explicit mode and the auto/narrow query.\n@mixin adw-dialog-bottom-sheet {\n .adw-dialog-scrim {\n align-items: flex-end;\n justify-content: stretch;\n padding: 0;\n }\n\n .adw-dialog-box {\n width: 100%;\n max-width: none;\n // Rounded only along the top edge — it hugs the bottom viewport edge.\n border-top-left-radius: var(--window-radius);\n border-top-right-radius: var(--window-radius);\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n animation: adw-dialog-slide-up 0.25s cubic-bezier(0, 0, 0.2, 1);\n }\n}\n\n// Host: contributes nothing to layout while closed; the `open` class reveals it.\nadw-dialog {\n display: none;\n\n &.open {\n display: block;\n }\n\n // The full-cover scrim — a flex container centring the box; a dimming wash\n // behind it. Clicking the scrim (outside the box) attempts to dismiss.\n .adw-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1050;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-l);\n background-color: var(--dialog-scrim-color, rgba(0, 0, 6, 0.32));\n animation: adw-dialog-fade-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n }\n\n // The dialog box (\"sheet\"): a rounded window-coloured surface with a soft\n // layered shadow + hairline outline. Sized by the content-width/height props.\n .adw-dialog-box {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n width: min(var(--adw-dialog-content-width, 360px), calc(100vw - 2 * var(--spacing-l)));\n max-height: min(var(--adw-dialog-content-height, 100vh), calc(100vh - 2 * var(--spacing-l)));\n overflow: hidden;\n\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 0 1px rgba(0, 0, 0, 0.05),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 14px 2px rgba(0, 0, 6, 0.03);\n\n font-family: var(--font-family);\n animation: adw-dialog-pop-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n\n &:focus {\n outline: 1px solid var(--separator-color);\n }\n }\n\n // Flat header bar — transparent over the window background, title strictly\n // centred against the trailing close button (the AdwHeaderBar idiom).\n .adw-dialog-header {\n display: flex;\n align-items: center;\n min-height: 47px;\n padding: 0 6px;\n flex-shrink: 0;\n }\n\n .adw-dialog-header-side {\n display: flex;\n align-items: center;\n flex: 1 1 0;\n min-width: 0;\n }\n\n .adw-dialog-header-side--end {\n justify-content: flex-end;\n }\n\n .adw-dialog-title {\n flex: 0 0 auto;\n font-weight: bold;\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 0 6px;\n }\n\n // Round flat close button drawing a CSS \"×\" glyph: `windowCloseSymbolic` exists in\n // @gjsify/adwaita-icons, but the generated `.adw-icon--<name>` mask classes come from\n // the ICONS map in scripts/build-scss.mjs, which has no window-close entry.\n .adw-dialog-close {\n appearance: none;\n border: none;\n margin: 0;\n width: 28px;\n height: 28px;\n padding: 0;\n border-radius: 50%;\n background-color: transparent;\n color: var(--window-fg-color);\n cursor: pointer;\n position: relative;\n flex: none;\n transition: background-color 0.1s ease;\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 12px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &.locked {\n opacity: var(--dim-opacity);\n cursor: default;\n }\n }\n\n // Content area — the author's markup; scrolls when it exceeds the box height.\n .adw-dialog-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow-y: auto;\n padding: var(--spacing-m) var(--spacing-l) var(--spacing-l);\n }\n\n // A header-less dialog pads the content on all sides.\n .adw-dialog-header[hidden] + .adw-dialog-content {\n padding-top: var(--spacing-l);\n }\n\n // --- Explicit bottom-sheet presentation ---\n &[data-presentation='bottom-sheet'] {\n @include adw-dialog-bottom-sheet;\n }\n}\n\n// --- Adaptive (auto) presentation: bottom sheet on narrow viewports ---\n@media (max-width: 550px) {\n adw-dialog[data-presentation='auto'] {\n @include adw-dialog-bottom-sheet;\n }\n}\n\n@keyframes adw-dialog-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes adw-dialog-pop-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes adw-dialog-slide-up {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n","// _shortcuts_dialog.scss — the shortcuts dialog: sections of shortcut rows, and the\n// rows themselves.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_shortcuts-dialog.scss (16-27 the\n// `.shortcut-row` padding and the `.title-box` subtitle; 1-14 the spacing between the\n// groups inside the dialog's page)\n// Copyright (c) 2025 GNOME Foundation Inc. (libadwaita). LGPLv2.1+\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// The class list libadwaita gives the dialog itself is `dialog.shortcuts`, and the\n// stylesheet reaches through it into a preferences page. Here the sections are the\n// dialog's children in the base's own content area, so the element is the same hook\n// in one selector — and the CONTENT AREA is the box the stylesheet spaces out\n// (`border-spacing: 18px` there, which is a `GtkBox` doing what a gap does).\nadw-shortcuts-dialog .adw-dialog-content {\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\nadw-shortcuts-dialog adw-shortcuts-section {\n flex: 0 0 auto;\n}\n\nadw-shortcuts-section {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n\n.adw-shortcuts-section-title {\n font-weight: 700;\n\n &[hidden] {\n display: none;\n }\n}\n\n.adw-shortcuts-section-body {\n display: flex;\n flex-direction: column;\n // The boxed-list surface the sections read as — a card with a hairline, exactly the\n // one `adw-preferences-group` draws and the one `_shortcuts-dialog.scss` inherits.\n border: 1px solid var(--card-shade-color);\n border-radius: var(--card-radius);\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n overflow: hidden;\n}\n\nadw-shortcuts-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--spacing-m);\n // `.shortcut-row { padding: 9px 12px; min-height: 36px }` (_shortcuts-dialog.scss:16-19)\n padding: 9px 12px;\n min-height: 36px;\n\n &[hidden] {\n display: none;\n }\n\n &:not(:first-child) {\n border-top: 1px solid var(--card-shade-color);\n }\n\n + adw-shortcuts-item {\n border-top: 1px solid var(--card-shade-color);\n }\n}\n\n// `.title-box { border-spacing: 3px }` with the subtitle under the title: the source\n// is a vertical box, so the title and the subtitle stack and the subtitle is dimmed\n// and caption-sized (`@extend .caption; @extend .dimmed`).\n.adw-shortcuts-item-title,\n.adw-shortcuts-item-subtitle {\n flex: 0 1 auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.adw-shortcuts-item-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n margin-top: 3px;\n\n &[hidden] {\n display: none;\n }\n}\n\n.adw-shortcuts-item-label {\n flex: 0 0 auto;\n\n &[hidden] {\n display: none;\n }\n}\n","// _widget.scss — the GtkWidget layout properties an element carries as attributes.\n//\n// Every GTK widget inherits `halign`, `valign`, `hexpand` and `vexpand` from GtkWidget, and a\n// projected `.blp` hands them to `buildSharedTree` as attributes (`halign=\"center\"`). Until\n// this partial nothing read them, so the gallery's bottom sheet stretched the button its\n// Blueprint centres. The margins are not here: an attribute cannot carry a length into CSS\n// portably, so `shared-tree-builder.ts` writes them as inline style — and so are\n// `width-request` / `height-request`, as the `min-width` / `min-height` they are.\n//\n// ALIGNMENT IS AN AUTO MARGIN, because that is the one CSS placement that means the same on\n// both axes of a flex container and of a grid: GTK allocates a non-FILL child its natural\n// size and places it inside the space its parent gave it, and an auto margin shrinks a flex\n// or grid item to its content and puts the leftover on the named side. It does NOT place a\n// child of a BLOCK container on the vertical axis, where CSS resolves an auto block margin to\n// zero — so a GTK bin that lays its child out by alignment is a grid or a flex box here\n// (`.adw-bottom-sheet-content`, `gtk-box`). And it takes the side it pushes from: a centred\n// child cannot also keep a `margin-start`, where GTK would centre it inside the remaining\n// space.\n//\n// EXPAND IS FLEX-GROW ALONG THE BOX'S OWN AXIS, which is why it lives with the box rules\n// below and not on the attribute alone: `vexpand` in a horizontal box asks for the cross\n// axis, which `align-items: stretch` already fills, and a `flex-grow` there would widen the\n// child instead.\n//\n// Reference: refs/gtk/gtk/gtkwidget.c (halign, valign, hexpand, vexpand)\n// Reference: refs/gtk/gtk/gtkboxlayout.c (spare space shared among expanding children)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n\n[halign='start'] {\n margin-inline-end: auto;\n}\n\n[halign='end'] {\n margin-inline-start: auto;\n}\n\n[halign='center'] {\n margin-inline: auto;\n}\n\n[valign='start'] {\n margin-block-end: auto;\n}\n\n[valign='end'] {\n margin-block-start: auto;\n}\n\n[valign='center'] {\n margin-block: auto;\n}\n\ngtk-box:not([orientation='vertical']) > [hexpand]:not([hexpand='false']),\ngtk-box[orientation='vertical'] > [vexpand]:not([vexpand='false']) {\n flex-grow: 1;\n}\n\n// An AUTHORED `hexpand: false` is the one case where absence is not enough: a widget that\n// grows by default (`<gtk-scrolled-window>` is `flex: 1 1 0%`, the allocation of a window in a\n// column) must stop, and GTK then gives it its NATURAL size rather than nothing — hence the\n// `auto` basis, not just a zero grow. `width-request` (an inline `min-width`) is the floor.\ngtk-box:not([orientation='vertical']) > [hexpand='false'],\ngtk-box[orientation='vertical'] > [vexpand='false'] {\n flex-grow: 0;\n flex-basis: auto;\n}\n","// adwaita-skin.scss — Main entry point for @gjsify/adwaita-web.\n// Mirrors refs/adwaita-web/adwaita-web/scss/adwaita-skin.scss organization.\n// Reference: refs/adwaita-web/adwaita-web/scss/adwaita-skin.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'icons.generated';\n@use 'variables';\n@use 'theme';\n@use 'root';\n// Style-isolation boundary — emitted before the components so their own rules\n// override this typographic/box-model floor (see _reset.scss).\n@use 'reset';\n// The ONE symbolic-icon box, behind <gtk-image>. Emitted before every widget that\n// draws one, so a context that sizes its own icons (the about dialog's 96px, the\n// split button's 14px arrows, the view switcher's 16px) still wins on ordinary\n// specificity.\n@use 'icon';\n// libadwaita's typography + semantic-colour UTILITY CLASSES (`.dimmed`,\n// `.numeric`, `.monospace`, `.title-1`…), and <gtk-label>, the element they are\n// written for — see _labels.scss. Emitted BEFORE every widget so a widget's\n// own rule wins on ordinary specificity, and because two partials @extend from\n// it (`_progress_bar.scss`'s text node, `_data_grid.scss`'s cells) exactly as\n// libadwaita's own `_progress-bar.scss` does.\n@use 'labels';\n// <gtk-box>. Before every widget, which may place its own children in one.\n@use 'box';\n// The five Gtk layout containers after it, and they are here for ONE reason each: nothing\n// downstream of `box` needs to place children in one, and the frame's 1px border is the\n// only rule libadwaita writes for any of the five (`_misc.scss:4-15`) — so they belong with\n// the primitive they build on rather than in the widget run below.\n@use 'frame';\n@use 'aspect_frame';\n@use 'center_box';\n@use 'grid';\n@use 'fixed';\n// The REST of libadwaita's documented style-class surface — the widget-\n// independent half: the surfaces (`.background`, `.view`, `.frame`), `.card` and\n// the two boxed lists, `.toolbar`, `.spacer`, `.osd`, `.linked`, the app-icon\n// shadows and the undershoot indicators. Emitted here for the same two reasons\n// as `_labels.scss`: a widget's own rule then wins on ordinary specificity, and\n// `_card.scss` / `_preferences.scss` @extend `%card` from it.\n// `scripts/check-adwaita-style-classes.mjs` holds the ledger of the whole\n// documented surface and fails on a class with no rule behind it.\n@use 'style_classes';\n@use 'window';\n@use 'application_window';\n// <adw-header-bar>, <gtk-header-bar> AND <gtk-window-controls>, in ONE partial because\n// upstream's `_header-bar.scss` styles `headerbar`, `windowcontrols` and `windowtitle`\n// together — and because a bar's frame buttons ARE its window controls.\n@use 'headerbar';\n@use 'action_bar';\n@use 'window_title';\n@use 'button';\n// The four button-derived nodes below, in the order of `src/elements/`: each one\n// renders a `.adw-button` of its own, so each rule comes AFTER `button` rather than\n// before it — `button.link`'s transparent background is the whole point of a link and\n// `.adw-button`'s resting fill must not win it on source order.\n@use 'link';\n@use 'scale_button';\n@use 'color_button';\n@use 'font_button';\n@use 'button_content';\n// The ONE popover surface. Emitted BEFORE the widgets that host one, so a\n// consumer's (or a widget's) own higher-specificity rule still wins over it.\n@use 'popover';\n// <gtk-popover-menu>, <gtk-popover-menu-bar> and <gtk-popover-bin>. All three AFTER\n// `popover`, because every surface they own is `<gtk-popover>`'s and none of them restates\n// it — they add the menubar's item rules and the bin's `.has-open-popup`, and libadwaita\n// puts both in the same file as `popover.menu` for the same reason.\n@use 'popover_menu_bar';\n@use 'popover_bin';\n@use 'split_button';\n@use 'menu_button';\n@use 'drop_down';\n@use 'toggle_group';\n// The ONE toggle, behind <gtk-switch>. Emitted before `switch_row` and\n// `expander_row`, the two widgets that host one — and which each carried their\n// own copy of it until it was lifted out of `adw-switch-row {}`.\n@use 'switch';\n@use 'entry';\n@use 'search_entry';\n@use 'password_entry';\n@use 'separator';\n// `<gtk-text>`, `<gtk-text-view>` and `<gtk-editable-label>` — the widgets whose content is\n// text, and the two libadwaita blocks that paint a `text` node.\n@use 'text';\n// `<gtk-search-bar>`, which reads the header-bar tokens rather than the header bar's rules.\n@use 'search_bar';\n// <gtk-drawing-area>, the one widget of the gtk/drawing page that carries a rule of its\n// own. No dependency on anything above it — it styles one canvas — so the order here is\n// placement, not precedence.\n@use 'drawing';\n// The `dnd` node, which libadwaita styles once for the whole widget\n// (`_common.scss:30-32`) and which is otherwise geometry: a drag icon has no parent to lay\n// out in, because it is a GtkRoot with its own surface. No dependency on anything above it.\n@use 'drag_icon';\n// The layout CONTAINERS GTK owns and libadwaita only styles. `_paned` draws the divider as\n// an inset box-shadow on the `separator` node a `GtkPanedHandle` carries, which is a\n// different rule from `<gtk-separator>`'s own fill — so it needs its own partial rather\n// than a class the separator's rule would fight over.\n@use 'overlay';\n@use 'revealer';\n@use 'paned';\n@use 'expander';\n// The two form-control primitives, in ONE partial because upstream merges them\n// (there is no `_radio.scss` in libadwaita) — see _checks.scss.\n@use 'checks';\n@use 'spin_button';\n@use 'scale';\n@use 'progress_bar';\n// <gtk-level-bar>, next to the progress bar it is easy to confuse with. It has no\n// dependency on anything above it, so the order here is readability, not precedence.\n@use 'level_bar';\n// The three views, in dependency order: `list_view` declares the selectable-row mixin\n// and the rubber band that the other two include.\n@use 'list_view';\n@use 'grid_view';\n@use 'column_view';\n@use 'tree_expander';\n// The media group, in dependency order and nothing else: `picture` fits a replaced\n// element, `inscription` is text measured in characters and lines, `video` lays an\n// overlay out and hosts a `media_controls` inside its revealer, so `media_controls`\n// comes after `video` only in the sense that `video` NAMES it — neither partial reads\n// the other, and the order here is readability, not precedence.\n@use 'picture';\n@use 'inscription';\n@use 'video';\n@use 'media_controls';\n// The two child-holding containers. `list_box` comes first only because it reads like\n// `list_view`; nothing here is a `@use` of the other, and `flow_box` includes the selectable\n// mixin from `list_view` above for the cell's four state colours.\n@use 'list_box';\n@use 'flow_box';\n@use 'calendar';\n@use 'preferences';\n@use 'preferences_row';\n@use 'card';\n@use 'data_grid';\n@use 'bin';\n@use 'clamp';\n// <gtk-stack> AND <gtk-stack-switcher> AND <gtk-stack-sidebar>, in ONE partial: upstream\n// styles the switcher's buttons out of `_buttons.scss` and the sidebar's rows out of\n// `_sidebars.scss`, so a stack and the two things that switch over it share styles.\n@use 'stack';\n@use 'clamp_scrollable';\n// <adw-spinner> AND <gtk-spinner>, in ONE partial because upstream's\n// `_spinner.scss` styles `spinner` and `image.spinner` in the same file.\n@use 'spinner';\n// <adw-shortcut-label>'s keycaps. After `labels`, because a separator inside it\n// is an ordinary `.dimmed`.\n@use 'shortcut_label';\n@use 'avatar';\n@use 'banner';\n@use 'status_page';\n@use 'row';\n@use 'action_row';\n@use 'entry_row';\n@use 'switch_row';\n@use 'combo_row';\n@use 'spin_row';\n@use 'button_row';\n@use 'expander_row';\n@use 'password_entry_row';\n@use 'toast';\n@use 'toolbar_view';\n// The scrolling trio, beside `_scrolling.scss`'s edge indicators: the scrollbar first,\n// because the scrolled window's grid places it, and the viewport before the window, because\n// the window's grid has a cell for it.\n@use 'scrollbar';\n@use 'viewport';\n@use 'scrolled_window';\n@use 'window_handle';\n@use 'scrolling';\n@use 'wrap_box';\n@use 'panes';\n@use 'overlay_split_view';\n@use 'navigation_split_view';\n@use 'carousel';\n// <adw-tab-bar> BEFORE <adw-tab-view>, and only because upstream writes both in ONE file:\n// `tabbar`, `tabbox` and `tab` (_tab-view.scss:1-95). The chip rules here and the merged\n// bar's are the same declarations against the same class names, so whichever partial is\n// emitted second would win on source order for a document that nests one bar in the other.\n@use 'tab_bar';\n@use 'tab_view';\n@use 'view_switcher';\n@use 'inline_view_switcher';\n@use 'view_stack';\n@use 'view_switcher_bar';\n@use 'tab_button';\n@use 'tab_overview';\n@use 'view_switcher_sidebar';\n@use 'navigation_view';\n@use 'bottom_sheet';\n@use 'sidebar';\n// GTK's own dialogs: the about window's layout, the emoji chooser's nodes, and the two\n// Unix print dialogs. After `popover` and `entry`, which the emoji chooser hosts.\n@use 'gtk_about_dialog';\n@use 'emoji_chooser';\n@use 'print_dialogs';\n@use 'about_dialog';\n@use 'alert_dialog';\n@use 'preferences_dialog';\n@use 'dialog';\n// After 'dialog': the shortcuts dialog IS an <adw-dialog> and adds sections and rows\n// inside its content area, so its own rules have to come after the chrome they sit in.\n@use 'shortcuts_dialog';\n// Last among the widgets: an authored `halign` / `valign` is placement the author asked\n// for, and an element rule that sets a margin must not win it back on source order.\n@use 'widget';\n\n// Ensure the `hidden` attribute always wins: components that toggle visibility\n// via `element.hidden = true` set the HTML attribute, but a custom `display`\n// from a layout class (e.g. `.adw-switch { display: inline-flex }`) has equal\n// specificity and would otherwise override the UA `[hidden] { display: none }`,\n// leaving the element laid out (and stealing width from its siblings).\n[hidden] {\n display: none !important;\n}\n"]}
1
+ {"version":3,"sourceRoot":"","sources":["file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_icons.generated.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_variables.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_theme.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_root.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_reset.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_icon.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_labels.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_frame.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_aspect_frame.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_center_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_grid.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_fixed.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_style_classes.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_window.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_application_window.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_headerbar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_action_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_window_title.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_link.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scale_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_color_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_font_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_button_content.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_popover.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_popover_menu_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_popover_bin.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_split_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_menu_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_drop_down.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_toggle_group.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_switch.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_entry.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_search_entry.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_password_entry.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_separator.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_text.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_search_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_drawing.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_drag_icon.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_overlay.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_revealer.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_paned.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_expander.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_checks.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_spin_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scale.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_progress_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_level_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_list_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_grid_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_column_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tree_expander.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_picture.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_inscription.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_video.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_media_controls.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_list_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_flow_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_calendar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_preferences.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_preferences_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_card.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_data_grid.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_bin.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_clamp.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_stack.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_clamp_scrollable.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_spinner.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_shortcut_label.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_avatar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_banner.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_status_page.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_action_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_entry_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_switch_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_combo_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_spin_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_button_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_expander_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_password_entry_row.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_toast.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_toolbar_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scrollbar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_viewport.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scrolled_window.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_window_handle.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_scrolling.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_wrap_box.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_panes.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_overlay_split_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_navigation_split_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_carousel.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_switcher.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_inline_view_switcher.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_stack.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_switcher_bar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_button.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_tab_overview.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_view_switcher_sidebar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_navigation_view.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_bottom_sheet.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_sidebar.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_gtk_about_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_emoji_chooser.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_print_dialogs.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_about_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_alert_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_preferences_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_shortcuts_dialog.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/_widget.scss","file:///__w/gjsify/gjsify/packages/web/adwaita-web/scss/adwaita-skin.scss"],"names":[],"mappings":";AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;ACxNF;EAxNE;EACA;EAGA;EACA;EAGA;EACA;EACA;EAKA;EAOA;EAMA;EACA;EACA;EACA;EACA;EAMA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAIA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EASA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EAgCA;EACA;EACA;EACA;EACA;EAaA;EACA;EACA;EA8CA;EACA;EACA;EACA;;;AAaF;EACE;IACE;IACA;IACA;;;AClKJ;EACE;IA/DA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAEA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAKA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IAUA;;;AAkBF;EA5EE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAUA;;;AAyBF;EDrFE;EACA;EAGA;EACA;EAGA;EACA;EACA;EAKA;EAOA;EAMA;EACA;EACA;EACA;EACA;EAMA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAIA;EAGA;EACA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EASA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;EAGA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EAgCA;EACA;EACA;EACA;EACA;EAaA;EACA;EACA;EA8CA;EACA;EACA;EACA;;;AE3MF;EACE;EACA;EACA;EACA;EACA;;;ACqCF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAcF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOA;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;AAHF;AAAA;AAAA;EAGE;;;ACnFJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAQA;;AAKA;EACE;;;AA+BJ;EACE;EACA;;;AAcF;EACE;;;ACzBF;EACE;EACA;EACA;EACA;EAEA;;AAEA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AASF;EACE;EAGA;;AAWF;EACE;;AAGF;EACE;;AAiBF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AASJ;EACE;;;AAIF;EACE;;;AAOA;EACE;EAEA;EACA;EACA;;;AALF;EACE;EAEA;EACA;EACA;;;AALF;EACE;EAEA;EACA;EACA;;;AAIJ;AAAA;AAAA;AAKA;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAIF;EACE;;;AAIF;EACE;EACA;;;AAIF;EACE;EACA;;;AAIF;EACE;EACA;EACA;;;AAIF;EACE;EACA;EACA;;;AAIF;EACE;EACA;;;AAIF;EACE;;;ACzOF;EACE;EACA;EACA;;;AAGF;EACE;;;ACAF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;;AAIF;EACE;;;ACrBJ;EACE;EAIA;EACA;;;ACLF;EACE;EACA;EAGA;;;ACRF;EACE;EACA;;;ACCF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;;ACQJ;AAAA;AAAA;AAKA;EACE;EACA;;;AAOF;EACE;EACA;;AAEA;EAEE;EACA;;AAGF;EACE;EACA;;;AAMJ;EACE;;;AAGF;AAAA;AAAA;AAOA;AAAA;EACE;EACA;EACA;EACA,YACE;;AAIF;EATF;AAAA;IAUI,YACE;;;;AAcJ;EACE,YACE;;AAGF;EACE;;AAMF;EACE;;AASJ;EAEE;EACA;EACA;;AAEA;EANF;IAOI;;;;AAKN;AAAA;AAAA;AASA;EAGE;EACA;EAKA;;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAEA;EAGE;EAGA;;;AAIJ;AAAA;AAAA;AAeA;EACE;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EAIE;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;AASF;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EACE;;AAON;EACE;EACA;;;AAMJ;EACE;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;;AAIJ;AAAA;AAAA;AAUA;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAkBA;AAAA;EAEE;;AAII;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;AATF;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;AAKN;AAAA;EACE;;AAII;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;AATF;AAAA;AAAA;EAEE;EACA;;AAGF;AAAA;AAAA;EAEE;EACA;;;AAOV;AAAA;AAAA;AAQA;EACE;;;AAIF;EACE;;;AAKF;AAAA;AAAA;AA+BA;EACE;;;AAGF;EACE;;;AAIA;EACE;;AAGF;EACE;;;AAKF;EACE;;AAGF;EACE;;;ACtZJ;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;EACA;EACA;;AAKA;AAAA;AAAA;EAEE;EACA;EACA;;;AAMJ;EACE;EACA;EACA;EACA;EACA;;;AAMF;EACE;EACA;;;AAkBF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;;AAIA;AAAA;AAAA;EAEE;EACA;EACA;;AAMF;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;AAAA;EACE;;AAIJ;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;AAAA;EACE;EACA;EACA;EACA;EACA;;;AC3IJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;;AAEA;EACE;;;ACFJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;;AAEA;EAgBE;EACA;EAIA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EAGA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;AAiBN;AAAA;AAAA;EAGE,kBACE;;;AAQJ;AAAA;AAAA;AAmBA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EAGA;;AAEA;EACE;EACA;EACA;EACA;EAEA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIJ;AAAA;AAAA;AASA;EACE;EACA;EAEA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA,YACE;;AAGF;EATF;IAUI;;;AAIJ;EACE;;AAGF;EACE;;AAIF;EACE;;;ACpPN;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;AAAA;EAEI;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;;AC3CR;EACE;EACA;EACA;EACA;EACA;EACA;;AAKA;AAAA;EAEE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AChCJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAKJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AASJ;EACE;EACA;EACA;EAEA;EACA;;AAEA;EACE;;AAGF;EACE;;AAQJ;EACE;EACA;;AAIF;EACE;EACA;;AAIF;EACE;EACA;EACA;;AAQF;EACE;EACA;EACA;;AAOF;EACE;;AAEA;EACE;;AAGF;EACE;;AAUJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AASJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;;AC1LN;AAAA;EAEE,OANW;EAOX;EACA;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE,OAfS;;AAkBX;AAAA;EACE;;AAGF;AAAA;EACE,OAtBiB;;AA0BnB;AAAA;EACE,OA1Ba;;AA4Bb;AAAA;AAAA;EAEE;;AAGF;AAAA;EACE,OAlCW;;AAyCf;AAAA;AAAA;AAAA;AAAA;AAAA;EAKE;;;ACpDJ;AAWA;EACE;EACA;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAKA;EACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA,kBAnDW;EAoDX;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBA5DW;EA6DX;;AAGF;EACE;EACA;EACA,kBArEW;EAsEX;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA,kBAlFW;EAmFX;;AAGF;EAEE,kBAzFiB;;AA4FnB;EAEE,kBA9FiB;;AAiGnB;EACE;;AAOF;EACE;EACA;EACA;EACA,QAnHS;EAoHT;;AAEA;EACE;EACA,QAxHO;;AA2HT;EACE;;AAGF;EACE;EACA,QAjIO;;AAqIX;EACE;EACA,OAvIS;EAwIT;;;ACvIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE,kBACE;EAIF,qBACE;EAIF;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AC3CF;EACE;EACA;;;AAGF;EACE;EACA;;;AAKF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAOA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AC9BJ;EACE;EACA;;;AAKF;EACE;EACA;;;AAGF;EACE;EACA;EAEA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;;AAGF;EAGE;EACA;EACA;;AAMA;EACE;;AAGF;EACE;EACA;EACA;EACA;;;ACrCN;EAIE;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAIA,YACE;;AAOF;EA3BF;IA4BI,YACE;;;AAYJ;EAEE;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAOA;EACE;;AAGF;EACE;;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EAGE;;AAGF;EACE;;AAIF;EACE;IAIE;;;AAIJ;EACE;EACA;;AAGF;EACE;EACA;;;AAWJ;EACE;EACA;EACA;;;AAeF;EACE;EACA;EACA;;;AAMF;EACE;;;AAOF;EACE;EACA;EACA;EACA;;;AAYF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;EACA;EACA;;;AAKF;EACE;;;ACzPF;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EAGE;;AAGF;EACE;;AAGF;EACE;IAIE;;;AAIJ;EACE;EACA;;AAOJ;EACE;;;ACnEJ;EACE;;;AAOF;EACE;;;AAMF;AAAA;EAEE;;;ACzCF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EAEE;;AAIF;EACE;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EAEE;;AAYJ;EACE;EACA;;AAEA;EACE;;AAGF;AAAA;EAEE;;AAGF;AAAA;EAEE;EACA;;AAKJ;EACE;EACA;;AAEA;EACE;;AAGF;AAAA;EAEE;;AAGF;AAAA;EAEE;;AAKJ;EACE;;AAIF;EACE;EACA;;AAEA;AAAA;EAEE;EACA;;;ACtKN;EACI;EACA;EACA;EACA;;AAGA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKR;EACI;;AAIJ;EACI;;AAIJ;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAUR;EACI;EACA;EACA;;;AC7ER;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAWF;EACE;EACA;EACA;;AAKF;EACE;;AAIF;EACE;EACA;EACA;EACA;;AAMF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACjIJ;EACE;EACA;;;AAGF;EAGE;EAEA;EACA;EACA;EACA;EACA;;AAKA;EACE;;AAGF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAOF;EACE;EACA;;AAEA;EAEE;;AAKJ;EACE;EACA;EACA,YACE;;AAGF;EACE;;AAMF;EACE;;AAMN;EACE;;AAEA;EACE;EACA;EACA;;AAMJ;EACE;EAEA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAKN;EACE;;;ACxHN;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;EACE;;;AASF;EACE;;;AAGF;EACE;EACA;;;AAOF;EACE;;AAEA;EACE;;;AC1FJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAOA;;AAEA;EACE;EACA;;AAGF;EAEE;EACA;;AAIF;EACE;EACA;;AAGF;EArCF;IAsCI;;EAEA;IACE;;;;ACrCN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAbF;IAcI;;;AAMF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAKJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAGF;EACE;;AAGF;EACE;;;ACpEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAbF;IAcI;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;;;AAMJ;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;;;AAGF;EACE;;AAGF;EACE;;;AClEN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAEA;EACE;;AAKF;EACE;EACA;;;ACPN;EACE;EACA;EACA;;AAKA;EACE;EACA;;AAGF;EACE;EACA;EAEA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAGF;EAEE;EACA;;AAGF;EA5BF;IA6BI;;;;AASN;EACE;EACA;EACA;;AAIA;EACE;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;;AAGF;EA7BF;IA8BI;;;AAOJ;EACE;EACA;;;AAOJ;EACE;EACA;EACA;EAGA;;AAEA;EACE;EACA;;AAGF;EAGE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAMJ;EACE;;;AC3JJ;EACE;EAGA;EACA;;AAEA;EACE;;AAGF;EAXF;IAYI;;;AAGF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAbF;IAcI;;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAKJ;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;;;AC/FJ;EACE;EAGA;EACA;EAEA;EACA;;AAKA;EACE;EACA;EACA;;;AAQJ;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAQF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAOJ;EACE;EACA;;AAIA;EACE;EACA;EACA;;;AC7DJ;EAGE;EAGA;EAIA;EACA;EACA;EAGA;EAIA;EACA;;AAOA;EACE;EACA;EACA;EACA;;;ACbJ;EACE;EACA;;;AAGF;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAGE;;AAIF;EACE;;;AC7CJ;EACE;EAMA;EACA;EACA;;;AAKF;EACE;;;ACDF;EACE;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EAGA;EACA;EAGA;;AAEA;EACE;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;EACA;;;AAKF;EACE;;AAGF;EACE;;AAIA;EACE,YACE;;AAIJ;EACE,YACE;;;AAMR;EACE;;AAEA;EACE,YACE;;;AAON;EACE;;;AAGF;EACE;;;AC7FF;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAIF;EACE;EACA;;AAGF;EACE;;AAGF;EAEE;;AAIJ;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EAIA;EACA;;AAEA;EACE;;AAIF;EACE;EACA;;;AAIJ;EAKE;EACA;;;AC1DF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;AAAA;EACE;EACA;EACA;EACA;EACA;;AAIF;AAAA;EAME;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EAhBF;AAAA;IAoBI;;;AAKF;AAAA;EACE;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;;AAQF;AAAA;EACE;;AAEA;EAHF;AAAA;IAII;;;AAIJ;AAAA;EACE;EACA;;AAEA;EAJF;AAAA;IAKI;;;AAON;AAAA;AAAA;EAEE;EACA;EACA;;AAQA;AAAA;AAAA;EACE;;AAMF;AAAA;AAAA;EACE;;AAKJ;AAAA;EACE;EACA;;AAKF;AAAA;EACE;EACA;;;AAKJ;EACE;;;AAIF;EACE;;;AAIF;EACE;EACA,YAlJY;EAmJZ,oBAnJY;;;AAsJd;EACE;EACA,YAtJa;EAuJb,oBAvJa;;;AA+Jf;AAAA;EAEE;EACA,YAhKW;EAiKX,oBAjKW;;;AAsKb;AAAA;EAEE;;AAEA;AAAA;EACE;EACA;;AAKF;AAAA;EACE;;;ACzMJ;EAKE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAjBF;IAkBI;;;AAIF;EACE;;AAIF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAUJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAhBF;IAiBI;;;AAGF;EACE;;AAGF;EACE;;AAMF;EACE;EACA;;AAKF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;;AAGF;EACE;;AAKN;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAMA;EACE;EACA;;AAGF;EACE;EACA;;;ACrHR;EACE;EACA;EACA;EACA;EACA;;AAmBA;EAEE;EACA;;AAMA;EACE;;AAIJ;EACE;;AAGF;EAEE;EAIA;;AAEA;EACE;;AAIJ;EACE;;AAYA;EACE;;AAQF;EACE;;AAIJ;EAEE;EACA;EACA;EACA;EACA,YACE;;AAGF;EAVF;IAWI;;;AAKJ;EACE;EACA;EACA;EACA;EACA,YACE;;AAMJ;EACE;EACA;EACA;;AAEA;EALF;IAMI;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAEF;;AAOA;EACE;EACA;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;EACA;;AAKF;EACE;EACA;EAGA;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;EACA;;AAQF;EACE;;AAEA;EAHF;IAII;;;AAIJ;EACE;;AAGF;EACE;;AAKJ;EACE;;AAEA;EACE,YACE;;AAeJ;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAOJ;EACE;;AAEA;EACE;EACA;;;AC7PN;EACE;EACA;EACA;EAGA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAVF;IAYI;;;AAIJ;EAEE;EACA;EACA;EACA;EACA,YACE;;AAOJ;EAIE;;AAIF;EACE;;AAKF;EACE;;AAKF;EACE;;AASF;EAEE;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAOJ;EACE;EACA;EACA;EACA;;AAIA;EARF;IASI;IACA;IACA;;;;AASN;EACE;IACE;IACA;;EAGF;IACE;IACA;;EAGF;IACE;IACA;;;AChIJ;EACE;;AAGA;EACE;;AAGF;EAGE;EACA;EACA;EAIA;EACA;;AAGF;EACE;EACA,eAzBc;;AA+BhB;EACE;EACA;;AAEA;EAJF;IAKI;IACA;;;AAQF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAMF;EACE,QAnEU;;AAsEZ;EACE,YAvEU;;AA0EZ;EACE;EACA;EAEA;;AAIF;EACE;EACA;;AAMF;EACE;;AAGF;EACE,WA/FU;;AAkGZ;EACE;EACA;EACA;;AAIF;EACE;EACA;;AASF;EACE;EACA;EACA;EACA;;AAIA;EACE;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;AAMJ;EACE;EACA;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;;AC3IV;EACE;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EAvDA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAuCF;EAIE;EACA;;AAKF;EACE;;AAGF;EACE;;;ACzEJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EAGA;EACA;;AAGF;EDZA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;ACJF;EAIE;EACA;EACA;EACA;EACA;;;ACtBJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAKF;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAMF;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;AAGF;EFzEA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AEyDF;EAIE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;AAKF;AAAA;EAEE;;AAIJ;EACE;;;ACvGJ;EACE;EACA;EAEA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EAEA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAGF;EACE;;AAIJ;EACE;;;AChBJ;EACE;EAGA;EAIA;EAMA;;AAEA;EAGE;EACA;;AAOF;EACE;EAKA;EACA;;;ACNJ;EACE;EAMA;EACA;EACA;EACA;EAIA;EAIA;EAEA;EACA;;AAGA;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AApCJ;EA0CE;;AAEA;EACE;;AAKF;EACE;;;AC/DJ;EACE;EACA;EACA;;AAIA;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAOJ;EACE;EACA;EACA;EAKA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;;AAMA;EACE;;AAOJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAMF;EACE;;AAOJ;EACE;;;ACvFJ;EACE;EACA;EACA;EAGA;;AAIA;EAEE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAMF;EACE;;AAIF;EACE;EACA;EACA;EACA;;AAKF;AAAA;EAKE;EAGA;EACA;;AAIF;EACE;EACA;EACA;;AAMF;EACE;;AAQF;EACE;EACA;EAIA;;AAGF;EACE;EACA;;;AClHJ;EACE;EACA;EACA;EACA;EACA;EAQA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EAEA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;;AAQJ;EACE;;;AC1DF;EACE;EACA;EACA;EACA;EAIA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;AAIJ;ET1BE;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;ASUJ;EAGE;EACA;EAGA;EACA;EASA;EAIA;EAIA;;;AAGF;EAEE;EAIA;EACA;EAIA;;;AAGF;EACE;;;ACpEF;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EAEA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EAGE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EAEA;;AAEA;EACE;;;AAIJ;EACE;EAGA;EAEA;;;AAGF;AAAA;AAAA;EAIE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAIE;;;AAGF;EAGE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EAIE;EACA;;AAKF;EACE;EACA;;AAKF;EACE;EACA;EACA;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AAGF;EAGE;EACA;;;ACpKJ;EACE;;AAMA;EACE;;AAKF;EACE;EACA;EACA;EACA;;AAKA;EACE;;AASF;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAMF;EAGE;;;ACpEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAIA;;AAKA;EACE;;AAOA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;;AC1CJ;AAAA;EAIE;EACA;EACA;;;ACAF;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;;AAMF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAgBF;EAGE;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;;AAKJ;EACE;;AAEA;EACE;;AAMJ;EACE;EACA;;AAEA;EACE;EACA;;AAOJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;;ACrIN;EACE;;AAMA;EACE;;;ACVJ;EACE;EACA;;;ACSF;EACI;EACA;EACA;EACA;EACA;;AAOA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAMJ;EAEI;EACA;EACA;EACA;;AAQR;EACI;EACA;EACA;;AAGJ;EACI;EACA;;AAQJ;EACI;EACA;EACA;;;AAeJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,SAkDqB;;EA9C7B;IAEQ,SA4CmC;;;AAvC/C;EACI;IAEQ,SAoCiD;;EAhCzD;IAEQ,SA8B+D;;;AAjE3E;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAyDZ;;EArDI;IAEQ,WAoDZ;;;AA/CA;EACI;IAEQ,WA6CZ;;EAzCI;IAEQ,WAwCZ;;;AA3EA;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAgEZ;;EA5DI;IAEQ,WA2DZ;;;AAtDA;EACI;IAEQ,WAoDZ;;EAhDI;IAEQ,WA+CZ;;;AAlFA;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAuEZ;;EAnEI;IAEQ,WAkEZ;;;AA7DA;EACI;IAEQ,WA2DZ;;EAvDI;IAEQ,WAsDZ;;;AAzFA;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA8EZ;;EA1EI;IAEQ,WAyEZ;;;AApEA;EACI;IAEQ,WAkEZ;;EA9DI;IAEQ,WA6DZ;;;AAtDA;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA0D2B;;EAtDnC;IAEQ,WAoD0D;;;AAnEtE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA2D6B;;EAvDrC;IAEQ,WAqD6D;;;AApEzE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA4D6B;;EAxDrC;IAEQ,WAsD4D;;;AArExE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA6D8B;;EAzDtC;IAEQ,WAuD8D;;;AAtE1E;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAiE4B;;EA7DpC;IAEQ,WA2D2D;;;AA1EvE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAkE8B;;EA9DtC;IAEQ,WA4D8D;;;AA3E1E;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAmE8B;;EA/DtC;IAEQ,WA6D6D;;;AA5EzE;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAoE+B;;EAhEvC;IAEQ,WA8D+D;;;AAK/E;EACI;;;AAGJ;EACI;;;AAvFA;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WAqFZ;;EAjFI;IAEQ,WAgFZ;;;AA/FA;EACI;EACA;EACA;;;AAGJ;EACI;IAEQ,WA0FZ;;EAtFI;IAEQ,WAqFZ;;;AAWJ;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAQJ;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAOR;EACI;;AAGJ;EACI;;AAMJ;EACI;;AAEA;EACI;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;;;AAahB;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EAGA;;AAMJ;EACI;EACA;EACA;EACA;;;AAkCR;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAlBJ;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAlBJ;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAlBJ;EACI;;;AAKJ;EACI;;;AAMJ;EACI;;;AAGJ;EACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;AAMA;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EAKA;EACA;EACA;EACA;;AAGA;EACI;;AAOR;EACI;EACA;EACA;EACA;EAIA;EACA;EACA;;AAEA;EACI;;AAMR;EAEI;EACA;EACA;EACA;;AAMJ;EAEI;;AAGJ;EACI;EACA;EACA;EAIA;EAKA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAKA;;AAEA;EACI;EACA;;AAKJ;EAEI;;AAMJ;EACI;;AAKJ;EACI;EACA;;AAMJ;EACI;;AAKR;EAEI;;AAGJ;EACI;;AAMJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAMR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEI;;;AC7rBZ;EACE;EACA;;;ACCF;EAIE;EACA;EACA;EACA;EACA;EACA;EAIA;;AAEA;EACE;EAGA;;;AASJ;EACE;EACA;EACA;EACA;EAGA;EACA;EACA;;AAIA;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAKF;AAAA;EAEE;EACA;EACA;EACA;EACA;;AAIF;EACE;;AAUF;EACE;EACA;;AAOF;EACE;IACE;;;;AAKN;EACE;IACE;;EAGF;IACE;;;ACpGJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAXF;IAYI,YACE;;;AAQN;EACE;EACA;EACA;EAGA;EACA;;AAKF;EACE;;;ACvEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAQF;EACE;EACA;EACA;EACA;;;AClCJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AAGA;EACE;;AAOF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAOF;EACE;EACA;;AAEA;EACE;;;AC/CR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAIF;EACE;;AAMF;EACE;;AAEA;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;AC/DN;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;EACE;;;AAUJ;EACE;;;AAMF;EACE;EACA;EACA;EACA;EACA;;;AASF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAmBF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;;;AClFF;AAAA;AAAA;AAAA;EAQE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;AAEA;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;EACA;EACA;EACA;;AAUF;AAAA;AAAA;AAAA;EACE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EACE;EACA;EACA;EACA;EACA;;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAEE;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EACE;;AAGF;AAAA;AAAA;AAAA;EACE;;;AAcJ;AAAA;EACE;EACA;;AAGF;AAAA;EACE;EACA;;AAMF;AAAA;EACE;EACA;;AAEA;AAAA;EACE;EACA;;;AC/GN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACtCF;EACE;EACA;;AAMF;EACE;EACA;EACA;EACA;;;AClBJ;EACE;EACA;;AAEA;EACE;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAWA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAUJ;EACE;;AAGF;EACE;;;ACnEJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;;AAIJ;EACE;EACA;EAKA;;AAWA;EAGE;EACA;EACA;EACA;EACA;EAGA;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;;ACtGN;EACE;EACA;EACA;EACA;EAIA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EAKA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACE;;AAGF;EACE;;AAKJ;EACE;EACA;EACA;;AAGE;EACE;EACA;;AAMF;EACE;EACA;;AAMN;EACE;EACA;EACA;;AAGE;EACE;EACA;;AAMF;EACE;EACA;;;AChGR;EACE;EACA;EACA;;AAEA;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AASJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAOA;AAAA;EAEE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAMJ;EACE;EACA;;AAIF;AAAA;EAEE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAWF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAKF;AAAA;AAAA;AAAA;AAAA;EAKE;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;EACE;;;AC5HR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAKJ;EACE;EACA;;;ACpDJ;EACE;EACA;;AAGA;EACE;EACA;;AAQF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AChJN;EACE;EACA;EACA;EACA;EACA;EAEA;;AAEA;AAAA;EAEE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AA4BF;EACE;;AASF;EACE;;AAMF;AAAA;EAEE;EACA;;AAGF;EACE,YACE;;AAGF;EACE;;AAIJ;EACE,YACE;;AAGF;EACE;;AAgBF;AAAA;EACE;EACA;EACA;;;AAeN;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AC5GF;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAGF;EACE;;AAIF;EACE;EACA;EACA;EACA,YAvBoB;;AAyBpB;EACE;EACA,WA5BU;EA6BV,YA7BU;EA8BV;EACA;EACA;EACA;EACA,YAjCkB;EAkClB;;AAEA;EACE;;AAGF;EACE;;AAGF;EAnBF;IAoBI;;EAEA;IACE;;EAGF;IACE;;;AAMR;EACE;EACA;EACA;EACA;;AAMA;EACE;EACA;EACA,QAxEU;EAyEV;EACA;;AAIJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA,OAxFU;EAyFV;EACA;;AAUJ;EACE;;AAEA;EACE;;AAQF;EAGE;;AAEA;EALF;IAMI;;;AAUN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;;AAEA;EAJF;IAKI;;;AAKN;EACE;EACA;EACA;;AAEA;EALF;IAMI;;;AAIJ;EACE;;AAEA;EAHF;IAII;;;AAKF;EACE,WA1Ka;;AA6Kf;EACE,YA7KQ;;AAgLV;EACE;EACA;;AAKF;EACE,YAzLa;;AA4Lf;EACE,WA5LQ;;AA+LV;EACE;EACA;;;ACvMR;EACE;EAMA;EACA;EACA;EACA;EAGA;;AAEA;EACE;;AAIF;EACE;;;AChBJ;EACE;EACA;EAMA;EACA;EACA;EACA;EASA;EACA;;AAEA;EACE;;AAMF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAIF;EAEE;;AAEA;EACE;EACA;;AAKJ;EAEE;;AAEA;EACE;EACA;;AAKJ;EACE;;AAEA;EACE;EACA;;AAGF;EAEE;;AAEA;EACE;EACA;;AAON;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AClHN;EACE;EAIA;;;ACUA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAOF;EACE,QAnCc;EAoCd;EACA;EACA;;AAGF;EACE,QA1Cc;EA2Cd;EACA;EACA;;AAQF;EAEE;EACA;EACA;EAGA;;AAGF;EACE;EACA,kBACE;EAEF;EACA;;AAGF;EACE;EACA,kBACE;EAEF;EACA;;AAGF;EACE;IAEE;;;;AC3FN;EACE;EACA;EACA;EACA;EAKA;EACA;;;AAQF;EACE;;;AAWF;EACE;;;AAQF;AAAA;EAEE;;;AAYF;EACE;EACA;EACA;EACA;EACA;;;AAKF;EACE;EACA;;;ACnDF;EACE;EACA;;;AAUF;EACE;EACA;;;AAaF;EACE;EACA;;;AClCF;EACE;EACA;EACA;EACA;EACA;EACA;;AAUA;EACE;EACA;EACA;EACA;EACA;EACA;EAGA;;AAkBF;EACE;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;;AAOA;EACE;;AAGF;EACE;;AASF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAOJ;EACE;EACA;EACA;EACA;;AAmBA;EACE;EACA;;AAGF;EACE;EACA;;AAKA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAQN;EACE;EACA;EACA;EACA;EACA;;AAMF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAMJ;EACE;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACxMF;EACE;EACA;EACA;EACA;EACA;;AAOA;EACE;EACA;EACA;EACA;;AASF;EACE;EACA;EACA;EACA;EACA;EACA;;AAQF;AAAA;EAEE;EACA;EACA;EACA;;AAEA;AAAA;EACE;EACA;;AAOF;EACE;;AAGF;EACE;;AASJ;EACE;;AAGF;EACE;;AAMA;EACE;;AAGF;EACE;EACA;EACA;EACA;;;ACtFN;EACE;EACA;EAMA;;AAEA;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;;AAEA;EACE;;AAiBJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;AAAA;EAEE;EACA;EACA;EACA;;AAIA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMJ;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA,YACE;;AAMJ;EACE;;;AAON;EACE;;AAEA;EACE;EACA;EACA;EACA;EAEA;EACA,YACE;;AAGF;EACE;;;AC5HN;EACE;EACA;EACA;EACA;EAGA;EACA;EACA;EAEA;EAGA;EACA;;AAEA;EACE;;AAGF;EArBF;IAsBI;;;AAMF;EACE;EACA;EACA;EACA;;AAMF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;EACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EAEA;EACA;;AAMF;EACE;;AAKA;EAGE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAZF;IAaI;;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;IAGE;;;AAON;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EAIE;;AAGF;EACE;EACA;EACA;EACA;;AAGF;AAAA;EAEE;EAGA;EACA;;AAEA;AAAA;EACE;;AAMJ;EACE;;AAEA;EACE;;AAOJ;EACE;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAMJ;EACE;EACA;;;AChTJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAOA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAON;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;EAIE;;AAGF;EACE;EACA;EACA;EACA;;AAQF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;EACE;;AAWJ;EACE;;AAEA;EACE;;AAOJ;EACE;;AAEA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAOF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAKJ;EACE;EACA;;AAKF;EACE;;AAMA;EAGE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;;ACnRN;EACI;EACA;EACA;;AAIA;EACI;EACA;EACA;EACA;;AAKJ;EACI;EACA;EACA;EAOA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACI;EAEJ;EACA;;AAOA;EACI;;AAGJ;EACI;EACA;EACA;;AAGJ;EAII;EACA;EACA;EACA;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAmBR;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKJ;EACI;;AAEA;EACI;;AAGJ;EACI;;AAMZ;EACI;EACA;;AAMA;EACI;;AAGJ;EACI;EACA;EASA;EACA;;AAEA;EACI;EACA;;AA4BZ;EACI;EACA;EACA;EACA;;AAMJ;EACI;;AAEA;EACI;EACA;EACA;EACA;;;ACtNZ;EAGI;EAEA;EACA;EACA;;AAGA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACI;EAGJ;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAIJ;EACI;EACA;EACA,YACI;;AAGJ;EACI;;AAOZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAKR;EACI;;AAIA;EACI;;AAMR;EACI;EACA;EACA;;AAGJ;EACI;;AAKA;EACI;;AAGJ;EACI;EACA;EACA;;AAMR;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;;AAEA;EACI;;AAKZ;EACI;;;ACpMZ;EACI;EACA;EACA;EAEA;EACA;;AAIA;EACI;;AAEA;EACI;EACA;EACA;EACA;;;ACdZ;EACI;;AAOA;EACI;;AATR;EAYI;EAGA;EACA;EACA;;AAGA;EACI;EACA;EAEA;;AAMJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACI;EAEJ;EACA;;AAMA;EACI;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAIR;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;;AAKJ;EACI;;AAEA;EACI;;;ACxGd;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAGF;EAIE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;;AC3EJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAGF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAKF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAKF;EAEE;;;AAGF;EAEE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAIF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EAEA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAKF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;AAAA;EAGE;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;;;AAOF;AAAA;EAEE;;;AAOF;AAAA;EAEE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAKF;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;IACE;;EAGF;IACE;;EAGF;AAAA;AAAA;IAGE;;;AC/cJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAKF;EACE;EACA;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;AAAA;EAGE;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;ACrGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAKA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAyBF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAKF;EACE;EACA;;AAMJ;EACE;;AAMF;EACE;;;AAIJ;EACE;IACE;IACA;;EAGF;IACE;IACA;;;ACzFJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAMA;EACE;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;EACA;EACA;EACA,YACE;;AASN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;EACA,YACE;EAEF;;AAUF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAOF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAMF;EACE;;AAEA;EAEE;;AAMN;EACE;;AAOF;EACE;EACA,YACE;;AAMJ;EACE;;;AC5JJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EAEA;;AAGF;EACE;EACA;;AAKA;EACE;;AAKF;EACE;EACA;EACA;;AAGF;EACE;;AAGA;EACE;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;;AAYF;EACE;EACA;EACA;EACA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAKF;EACE;EACA;;AAEA;EAEE;;AAKN;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;;AASA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEA;EACE;;AAKN;EACE;;;AAgBJ;EAGE;EACA;;AAGF;EACE;EACA;;AAVJ;EAaE;EAEA;;AAEA;EACE;EACA;EACA;;AAIA;EACE;;AAGF;EACE;;AAIJ;AAAA;EAEE;;AAEA;AAAA;EACE;;AAGF;AAAA;EACE;;;AC1PJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EAEA;;AAKF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;;AAGF;AAAA;AAAA;EAIE;EACA;;AAGF;AAAA;AAAA;EAGE;EACA;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EAEA;EACA;;AAGF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;IACE;;EAGF;IACE;;;AClKJ;EAGE;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;AAGF;EACE;IAGE;;;AAKN;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;;AAGF;EACE;;AAIJ;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAIJ;EACE;EACA;;;ACrLF;EACE;EAEA;EACA;EACA;EACA;;AAGF;EAEE;EACA;;AAKF;AAAA;EAEE;;AAIF;EACE;EACA;EACA;;AAGF;EACE;;AAKF;EACE;EACA;EACA;EACA;;AAGF;EACE;;;AASF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;;AAIJ;EACE;EACA;EACA;EACA;EAGA;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAEA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EAIE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAEA;EAGE;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAMF;EACE;;AAGF;AAAA;EAEE;;;ACvTJ;EAEE;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAGF;;AAEA;EACE;EACA;;AAKJ;AAAA;AAAA;EAGE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAMA;EACE;EACA;;AAGF;EACE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;;AAMR;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;ACrPJ;EACE;;AAEA;EACE;;;AAKJ;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EAEA;;;AAKF;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;EAEA;;;AAIF;EACE;;;AAIF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EAEA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAIF;EACE;;AAEA;EACE;;;AAMJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;;AAUN;EACE;EACA;;;AAGF;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AC7IJ;EAGE;;AAEA;EACE;;AAOF;EACE;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAQJ;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAMJ;EACE;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;;AAOA;EACE;;AAMA;EACE;;;ACzIR;EACE;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;EACA;;AAEA;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAKJ;EACE;EACA;EACA;EACA;;AAIF;EACE;;AAtKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EAEA;EACA;EACA;EACA;EACA;;;AAkKJ;EAhLE;IACE;IACA;IACA;;EAGF;IACE;IACA;IAEA;IACA;IACA;IACA;IACA;;;AAwKJ;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;EACE;IACE;;EAEF;IACE;;;AC7MJ;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;AAEA;EACE;;;AAIJ;EACE;EACA;EAGA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EAEA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;;AAOJ;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;;AAEA;EACE;;;ACrEJ;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAOF;AAAA;EAEE;EACA;;;AC0JF;EACE","sourcesContent":["// _icons.generated.scss — auto-generated by scripts/build-scss.mjs\n// DO NOT EDIT — regenerated on every build from @gjsify/adwaita-icons.\n\n:root {\n --icon-go-down: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%205%20c%200%20-0.265625%200.105469%20-0.519531%200.292969%20-0.707031%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20l%205.292969%205.292969%20l%205.292969%20-5.292969%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20c%200.1875%200.1875%200.292969%200.441406%200.292969%200.707031%20s%20-0.105469%200.519531%20-0.292969%200.707031%20l%20-6%206%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20l%20-6%20-6%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-sidebar-show: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%206%2013%20v%20-10%20h%20-3%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208%20c%200%200.550781%200.449219%201%201%201%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3Cpath%20d%3D'm%203%201%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%208%20c%200%201.644531%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-8%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200%202%20h%203%20v%2010%20h%20-3%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-8%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%204%200%20h%206%20c%200.570312%200%201%200.429688%201%201%20v%208%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-6%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-go-previous: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2012%202%20c%200%20-0.265625%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20c%20-0.390625%20-0.390625%20-1.023437%20-0.390625%20-1.414062%200%20l%20-6%206%20c%20-0.1875%200.1875%20-0.292969%200.441406%20-0.292969%200.707031%20s%200.105469%200.519531%200.292969%200.707031%20l%206%206%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20c%200.1875%20-0.1875%200.292969%20-0.441406%200.292969%20-0.707031%20s%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20l%20-5.292969%20-5.292969%20l%205.292969%20-5.292969%20c%200.1875%20-0.1875%200.292969%20-0.441406%200.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-go-next: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%202%20c%200%20-0.265625%200.105469%20-0.519531%200.292969%20-0.707031%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20l%206%206%20c%200.1875%200.1875%200.292969%200.441406%200.292969%200.707031%20s%20-0.105469%200.519531%20-0.292969%200.707031%20l%20-6%206%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20s%200.105469%20-0.519531%200.292969%20-0.707031%20l%205.292969%20-5.292969%20l%20-5.292969%20-5.292969%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-go-up: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%2011%20c%200%20-0.265625%200.105469%20-0.519531%200.292969%20-0.707031%20l%206%20-6%20c%200.390625%20-0.390625%201.023437%20-0.390625%201.414062%200%20l%206%206%20c%200.1875%200.1875%200.292969%200.441406%200.292969%200.707031%20s%20-0.105469%200.519531%20-0.292969%200.707031%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20l%20-5.292969%20-5.292969%20l%20-5.292969%205.292969%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20c%20-0.1875%20-0.1875%20-0.292969%20-0.441406%20-0.292969%20-0.707031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-refresh: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.40625%201%20c%20-0.613281%200.007812%20-1.234375%200.089844%20-1.847656%200.253906%20c%20-3.273438%200.878906%20-5.558594%203.855469%20-5.558594%207.246094%20s%202.285156%206.367188%205.558594%207.242188%20c%203.273437%200.878906%206.742187%20-0.558594%208.4375%20-3.492188%20c%200.277344%20-0.480469%200.109375%20-1.089844%20-0.367188%20-1.367188%20c%20-0.476562%20-0.273437%20-1.089844%20-0.109374%20-1.367187%200.367188%20c%20-1.246094%202.160156%20-3.777344%203.207031%20-6.1875%202.5625%20c%20-2.40625%20-0.644531%20-4.074219%20-2.820312%20-4.074219%20-5.3125%20c%200%20-2.496094%201.667969%20-4.667969%204.074219%20-5.3125%20c%202.410156%20-0.644531%204.941406%200.402344%206.1875%202.5625%20c%200.058593%200.085938%200.125%200.164062%200.203125%200.226562%20l%20-0.019532%200.015626%20l%20-0.007812%200.007812%20h%20-1.4375%20c%20-0.550781%200%20-1%200.449219%20-1%201%20c%200%200%200%201%201%201%20h%205%20v%20-5%20s%200.003906%20-1%20-1%20-1%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%201.6875%20l%20-0.015625%200.011719%20l%20-0.011719%200.011719%20c%20-1.277344%20-2.179688%20-3.53125%20-3.519532%20-5.953125%20-3.691407%20c%20-0.203125%20-0.015625%20-0.40625%20-0.019531%20-0.613281%20-0.019531%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-open-menu: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%201%202%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%201%207%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%201%2012%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-go-home: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200.363281%20c%20-0.5%200%20-1%200.167969%20-1.40625%200.507813%20l%20-4.464844%203.722656%20c%20-0.714844%200.59375%20-1.128906%201.476562%20-1.128906%202.40625%20v%206%20c%200%201.65625%201.34375%203%203%203%20h%208%20c%201.65625%200%203%20-1.34375%203%20-3%20v%20-6%20c%200%20-0.929688%20-0.414062%20-1.8125%20-1.128906%20-2.40625%20l%20-4.464844%20-3.722656%20c%20-0.40625%20-0.339844%20-0.90625%20-0.507813%20-1.40625%20-0.507813%20z%20m%20-0.015625%201.996094%20c%200.050781%20-0.003906%200.101563%200.011719%200.144531%200.046875%20l%204.464844%203.722656%20c%200.257812%200.214844%200.40625%200.535156%200.40625%200.871094%20v%206%20c%200%200.5625%20-0.4375%201%20-1%201%20h%20-2%20v%20-5%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20h%20-2%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%205%20h%20-2%20c%20-0.5625%200%20-1%20-0.4375%20-1%20-1%20v%20-6%20c%200%20-0.335938%200.148438%20-0.65625%200.40625%20-0.871094%20l%204.464844%20-3.722656%20c%200.035156%20-0.027344%200.074218%20-0.042969%200.113281%20-0.046875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-list-add: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%201%20v%206%20h%20-6%20v%202%20h%206%20v%206%20h%202%20v%20-6%20h%206%20v%20-2%20h%20-6%20v%20-6%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-network-wireless: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201.992188%20c%20-2.617188%200%20-5.238281%200.933593%20-7.195312%202.808593%20l%20-0.496094%200.480469%20c%20-0.3984378%200.378906%20-0.410156%201.011719%20-0.03125%201.410156%20c%200.382812%200.398438%201.015625%200.410156%201.414062%200.03125%20l%200.5%20-0.476562%20c%203.085938%20-2.957032%208.53125%20-2.957032%2011.617188%200%20l%200.5%200.476562%20c%200.398437%200.378906%201.03125%200.367188%201.414062%20-0.03125%20c%200.378906%20-0.398437%200.367188%20-1.03125%20-0.03125%20-1.410156%20l%20-0.496094%20-0.484375%20c%20-1.957031%20-1.871094%20-4.578124%20-2.804687%20-7.195312%20-2.804687%20z%20m%20-0.03125%204.007812%20c%20-1.570312%200.011719%20-3.128906%200.628906%20-4.207031%201.8125%20l%20-0.5%200.550781%20c%20-0.179688%200.195313%20-0.277344%200.453125%20-0.261719%200.71875%20c%200.011719%200.265625%200.128906%200.515625%200.328125%200.695313%20c%200.195313%200.179687%200.453125%200.273437%200.71875%200.257812%20c%200.265625%20-0.011718%200.515625%20-0.128906%200.695313%20-0.328125%20l%200.496093%20-0.546875%20c%201.277344%20-1.402344%204.160157%20-1.496094%205.523438%200.003906%20l%200.5%200.542969%20c%200.175781%200.199219%200.425781%200.316407%200.691406%200.328125%20c%200.265625%200.015625%200.523437%20-0.078125%200.722656%20-0.257812%20c%200.195313%20-0.179688%200.3125%20-0.429688%200.324219%20-0.695313%20c%200.011719%20-0.261719%20-0.082031%20-0.523437%20-0.261719%20-0.71875%20l%20-0.5%20-0.546875%20c%20-1.121093%20-1.234375%20-2.703125%20-1.828125%20-4.269531%20-1.816406%20z%20m%200.03125%204%20c%20-0.511719%200%20-1.023438%200.195312%20-1.414062%200.585938%20c%20-0.78125%200.78125%20-0.78125%202.046874%200%202.828124%20s%202.046874%200.78125%202.828124%200%20s%200.78125%20-2.046874%200%20-2.828124%20c%20-0.390624%20-0.390626%20-0.902343%20-0.585938%20-1.414062%20-0.585938%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202.96875%201.003906%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%208%20c%200%201.644532%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355468%203%20-3%20v%20-6%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20h%20-3.585938%20l%20-1.707031%20-1.707031%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%202%20h%203.585938%20l%201%201%20h%20-5.585938%20c%200%20-0.5625%200.4375%20-1%201%20-1%20z%20m%20-1%202%20h%2011%20c%200.5625%200%201%200.4375%201%201%20v%206%20c%200%200.5625%20-0.4375%201%20-1%201%20h%20-10%20c%20-0.5625%200%20-1%20-0.4375%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-starred: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.429688%200%20-0.8125%200.273438%20-0.949219%200.683594%20l%20-1.449219%204.339844%20l%20-4.589843%20-0.015626%20c%20-0.980469%20-0.003906%20-1.382813%201.257813%20-0.582031%201.820313%20l%203.625%202.554687%20l%20-1.5%204.285157%20c%20-0.316407%200.902343%200.6875%201.691406%201.492187%201.171875%20l%204.003906%20-2.59375%20l%203.894531%202.585937%20c%200.800782%200.53125%201.816407%20-0.257812%201.5%20-1.160156%20l%20-1.503906%20-4.289063%20l%203.644532%20-2.578124%20c%200.789062%20-0.5625%200.394531%20-1.808594%20-0.574219%20-1.8125%20l%20-4.660157%20-0.015626%20l%20-1.402343%20-4.285156%20c%20-0.132813%20-0.410156%20-0.515625%20-0.68749975%20-0.949219%20-0.691406%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-system-search: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-3.578125%200%20-6.5%202.921875%20-6.5%206.5%20s%202.921875%206.496094%206.5%206.496094%20c%201.429688%200%202.753906%20-0.464844%203.828125%20-1.253906%20l%202.945313%202.945312%20c%200.957031%200.9375%202.363281%20-0.5%201.40625%20-1.4375%20l%20-2.929688%20-2.929688%20c%200.785156%20-1.074218%201.25%20-2.394531%201.25%20-3.820312%20c%200%20-3.578125%20-2.921875%20-6.5%20-6.5%20-6.5%20z%20m%200%202%20c%202.496094%200%204.5%202.003906%204.5%204.5%20s%20-2.003906%204.496094%20-4.5%204.496094%20s%20-4.5%20-2%20-4.5%20-4.496094%20s%202.003906%20-4.5%204.5%20-4.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-contact-new: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-1.65625%200%20-3%201.34375%20-3%203%20s%201.34375%203%203%203%20s%203%20-1.34375%203%20-3%20s%20-1.34375%20-3%20-3%20-3%20z%20m%20-1.5%207%20c%20-2.492188%200%20-4.5%202.007812%20-4.5%204.5%20v%200.5%20c%200%201.109375%200.890625%202%202%202%20h%206%20v%20-1%20h%20-3%20v%20-4%20h%203%20v%20-1.972656%20c%20-0.164062%20-0.019532%20-0.332031%20-0.027344%20-0.5%20-0.027344%20z%20m%204.5%200%20v%203%20h%20-3%20v%202%20h%203%20v%203%20h%202%20v%20-3%20h%203%20v%20-2%20h%20-3%20v%20-3%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-mail-unread: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%202%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%206%20c%200%201.644531%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-6%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200.800781%202%20h%208.394531%20l%20-3.917968%202.613281%20c%20-0.171875%200.113281%20-0.382813%200.113281%20-0.554688%200%20z%20m%20-1.800781%201.203125%20l%204.613281%203.074219%20c%200.835938%200.558594%201.9375%200.558594%202.773438%200%20l%204.613281%20-3.074219%20v%205.796875%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-10%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-avatar-default: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-1.65625%200%20-3%201.34375%20-3%203%20s%201.34375%203%203%203%20s%203%20-1.34375%203%20-3%20s%20-1.34375%20-3%20-3%20-3%20z%20m%20-1.5%207%20c%20-2.492188%200%20-4.5%202.007812%20-4.5%204.5%20v%200.5%20c%200%201.109375%200.890625%202%202%202%20h%208%20c%201.109375%200%202%20-0.890625%202%20-2%20v%20-0.5%20c%200%20-2.492188%20-2.007812%20-4.5%20-4.5%20-4.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-media-playback-start: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%202.5%20v%2011%20c%200%201.5%201.269531%201.492188%201.269531%201.492188%20h%200.128907%20c%200.246093%200.003906%200.488281%20-0.050782%200.699218%20-0.171876%20l%209.796875%20-5.597656%20c%200.433594%20-0.242187%200.65625%20-0.734375%200.65625%20-1.226562%20c%200%20-0.492188%20-0.222656%20-0.984375%20-0.65625%20-1.222656%20l%20-9.796875%20-5.597657%20c%20-0.210937%20-0.121093%20-0.453125%20-0.175781%20-0.699218%20-0.175781%20h%20-0.128907%20s%20-1.269531%200%20-1.269531%201.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-media-playback-pause: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%203%201%20h%203%20c%200.550781%200%201%200.449219%201%201%20v%2012%20c%200%200.550781%20-0.449219%201%20-1%201%20h%20-3%20c%20-0.550781%200%20-1%20-0.449219%20-1%20-1%20v%20-12%20c%200%20-0.550781%200.449219%20-1%201%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2010%201%20h%203%20c%200.550781%200%201%200.449219%201%201%20v%2012%20c%200%200.550781%20-0.449219%201%20-1%201%20h%20-3%20c%20-0.550781%200%20-1%20-0.449219%20-1%20-1%20v%20-12%20c%200%20-0.550781%200.449219%20-1%201%20-1%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-media-eject: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.585938%201.585938%20l%20-4%204%20c%20-0.371094%200.378906%20-0.578126%200.886718%20-0.582032%201.148437%20l%20-0.003906%201.265625%20c%200%201%201%201%201%201%20h%2010%20s%201%200%201%20-1%20v%20-1%20h%20-0.003906%20c%200%20-0.53125%20-0.207032%20-1.039062%20-0.582032%20-1.414062%20l%20-4%20-4%20c%20-0.375%20-0.375%20-0.8125%20-0.617188%20-1.414062%20-0.585938%20s%20-1.09375%200.265625%20-1.414062%200.585938%20z%20m%20-3.585938%209.414062%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%201%20c%200%200.554688%200.445312%201%201%201%20h%2010%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-1%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-media-playlist-repeat: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20v%202%20h%20-4%20c%20-2.199219%200%20-4%201.800781%20-4%204%20v%202%20c%200%201.019531%200.386719%201.964844%201.019531%202.671875%20c%200.367188%200.410156%201%200.445313%201.410157%200.078125%20c%200.414062%20-0.367188%200.449218%20-1%200.078124%20-1.414062%20c%20-0.316406%20-0.351563%20-0.507812%20-0.8125%20-0.507812%20-1.335938%20v%20-2%20c%200%20-1.125%200.875%20-2%202%20-2%20h%204%20v%202%20h%201%20v%20-0.007812%20c%200.265625%200.003906%200.519531%20-0.101563%200.707031%20-0.285157%20l%202%20-2%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20l%20-2%20-2%20c%20-0.1875%20-0.183594%20-0.441406%20-0.289063%20-0.707031%20-0.285157%20v%20-0.007812%20z%20m%206.289062%203%20c%20-0.265624%20-0.011719%20-0.523437%200.078125%20-0.71875%200.257812%20c%20-0.414062%200.367188%20-0.449218%201%20-0.078124%201.410157%20c%200.316406%200.355469%200.507812%200.816406%200.507812%201.339843%20v%202%20c%200%201.125%20-0.875%202%20-2%202%20h%20-4%20v%20-2.007812%20h%20-1%20v%200.007812%20c%20-0.265625%20-0.003906%20-0.519531%200.101563%20-0.707031%200.285157%20l%20-2%202%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%202%202%20c%200.1875%200.183594%200.441406%200.289063%200.707031%200.285157%20v%200.007812%20h%201%20v%20-1.992188%20h%204%20c%202.199219%200%204%20-1.804687%204%20-4%20v%20-2%20c%200%20-1.023437%20-0.386719%20-1.96875%20-1.019531%20-2.675781%20c%20-0.175781%20-0.199219%20-0.425781%20-0.316406%20-0.691407%20-0.332031%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-dialog-error: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-3.871094%200%20-7%203.128906%20-7%207%20s%203.128906%207%207%207%20s%207%20-3.128906%207%20-7%20s%20-3.128906%20-7%20-7%20-7%20z%20m%20-4%206%20h%208%20v%202%20h%20-8%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-muted: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2010%205%20c%20-0.265625%200%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%201.292969%201.292969%20l%20-1.292969%201.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20s%201.023437%200.390625%201.414062%200%20l%201.292969%20-1.292969%20l%201.292969%201.292969%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20s%200.390625%20-1.023437%200%20-1.414062%20l%20-1.292969%20-1.292969%20l%201.292969%20-1.292969%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20l%20-1.292969%201.292969%20l%20-1.292969%20-1.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-low: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%202.957031%202.980469%20c%20-0.199219%200.011719%20-0.394531%200.074219%20-0.5625%200.203125%20c%20-0.441406%200.332032%20-0.53125%200.960938%20-0.195312%201.402344%20c%201.074219%201.425781%201.074219%203.386719%200%204.8125%20c%20-0.335938%200.441406%20-0.246094%201.070312%200.195312%201.402344%20c%200.441407%200.332031%201.066407%200.242187%201.398438%20-0.195313%20c%200.804687%20-1.070312%201.207031%20-2.339843%201.207031%20-3.613281%20s%20-0.402344%20-2.542969%20-1.207031%20-3.613281%20c%20-0.183594%20-0.246094%20-0.464844%20-0.382813%20-0.753907%20-0.398438%20c%20-0.027343%200%20-0.054687%200%20-0.085937%200%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-medium: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%203.039062%202.980469%20c%20-0.222656%20-0.007812%20-0.453124%200.058594%20-0.644531%200.203125%20c%20-0.261719%200.199219%20-0.394531%200.5%20-0.394531%200.804688%20v%200.066406%20c%200.011719%200.1875%200.078125%200.371094%200.199219%200.527344%20c%201.074219%201.429687%201.074219%203.390625%200%204.816406%20c%20-0.121094%200.160156%20-0.1875%200.34375%20-0.199219%200.53125%20v%200.066406%20c%200%200.304688%200.132812%200.605469%200.394531%200.804688%20c%200.441407%200.332031%201.066407%200.242187%201.398438%20-0.199219%20c%200.804687%20-1.066406%201.207031%20-2.335937%201.207031%20-3.609375%20s%20-0.402344%20-2.542969%20-1.207031%20-3.613281%20c%20-0.183594%20-0.246094%20-0.464844%20-0.382813%20-0.753907%20-0.398438%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2013.460938%201.96875%20c%20-0.191407%20-0.003906%20-0.386719%200.054688%20-0.558594%200.167969%20c%20-0.457032%200.3125%20-0.578125%200.933593%20-0.269532%201.390625%20c%201.824219%202.707031%201.824219%206.238281%200%208.945312%20c%20-0.308593%200.457032%20-0.1875%201.078125%200.269532%201.390625%20c%200.457031%200.308594%201.078125%200.1875%201.390625%20-0.269531%20c%201.136719%20-1.691406%201.707031%20-3.640625%201.707031%20-5.59375%20s%20-0.570312%20-3.902344%20-1.707031%20-5.59375%20c%20-0.195313%20-0.285156%20-0.511719%20-0.4375%20-0.832031%20-0.4375%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-audio-volume-high: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%201.007812%20c%20-0.296875%20-0.003906%20-0.578125%200.125%20-0.769531%200.351563%20l%20-3.230469%203.640625%20h%20-1%20c%20-1.09375%200%20-2%200.84375%20-2%202%20v%202%20c%200%201.089844%200.910156%202%202%202%20h%201%20l%203.230469%203.640625%20c%200.210937%200.253906%200.492187%200.363281%200.769531%200.359375%20z%20m%206.460938%200.960938%20c%20-0.191407%20-0.003906%20-0.386719%200.054688%20-0.558594%200.167969%20c%20-0.457032%200.3125%20-0.578125%200.933593%20-0.269532%201.390625%20c%201.824219%202.707031%201.824219%206.238281%200%208.945312%20c%20-0.308593%200.457032%20-0.1875%201.078125%200.269532%201.390625%20c%200.457031%200.308594%201.078125%200.1875%201.390625%20-0.269531%20c%201.136719%20-1.691406%201.707031%20-3.640625%201.707031%20-5.59375%20s%20-0.570312%20-3.902344%20-1.707031%20-5.59375%20c%20-0.195313%20-0.285156%20-0.511719%20-0.4375%20-0.832031%20-0.4375%20z%20m%20-3.421876%202.019531%20c%20-0.222656%20-0.007812%20-0.453124%200.058594%20-0.644531%200.203125%20c%20-0.261719%200.199219%20-0.394531%200.5%20-0.394531%200.804688%20v%200.058594%20c%200.011719%200.191406%200.074219%200.375%200.199219%200.535156%20c%201.074219%201.429687%201.074219%203.390625%200%204.816406%20c%20-0.125%200.164062%20-0.1875%200.347656%20-0.199219%200.535156%20v%200.0625%20c%200%200.304688%200.132812%200.605469%200.394531%200.804688%20c%200.441407%200.332031%201.066407%200.242187%201.398438%20-0.199219%20c%200.804687%20-1.066406%201.207031%20-2.335937%201.207031%20-3.609375%20s%20-0.402344%20-2.542969%20-1.207031%20-3.613281%20c%20-0.183594%20-0.246094%20-0.464844%20-0.382813%20-0.753907%20-0.398438%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-camera-photo: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-0.265625%200%20-0.519531%200.105469%20-0.707031%200.292969%20l%20-1.707031%201.707031%20h%20-1.085938%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%207%20c%200%201.644531%201.355469%203%203%203%20h%2010%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-7%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20h%20-1.085938%20l%20-1.707031%20-1.707031%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200.414062%202%20h%202.171876%20l%201.707031%201.707031%20c%200.1875%200.1875%200.441406%200.292969%200.707031%200.292969%20h%201.5%20c%200.570312%200%201%200.429688%201%201%20v%207%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-10%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-7%20c%200%20-0.570312%200.429688%20-1%201%20-1%20h%201.5%20c%200.265625%200%200.519531%20-0.105469%200.707031%20-0.292969%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%208%204%20c%20-2.199219%200%20-4%201.800781%20-4%204%20s%201.800781%204%204%204%20s%204%20-1.800781%204%20-4%20s%20-1.800781%20-4%20-4%20-4%20z%20m%200%202%20c%201.117188%200%202%200.882812%202%202%20s%20-0.882812%202%20-2%202%20s%20-2%20-0.882812%20-2%20-2%20s%200.882812%20-2%202%20-2%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-user-trash: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-1.378906%200%20-2.5%201.121094%20-2.5%202.5%20v%200.5%20h%20-3%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20h%201%20v%208%20c%200%201.65625%201.34375%203%203%203%20h%206%20c%201.65625%200%203%20-1.34375%203%20-3%20v%20-8%20h%201%20c%200.550781%200%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20h%20-3.023438%20v%20-0.5%20c%200%20-1.378906%20-1.117187%20-2.5%20-2.5%20-2.5%20z%20m%200%202%20h%202.976562%20c%200.289063%200%200.5%200.210938%200.5%200.5%20v%200.5%20h%20-3.976562%20v%20-0.5%20c%200%20-0.289062%200.210938%20-0.5%200.5%20-0.5%20z%20m%20-2.5%203%20h%208%20v%208%20c%200%200.5625%20-0.4375%201%20-1%201%20h%20-6%20c%20-0.5625%200%20-1%20-0.4375%20-1%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%207%207%20v%205%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-5%20c%200%20-0.277344%200.222656%20-0.5%200.5%20-0.5%20s%200.5%200.222656%200.5%200.5%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%2010%207%20v%205%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-5%20c%200%20-0.277344%200.222656%20-0.5%200.5%20-0.5%20s%200.5%200.222656%200.5%200.5%20z%20m%200%200'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-view-reveal: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%202%20c%20-3.648438%200.003906%20-6.832031%202.476562%20-7.738281%206.007812%20c%200.914062%203.527344%204.097656%205.988282%207.738281%205.992188%20c%203.648438%20-0.003906%206.832031%20-2.476562%207.738281%20-6.011719%20c%20-0.914062%20-3.523437%20-4.097656%20-5.984375%20-7.738281%20-5.988281%20z%20m%200%202%20c%202.210938%200%204%201.789062%204%204%20s%20-1.789062%204%20-4%204%20s%20-4%20-1.789062%20-4%20-4%20s%201.789062%20-4%204%20-4%20z%20m%200%202%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20s%202%20-0.894531%202%20-2%20s%20-0.894531%20-2%20-2%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-conceal: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201.53125%200.46875%20l%20-1.0625%201.0625%20l%2014%2014%20l%201.0625%20-1.0625%20l%20-2.382812%20-2.382812%20c%201.265624%20-1.0625%202.171874%20-2.496094%202.589843%20-4.097657%20c%20-0.914062%20-3.523437%20-4.097656%20-5.984375%20-7.738281%20-5.988281%20c%20-1.367188%200.011719%20-2.707031%200.371094%20-3.894531%201.042969%20z%20m%206.46875%203.53125%20c%202.210938%200%204%201.789062%204%204%20c%20-0.003906%200.800781%20-0.246094%201.578125%20-0.699219%202.238281%20l%20-1.46875%20-1.46875%20c%200.105469%20-0.242187%200.164063%20-0.503906%200.167969%20-0.769531%20c%200%20-1.105469%20-0.894531%20-2%20-2%20-2%20c%20-0.265625%200.003906%20-0.527344%200.0625%20-0.769531%200.167969%20l%20-1.46875%20-1.46875%20c%200.660156%20-0.453125%201.4375%20-0.695313%202.238281%20-0.699219%20z%20m%20-6.144531%200.917969%20c%20-0.753907%200.898437%20-1.296875%201.957031%20-1.59375%203.09375%20c%200.914062%203.523437%204.097656%205.984375%207.738281%205.988281%20c%200.855469%20-0.007812%201.703125%20-0.152344%202.511719%20-0.425781%20l%20-1.667969%20-1.667969%20c%20-0.277344%200.058594%20-0.5625%200.089844%20-0.84375%200.09375%20c%20-2.210938%200%20-4%20-1.789062%20-4%20-4%20c%200.003906%20-0.28125%200.035156%20-0.566406%200.09375%20-0.84375%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-value-increase: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%203%20v%204%20h%20-4%20v%202%20h%204%20v%204%20h%202%20v%20-4%20h%204%20v%20-2%20h%20-4%20v%20-4%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-value-decrease: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%207%20h%2010%20v%202%20h%20-10%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-edit-clear: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%202%20c%20-0.832031%200%20-1.558594%200.34375%20-2.292969%200.78125%20s%20-1.464843%201.003906%20-2.128906%201.597656%20c%20-0.660156%200.597656%20-1.253906%201.222656%20-1.707031%201.796875%20c%20-0.226563%200.289063%20-0.417969%200.5625%20-0.570313%200.835938%20c%20-0.152343%200.277343%20-0.300781%200.53125%20-0.300781%200.988281%20s%200.148438%200.710938%200.300781%200.984375%20c%200.152344%200.277344%200.34375%200.550781%200.570313%200.835937%20c%200.453125%200.578126%201.046875%201.203126%201.707031%201.796876%20c%200.664063%200.597656%201.394531%201.164062%202.128906%201.601562%20s%201.460938%200.78125%202.292969%200.78125%20h%206%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-6%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%201%203%20c%200.265625%200%200.519531%200.105469%200.707031%200.292969%20l%201.292969%201.292969%20l%201.292969%20-1.292969%20c%200.1875%20-0.1875%200.441406%20-0.292969%200.707031%20-0.292969%20s%200.519531%200.105469%200.707031%200.292969%20c%200.390625%200.390625%200.390625%201.023437%200%201.414062%20l%20-1.292969%201.292969%20l%201.292969%201.292969%20c%200.390625%200.390625%200.390625%201.023437%200%201.414062%20s%20-1.023437%200.390625%20-1.414062%200%20l%20-1.292969%20-1.292969%20l%20-1.292969%201.292969%20c%20-0.390625%200.390625%20-1.023437%200.390625%20-1.414062%200%20s%20-0.390625%20-1.023437%200%20-1.414062%20l%201.292969%20-1.292969%20l%20-1.292969%20-1.292969%20c%20-0.390625%20-0.390625%20-0.390625%20-1.023437%200%20-1.414062%20c%200.1875%20-0.1875%200.441406%20-0.292969%200.707031%20-0.292969%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-document-edit: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2012.277344%200.832031%20c%20-0.578125%200.007813%20-1.167969%200.230469%20-1.691406%200.753907%20l%20-9%209%20c%20-0.375%200.375%20-0.585938%200.882812%20-0.585938%201.414062%20v%203%20h%203%20c%200.53125%200%201.039062%20-0.210938%201.414062%20-0.585938%20l%209%20-9%20c%201.789063%20-1.789062%200.082032%20-4.390624%20-1.890624%20-4.570312%20c%20-0.082032%20-0.011719%20-0.164063%20-0.011719%20-0.246094%20-0.011719%20z%20m%20-1.777344%203.605469%20l%201.0625%201.0625%20l%20-7.0625%207.0625%20l%20-1.0625%20-1.0625%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-document-open: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%201%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%208%20c%200%201.644531%201.355469%203%203%203%20h%208.882812%20c%200.832032%200%201.578126%20-0.402344%202.054688%20-0.9375%20c%200.472656%20-0.53125%200.738281%20-1.167969%200.910156%20-1.800781%20l%200.972656%20-2.609375%20c%200.390626%20-1.449219%20-0.09375%20-2.652344%20-0.820312%20-3.167969%20c%20-0.484375%20-0.34375%20-0.714844%20-0.292969%20-1%20-0.324219%20v%20-1.160156%20c%200%20-0.855469%20-0.558594%20-1.589844%20-1.09375%20-1.828125%20c%20-0.417969%20-0.1875%20-0.808594%20-0.183594%20-0.953125%20-0.171875%20h%20-3.539063%20l%20-1.707031%20-1.707031%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%202%20h%202.585938%20l%201.707031%201.707031%20c%200.1875%200.1875%200.441406%200.292969%200.707031%200.292969%20h%204%20v%201%20h%20-5%20h%200.039062%20c%20-0.914062%20-0.039062%20-1.746093%200.394531%20-2.1875%200.96875%20c%20-0.714843%201.226562%20-1.160156%202.28125%20-1.800781%203.71875%20c%20-0.171875%200.527344%200.113281%201.09375%200.636719%201.265625%20c%200.527344%200.167969%201.09375%20-0.117187%201.261719%20-0.640625%20c%200.488281%20-1.011719%200.921875%20-1.816406%201.339843%20-2.808594%20c%200.210938%20-0.503906%200.703126%20-0.492187%200.898438%20-0.503906%20h%205.8125%20c%201%200%201.046875%200.703125%200.886719%201.128906%20l%20-0.96875%202.609375%20c%20-0.121094%200.4375%20-0.300781%200.800781%20-0.476563%200.996094%20c%20-0.175781%200.199219%20-0.285156%200.265625%20-0.558594%200.265625%20h%20-8.882812%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-8%20c%200%20-0.570312%200.46875%20-0.792969%201%20-1%20z%20m%209.105469%201.996094%20h%200.003906%20v%200.003906%20h%200.003906%20l%20-0.003906%200.003906%20h%20-0.003906%20v%20-0.003906%20c%20-0.003907%200%20-0.007813%200%20-0.011719%200%20h%20-0.003906%20l%20-0.003906%20-0.003906%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-document-save: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208.585938%20l%20-1.292969%20-1.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%203%203%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%203%20-3%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-1.292969%201.292969%20v%20-8.585938%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-7%2014%20v%202%20h%2014%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-mail-send: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.257812%200%20-0.511719%200.0976562%20-0.707031%200.292969%20l%20-1.25%201.25%20l%20-1.761719%201.730469%20c%20-0.191406%200.199218%20-0.28125%200.441406%20-0.28125%200.75%20c%200%200.976562%201%201%201%201%20c%200.257812%200%200.527344%20-0.128907%200.71875%20-0.3125%20l%201.28125%20-1.28125%20v%203.570312%20s%200%201%201%201%20s%201%20-1%201%20-1%20v%20-3.570312%20l%201.28125%201.28125%20c%200.191406%200.183593%200.410156%200.3125%200.71875%200.3125%20c%200%200%201%20-0.023438%201%20-1%20c%200%20-0.308594%20-0.089844%20-0.550782%20-0.28125%20-0.75%20l%20-1.761719%20-1.730469%20l%20-1.25%20-1.25%20c%20-0.195312%20-0.1953128%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%20-5%209%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%204%20h%202%20v%20-3.800781%20l%204.613281%203.078125%20c%200.835938%200.558594%201.9375%200.558594%202.773438%200%20l%204.613281%20-3.078125%20v%203.800781%20h%202%20v%20-4%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200.800781%202%20h%208.398438%20l%20-3.921875%202.613281%20c%20-0.171875%200.113281%20-0.382813%200.113281%20-0.554688%200%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-mail-reply-sender: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%205%202%20c%20-0.265625%200%20-0.519531%200.105469%20-0.707031%200.292969%20l%20-4%204%20c%20-0.3906252%200.390625%20-0.3906252%201.023437%200%201.414062%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20s%200.390625%20-1.023437%200%20-1.414062%20l%20-2.292969%20-2.292969%20h%208.585938%20c%201.117188%200%202%200.882812%202%202%20v%203%20c%200%200.550781%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20v%20-3%20c%200%20-0.023438%200%20-0.046875%20-0.003906%20-0.070312%20c%20-0.035156%20-2.164063%20-1.820313%20-3.929688%20-3.996094%20-3.929688%20h%20-8.585938%20l%202.292969%20-2.292969%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder-documents: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.96875%201.003906%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%209%20c%200%201.644532%201.355469%203%203%203%20h%206%20c%201.644531%200%203%20-1.355468%203%20-3%20v%20-7.5%20c%200%20-0.265625%20-0.105469%20-0.519531%20-0.292969%20-0.707031%20l%20-3.5%20-3.5%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20z%20m%200%202%20h%204%20v%201.5%20c%200%201%200.5%201.5%201.5%201.5%20h%201.5%20v%207%20c%200%200.570313%20-0.429688%201%20-1%201%20h%20-6%20c%20-0.570312%200%20-1%20-0.429687%20-1%20-1%20v%20-9%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder-download: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.984375%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208.585938%20l%20-2.292969%20-2.292969%20c%20-0.1875%20-0.1875%20-0.441406%20-0.292969%20-0.707031%20-0.292969%20s%20-0.519531%200.105469%20-0.707031%200.292969%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%204%20-4%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-2.292969%202.292969%20v%20-8.585938%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-6%2014%20v%202%20h%2012%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-grid: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%208%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%20-8%208%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%208%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%204%20c%200%200.554688%200.445312%201%201%201%20h%204%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-4%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-list: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%202%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-2%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%201%20v%202%20h%208%20v%20-2%20z%20m%20-5%204.015625%20c%20-0.554688%200%20-1%200.445313%20-1%201%20v%201.980469%20c%200%200.550781%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.449219%201%20-1%20v%20-1.980469%20c%200%20-0.554687%20-0.445312%20-1%20-1%20-1%20z%20m%205%200.984375%20v%202%20h%208%20v%20-2%20z%20m%20-5%204%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%201.980469%20c%200%200.550781%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.449219%201%20-1%20v%20-1.980469%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200.984375%20v%202%20h%208%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-more: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.996094%200%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%206%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%206%20c%20-1.105469%200%20-2%200.894531%20-2%202%20s%200.894531%202%202%202%20c%201.101562%200%202%20-0.894531%202%20-2%20s%20-0.898438%20-2%20-2%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-view-paged: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%209%205.5%20v%20-1%20c%200%20-0.277344%20-0.222656%20-0.5%20-0.5%20-0.5%20h%20-3%20c%20-0.277344%200%20-0.5%200.222656%20-0.5%200.5%20v%201%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%203%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3Cpath%20d%3D'm%204%200%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%207%20c%200%201.644531%201.355469%203%203%203%20h%206%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-7%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%200%202%20h%206%20c%200.570312%200%201%200.429688%201%201%20v%207%20c%200%200.570312%20-0.429688%201%20-1%201%20h%20-6%20c%20-0.570312%200%20-1%20-0.429688%20-1%20-1%20v%20-7%20c%200%20-0.570312%200.429688%20-1%201%20-1%20z%20m%2011%202%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%208%20c%200%200.550781%20-0.449219%201%20-1%201%20h%20-7%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20h%207%20c%201.65625%200%203%20-1.34375%203%20-3%20v%20-8%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%209%208.5%20v%20-1%20c%200%20-0.277344%20-0.222656%20-0.5%20-0.5%20-0.5%20h%20-3%20c%20-0.277344%200%20-0.5%200.222656%20-0.5%200.5%20v%201%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%203%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-view-columns: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%202%201%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%205%200%20c%20-0.554688%200%20-1%200.445312%20-1%201%20v%2012%20c%200%200.554688%200.445312%201%201%201%20h%202%20c%200.554688%200%201%20-0.445312%201%20-1%20v%20-12%20c%200%20-0.554688%20-0.445312%20-1%20-1%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-list-remove: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%207%20h%2014%20v%202%20h%20-14%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-send-to: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.257812%200%20-0.511719%200.0976562%20-0.707031%200.292969%20l%20-1.246094%201.25%20l%20-1.765625%201.730469%20c%20-0.191406%200.199218%20-0.28125%200.441406%20-0.28125%200.75%20c%200%200.976562%201%201%201%201%20c%200.257812%200%200.527344%20-0.128907%200.71875%20-0.3125%20l%201.28125%20-1.28125%20v%207.570312%20s%200%201%201%201%20s%201%20-1%201%20-1%20v%20-7.570312%20l%201.28125%201.28125%20c%200.191406%200.183593%200.410156%200.3125%200.71875%200.3125%20c%200%200%201%20-0.023438%201%20-1%20c%200%20-0.308594%20-0.089844%20-0.550782%20-0.28125%20-0.75%20l%20-1.765625%20-1.730469%20l%20-1.246094%20-1.25%20c%20-0.195312%20-0.1953128%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%20-3.96875%206.964844%20c%20-1.660156%20-0.027344%20-3.03125%201.371094%20-3.03125%203.035156%20v%202.972656%20c%200%201.664063%201.371094%203.035156%203.03125%203.035156%20h%207.9375%20c%201.664062%200%203.03125%20-1.371093%203.03125%20-3.035156%20v%20-2.972656%20c%200%20-1.664062%20-1.367188%20-3.0625%20-3.03125%20-3.035156%20l%20-1.96875%200.035156%20v%202%20l%201.96875%20-0.035156%20c%200.589844%20-0.007813%201.03125%200.445312%201.03125%201.035156%20v%202.972656%20c%200%200.589844%20-0.441406%201.035156%20-1.03125%201.035156%20h%20-7.9375%20c%20-0.585938%200%20-1.03125%20-0.445312%20-1.03125%20-1.035156%20v%20-2.972656%20c%200%20-0.589844%200.445312%20-1.042969%201.03125%20-1.035156%20l%201.96875%200.035156%20v%20-2%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-folder-music: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%201%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%204.339844%20c%20-0.457031%20-0.214844%20-0.964844%20-0.339844%20-1.5%20-0.339844%20c%20-1.921875%200%20-3.5%201.578125%20-3.5%203.5%20s%201.578125%203.5%203.5%203.5%20c%201.914062%200%203.492188%20-1.570312%203.5%20-3.484375%20c%200%20-0.003906%200%20-0.011719%200%20-0.015625%20v%20-7.5%20c%200%20-0.5625%200.4375%20-1%201%20-1%20h%204%20c%200.5625%200%201%200.4375%201%201%20v%204.339844%20c%20-0.457031%20-0.214844%20-0.964844%20-0.339844%20-1.5%20-0.339844%20c%20-1.921875%200%20-3.5%201.578125%20-3.5%203.5%20s%201.578125%203.5%203.5%203.5%20s%203.5%20-1.578125%203.5%20-3.5%20v%20-7.5%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%20-4.5%209%20c%200.839844%200%201.5%200.660156%201.5%201.5%20v%200.015625%20c%20-0.007812%200.832031%20-0.664062%201.484375%20-1.5%201.484375%20c%20-0.839844%200%20-1.5%20-0.660156%20-1.5%20-1.5%20s%200.660156%20-1.5%201.5%20-1.5%20z%20m%208%200%20c%200.839844%200%201.5%200.660156%201.5%201.5%20s%20-0.660156%201.5%20-1.5%201.5%20s%20-1.5%20-0.660156%20-1.5%20-1.5%20s%200.660156%20-1.5%201.5%20-1.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-edit-copy: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%200%203%20c%200%20-1.644531%201.355469%20-3%203%20-3%20h%205%20c%201.644531%200%203%201.355469%203%203%20c%200%200.550781%20-0.449219%201%20-1%201%20s%20-1%20-0.449219%20-1%20-1%20c%200%20-0.570312%20-0.429688%20-1%20-1%20-1%20h%20-5%20c%20-0.570312%200%20-1%200.429688%20-1%201%20v%205%20c%200%200.570312%200.429688%201%201%201%20c%200.550781%200%201%200.449219%201%201%20s%20-0.449219%201%20-1%201%20c%20-1.644531%200%20-3%20-1.355469%20-3%20-3%20z%20m%205%205%20c%200%20-1.644531%201.355469%20-3%203%20-3%20h%205%20c%201.644531%200%203%201.355469%203%203%20v%205%20c%200%201.644531%20-1.355469%203%20-3%203%20h%20-5%20c%20-1.644531%200%20-3%20-1.355469%20-3%20-3%20z%20m%202%200%20v%205%20c%200%200.570312%200.429688%201%201%201%20h%205%20c%200.570312%200%201%20-0.429688%201%20-1%20v%20-5%20c%200%20-0.570312%20-0.429688%20-1%20-1%20-1%20h%20-5%20c%20-0.570312%200%20-1%200.429688%20-1%201%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emblem-system: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%200.238281%20c%200%200.464844%20-0.378906%200.902344%20-0.820312%201.046875%20c%20-0.023438%200.007813%20-0.042969%200.011719%20-0.0625%200.019532%20c%20-0.445313%200.148437%20-1.007813%200.015624%20-1.28125%20-0.359376%20l%20-0.140626%20-0.195312%20c%20-0.15625%20-0.214844%20-0.390624%20-0.359375%20-0.652343%20-0.398438%20c%20-0.261719%20-0.042968%20-0.53125%200.019532%20-0.742188%200.175782%20c%20-0.449219%200.324218%20-0.550781%200.949218%20-0.222656%201.398437%20l%200.140625%200.199219%20c%200.277344%200.375%200.226562%200.953125%20-0.050781%201.328125%20c%20-0.011719%200.015625%20-0.023438%200.035156%20-0.035157%200.050781%20c%20-0.273437%200.378906%20-0.804687%200.601563%20-1.25%200.457032%20l%20-0.230468%20-0.074219%20c%20-0.523438%20-0.171875%20-1.089844%200.117187%20-1.257813%200.640625%20c%20-0.171875%200.527344%200.113281%201.089844%200.640625%201.261718%20l%200.222656%200.074219%20c%200.445313%200.144531%200.738282%200.636719%200.75%201.101563%20v%200.070312%20c%200.015626%200.464844%20-0.304687%200.960938%20-0.746093%201.105469%20l%20-0.226563%200.070313%20c%20-0.527344%200.171874%20-0.8125%200.738281%20-0.640625%201.261718%20c%200.167969%200.523438%200.734375%200.8125%201.257813%200.640625%20l%200.230468%20-0.074219%20c%200.445313%20-0.144531%200.976563%200.078126%201.25%200.457032%20c%200.011719%200.015625%200.027344%200.035156%200.039063%200.050781%20c%200.277344%200.375%200.324219%200.953125%200.050781%201.328125%20l%20-0.144531%200.203125%20c%20-0.324219%200.445313%20-0.226563%201.070313%200.222656%201.394531%20c%200.445313%200.324219%201.070313%200.226563%201.394531%20-0.21875%20l%200.144532%20-0.199218%20c%200.273437%20-0.378907%200.835937%20-0.507813%201.277344%20-0.359376%20c%200.019531%200.007813%200.042968%200.011719%200.0625%200.019532%20c%200.445312%200.140625%200.820312%200.578125%200.820312%201.046875%20v%200.238281%20c%200%200.550781%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20v%20-0.238281%20c%200%20-0.46875%200.378906%20-0.90625%200.820312%20-1.046875%20c%200.023438%20-0.007813%200.042969%20-0.015625%200.066407%20-0.023438%20c%200.441406%20-0.144531%201.003906%20-0.015625%201.277343%200.363282%20l%200.144532%200.199218%20c%200.324218%200.445313%200.949218%200.542969%201.394531%200.21875%20c%200.445313%20-0.324218%200.546875%20-0.949218%200.222656%20-1.394531%20l%20-0.148437%20-0.203125%20c%20-0.273438%20-0.375%20-0.226563%20-0.953125%200.050781%20-1.328125%20c%200.015625%20-0.015625%200.027344%20-0.035156%200.039063%20-0.050781%20c%200.273437%20-0.378906%200.804687%20-0.601563%201.25%20-0.457032%20l%200.234374%200.078126%20c%200.523438%200.167968%201.085938%20-0.121094%201.257813%20-0.644532%20c%200.171875%20-0.523437%20-0.117187%20-1.089844%20-0.640625%20-1.257812%20l%20-0.230469%20-0.074219%20c%20-0.445312%20-0.144531%20-0.734375%20-0.640625%20-0.746093%20-1.105469%20c%200%20-0.023437%200%20-0.046875%200%20-0.070312%20c%20-0.015626%20-0.464844%200.300781%20-0.957032%200.746093%20-1.101563%20l%200.230469%20-0.074219%20c%200.523438%20-0.171874%200.8125%20-0.734374%200.640625%20-1.261718%20c%20-0.171875%20-0.523438%20-0.734375%20-0.8125%20-1.257813%20-0.640625%20l%20-0.230468%200.074219%20c%20-0.445313%200.144531%20-0.980469%20-0.078126%20-1.253906%20-0.457032%20c%20-0.011719%20-0.015625%20-0.023438%20-0.035156%20-0.035157%20-0.050781%20c%20-0.277343%20-0.375%20-0.324219%20-0.953125%20-0.050781%20-1.328125%20l%200.144531%20-0.199219%20c%200.324219%20-0.445312%200.226563%20-1.074219%20-0.222656%20-1.398437%20c%20-0.214844%20-0.15625%20-0.480469%20-0.21875%20-0.742187%20-0.179688%20c%20-0.265626%200.042969%20-0.5%200.1875%20-0.652344%200.402344%20l%20-0.144532%200.195312%20c%20-0.273437%200.378907%20-0.835937%200.507813%20-1.28125%200.363282%20c%20-0.019531%20-0.007813%20-0.039062%20-0.015625%20-0.0625%20-0.023438%20c%20-0.441406%20-0.140625%20-0.820312%20-0.578125%20-0.820312%20-1.046875%20v%20-0.238281%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%200%204%20c%200.871094%200%201.675781%200.273438%202.332031%200.742188%20c%200.003907%200.007812%200.011719%200.015624%200.019531%200.023437%20c%200.011719%200.003906%200.019532%200.007813%200.03125%200.015625%20c%200.660157%200.484375%201.160157%201.171875%201.421876%201.976562%20v%200.007813%20s%200.003906%200.003906%200.003906%200.007813%20c%200.292968%200.851562%200.15625%201.65625%200%202.457031%20c%200%200%20-0.003906%200.003906%20-0.003906%200.007812%20v%200.003907%20c%20-0.261719%200.800781%20-0.757813%201.488281%20-1.414063%201.976562%20c%20-0.015625%200.003906%20-0.027344%200.011719%20-0.039063%200.019531%20c%20-0.007812%200.003907%20-0.015624%200.011719%20-0.019531%200.019531%20c%20-0.65625%200.46875%20-1.460937%200.742188%20-2.332031%200.742188%20c%20-0.855469%200%20-1.644531%20-0.265625%20-2.289062%20-0.714844%20c%20-0.019532%20-0.015625%20-0.042969%20-0.035156%20-0.0625%20-0.046875%20c%20-0.011719%20-0.007812%20-0.023438%20-0.015625%20-0.035157%20-0.019531%20c%20-0.652343%20-0.484375%20-1.148437%20-1.160156%20-1.40625%20-1.945312%20c%20-0.003906%20-0.015626%20-0.007812%20-0.023438%20-0.011719%20-0.035157%20c%20-0.003906%20-0.007812%20-0.007812%20-0.015625%20-0.011718%20-0.019531%20c%20-0.285156%20-0.847656%20-0.148438%20-1.644531%200%20-2.4375%20c%200.003906%20-0.007812%200.007812%20-0.011719%200.011718%20-0.019531%20c%200.003907%20-0.011719%200.007813%20-0.023438%200.011719%20-0.039063%20c%200.261719%20-0.785156%200.757813%20-1.460937%201.414063%20-1.945312%20c%200.007812%20-0.003906%200.019531%20-0.007813%200.027344%20-0.015625%20c%200.019531%20-0.011719%200.042968%20-0.03125%200.058593%20-0.046875%20c%200.648438%20-0.449219%201.4375%20-0.714844%202.292969%20-0.714844%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-preferences-system: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%2013.855469%200%20l%20-1.539063%201.4375%20c%20-0.453125%200.421875%20-0.53125%201.148438%20-0.269531%201.707031%20l%20-5.886719%205.996094%20c%20-0.011718%200%20-0.019531%200%20-0.03125%200%20c%20-0.257812%20-0.128906%20-0.550781%20-0.183594%20-0.839844%20-0.148437%20c%20-0.328124%200.046874%20-0.632812%200.199218%20-0.867187%200.441406%20l%20-3.945313%203.996094%20c%20-0.3906245%200.375%20-0.5468745%200.933593%20-0.4062495%201.457031%20c%200.1406255%200.523437%200.5546875%200.929687%201.0820315%201.058593%20c%200.527344%200.132813%201.082031%20-0.03125%201.453125%20-0.425781%20l%203.945312%20-3.996093%20c%200.472657%20-0.453126%200.59375%20-1.15625%200.296875%20-1.738282%20l%205.890625%20-5.964844%20c%200.558594%200.25%201.273438%200.148438%201.707031%20-0.289062%20l%201.414063%20-1.5625%20z%20m%20-10.308594%200.0898438%20c%20-0.398437%200%20-0.785156%200.0937502%20-1.140625%200.2187502%20l%201.882812%201.878906%20c%200.390626%200.382812%200.390626%201%200%201.386719%20l%20-0.710937%200.707031%20c%20-0.386719%200.386719%20-1%200.386719%20-1.390625%200%20l%20-1.882812%20-1.878906%20c%20-0.125%200.355468%20-0.2187505%200.742187%20-0.2187505%201.140625%20c%200%201.90625%201.5507815%203.453125%203.4609375%203.453125%20c%200.402344%200%200.789063%20-0.09375%201.144531%20-0.21875%20l%201.175782%201.171875%20h%200.058593%20l%202.070313%20-2.0625%20l%20-1.203125%20-1.203125%20c%200.125%20-0.359375%200.214843%20-0.742188%200.214843%20-1.140625%20c%200%20-1.90625%20-1.546874%20-3.4531252%20-3.460937%20-3.4531252%20z%20m%206.550781%207.8906252%20l%20-2.070312%202.066406%20c%200.011718%200.027344%200.023437%200.058594%200.03125%200.089844%20l%201.144531%201.140625%20c%20-0.125%200.355468%20-0.21875%200.742187%20-0.21875%201.140625%20c%200%201.902343%201.550781%203.449219%203.460937%203.449219%20c%200.433594%200%200.855469%20-0.101563%201.238282%20-0.246094%20l%20-2.007813%20-2%20c%20-0.386719%20-0.386719%20-0.386719%20-1.035156%200%20-1.417969%20l%200.679688%20-0.679687%20c%200.195312%20-0.191407%200.457031%20-0.308594%200.710937%20-0.308594%20s%200.515625%200.117187%200.710938%200.308594%20l%201.945312%201.941406%20c%200.105469%20-0.328125%200.183594%20-0.683594%200.183594%20-1.046875%20c%200%20-1.90625%20-1.546875%20-3.453125%20-3.460938%20-3.453125%20c%20-0.398437%200%20-0.785156%200.09375%20-1.140624%200.21875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-application-x-executable: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208.015625%200.015625%20c%20-0.769531%200%20-1.539063%200.292969%20-2.121094%200.875%20l%20-5.003906%205.003906%20c%20-1.164063%201.164063%20-1.164063%203.078125%200%204.242188%20l%205.003906%205.003906%20c%201.164063%201.164063%203.078125%201.164063%204.242188%200%20l%205.007812%20-5.003906%20c%201.164063%20-1.164063%201.164063%20-3.078125%200%20-4.242188%20l%20-5.007812%20-5.003906%20c%20-0.582031%20-0.582031%20-1.351563%20-0.875%20-2.121094%20-0.875%20z%20m%200.101563%201.988281%20c%200.210937%200.023438%200.414062%200.117188%200.585937%200.28125%20l%20-0.339844%200.113282%20c%20-0.074219%20-0.136719%20-0.15625%20-0.269532%20-0.246093%20-0.394532%20z%20m%20-1.570313%201.058594%20c%200.300781%200.421875%200.464844%200.929688%200.46875%201.453125%20c%200%201.378906%20-1.121094%202.5%20-2.5%202.5%20c%20-0.523437%20-0.003906%20-1.03125%20-0.171875%20-1.449219%20-0.472656%20z%20m%203.441406%200.503906%20l%203.742188%203.742188%20c%200.402343%200.402344%200.402343%201.011718%200%201.414062%20l%20-0.253907%200.25%20c%20-0.039062%20-0.046875%20-0.074218%20-0.09375%20-0.117187%20-0.140625%20l%200.621094%20-0.855469%20l%20-0.808594%20-0.585937%20l%20-0.621094%200.851563%20c%20-0.167969%20-0.078126%20-0.347656%20-0.136719%20-0.535156%20-0.175782%20v%20-1.050781%20h%20-1%20v%201.050781%20c%20-0.183594%200.039063%20-0.363281%200.097656%20-0.53125%200.175782%20l%20-0.621094%20-0.851563%20l%20-0.804687%200.585937%20l%200.617187%200.855469%20c%20-0.125%200.136719%20-0.238281%200.289063%20-0.332031%200.453125%20l%20-1%20-0.324218%20l%20-0.308594%200.949218%20l%201%200.324219%20c%20-0.011718%200.09375%20-0.019531%200.1875%20-0.019531%200.28125%20s%200.007813%200.1875%200.019531%200.28125%20l%20-1%200.324219%20l%200.308594%200.949218%20l%201%20-0.324218%20c%200.09375%200.164062%200.207031%200.316406%200.332031%200.453125%20l%20-0.617187%200.855469%20l%200.195312%200.140624%20l%20-0.53125%200.53125%20c%20-0.402344%200.40625%20-1.011718%200.40625%20-1.414062%200%20l%20-4.902344%20-4.902343%20l%200.027344%20-0.039063%20l%200.210937%20-0.289062%20c%200.328125%200.152344%200.679688%200.269531%201.046875%200.339844%20v%201.179687%20h%201.648438%20v%20-1.179687%20c%200.363281%20-0.070313%200.714844%20-0.1875%201.046875%20-0.339844%20l%200.207031%200.289062%20l%200.484375%200.667969%20l%201.335937%20-0.972656%20l%20-0.484374%20-0.667969%20l%20-0.210938%20-0.289062%20c%200.25%20-0.269532%200.46875%20-0.566407%200.648438%20-0.890626%20l%200.339843%200.113282%20l%200.785157%200.253906%20l%200.507812%20-1.566406%20l%20-0.785156%20-0.257813%20l%20-0.335938%20-0.109375%20c%200.019532%20-0.179687%200.035156%20-0.363281%200.035156%20-0.550781%20s%20-0.015624%20-0.371094%20-0.035156%20-0.550781%20l%200.335938%20-0.109375%20l%200.785156%20-0.257813%20z%20m%201.527344%205.449219%20c%200.527344%200%200.984375%200.265625%201.25%200.667969%20l%20-2.078125%202.082031%20c%20-0.40625%20-0.269531%20-0.671875%20-0.722656%20-0.671875%20-1.25%20c%200%20-0.835937%200.667969%20-1.5%201.5%20-1.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3Cpath%20d%3D'm%204.039062%20-18.988281%20c%20-1.449218%200%20-2.679687%201.046875%20-2.964843%202.421875%20c%20-0.019531%200.097656%20-0.035157%200.199218%20-0.046875%200.300781%20c%20-0.007813%200.101563%20-0.015625%200.203125%20-0.015625%200.304687%20v%207.910157%20c%200%201.660156%201.367187%203.027343%203.027343%203.027343%20h%207.949219%20c%201.660157%200%203.027344%20-1.367187%203.027344%20-3.027343%20v%20-7.910157%20c%200%20-0.105468%20-0.003906%20-0.207031%20-0.015625%20-0.304687%20c%20-0.011719%20-0.101563%20-0.027344%20-0.203125%20-0.046875%20-0.300781%20c%20-0.285156%20-1.375%20-1.511719%20-2.421875%20-2.964844%20-2.421875%20z%20m%200%202.003906%20h%202.976563%20v%203%20h%20-2.976563%20c%20-0.585937%200%20-1.027343%20-0.441406%20-1.027343%20-1.027344%20v%20-0.949219%20c%200.003906%20-0.035156%200.003906%20-0.070312%200.007812%20-0.105468%20c%200.003907%20-0.035156%200.007813%20-0.070313%200.011719%20-0.105469%20c%200.007812%20-0.035156%200.019531%20-0.066406%200.027344%20-0.097656%20c%200.125%20-0.421875%200.503906%20-0.714844%200.980468%20-0.714844%20z%20m%204.976563%200%20h%202.972656%20c%200.585938%200%201.023438%200.4375%201.027344%201.023437%20v%200.949219%20c%200%200.585938%20-0.441406%201.027344%20-1.027344%201.027344%20h%20-2.972656%20z%20m%204%203.71875%20v%205.214844%20c%200%200.585937%20-0.441406%201.027343%20-1.027344%201.027343%20h%20-7.949219%20c%20-0.585937%200%20-1.027343%20-0.441406%20-1.027343%20-1.027343%20v%20-5.175781%20c%200.324219%200.148437%200.671875%200.246093%201.027343%200.246093%20h%202.976563%20v%203.035157%20l%202%200.992187%20v%20-4.027344%20h%202.972656%20c%200.34375%200%200.695313%20-0.113281%201.027344%20-0.285156%20z%20m%20-5%2033.28125%20c%20-0.851563%200%20-1.699219%200.328125%20-2.351563%200.976563%20l%20-4.671874%204.671874%20c%20-1.300782%201.300782%20-1.300782%203.402344%200%204.703126%20l%204.671874%204.671874%20c%201.300782%201.300782%203.402344%201.300782%204.699219%200%20l%204.675781%20-4.671874%20c%201.300782%20-1.300782%201.300782%20-3.402344%200%20-4.703126%20l%20-4.675781%20-4.671874%20c%20-0.648437%20-0.648438%20-1.496093%20-0.976563%20-2.347656%20-0.976563%20z%20m%200%201.984375%20c%200.335937%200%200.675781%200.132812%200.941406%200.402344%20l%203.03125%203.027344%20c%20-0.066406%200.039062%20-0.136719%200.070312%20-0.210937%200.09375%20c%20-0.019532%200.003906%20-0.039063%200.011718%20-0.0625%200.015624%20c%20-0.441406%200.148438%20-1.003906%200.019532%20-1.277344%20-0.359374%20l%20-0.140625%20-0.195313%20c%20-0.15625%20-0.210937%20-0.390625%20-0.355469%20-0.652344%20-0.398437%20c%20-0.066406%20-0.011719%20-0.132812%20-0.015626%20-0.199219%20-0.011719%20c%20-0.195312%200.007812%20-0.382812%200.074219%20-0.542968%200.191406%20c%20-0.449219%200.324219%20-0.550782%200.949219%20-0.226563%201.394531%20l%200.144531%200.199219%20c%200.273438%200.378906%200.226563%200.953125%20-0.050781%201.332031%20c%20-0.011719%200.015625%20-0.023437%200.03125%20-0.035156%200.050782%20c%20-0.273437%200.378906%20-0.808594%200.597656%20-1.253906%200.453124%20l%20-0.226563%20-0.074218%20c%20-0.523437%20-0.167969%20-1.089844%200.117187%20-1.257812%200.644531%20c%20-0.171875%200.523437%200.113281%201.089844%200.636718%201.261719%20l%200.226563%200.070312%20c%200.445313%200.144532%200.738281%200.640625%200.746094%201.105469%20c%200.003906%200.023437%200.003906%200.042969%200.003906%200.066406%20c%200.015625%200.464844%20-0.304687%200.960938%20-0.75%201.105469%20l%20-0.226563%200.074219%20c%20-0.179687%200.058593%20-0.332031%200.164062%20-0.445312%200.296875%20l%20-3.785156%20-3.785156%20c%20-0.535156%20-0.535157%20-0.535156%20-1.355469%200%20-1.890626%20l%204.667968%20-4.667968%20c%200.269532%20-0.269532%200.609376%20-0.402344%200.945313%20-0.402344%20z%20m%205.585937%205.234375%20c%200.058594%200%200.117188%200.003906%200.175782%200.007813%20c%200.382812%200.523437%200.335937%201.234374%20-0.144532%201.71875%20l%20-3.753906%203.75%20c%20-0.027344%20-0.066407%20-0.050781%20-0.136719%20-0.070312%20-0.203126%20c%20-0.003906%20-0.011718%20-0.007813%20-0.023437%20-0.011719%20-0.035156%20c%20-0.003906%20-0.007812%20-0.007813%20-0.011718%20-0.011719%20-0.019531%20c%20-0.285156%20-0.84375%20-0.152344%20-1.644531%200%20-2.4375%20c%200.003906%20-0.003906%200.007813%20-0.007813%200.011719%20-0.015625%20c%200.003906%20-0.011719%200.007813%20-0.027344%200.011719%20-0.039062%20c%200.261718%20-0.789063%200.757812%20-1.464844%201.410156%20-1.945313%20c%200.011719%20-0.003906%200.023438%20-0.011719%200.03125%20-0.015625%20c%200.019531%20-0.015625%200.042969%20-0.03125%200.058594%20-0.046875%20c%200.648437%20-0.453125%201.4375%20-0.71875%202.292968%20-0.71875%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-close: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%204%20h%201%20h%200.03125%20c%200.253906%200.011719%200.511719%200.128906%200.6875%200.3125%20l%202.28125%202.28125%20l%202.3125%20-2.28125%20c%200.265625%20-0.230469%200.445312%20-0.304688%200.6875%20-0.3125%20h%201%20v%201%20c%200%200.285156%20-0.035156%200.550781%20-0.25%200.75%20l%20-2.28125%202.28125%20l%202.25%202.25%20c%200.1875%200.1875%200.28125%200.453125%200.28125%200.71875%20v%201%20h%20-1%20c%20-0.265625%200%20-0.53125%20-0.09375%20-0.71875%20-0.28125%20l%20-2.28125%20-2.28125%20l%20-2.28125%202.28125%20c%20-0.1875%200.1875%20-0.453125%200.28125%20-0.71875%200.28125%20h%20-1%20v%20-1%20c%200%20-0.265625%200.09375%20-0.53125%200.28125%20-0.71875%20l%202.28125%20-2.25%20l%20-2.28125%20-2.28125%20c%20-0.210938%20-0.195312%20-0.304688%20-0.46875%20-0.28125%20-0.75%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-minimize: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204%2010.007812%20h%208%20v%201.988282%20h%20-8%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-maximize: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203.988281%203.992188%20v%208.011718%20h%208.011719%20v%20-8.011718%20z%20m%202%202%20h%204.011719%20v%204.011718%20h%20-4.011719%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-window-restore: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.988281%204.992188%20v%206.011718%20h%206.011719%20v%20-6.011718%20z%20m%202%202%20h%202.011719%20v%202.011718%20h%20-2.011719%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-image-missing: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.015625%201.03125%20c%20-1.644531%200%20-3%201.355469%20-3%203%20v%201%20h%201%20v%20-1%20c%200%20-1.109375%200.890625%20-2%202%20-2%20h%201%20v%20-1%20z%20m%202%200%20v%201%20h%204%20v%20-1%20z%20m%205%200%20v%201%20h%201%20c%201.109375%200%202%200.890625%202%202%20v%201%20h%201%20v%20-1%20c%200%20-1.644531%20-1.355469%20-3%20-3%20-3%20z%20m%20-5%204%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20z%20m%20-5%201%20v%204%20h%201%20v%20-4%20z%20m%2013%200%20v%204%20h%201%20v%20-4%20z%20m%20-4.5%202%20l%20-2%202%20l%20-1.5%20-1%20l%20-2%202%20v%200.5%20c%200%200.5%200.5%200.5%200.5%200.5%20h%207%20s%200.472656%20-0.035156%200.5%20-0.5%20v%20-1%20z%20m%20-8.5%203%20v%201%20c%200%201.644531%201.355469%203%203%203%20h%201%20v%20-1%20h%20-1%20c%20-1.109375%200%20-2%20-0.890625%20-2%20-2%20v%20-1%20z%20m%2013%200%20v%201%20c%200%201.109375%20-0.890625%202%20-2%202%20h%20-1%20v%201%20h%201%20c%201.644531%200%203%20-1.355469%203%20-3%20v%20-1%20z%20m%20-8%203%20v%201%20h%204%20v%20-1%20z%20m%200%200'%20fill%3D'currentColor'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-recent: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208.484375%200.0195312%20c%20-4.128906%200%20-7.484375%203.3554688%20-7.484375%207.4882808%20c%200%204.128907%203.355469%207.484376%207.484375%207.484376%20c%204.132813%200%207.488281%20-3.355469%207.488281%20-7.484376%20c%200%20-4.132812%20-3.355468%20-7.4882808%20-7.488281%20-7.4882808%20z%20m%200%201.9726568%20c%203.050781%200%205.515625%202.464843%205.515625%205.515624%20c%200%203.046876%20-2.464844%205.511719%20-5.515625%205.511719%20c%20-3.046875%200%20-5.511719%20-2.464843%20-5.511719%20-5.511719%20c%200%20-3.050781%202.464844%20-5.515624%205.511719%20-5.515624%20z%20m%203.011719%202.007812%20c%20-0.035156%200%20-0.070313%200%20-0.105469%200.007812%20c%20-0.097656%200.023438%20-0.183594%200.078126%20-0.25%200.15625%20l%20-2.65625%202.65625%20l%20-1.65625%20-1.65625%20c%20-0.105469%20-0.179687%20-0.3125%20-0.269531%20-0.515625%20-0.234374%20c%20-0.203125%200.039062%20-0.363281%200.199218%20-0.402344%200.402343%20c%20-0.039062%200.203125%200.054688%200.410157%200.230469%200.519531%20l%202%202%20c%200.195313%200.179688%200.496094%200.179688%200.6875%200%20l%203%20-3%20c%200.140625%20-0.140624%200.179687%20-0.351562%200.109375%20-0.535156%20c%20-0.074219%20-0.183594%20-0.246094%20-0.308594%20-0.441406%20-0.316406%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-people: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-4.402344%200%20-8%203.597656%20-8%208%20s%203.597656%208%208%208%20s%208%20-3.597656%208%20-8%20s%20-3.597656%20-8%20-8%20-8%20z%20m%200%201.980469%20c%203.339844%200%206.019531%202.679687%206.019531%206.019531%20s%20-2.679687%206.019531%20-6.019531%206.019531%20s%20-6.019531%20-2.679687%20-6.019531%20-6.019531%20s%202.679687%20-6.019531%206.019531%20-6.019531%20z%20m%20-2%203.019531%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20z%20m%204%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20s%200.449219%201%201%201%20s%201%20-0.449219%201%20-1%20s%20-0.449219%20-1%20-1%20-1%20z%20m%20-5.28125%204.066406%20c%20-0.113281%200.066406%20-0.199219%200.175782%20-0.234375%200.304688%20s%20-0.015625%200.265625%200.050781%200.378906%20c%200.714844%201.238281%202.035156%202%203.464844%202%20s%202.75%20-0.761719%203.464844%20-2%20c%200.066406%20-0.113281%200.085937%20-0.25%200.050781%20-0.378906%20s%20-0.121094%20-0.238282%20-0.234375%20-0.304688%20s%20-0.25%20-0.085937%20-0.378906%20-0.050781%20s%20-0.238282%200.121094%20-0.304688%200.234375%20c%20-0.535156%200.929688%20-1.523437%201.5%20-2.597656%201.5%20s%20-2.0625%20-0.570312%20-2.597656%20-1.5%20c%20-0.066406%20-0.113281%20-0.175782%20-0.199219%20-0.304688%20-0.234375%20s%20-0.265625%20-0.015625%20-0.378906%200.050781%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-body: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%201%207%20v%208%20h%2011%20c%200.4375%200%200.875%20-0.375%201%20-1%20l%201%20-5.96875%20v%20-2.03125%20c%200%20-0.535156%20-0.40625%20-1%20-1%20-1%20h%20-3.898438%20l%200.898438%20-3.5%20c%200.226562%20-0.839844%20-0.433594%20-1.5%20-1%20-1.5%20h%20-1%20l%20-4.042969%207%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-nature: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.003906%201%20s%20-3%200%20-3%203%20v%205%20s%200.042969%201.417969%200.027344%202%20c%200%201%20-0.535156%201.414062%20-1.402344%202.121094%20c%20-0.628906%200.488281%20-0.773437%201.308594%20-0.308594%201.699218%20c%200.429688%200.351563%201.164063%200.300782%201.660157%20-0.34375%20l%201.019531%20-1.476562%20c%200.699219%20-1.015625%200.984375%20-1.875%201%20-3%20l%200.003906%20-6%20c%200%20-1%200.996094%20-1%200.996094%20-1%20v%206.574219%20l%203.003906%20-3.074219%20v%20-2.5%20c%200%20-1%200.996094%20-1%200.996094%20-1%20l%200.003906%202.5%20l%201.996094%20-2.035156%20c%200.339844%20-0.3125%200.503906%20-0.464844%201%20-0.464844%20l%200.003906%201%20l%20-4.003906%204%20h%204%20s%200.003906%201%20-1%201%20h%20-4%20l%20-2%202%20c%200%200.425781%200%202.007812%202%202.007812%20l%204.003906%20-0.007812%20s%203%200%202.996094%20-2.992188%20v%20-9.007812%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-food: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%200.984375%20-0.0117188%20c%20-0.550781%200.00781255%20-0.9921875%200.4609378%20-0.984375%201.0117188%20v%204%20s%200.0078125%200.84375%200.574219%201.601562%20c%200.449219%200.59375%201.257812%201.117188%202.425781%201.3125%20v%201.085938%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%205%20c%200%200.550781%200.449219%201%201%201%20h%202%20c%200.550781%200%201%20-0.449219%201%20-1%20v%20-5%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20v%20-1.085938%20c%201.167969%20-0.195312%201.976562%20-0.71875%202.425781%20-1.3125%20c%200.566407%20-0.757812%200.574219%20-1.601562%200.574219%20-1.601562%20v%20-4%20c%200.003906%20-0.359375%20-0.183594%20-0.695312%20-0.496094%20-0.878906%20c%20-0.3125%20-0.1796878%20-0.695312%20-0.1796878%20-1.007812%200%20c%20-0.3125%200.183594%20-0.5%200.519531%20-0.496094%200.878906%20v%203.5%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-3.5%20c%200.003906%20-0.269531%20-0.101562%20-0.53125%20-0.292969%20-0.722656%20c%20-0.191406%20-0.1914065%20-0.453125%20-0.2968752%20-0.722656%20-0.2890628%20c%20-0.550781%200.00781255%20-0.992187%200.4609378%20-0.984375%201.0117188%20v%203.5%20c%200%200.277344%20-0.222656%200.5%20-0.5%200.5%20s%20-0.5%20-0.222656%20-0.5%20-0.5%20v%20-3.5%20c%200.003906%20-0.269531%20-0.101562%20-0.53125%20-0.292969%20-0.722656%20c%20-0.191406%20-0.1914065%20-0.453125%20-0.2968752%20-0.722656%20-0.2890628%20z%20m%2012.984375%200.0117188%20c%20-0.253906%200.0078125%20-0.496094%200.113281%20-0.675781%200.292969%20c%20-1.734375%201.734375%20-2.503907%204.160156%20-2.898438%206.136719%20c%20-0.394531%201.976562%20-0.394531%203.570312%20-0.394531%203.570312%20c%200%200.550781%200.449219%201%201%201%20h%201%20v%204%20c%200%200.550781%200.449219%201%201%201%20h%201%20c%200.550781%200%201%20-0.449219%201%20-1%20v%20-14%20c%200%20-0.5625%20-0.464844%20-1.015625%20-1.03125%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-travel: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203.003906%201%20c%20-0.460937%200%20-0.859375%200.3125%20-0.972656%200.757812%20l%20-1%204%20c%20-0.019531%200.078126%20-0.027344%200.160157%20-0.027344%200.242188%20v%200.039062%20c%20-0.566406%200.09375%20-0.99999975%200.5625%20-0.99999975%201.15625%20v%204.613282%20c%200%200.589844%200.43359375%201.058594%200.99999975%201.152344%20v%201.539062%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%202%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20v%20-1.5%20h%208%20v%201.5%20c%200%200.277344%200.222656%200.5%200.5%200.5%20h%202%20c%200.277344%200%200.5%20-0.222656%200.5%20-0.5%20v%20-1.539062%20c%200.5625%20-0.09375%201%20-0.5625%201%20-1.15625%20v%20-4.609376%20c%200%20-0.59375%20-0.4375%20-1.0625%20-1%20-1.15625%20v%20-0.039062%20c%200%20-0.082031%20-0.011718%20-0.164062%20-0.03125%20-0.242188%20l%20-1%20-4%20c%20-0.109375%20-0.445312%20-0.511718%20-0.757812%20-0.96875%20-0.757812%20z%20m%200.78125%202%20h%208.4375%20l%200.75%203%20h%20-9.9375%20z%20m%20-0.28125%205%20c%200.828125%200%201.5%200.671875%201.5%201.5%20s%20-0.671875%201.5%20-1.5%201.5%20s%20-1.5%20-0.671875%20-1.5%20-1.5%20s%200.671875%20-1.5%201.5%20-1.5%20z%20m%209%200%20c%200.828125%200%201.5%200.671875%201.5%201.5%20s%20-0.671875%201.5%20-1.5%201.5%20s%20-1.5%20-0.671875%20-1.5%20-1.5%20s%200.671875%20-1.5%201.5%20-1.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-activities: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208%200%20c%20-4.40625%200%20-8%203.59375%20-8%208%20s%203.59375%208%208%208%20s%208%20-3.59375%208%20-8%20s%20-3.59375%20-8%20-8%20-8%20z%20m%200%202%20c%200.039062%200%200.074219%200.003906%200.113281%200.007812%20c%20-0.335937%201.648438%200.167969%203.394532%201.429688%204.601563%20c%201.203125%201.15625%202.875%201.601563%204.453125%201.285156%20c%200%200.035157%200.003906%200.070313%200.003906%200.105469%20c%200%203.324219%20-2.675781%206%20-6%206%20c%20-0.039062%200%20-0.078125%20-0.003906%20-0.113281%20-0.007812%20c%200.320312%20-1.582032%20-0.128907%20-3.257813%20-1.28125%20-4.460938%20c%20-0.722657%20-0.746094%20-1.636719%20-1.234375%20-2.609375%20-1.429688%20c%20-0.246094%20-0.050781%20-0.492188%20-0.082031%20-0.742188%20-0.09375%20c%20-0.414062%20-0.023437%20-0.835937%200.011719%20-1.246094%200.097657%20c%20-0.003906%20-0.035157%20-0.007812%20-0.070313%20-0.007812%20-0.105469%20c%200%20-3.324219%202.675781%20-6%206%20-6%20z%20m%201.113281%200.105469%20c%202.429688%200.453125%204.332031%202.355469%204.78125%204.785156%20c%20-1.289062%200.296875%20-2.671875%20-0.050781%20-3.660156%20-1.003906%20c%20-1.035156%20-0.988281%20-1.433594%20-2.429688%20-1.121094%20-3.78125%20z%20m%20-5.90625%206.898437%20c%200.992188%200.050782%201.953125%200.472656%202.675781%201.222656%20c%200.949219%200.988282%201.304688%202.371094%201.007813%203.667969%20c%20-2.433594%20-0.453125%20-4.335937%20-2.355469%20-4.785156%20-4.789062%20c%200.363281%20-0.082031%200.734375%20-0.121094%201.101562%20-0.101563%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-objects: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cg%20fill%3D'currentColor'%3E%20%3Cpath%20d%3D'm%207.992188%200%20c%20-2.832032%200%20-5.289063%202%20-5.871094%204.777344%20c%20-0.527344%202.535156%200.691406%205.035156%202.875%206.328125%20l%200.003906%200.898437%20c%200%200.550782%200.445312%200.996094%201%200.996094%20h%204%20c%200.550781%200%200.996094%20-0.445312%201%20-0.996094%20v%20-0.902344%20c%202.183594%20-1.292968%203.398438%20-3.796874%202.871094%20-6.328124%20c%20-0.582032%20-2.777344%20-3.042969%20-4.773438%20-5.875%20-4.773438%20z%20m%200%202%20c%201.902343%200%203.53125%201.320312%203.917968%203.183594%20c%200.390625%201.859375%20-0.570312%203.722656%20-2.3125%204.484375%20c%20-0.363281%200.15625%20-0.597656%200.515625%20-0.597656%200.914062%20v%200.417969%20h%20-2.003906%20v%20-0.417969%20c%200%20-0.398437%20-0.234375%20-0.753906%20-0.601563%20-0.914062%20c%20-1.738281%20-0.761719%20-2.703125%20-2.625%20-2.316406%20-4.484375%20c%200.390625%20-1.859375%202.015625%20-3.183594%203.914063%20-3.183594%20z%20m%20-1.996094%2012%20v%201%20c%200%200.554688%200.449218%201%201%201%20h%202%20c%200.554687%200%201%20-0.445312%201%20-1%20v%20-1%20z%20m%200%200'%2F%3E%20%3Cpath%20d%3D'm%206.644531%206.144531%20c%20-0.195312%200.195313%20-0.195312%200.515625%200%200.710938%20l%201%201%20c%200.191407%200.191406%200.511719%200.191406%200.707031%200%20l%201%20-1%20c%200.191407%20-0.195313%200.191407%20-0.515625%200%20-0.710938%20c%20-0.195312%20-0.191406%20-0.515624%20-0.191406%20-0.707031%200%20l%20-0.648437%200.648438%20l%20-0.644532%20-0.648438%20c%20-0.195312%20-0.191406%20-0.515624%20-0.191406%20-0.707031%200%20z%20m%200%200'%20fill-opacity%3D'0.34902'%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-symbols: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%204.5%201%20c%20-0.257812%200%20-0.511719%200.097656%20-0.707031%200.292969%20l%20-2.5%202.5%20c%20-0.390625%200.390625%20-0.390625%201.023437%200%201.414062%20l%202.5%202.5%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%202.5%20-2.5%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20l%20-2.5%20-2.5%20c%20-0.195312%20-0.195313%20-0.449219%20-0.292969%20-0.707031%20-0.292969%20z%20m%207.515625%201%20c%20-0.023437%200%20-0.046875%200%20-0.070313%200.003906%20c%20-0.335937%200.015625%20-0.640624%200.203125%20-0.808593%200.496094%20l%20-2.320313%204%20c%20-0.386718%200.664062%200.089844%201.5%200.863282%201.5%20h%204.644531%20c%200.769531%200%201.246093%20-0.835938%200.863281%20-1.5%20l%20-2.320312%20-4%20c%20-0.179688%20-0.308594%20-0.503907%20-0.496094%20-0.851563%20-0.5%20z%20m%20-5.015625%207%20c%20-1.65625%200%20-3%201.34375%20-3%203%20s%201.34375%203%203%203%20s%203%20-1.34375%203%20-3%20s%20-1.34375%20-3%20-3%20-3%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-emoji-flags: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203%200%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%2015%20h%202%20v%20-8%20h%202.382812%20l%200.722657%201.449219%20c%200.167969%200.335937%200.515625%200.550781%200.894531%200.550781%20h%205%20c%200.550781%200%201%20-0.449219%201%20-1%20v%20-6%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20h%20-3.382812%20l%20-0.722657%20-1.449219%20c%20-0.167969%20-0.335937%20-0.515625%20-0.550781%20-0.894531%20-0.550781%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-edit-find: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%206.5%200%20c%20-3.578125%200%20-6.5%202.921875%20-6.5%206.5%20s%202.921875%206.5%206.5%206.5%20c%201.429688%200%202.753906%20-0.46875%203.828125%20-1.257812%20l%202.945313%202.945312%20c%200.957031%200.9375%202.363281%20-0.5%201.40625%20-1.4375%20l%20-2.929688%20-2.929688%20c%200.785156%20-1.074218%201.25%20-2.394531%201.25%20-3.820312%20c%200%20-3.578125%20-2.921875%20-6.5%20-6.5%20-6.5%20z%20m%200%202%20c%202.496094%200%204.5%202.003906%204.5%204.5%20s%20-2.003906%204.5%20-4.5%204.5%20s%20-4.5%20-2.003906%20-4.5%20-4.5%20s%202.003906%20-4.5%204.5%20-4.5%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-printer: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%205%201%20c%20-0.550781%200%20-1%200.449219%20-1%201%20v%201%20h%208%20v%20-1%20c%200%20-0.550781%20-0.449219%20-1%20-1%20-1%20z%20m%20-3%203%20c%20-1.109375%200%20-2%200.890625%20-2%202%20v%204%20c%200%201.109375%200.890625%202%202%202%20v%201%20c%200%201.089844%200.910156%202%202%202%20h%208%20c%201.089844%200%202%20-0.910156%202%20-2%20v%20-1%20c%201.109375%200%202%20-0.890625%202%20-2%20v%20-4%20c%200%20-1.109375%20-0.890625%20-2%20-2%20-2%20z%20m%202%206%20h%208%20v%203%20h%20-8%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-face-smile: url(\"data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'16'%20height%3D'16'%3E%3Cpath%20d%3D'M8%201a7%207%200%20100%2014A7%207%200%20008%201zM6%205c.559%200%201.031.473%201.031%201.031V7c0%20.558-.472%201-1.03%201-.56%200-1-.442-1-1v-.969C5%205.473%205.44%205%206%205zm4%200c.559%200%201%20.473%201%201.031V7c0%20.558-.441%201-1%201-.558%200-1-.442-1-1v-.969C9%205.473%209.442%205%2010%205zM3%209.07c.997.637%204.017.917%205%20.917.984%200%203.805.051%205-.917v.5c0%20.68-1.744%201.404-5%201.404-3.256%200-5-.872-5-1.404z'%20fill%3D'currentColor'%2F%3E%3C%2Fsvg%3E\");\n --icon-dialog-warning: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207.90625%200.09375%20c%20-0.527344%20-0.0273438%20-1.039062%200.28125%20-1.4375%200.96875%20l%20-6.25%2011.59375%20c%20-0.535156%200.964844%200.046875%202.34375%201.09375%202.34375%20h%2013.15625%20c%200.980469%200%201.902344%20-1.160156%201.21875%20-2.34375%20l%20-6.3125%20-11.53125%20c%20-0.398438%20-0.644531%20-0.941406%20-1.003906%20-1.46875%20-1.03125%20z%20m%201.09375%203.90625%20v%205%20c%200.007812%200.527344%20-0.472656%201%20-1%201%20s%20-1.007812%20-0.472656%20-1%20-1%20v%20-5%20z%20m%20-1%207%20c%200.550781%200%201%200.449219%201%201%20s%20-0.449219%201%20-1%201%20s%20-1%20-0.449219%20-1%20-1%20s%200.449219%20-1%201%20-1%20z%20m%200%200'%20fill%3D'currentColor'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-pan-end: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%207%2013%20c%200.265625%200%200.519531%20-0.101562%200.707031%20-0.292969%20l%204%20-4%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20l%20-4.003906%20-4%20c%20-0.390625%20-0.386719%20-1.023437%20-0.386719%20-1.414063%200%20c%20-0.386718%200.394531%20-0.386718%201.027343%200.003907%201.414062%20l%203.292969%203.292969%20l%20-3.292969%203.292969%20c%20-0.390625%200.390625%20-0.390625%201.027343%200%201.414062%20c%200.1875%200.191407%200.441406%200.292969%200.707031%200.292969%20z%20m%200%200'%20fill%3D'currentColor'%20fill-rule%3D'evenodd'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-pan-end-rtl: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%208.285156%2012.699219%20l%20-3.917968%20-4%20c%20-0.378907%20-0.390625%20-0.378907%20-1.007813%200%20-1.394531%20l%203.917968%20-4%20c%200.382813%20-0.398438%201.015625%20-0.40625%201.414063%20-0.019532%20c%200.394531%200.382813%200.402343%201.015625%200.019531%201.414063%20l%20-3.242188%203.300781%20l%203.242188%203.300781%20c%200.382812%200.398438%200.375%201.03125%20-0.019531%201.417969%20c%20-0.398438%200.382812%20-1.03125%200.375%20-1.414063%20-0.019531%20z%20m%200%200'%20fill%3D'currentColor'%20fill-rule%3D'evenodd'%2F%3E%20%3C%2Fsvg%3E\");\n --icon-pan-down: url(\"data:image/svg+xml,%3Csvg%20height%3D'16px'%20viewBox%3D'0%200%2016%2016'%20width%3D'16px'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cpath%20d%3D'm%203.292969%207.707031%20l%204%204%20c%200.390625%200.390625%201.023437%200.390625%201.414062%200%20l%204%20-4%20c%200.390625%20-0.390625%200.390625%20-1.023437%200%20-1.414062%20s%20-1.023437%20-0.390625%20-1.414062%200%20l%20-3.292969%203.292969%20l%20-3.292969%20-3.292969%20c%20-0.390625%20-0.390625%20-1.023437%20-0.390625%20-1.414062%200%20s%20-0.390625%201.023437%200%201.414062%20z%20m%200%200'%20fill%3D'currentColor'%20fill-rule%3D'evenodd'%2F%3E%20%3C%2Fsvg%3E\");\n}\n\n.adw-icon--go-down {\n mask-image: var(--icon-go-down);\n -webkit-mask-image: var(--icon-go-down);\n}\n\n.adw-icon--sidebar-show {\n mask-image: var(--icon-sidebar-show);\n -webkit-mask-image: var(--icon-sidebar-show);\n}\n\n.adw-icon--go-previous {\n mask-image: var(--icon-go-previous);\n -webkit-mask-image: var(--icon-go-previous);\n}\n\n.adw-icon--go-next {\n mask-image: var(--icon-go-next);\n -webkit-mask-image: var(--icon-go-next);\n}\n\n.adw-icon--go-up {\n mask-image: var(--icon-go-up);\n -webkit-mask-image: var(--icon-go-up);\n}\n\n.adw-icon--view-refresh {\n mask-image: var(--icon-view-refresh);\n -webkit-mask-image: var(--icon-view-refresh);\n}\n\n.adw-icon--open-menu {\n mask-image: var(--icon-open-menu);\n -webkit-mask-image: var(--icon-open-menu);\n}\n\n.adw-icon--go-home {\n mask-image: var(--icon-go-home);\n -webkit-mask-image: var(--icon-go-home);\n}\n\n.adw-icon--list-add {\n mask-image: var(--icon-list-add);\n -webkit-mask-image: var(--icon-list-add);\n}\n\n.adw-icon--network-wireless {\n mask-image: var(--icon-network-wireless);\n -webkit-mask-image: var(--icon-network-wireless);\n}\n\n.adw-icon--folder {\n mask-image: var(--icon-folder);\n -webkit-mask-image: var(--icon-folder);\n}\n\n.adw-icon--starred {\n mask-image: var(--icon-starred);\n -webkit-mask-image: var(--icon-starred);\n}\n\n.adw-icon--system-search {\n mask-image: var(--icon-system-search);\n -webkit-mask-image: var(--icon-system-search);\n}\n\n.adw-icon--contact-new {\n mask-image: var(--icon-contact-new);\n -webkit-mask-image: var(--icon-contact-new);\n}\n\n.adw-icon--mail-unread {\n mask-image: var(--icon-mail-unread);\n -webkit-mask-image: var(--icon-mail-unread);\n}\n\n.adw-icon--avatar-default {\n mask-image: var(--icon-avatar-default);\n -webkit-mask-image: var(--icon-avatar-default);\n}\n\n.adw-icon--media-playback-start {\n mask-image: var(--icon-media-playback-start);\n -webkit-mask-image: var(--icon-media-playback-start);\n}\n\n.adw-icon--media-playback-pause {\n mask-image: var(--icon-media-playback-pause);\n -webkit-mask-image: var(--icon-media-playback-pause);\n}\n\n.adw-icon--media-eject {\n mask-image: var(--icon-media-eject);\n -webkit-mask-image: var(--icon-media-eject);\n}\n\n.adw-icon--media-playlist-repeat {\n mask-image: var(--icon-media-playlist-repeat);\n -webkit-mask-image: var(--icon-media-playlist-repeat);\n}\n\n.adw-icon--dialog-error {\n mask-image: var(--icon-dialog-error);\n -webkit-mask-image: var(--icon-dialog-error);\n}\n\n.adw-icon--audio-volume-muted {\n mask-image: var(--icon-audio-volume-muted);\n -webkit-mask-image: var(--icon-audio-volume-muted);\n}\n\n.adw-icon--audio-volume-low {\n mask-image: var(--icon-audio-volume-low);\n -webkit-mask-image: var(--icon-audio-volume-low);\n}\n\n.adw-icon--audio-volume-medium {\n mask-image: var(--icon-audio-volume-medium);\n -webkit-mask-image: var(--icon-audio-volume-medium);\n}\n\n.adw-icon--audio-volume-high {\n mask-image: var(--icon-audio-volume-high);\n -webkit-mask-image: var(--icon-audio-volume-high);\n}\n\n.adw-icon--camera-photo {\n mask-image: var(--icon-camera-photo);\n -webkit-mask-image: var(--icon-camera-photo);\n}\n\n.adw-icon--user-trash {\n mask-image: var(--icon-user-trash);\n -webkit-mask-image: var(--icon-user-trash);\n}\n\n.adw-icon--view-reveal {\n mask-image: var(--icon-view-reveal);\n -webkit-mask-image: var(--icon-view-reveal);\n}\n\n.adw-icon--view-conceal {\n mask-image: var(--icon-view-conceal);\n -webkit-mask-image: var(--icon-view-conceal);\n}\n\n.adw-icon--value-increase {\n mask-image: var(--icon-value-increase);\n -webkit-mask-image: var(--icon-value-increase);\n}\n\n.adw-icon--value-decrease {\n mask-image: var(--icon-value-decrease);\n -webkit-mask-image: var(--icon-value-decrease);\n}\n\n.adw-icon--edit-clear {\n mask-image: var(--icon-edit-clear);\n -webkit-mask-image: var(--icon-edit-clear);\n}\n\n.adw-icon--document-edit {\n mask-image: var(--icon-document-edit);\n -webkit-mask-image: var(--icon-document-edit);\n}\n\n.adw-icon--document-open {\n mask-image: var(--icon-document-open);\n -webkit-mask-image: var(--icon-document-open);\n}\n\n.adw-icon--document-save {\n mask-image: var(--icon-document-save);\n -webkit-mask-image: var(--icon-document-save);\n}\n\n.adw-icon--mail-send {\n mask-image: var(--icon-mail-send);\n -webkit-mask-image: var(--icon-mail-send);\n}\n\n.adw-icon--mail-reply-sender {\n mask-image: var(--icon-mail-reply-sender);\n -webkit-mask-image: var(--icon-mail-reply-sender);\n}\n\n.adw-icon--folder-documents {\n mask-image: var(--icon-folder-documents);\n -webkit-mask-image: var(--icon-folder-documents);\n}\n\n.adw-icon--folder-download {\n mask-image: var(--icon-folder-download);\n -webkit-mask-image: var(--icon-folder-download);\n}\n\n.adw-icon--view-grid {\n mask-image: var(--icon-view-grid);\n -webkit-mask-image: var(--icon-view-grid);\n}\n\n.adw-icon--view-list {\n mask-image: var(--icon-view-list);\n -webkit-mask-image: var(--icon-view-list);\n}\n\n.adw-icon--view-more {\n mask-image: var(--icon-view-more);\n -webkit-mask-image: var(--icon-view-more);\n}\n\n.adw-icon--view-paged {\n mask-image: var(--icon-view-paged);\n -webkit-mask-image: var(--icon-view-paged);\n}\n\n.adw-icon--view-columns {\n mask-image: var(--icon-view-columns);\n -webkit-mask-image: var(--icon-view-columns);\n}\n\n.adw-icon--list-remove {\n mask-image: var(--icon-list-remove);\n -webkit-mask-image: var(--icon-list-remove);\n}\n\n.adw-icon--send-to {\n mask-image: var(--icon-send-to);\n -webkit-mask-image: var(--icon-send-to);\n}\n\n.adw-icon--folder-music {\n mask-image: var(--icon-folder-music);\n -webkit-mask-image: var(--icon-folder-music);\n}\n\n.adw-icon--edit-copy {\n mask-image: var(--icon-edit-copy);\n -webkit-mask-image: var(--icon-edit-copy);\n}\n\n.adw-icon--emblem-system {\n mask-image: var(--icon-emblem-system);\n -webkit-mask-image: var(--icon-emblem-system);\n}\n\n.adw-icon--preferences-system {\n mask-image: var(--icon-preferences-system);\n -webkit-mask-image: var(--icon-preferences-system);\n}\n\n.adw-icon--application-x-executable {\n mask-image: var(--icon-application-x-executable);\n -webkit-mask-image: var(--icon-application-x-executable);\n}\n\n.adw-icon--window-close {\n mask-image: var(--icon-window-close);\n -webkit-mask-image: var(--icon-window-close);\n}\n\n.adw-icon--window-minimize {\n mask-image: var(--icon-window-minimize);\n -webkit-mask-image: var(--icon-window-minimize);\n}\n\n.adw-icon--window-maximize {\n mask-image: var(--icon-window-maximize);\n -webkit-mask-image: var(--icon-window-maximize);\n}\n\n.adw-icon--window-restore {\n mask-image: var(--icon-window-restore);\n -webkit-mask-image: var(--icon-window-restore);\n}\n\n.adw-icon--image-missing {\n mask-image: var(--icon-image-missing);\n -webkit-mask-image: var(--icon-image-missing);\n}\n\n.adw-icon--emoji-recent {\n mask-image: var(--icon-emoji-recent);\n -webkit-mask-image: var(--icon-emoji-recent);\n}\n\n.adw-icon--emoji-people {\n mask-image: var(--icon-emoji-people);\n -webkit-mask-image: var(--icon-emoji-people);\n}\n\n.adw-icon--emoji-body {\n mask-image: var(--icon-emoji-body);\n -webkit-mask-image: var(--icon-emoji-body);\n}\n\n.adw-icon--emoji-nature {\n mask-image: var(--icon-emoji-nature);\n -webkit-mask-image: var(--icon-emoji-nature);\n}\n\n.adw-icon--emoji-food {\n mask-image: var(--icon-emoji-food);\n -webkit-mask-image: var(--icon-emoji-food);\n}\n\n.adw-icon--emoji-travel {\n mask-image: var(--icon-emoji-travel);\n -webkit-mask-image: var(--icon-emoji-travel);\n}\n\n.adw-icon--emoji-activities {\n mask-image: var(--icon-emoji-activities);\n -webkit-mask-image: var(--icon-emoji-activities);\n}\n\n.adw-icon--emoji-objects {\n mask-image: var(--icon-emoji-objects);\n -webkit-mask-image: var(--icon-emoji-objects);\n}\n\n.adw-icon--emoji-symbols {\n mask-image: var(--icon-emoji-symbols);\n -webkit-mask-image: var(--icon-emoji-symbols);\n}\n\n.adw-icon--emoji-flags {\n mask-image: var(--icon-emoji-flags);\n -webkit-mask-image: var(--icon-emoji-flags);\n}\n\n.adw-icon--edit-find {\n mask-image: var(--icon-edit-find);\n -webkit-mask-image: var(--icon-edit-find);\n}\n\n.adw-icon--printer {\n mask-image: var(--icon-printer);\n -webkit-mask-image: var(--icon-printer);\n}\n\n.adw-icon--face-smile {\n mask-image: var(--icon-face-smile);\n -webkit-mask-image: var(--icon-face-smile);\n}\n\n.adw-icon--dialog-warning {\n mask-image: var(--icon-dialog-warning);\n -webkit-mask-image: var(--icon-dialog-warning);\n}\n\n.adw-icon--pan-end {\n mask-image: var(--icon-pan-end);\n -webkit-mask-image: var(--icon-pan-end);\n}\n\n.adw-icon--pan-end-rtl {\n mask-image: var(--icon-pan-end-rtl);\n -webkit-mask-image: var(--icon-pan-end-rtl);\n}\n\n.adw-icon--pan-down {\n mask-image: var(--icon-pan-down);\n -webkit-mask-image: var(--icon-pan-down);\n}\n","// _variables.scss — Adwaita CSS custom properties (light theme defaults).\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss (canonical color palette)\n// Reference: refs/adwaita-web/adwaita-web/scss/_variables.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Subset adapted for @gjsify/adwaita-web Web Components.\n\n@mixin light-theme {\n // Window\n --window-bg-color: #fafafb;\n --window-fg-color: rgba(0, 0, 6, 0.8);\n\n // Views\n --view-bg-color: #ffffff;\n --view-fg-color: rgba(0, 0, 6, 0.8);\n\n // Header bar\n --headerbar-bg-color: #ffffff;\n --headerbar-fg-color: rgba(0, 0, 6, 0.8);\n --headerbar-shade-color: rgba(0, 0, 6, 0.12);\n\n // Hairline separators (header underline, sidebar/pane dividers). Subtle in\n // BOTH themes — dark theme flips to a faint light line, the way libadwaita\n // draws separators, instead of a harsh near-black line on a dark surface.\n --separator-color: rgba(0, 0, 6, 0.1);\n\n // The GENERIC shade the whole `*-shade-color` family below specialises\n // (`_colors.scss:79,141`). Scroll undershoots are drawn from it, and it belongs\n // to the palette rather than to any one widget: a scroller can sit on a window,\n // a view, a sidebar or a card, and reading its neighbour's shade would make the\n // same indicator four different colours.\n --shade-color: rgba(0, 0, 6, 0.07);\n\n // Sidebar / split panes. libadwaita defines the whole family, not just the\n // background (_colors.scss:47-58), and only the background was here — so\n // `.sidebar-pane` had no foreground to name, and an app overriding\n // `--sidebar-fg-color` was overriding nothing.\n --sidebar-bg-color: #ebebed;\n --sidebar-fg-color: rgba(0, 0, 6, 0.8);\n --sidebar-backdrop-color: #f2f2f4;\n --sidebar-shade-color: rgba(0, 0, 6, 0.07);\n --sidebar-border-color: rgba(0, 0, 6, 0.07);\n\n // The MIDDLE pane of a three-pane setup. Nothing renders one yet; the tokens\n // are defined because they are public API an app may already reference, and a\n // half-present family reads as \"this one is unsupported\" rather than \"this\n // composition is not built yet\".\n --secondary-sidebar-bg-color: #f3f3f5;\n --secondary-sidebar-fg-color: rgba(0, 0, 6, 0.8);\n --secondary-sidebar-backdrop-color: #f6f6fa;\n --secondary-sidebar-shade-color: rgba(0, 0, 6, 0.07);\n --secondary-sidebar-border-color: rgba(0, 0, 6, 0.07);\n\n // Cards / boxed lists\n --card-bg-color: #ffffff;\n --card-fg-color: rgba(0, 0, 6, 0.8);\n --card-shade-color: rgba(0, 0, 6, 0.07);\n\n // Accent\n --accent-bg-color: #3584e4;\n --accent-fg-color: #ffffff;\n --accent-color: #1c71d8;\n\n // Popover (menus, dropdowns) — an elevated surface above the window.\n --popover-bg-color: #ffffff;\n --popover-fg-color: rgba(0, 0, 6, 0.8);\n --popover-shade-color: rgba(0, 0, 6, 0.07);\n\n // Dialog scrim — the dimming wash behind a presented dialog (Adw dims with\n // --shade-color at double alpha; this is the equivalent neutral wash).\n --dialog-scrim-color: rgba(0, 0, 6, 0.32);\n\n // Buttons\n --button-bg-color: rgba(0, 0, 6, 0.08);\n --button-hover-color: rgba(0, 0, 6, 0.13);\n --button-active-color: rgba(0, 0, 6, 0.19);\n\n // Entries\n --entry-bg-color: rgba(0, 0, 6, 0.1);\n --entry-border-color: rgba(0, 0, 6, 0.18);\n --entry-border-hover-color: rgba(0, 0, 6, 0.28);\n\n // Destructive action\n --destructive-bg-color: #e01b24;\n --destructive-fg-color: #ffffff;\n --destructive-color: oklab(from var(--destructive-bg-color) min(l, 0.5) a b);\n\n // Semantic states. `.error` / `.warning` / `.success` (see _labels.scss) do\n // not just recolour text — they REBIND the three accent tokens to these, so\n // anything accent-coloured inside them follows. Values are libadwaita's\n // (_colors.scss:16-29): red_3 / yellow_5 / green_4 from _palette.scss:106-121.\n // The standalone `*-color` is upstream's own relative-colour derivation of the\n // background, kept as an expression rather than resolved to a hex so it tracks\n // a re-themed `*-bg-color`.\n --success-bg-color: #2ec27e;\n --success-fg-color: #ffffff;\n --success-color: oklab(from var(--success-bg-color) min(l, 0.5) a b);\n --warning-bg-color: #e5a50a;\n --warning-fg-color: rgba(0, 0, 0, 0.8);\n --warning-color: oklab(from var(--warning-bg-color) min(l, 0.5) a b);\n --error-bg-color: #e01b24;\n --error-fg-color: #ffffff;\n --error-color: oklab(from var(--error-bg-color) min(l, 0.5) a b);\n\n // Switch\n --switch-off-bg: rgba(0, 0, 0, 0.2);\n --switch-knob-bg: #ffffff;\n\n // Layout radii\n --window-radius: 15px;\n --card-radius: 12px;\n --button-radius: 9px;\n\n // Spacing scale\n --spacing-xs: 6px;\n --spacing-s: 9px;\n --spacing-m: 12px;\n --spacing-l: 18px;\n --spacing-xl: 24px;\n\n // Typography — GNOME default: Adwaita Sans 11. The stack is a PROGRESSION, and the\n // tail is what makes it one (#1817). 'Adwaita Sans' is installed on a GNOME desktop\n // and nowhere else; 'Cantarell' is GNOME's own earlier UI face and the right second\n // guess there; 'Inter' is the one cross-platform name an app usually has beside it.\n //\n // What was MISSING is macOS, and it was missing in the worst place. With no Apple face\n // named, `sans-serif` resolved to Helvetica — measured on a Mac carrying neither\n // Adwaita Sans nor Cantarell — which is the one typeface no libadwaita application is\n // meant to look like, and the stylesheet said nothing about it. `system-ui` and its\n // `-apple-system` alias are the two spellings every current engine resolves to the\n // platform's own UI face (SF on macOS, Segoe UI Variable on Windows, Cantarell on\n // GNOME), so they go after the named faces and BEFORE the generic: a generic asks the\n // host for its DEFAULT, which is the substitution this is about, while `system-ui` asks\n // for its UI face, which is what an Adwaita app wants.\n //\n // 'Segoe UI' stays ahead of them as the EXPLICIT Windows face: `system-ui` reached it\n // only from Windows 8 and Segoe UI Variable only from Windows 11, so the name is still\n // the portable spelling there. Held honest by the `stylesheet-font-families`\n // conformance rule, whose ledger carries the reason for 'Adwaita Sans' — never delete\n // one without the other.\n //\n // THE PERIOD ending this first sentence, and the absence of a comment block between\n // these declarations, are both load-bearing rather than stylistic.\n // `scripts/generate-adwaita-tokens.mjs` titles each token group by the first sentence\n // of the comment block touching its FIRST declaration, so a caption with no terminator\n // runs on into the next words — and a block sitting between two declarations starts a\n // NEW group, which is how a paragraph about this mechanism became a section title in\n // the website before it was moved in here. Everything past the first sentence is prose\n // for that one reader; `check-generated-website-data.mjs` holds both derived artifacts\n // against the run.\n --font-family: 'Adwaita Sans', 'Cantarell', 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;\n --font-size-base: 11pt;\n --font-size-small: 9pt;\n --font-size-heading: 12pt;\n --dim-opacity: 0.55;\n\n // Borders and disabled dimming, as libadwaita's own two-step (_colors.scss:263,\n // 317-329): an OPACITY token the high-contrast query moves, and a colour\n // DERIVED from it against `currentColor` — so a border follows the text colour\n // of the surface it is drawn on instead of being a fixed grey.\n //\n // `--disabled-opacity` had no home here, and three partials said so in a\n // comment and reached for `--dim-opacity` instead (`_switch.scss:81-83`,\n // `_checks.scss:164-166`, `_progress_bar.scss:87-89`). Those are different\n // numbers upstream — 50% disabled vs 55% dimmed — and under high contrast they\n // move in OPPOSITE directions (disabled 40%, dimmed 90%), so the stand-in was\n // most wrong exactly where it mattered most.\n --border-opacity: 15%;\n --border-color: color-mix(in srgb, currentColor var(--border-opacity), transparent);\n --disabled-opacity: 0.5;\n\n // Document + monospace families, behind `.document` / `.monospace`\n // (_labels.scss:75-84). In GTK these four are written into `:root` at RUNTIME\n // by AdwStyleManager from the desktop's font settings\n // (adw-style-manager.c:169-218), defaulting to `Sans 10` / `Monospace 10`\n // (:50-56). A browser has no style manager, so they are ordinary tokens here\n // — same names, so re-theming goes through the documented contract.\n //\n // The monospace stack has ONE home, and did not until recently: `_data_grid.scss`\n // used to inline it, and `source-view/theme.ts` carried a SECOND, longer copy in\n // a TS string literal (measured on one page, `.cm-scroller` resolved to\n // 'Adwaita Mono', 'Cascadia Code', 'JetBrains Mono', … while a `.monospace`\n // label beside it resolved to this token — two typefaces, same document).\n // A literal in TS is also outside the `stylesheet-font-families` rule, which\n // reads `.css`/`.scss`. Both now read this token; its consumers are\n // `.monospace` (_labels.scss:128), `_action_row.scss:94`, the data-grid mono\n // cell (via `@extend .monospace`) and `<adw-source-view>`.\n //\n // Adwaita Mono heads the stack as a PROGRESSIVE ENHANCEMENT, not because\n // anything here ships it: `@gjsify/adwaita-fonts` vendors two Sans TTFs and no\n // mono face at all (the upstream mono faces are 1.4-1.5 MB each). This comment\n // used to claim the package ships it — a claim the NativeScript theme, which\n // carries the same stack, already contradicted in prose\n // (`nativescript-bridge/adwaita/src/theme/adwaita.css:769`). So on a GNOME\n // desktop the system `adwaita-mono-fonts` resolves it; anywhere else the\n // generic tail is what renders, which is the correct outcome and the reason the\n // tail exists. Held honest by the `stylesheet-font-families` conformance rule,\n // whose ledger carries this reason — never delete one without the other.\n //\n // `'Cantarell'` is dropped from that stack on the way here: Cantarell is\n // GNOME's PROPORTIONAL UI font, so a monospace fallback chain that reaches it\n // second lands on a font whose figures do not line up — the exact property\n // `.monospace` exists for.\n //\n // The tail is the same PROGRESSION the sans stack is, for the same reason (#1817), and\n // it had the gap in the other direction: `ui-monospace` covers macOS and GNOME but\n // reaches Cascadia Mono only from Windows 10 1903, and no Windows face was named at\n // all, so a Windows 10 host without it landed on the `monospace` GENERIC — Times New\n // Roman, whose figures do not line up, which is the one thing this stack exists to\n // provide. 'Cascadia Code' ships with Windows Terminal and 'Consolas' is on every\n // Windows since Vista.\n //\n // ONE LINE, and not a style choice: the same generator reads this file with a line-based\n // reader that REFUSES a declaration it cannot read rather than dropping the token\n // without saying so, so a wrapped value makes it exit 1.\n --document-font-family: var(--font-family);\n --document-font-size: var(--font-size-base);\n --monospace-font-family: 'Adwaita Mono', ui-monospace, 'SF Mono', 'Cascadia Code', 'Consolas', 'Menlo', monospace;\n --monospace-font-size: var(--font-size-base);\n}\n\n// The tokens above are a MIXIN rather than a bare `:root` block so `.theme-light`\n// can include them too (see `_theme.scss`). A light opt-out that exists only as\n// `:not(.theme-light)` on the media query cannot serve a SUBTREE: on a dark system\n// the root stays dark, and a container asking for light matches no rule at all.\n:root {\n @include light-theme;\n}\n\n// High contrast moves the three opacity tokens, and only those — every colour\n// that reads them follows without its own query (_colors.scss:325-329).\n@media (prefers-contrast: more) {\n :root {\n --border-opacity: 50%;\n --dim-opacity: 0.9;\n --disabled-opacity: 0.4;\n }\n}\n","// _theme.scss — Light/dark theme switching.\n// Auto via prefers-color-scheme + manual .theme-dark / .theme-light overrides.\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `light-theme` lives in _variables.scss; @use makes it reachable (the skin uses\n// the module system, so a mixin there is namespaced rather than global).\n@use 'variables';\n\n@mixin dark-theme {\n --window-bg-color: #222226;\n --window-fg-color: #ffffff;\n --view-bg-color: #1d1d20;\n --view-fg-color: #ffffff;\n --headerbar-bg-color: #2e2e32;\n --headerbar-fg-color: #ffffff;\n --headerbar-shade-color: rgba(0, 0, 6, 0.36);\n --separator-color: rgba(255, 255, 255, 0.08);\n --shade-color: rgba(0, 0, 6, 0.25);\n --sidebar-bg-color: #2e2e32;\n --sidebar-fg-color: #ffffff;\n --sidebar-backdrop-color: #28282c;\n --sidebar-shade-color: rgba(0, 0, 6, 0.25);\n --sidebar-border-color: rgba(0, 0, 6, 0.36);\n --secondary-sidebar-bg-color: #28282c;\n --secondary-sidebar-fg-color: #ffffff;\n --secondary-sidebar-backdrop-color: #252529;\n --secondary-sidebar-shade-color: rgba(0, 0, 6, 0.25);\n --secondary-sidebar-border-color: rgba(0, 0, 6, 0.36);\n --card-bg-color: rgba(255, 255, 255, 0.08);\n --card-fg-color: #ffffff;\n --card-shade-color: rgba(0, 0, 6, 0.36);\n --accent-color: #78aeed;\n --popover-bg-color: #36363a;\n --popover-fg-color: #ffffff;\n --popover-shade-color: rgba(0, 0, 6, 0.36);\n // A deeper scrim in dark mode so the dimming reads against a dark window.\n --dialog-scrim-color: rgba(0, 0, 6, 0.55);\n --button-bg-color: rgba(255, 255, 255, 0.1);\n --button-hover-color: rgba(255, 255, 255, 0.15);\n --button-active-color: rgba(255, 255, 255, 0.22);\n --entry-bg-color: rgba(255, 255, 255, 0.1);\n --entry-border-color: rgba(255, 255, 255, 0.16);\n --entry-border-hover-color: rgba(255, 255, 255, 0.26);\n --destructive-bg-color: #c01c28;\n --destructive-fg-color: #ffffff;\n --destructive-color: oklab(from var(--destructive-bg-color) max(l, 0.85) a b);\n // Semantic states — libadwaita's dark overrides (_colors.scss:83-92): the\n // backgrounds darken (green_5 / a hand-picked amber / red_4) and the\n // standalone colour LIGHTENS instead of darkening, so it stays readable on a\n // dark surface. Upstream does not re-declare the `*-fg-color`s here either.\n --success-bg-color: #26a269;\n --success-color: oklab(from var(--success-bg-color) max(l, 0.85) a b);\n --warning-bg-color: #cd9309;\n --warning-color: oklab(from var(--warning-bg-color) max(l, 0.85) a b);\n --error-bg-color: #c01c28;\n --error-color: oklab(from var(--error-bg-color) max(l, 0.85) a b);\n --switch-off-bg: rgba(255, 255, 255, 0.2);\n --switch-knob-bg: #deddda;\n // The active toggle chip is NOT near-white in both themes — that premise was\n // wrong, and it is what made the selected toggle a solid white pill on a dark\n // window while GTK draws a grey one. libadwaita's own _colors.scss:247-248 says\n // dark takes a TRANSLUCENT white over the dark background, with white text:\n // --active-toggle-bg-color: rgb(255 255 255 / 20%);\n // --active-toggle-fg-color: #ffffff;\n // The foreground needs no entry at all — _toggle_group.scss defaults it to\n // var(--window-fg-color), which is already #ffffff here. Only the background\n // was ever missing; the old dark override forced dark text to compensate for it.\n --active-toggle-bg-color: rgb(255 255 255 / 20%);\n}\n\n// Auto dark theme via prefers-color-scheme — opt out with .theme-light\n@media (prefers-color-scheme: dark) {\n :root:not(.theme-light) {\n @include dark-theme;\n }\n}\n\n// Manual override, on ANY element rather than only on `:root`.\n//\n// It was `:root.theme-dark`, which silently does nothing unless the class lands on\n// `<html>` — so an EMBEDDED consumer could not give its own subtree a scheme without\n// re-theming the host page around it. The storybook is exactly that case: it scopes\n// to its own container, the class was present, the tokens never changed, and nothing\n// reported a problem. Custom properties resolve per element, so an element-level\n// selector overrides the inherited values for its subtree and for nothing else.\n.theme-dark {\n @include dark-theme;\n}\n\n// The light counterpart, for the same reason: on a dark system a subtree has to be\n// able to ask for light, which `:root:not(.theme-light)` on the media query above\n// cannot give it once the class sits anywhere but the root.\n.theme-light {\n @include variables.light-theme;\n}\n","// _root.scss — opt-in page surface for chrome-less layouts.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_window.scss (surface tokens)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: original opt-in helper for @gjsify/adwaita-web.\n//\n// The components theme via the `--window-*` CSS custom properties, but only\n// `adw-window` actually PAINTS the window surface (background + text colour).\n// A page laid out WITHOUT an `<adw-window>` (e.g. a plain browser view that\n// hosts rows/cards directly) therefore renders on the browser default (white)\n// and its native form controls / scrollbars don't follow the light/dark scheme.\n//\n// Applying `.adw-root` to `<body>` (or `<html>` / the `:root` element) binds the\n// Adwaita window surface + `color-scheme: light dark` to the document, so a\n// window-less layout is themed exactly like the components inside it. This is\n// OPT-IN and additive — it does not change any component's own styling.\n.adw-root {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n color-scheme: light dark;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n}\n","// _reset.scss — style-isolation boundary for embedding in arbitrary host pages.\n//\n// adwaita-web renders as LIGHT-DOM custom elements (by design: the widgets\n// compose with the page and stay overridable via the `--adw-*` / `--*` design\n// tokens). The trade-off of light DOM is that a host page's *inherited*\n// typography — `font-family`, `color`, `line-height`, `letter-spacing`, … — and\n// generic element resets can leak into the widgets.\n//\n// This partial establishes an Adwaita typographic + box-model context at EVERY\n// component boundary, so inheritance from the host stops at the widget. It sets\n// only a FLOOR: it is `@use`d before the component partials, so each component's\n// own rules override it, and consumers keep full control through the tokens and\n// ordinary higher-specificity rules (isolation without giving up overriding).\n//\n// The box battles (borders, backgrounds) are already won by the components'\n// class-scoped rules against realistic element-level host CSS; the real leak is\n// inherited typography + a host `* {}` box-sizing reset, which is what this\n// neutralises.\n\n// Every custom element adwaita-web defines — one entry per `customElements\n// .define(…)` call under `src/`, in BOTH namespaces: a tag carries the prefix of\n// the library that owns its GType (ADR 0034 clause 1), so `gtk-entry` is on this\n// list beside `adw-action-row`.\n//\n// DERIVED, NOT REMEMBERED: `scripts/check-adwaita-reset-components.mjs` walks\n// those calls and fails on any tag missing from this list (and on any entry with\n// no call behind it). A hand-kept list is a second copy of the registry, and it\n// had already drifted — `adw-source-view` was defined for its whole life and\n// never listed, so it silently ran without the isolation floor. Nothing noticed,\n// because the only spec touching this file instantiates `adw-switch-row`.\n$adw-components:\n adw-about-dialog, adw-action-row, adw-alert-dialog, adw-alert-response, adw-application-window, adw-avatar,\n adw-banner, adw-bin, adw-bottom-sheet, adw-bottom-sheet-bottom-bar, adw-bottom-sheet-content,\n adw-bottom-sheet-sheet, adw-breakpoint-bin, adw-button-content, adw-button-row, adw-card, adw-carousel,\n adw-carousel-indicator-dots, adw-carousel-indicator-lines, adw-clamp, adw-clamp-scrollable, adw-combo-row,\n adw-data-grid, adw-dialog, adw-entry-row, adw-expander-row, adw-header-bar, adw-inline-view-switcher,\n adw-layout-slot, adw-multi-layout-view, adw-navigation-page, adw-navigation-split-view, adw-navigation-view,\n adw-overlay-split-view, adw-password-entry-row, adw-preferences-dialog, adw-preferences-group,\n adw-preferences-page, adw-preferences-row, adw-radio, adw-shortcut-label, adw-shortcuts-dialog, adw-shortcuts-item,\n adw-shortcuts-section, adw-sidebar, adw-sidebar-item, adw-sidebar-section, adw-source-view, adw-spin-row,\n adw-spinner, adw-split-button, adw-status-page, adw-switch-row, adw-tab-bar, adw-tab-button, adw-tab-overview, adw-tab-page, adw-tab-view,\n adw-toast-overlay, adw-toggle, adw-toggle-group, adw-toolbar-view, gtk-notebook, adw-view-stack, adw-view-stack-page,\n adw-view-switcher, adw-view-switcher-bar, adw-view-switcher-page, adw-view-switcher-sidebar, adw-window, adw-window-title, adw-wrap-box,\n gtk-about-dialog, gtk-action-bar, gtk-application-window, gtk-aspect-frame, gtk-box, gtk-button, gtk-center-box,\n gtk-calendar, gtk-check-button, gtk-color-dialog-button, gtk-column-view, gtk-drag-icon, gtk-drawing-area, gtk-drop-down,\n gtk-editable-label, gtk-emoji-chooser, gtk-entry, gtk-expander, gtk-fixed, gtk-flow-box, gtk-flow-box-child, gtk-font-dialog-button, gtk-frame,\n gtk-gl-area, gtk-graphics-offload, gtk-grid, gtk-grid-view, gtk-header-bar, gtk-image, gtk-inscription, gtk-label, gtk-level-bar,\n gtk-link-button, gtk-list-box, gtk-list-box-row, gtk-list-view, gtk-media-controls, gtk-menu-button, gtk-overlay, gtk-page-setup-unix-dialog, gtk-paned,\n gtk-password-entry, gtk-picture, gtk-popover, gtk-popover-bin, gtk-popover-menu, gtk-popover-menu-bar, gtk-print-unix-dialog,\n gtk-progress-bar, gtk-revealer, gtk-scale, gtk-scale-button, gtk-scrollbar, gtk-scrolled-window, gtk-search-bar, gtk-search-entry, gtk-separator, gtk-source-view,\n gtk-spin-button, gtk-spinner, gtk-stack, gtk-stack-sidebar, gtk-stack-switcher, gtk-switch, gtk-text, gtk-text-view, gtk-toggle-button, gtk-tree-expander, gtk-video, gtk-viewport,\n gtk-window, gtk-window-controls, gtk-window-handle;\n\n// Roots: re-root the inherited typographic properties (and the box model) so a\n// host page's font / colour / spacing cannot flow into the widget. Every value\n// is the Adwaita default; a component that wants something else overrides it on\n// its own element (this rule is emitted first).\n#{$adw-components} {\n box-sizing: border-box;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 400;\n font-style: normal;\n font-variant: normal;\n line-height: normal;\n letter-spacing: normal;\n word-spacing: normal;\n text-align: start;\n text-indent: 0;\n text-transform: none;\n text-shadow: none;\n}\n\n// A box and a label INHERIT inside another widget, as every GTK node does. They\n// are the two elements an authored tree puts INSIDE the others — a label in a\n// `.error` box, a box of labels in a header bar — and the floor above would\n// repaint every one of them in `--window-fg-color` at the base size, whatever\n// its parent says. Nested in any component the floor already stops the host\n// page, so only the OUTERMOST one keeps it. `:where()` adds no specificity, so a\n// class on the element itself (`.title-1`, `.dimmed`) still wins.\n//\n// A button's content inherits for the same reason: `<adw-button-content>` is the child\n// of a `<gtk-button>`, and the floor painted its icon and label in the window colour on\n// a `.suggested-action` button, where GTK draws them in the accent foreground.\n:where(#{$adw-components}) :is(gtk-box, gtk-label, adw-button-content) {\n color: inherit;\n font-family: inherit;\n font-size: inherit;\n font-weight: inherit;\n font-style: inherit;\n font-variant: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n word-spacing: inherit;\n text-transform: inherit;\n text-shadow: inherit;\n}\n\n// Descendants: `box-sizing` does not inherit, so a host `*, *::before {\n// box-sizing: content-box }` reset would still reach internal elements. Pin it\n// to `border-box` (adwaita's model throughout) inside every component.\n@each $c in $adw-components {\n #{$c} *,\n #{$c} *::before,\n #{$c} *::after {\n box-sizing: border-box;\n }\n}\n","// _icon.scss — the symbolic icon box behind <gtk-image>.\n//\n// A symbolic icon is rendered as a CSS mask rather than an <img> or inline SVG,\n// so `currentColor` drives the fill and the glyph re-themes with whatever\n// contains it. The per-name `.adw-icon--<name>` mask classes are GENERATED into\n// scss/_icons.generated.scss by scripts/build-scss.mjs (one entry per icon in\n// its ICONS map), so adding an icon is a single map edit.\n//\n// This block lived in `_button.scss` for as long as the button was the only\n// widget that drew one. It is emitted BEFORE the widget partials so a context\n// that sizes its own icons (`.adw-about-dialog-icon` at 96px, the split button's\n// 14px arrows, the view switcher's 16px) still wins on ordinary specificity.\n//\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:34-41 — `.normal-icons`\n// / `.large-icons` set `-gtk-icon-size`. libadwaita has NO `_icon.scss`: there\n// the icon is a GtkImage and its size is a widget property, not a rule.\n// Reference: refs/adwaita-web/adwaita-web/scss/_icon.scss — the vendored web\n// port's `.adw-icon` is an inline-flex holder around a real <svg>; this\n// package masks instead, which is what keeps it colourable via currentColor.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components (mask-based).\n\n.adw-icon {\n display: inline-block;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n background-color: currentColor;\n mask-size: 16px;\n mask-repeat: no-repeat;\n mask-position: center;\n -webkit-mask-size: 16px;\n -webkit-mask-repeat: no-repeat;\n -webkit-mask-position: center;\n\n // `currentColor` IS the icon: the mask is painted with the inherited colour,\n // so a suggested-action button's `--accent-fg-color` has to reach it. Since\n // <gtk-image> is a custom element it is also in `$adw-components`, and the\n // ADR-0010 boundary reset re-roots `color` on every entry there — which would\n // otherwise repaint every icon in `--window-fg-color` regardless of its host.\n // Class beats type selector, so this restores inheritance.\n color: inherit;\n\n // `display: inline-block` (author CSS) otherwise beats the UA `[hidden]`\n // rule, so a hidden icon (e.g. an avatar's fallback icon while initials\n // show) would still render as a solid maskless square. Honor `hidden`.\n &[hidden] {\n display: none;\n }\n}\n\n// THE FALLBACK GLYPH — what a name the stylesheet cannot draw resolves to.\n//\n// Until this rule existed there was no `mask-image` on `.adw-icon` at all, so an\n// icon whose name has no generated class kept `background-color: currentColor`\n// over an empty mask and painted a SOLID 16px square in the widget's text\n// colour. Measured in Firefox: `.adw-icon.adw-icon--dialog-error` reported\n// `mask-image: none`, `background-color: rgb(0, 128, 0)`, box 16x16 — visually a\n// deliberate colour swatch, which is why three renderer-comparison surfaces\n// carried substituted glyphs and nobody read it as a bug.\n//\n// `image-missing` is libadwaita's OWN answer to \"I have no icon to draw here\":\n// C substitutes exactly that name for a NULL icon-name in three widgets\n// (adw-button-content.c:294,356 · adw-view-switcher-button.c:286,347,405 ·\n// adw-inline-view-switcher.c:142), and GTK's icon theme returns the same\n// broken-image paintable for a name it cannot find. So the three renderers end\n// up on ONE glyph: GTK draws it from the system theme, the web draws it from\n// here, and NativeScript cannot reach the state at all — its GtkImage takes SVG\n// SOURCE, not a name, so a missing icon there is a missing import the compiler\n// rejects. Nothing THROWS, on any of the three: an icon is decorative and taking\n// an application down over a glyph is a failure mode none of them has.\n//\n// `:where()` and not `.adw-icon`, and that is the load-bearing detail:\n// `adwaita-skin.scss` @uses `icons.generated` BEFORE `icon`, so at equal\n// specificity this rule would come last and override every generated mask class\n// — every icon in the package would draw the broken glyph. `:where()` scores\n// 0,0,0, so ANY `.adw-icon--<name>` rule beats it wherever it sits in the\n// cascade, including one `registerIcon()` inserts at runtime.\n:where(.adw-icon) {\n mask-image: var(--icon-image-missing);\n -webkit-mask-image: var(--icon-image-missing);\n}\n\n// …and NO name at all draws nothing, rather than the broken glyph. `<gtk-image>`\n// leaves the node classless only when `icon-name` is ABSENT or EMPTY, which is the\n// state where the HOST decided against an icon — the tab strip's indicator slot,\n// the avatar's fallback while initials show. `Gtk.Image` with a NULL icon-name\n// draws nothing too.\n//\n// A name that was GIVEN never reaches this rule, even an unusable one: the element\n// puts `adw-icon--image-missing` on it, because `gtk_icon_theme_lookup_icon` has no\n// \"found nothing\" answer either. Until it did, `<adw-button-row start-icon-name=\"a b\">`\n// reserved a VISIBLE 16px slot and painted none of it — this rule turning the\n// pre-existing solid square into an invisible hole.\n.adw-icon:not([class*='adw-icon--']) {\n background-color: transparent;\n}\n","// _labels.scss — libadwaita's typography + semantic-colour UTILITY CLASSES, and\n// the `label {}` rules of the element they are written for.\n//\n// `refs/libadwaita/src/stylesheet/widgets/_labels.scss` is a widget partial in\n// name only: `label { … }` is four lines of GtkLabel plumbing and everything else\n// in it is a CLASS a consumer puts on whatever node it already has — a `<span>` on\n// a hand-written page, or <gtk-label>, which exists because an AUTHORED tree (a\n// Blueprint `Gtk.Label` mounted through `mountSharedTree`) arrives as a tag with a\n// `label` attribute and needs an element to read it. ADR 0010 makes the class\n// surface the public contract either way; the element adds the layout below and\n// nothing to the classes.\n//\n// This is also where the in-tree duplication ends: `_data_grid.scss` declared\n// `font-variant-numeric: tabular-nums` twice and inlined a whole monospace font\n// stack — i.e. `.numeric` and `.monospace` — and dimmed its header row with a\n// raw `opacity: var(--dim-opacity)` where `.dimmed` is the upstream spelling. It\n// composes these now.\n//\n// WHAT DIFFERS FROM UPSTREAM, AND WHY\n//\n// - `font-size` percentages are upstream's (181% / 136% / 118% / 82%), which\n// are relative to the INHERITED size. That is what libadwaita means by them\n// and it composes with `--font-size-base`, so they are kept verbatim rather\n// than resolved to pt values.\n// - `.document` / `.monospace` read `--document-font-*` / `--monospace-font-*`.\n// In GTK those four are written into `:root` at runtime by AdwStyleManager\n// from the desktop's font settings (adw-style-manager.c:169-218), defaulting\n// to `Sans 10` / `Monospace 10` (:50-56). There is no style manager in a\n// browser, so `_variables.scss` supplies them as ordinary tokens — same\n// names, so a consumer re-themes through the documented contract.\n// - `refs/adwaita-web/adwaita-web/scss/_utility_classes.scss` carries its own\n// version of this block (it puts these in `_utility_classes.scss`, NOT in\n// `_label.scss`) and it disagrees with libadwaita on two points: it adds a\n// `line-height` to every title/heading, and it dims `.caption` and\n// `.caption-heading` by folding `--dim-opacity` into them. Neither is in\n// libadwaita — a caption is small, not dim, and dimming is `.dimmed`'s job,\n// composable onto anything. libadwaita is followed here.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss:13-88 (every class below)\n// Reference: refs/libadwaita/src/adw-style-manager.c:50-56,169-218 (the four font tokens)\n// Reference: refs/adwaita-web/adwaita-web/scss/_utility_classes.scss (the vendored port's variant, NOT followed — see above)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web; `label {}` is ported onto\n// <gtk-label> without `:disabled`, which the element has no state for.\n\n// <gtk-label>: `label {}` (_labels.scss:1-11) plus the layout GtkLabel does in C.\n//\n// THE TWO SPACERS ARE `xalign`. GTK places the text at `xalign * (width − text\n// width)` inside the label's allocation (gtklabel.c, gtk_label_get_layout_location); the\n// element's free space is split between `::before` and `::after` in the ratio\n// `xalign : 1 − xalign`, which is that formula, and flips in RTL as the C does.\n//\n// `YALIGN` HAS NO CONTINUUM ON THE CROSS AXIS. `xalign`'s spacer trick splits free space\n// along flexbox's MAIN axis, where a flex item's `flex-grow` ratio is a real number;\n// `align-items` is the CROSS-axis equivalent and CSS gives it three keywords, not a ratio\n// — there is no `align-items: 0.25` the way there is a `flex-grow: 0.25`. A second pair of\n// spacers would need a second axis, and a `<gtk-label>` cannot be both a row (for `xalign`)\n// and a column (for `yalign`) at once without an inner wrapper element, which would cost\n// every single-line label the \"one text node, no children\" DOM shape `gtk-label.spec.ts`\n// pins for the XSS answer. So `--gtk-label-align-items` is set by `labelYalignAlignItems`\n// (`@gjsify/adwaita-core`) from the NEAREST of three zones — `flex-start` below `0.25`,\n// `flex-end` above `0.75`, `center` between (the default, unchanged from before this\n// property existed) — exact at the three values GTK's own default and both edges take,\n// and a DECLARED divergence for anything else: nearest zone, not a silent half-split, and\n// `label.spec.ts`/`gtk-label.spec.ts` both say so where they test the intermediate values.\n//\n// `white-space: pre`: Pango keeps a newline and a run of spaces, and a label that\n// does not wrap is as wide as its text — which a flex item's `min-width: auto`\n// already makes its minimum. `wrap` breaks at word boundaries, WORD being the\n// default `wrap-mode` — so does `ellipsize` alone, see `.adw-label-clamp` below.\ngtk-label {\n display: flex;\n align-items: var(--gtk-label-align-items, center);\n white-space: pre;\n caret-color: currentColor;\n // GtkLabel is not selectable unless asked (`selectable` defaults to FALSE).\n user-select: none;\n\n &::before,\n &::after {\n content: '';\n flex-shrink: 1;\n flex-basis: 0;\n }\n\n &::before {\n flex-grow: var(--gtk-label-xalign, 0.5);\n }\n\n &::after {\n flex-grow: calc(1 - var(--gtk-label-xalign, 0.5));\n }\n\n &[wrap] {\n white-space: pre-wrap;\n }\n\n // `gtk-label.ts`'s span-render path: the text moves into this span so it can be pinned\n // to its measured wrap width (a flex item is blockified by spec, but `display: block` is\n // spelled out rather than relied on implicitly). Present whenever `wrap` is set OR\n // `ellipsize` is active — MEASURED (`@gjsify/adwaita-core`'s `label.ts` header): GTK's\n // own Pango layout wraps onto multiple lines from `ellipsize` ALONE, `wrap` or not, so\n // both cases need the same span and the same measurement pass.\n .adw-label-text {\n display: block;\n // A pinned width, or a shrink-to-fit one, may never push the label wider than its\n // container.\n max-width: 100%;\n }\n\n // `wrap-mode` — Pango's break-opportunity choice — is a real `word-break`/\n // `overflow-wrap` mapping, not a declared gap: CSS's `break-all` is Pango's CHAR (break\n // anywhere), and `overflow-wrap: anywhere` is Pango's WORD_CHAR (word boundaries, falling\n // back to a character break only when a single word will not fit) — the pspec's own\n // words for that member. WORD, the default, is the browser's un-overridden behaviour, so\n // it has no rule here. Scoped to `.adw-label-text` alone, not `[wrap]`: `wrap-mode` only\n // matters once the layout can span more than one line at all, which `ellipsize` alone\n // already grants (see above) — the span's mere existence is that condition.\n &[wrap-mode='char'] .adw-label-text {\n word-break: break-all;\n }\n\n &[wrap-mode='word-char'] .adw-label-text {\n overflow-wrap: anywhere;\n }\n\n // `ellipsize` — a JS-toggled CLASS, not an attribute selector: `.adw-label-clamp` is set\n // by `gtk-label.ts`'s `_renderSpan` from `ellipsize`'s NORMALIZED value, so a raw,\n // unrecognised `ellipsize` attribute (which `normalizeLabelEllipsize` already reads as\n // `none`) can never leave this rule half-applied the way an `[ellipsize]` PRESENCE\n // selector would. `lines`, gated by `labelEffectiveLines` (`@gjsify/adwaita-core`) to\n // \"ellipsize is active\", `wrap` or not — MEASURED, the same header — applies here\n // REGARDLESS of `wrap`: a real `Gtk.Label` allocated with `wrap=FALSE, ellipsize=END,\n // lines=2` lays out exactly two lines, ellipsized, not one. `-webkit-line-clamp` needs\n // its own box context (`display: -webkit-box` + `-webkit-box-orient: vertical`) and text\n // that can actually WRAP (`white-space: normal`, overriding the host's inherited `pre`/\n // `pre-wrap`) to have more than one line to clamp in the first place; the default of `1`\n // is Pango's own when `lines` is unset (`--gtk-label-lines` is still set then — see\n // `_render()` — so the fallback here is only a defensive belt for a span whose host\n // somehow reached this class without it).\n .adw-label-text.adw-label-clamp {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: var(--gtk-label-lines, 1);\n overflow: hidden;\n text-overflow: var(--gtk-label-ellipsize-overflow, ellipsis);\n white-space: normal;\n }\n\n &[selectable] {\n user-select: text;\n cursor: text;\n }\n\n &.separator {\n @extend .dimmed;\n }\n}\n\n// _labels.scss:13-15\n.dimmed {\n opacity: var(--dim-opacity);\n}\n\n// _labels.scss:17-19\n.accent {\n color: var(--accent-color);\n}\n\n// _labels.scss:21-29 — a semantic class does not just recolour the text, it\n// REBINDS the three accent tokens, so a button or switch inside it turns the\n// same colour without knowing which state it is in.\n@each $e_type in error, warning, success {\n .#{$e_type} {\n color: var(--accent-color);\n\n --accent-bg-color: var(--#{$e_type}-bg-color);\n --accent-fg-color: var(--#{$e_type}-fg-color);\n --accent-color: var(--#{$e_type}-color);\n }\n}\n\n/**********************\n * General Typography *\n **********************/\n\n// _labels.scss:35-53\n.title-1 {\n font-weight: 800;\n font-size: 181%;\n}\n\n.title-2 {\n font-weight: 800;\n font-size: 136%;\n}\n\n.title-3 {\n font-weight: 700;\n font-size: 136%;\n}\n\n.title-4 {\n font-weight: 700;\n font-size: 118%;\n}\n\n// _labels.scss:55-57\n.heading {\n font-weight: 700;\n}\n\n// _labels.scss:59-62\n.body {\n font-weight: 400;\n line-height: 140%;\n}\n\n// _labels.scss:64-67\n.caption-heading {\n font-weight: 700;\n font-size: 82%;\n}\n\n// _labels.scss:69-73\n.caption {\n font-weight: 400;\n font-size: 82%;\n line-height: 140%;\n}\n\n// _labels.scss:75-79\n.document {\n font-family: var(--document-font-family);\n font-size: var(--document-font-size);\n line-height: 140%;\n}\n\n// _labels.scss:81-84\n.monospace {\n font-family: var(--monospace-font-family);\n font-size: var(--monospace-font-size);\n}\n\n// _labels.scss:86-88\n.numeric {\n font-variant-numeric: tabular-nums;\n}\n","// _box.scss — <gtk-box>, GTK's one-axis container.\n//\n// libadwaita has no box partial: a box draws nothing, it only places children.\n// The element sets `flex-direction` and `gap` inline from its normalised\n// properties (gtk-box.ts); this is the rest of GtkBoxLayout's shape.\n//\n// `align-items: stretch`: a child's default `halign`/`valign` is FILL, so it takes\n// the whole cross axis. `min-width`/`min-height: 0` are deliberately NOT set on\n// the children: a GTK box never allocates a child less than its minimum, and a\n// flex item's `auto` minimum is that.\n//\n// Reference: refs/gtk/gtk/gtkboxlayout.c (homogeneous: every child the same size)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n\ngtk-box {\n display: flex;\n flex-direction: row;\n align-items: stretch;\n}\n\ngtk-box[homogeneous] > * {\n flex: 1 1 0;\n}\n","// _frame.scss — <gtk-frame>: the 1px border, and the label that sits inside its top edge.\n//\n// libadwaita writes this rule TWICE, once for the widget node and once for the style\n// class (`widgets/_misc.scss:4-7`); the widget half is here and the class half stays in\n// `_style_classes.scss`, where every other `.frame` consumer already is. The label's\n// `margin: 4px` (`_misc.scss:12-14`) is the inset it gets inside the border, keyed on the\n// class the element puts on whatever stands in for GtkFrame's label widget — the internal\n// `<gtk-label>` `label` builds, or an author's `label-widget`.\n//\n// The BOX is GtkFrame's, not libadwaita's: the label widget takes the top line and the\n// child the rest (`gtk_frame_real_compute_child_allocation`, gtkframe.c:554-580), so the\n// host is a flex column whose children grow into whatever the pinned label leaves.\n// `overflow: hidden` is `GTK_OVERFLOW_HIDDEN` (gtkframe.c:246) — the GIR doc calls the\n// clipping out as the way to round a child's corners, at the price of its shadows.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:4-15\n// Reference: refs/gtk/gtk/gtkframe.c:246, :519-580\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-frame {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n border: 1px solid var(--border-color);\n border-radius: var(--card-radius);\n overflow: hidden;\n\n // GTK sizes the label widget itself and never grows it, so it is pinned at its own size\n // (`flex: none`) and its `align-self` is the element's, written from `label-xalign`.\n > .adw-frame-label {\n flex: none;\n margin: 4px;\n }\n\n // Everything else is the child, and it takes the height the label leaves.\n > * {\n flex: 1 1 auto;\n }\n}\n","// _aspect_frame.scss — <gtk-aspect-frame>: draws NOTHING, it only sizes and places.\n//\n// libadwaita has no rule for the `aspectframe` node (its stylesheet never names it), and\n// neither should this: the widget paints no border, no background and no frame, because\n// `gtk_aspect_frame_size_allocate` gives its child one allocation of the requested shape\n// and puts that box at (`xalign`, `yalign`) — gtakaspectframe.c:561-587. That allocation\n// IS the widget.\n//\n// What is left to CSS is the placing, and all of it is per-INSTANCE: the element writes\n// `justify-content` and `align-items` from `xalign` / `yalign` and the child's\n// `aspect-ratio`, `max-width` and `max-height` inline, because a stylesheet cannot key on a\n// fraction. So this partial is the flex container and nothing else.\n//\n// Reference: refs/gtk/gtk/gtkaspectframe.c:561-587\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-aspect-frame {\n display: flex;\n // The child's shape and both alignments are written INLINE by the element, because a\n // stylesheet cannot key on a fraction; these are the values in the frame before it does,\n // which are also the pspec defaults for `xalign` and `yalign`.\n justify-content: center;\n align-items: center;\n}\n","// _center_box.scss — <gtk-center-box>: three children, and the space between them.\n//\n// `gtk_center_box_set_css_name (widget_class, I_(\"box\"))` (gtkcenterbox.c:345) means the\n// theme's `box` rule styles this widget, and libadwaita ships NO `box` rule — a box draws\n// nothing, it only places. `justify-content: space-between` IS the placement: the centre\n// layout puts the start child at the start, the end child at the end and the centre between\n// them, growing the centre into whatever is left when it expands\n// (gtkcenterlayout.c:174-186).\n//\n// The `shrink-center-last` weights and a `baseline-position` are written INLINE by the\n// element, because both are per-instance values a selector cannot express: the weights\n// differ per child, and the position is a fraction.\n//\n// Reference: refs/gtk/gtk/gtkcenterbox.c:345-346\n// Reference: refs/gtk/gtk/gtkcenterlayout.c:144-186\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-center-box {\n display: flex;\n justify-content: space-between;\n // A child's default `valign` is FILL, and the centre layout's one line takes the whole\n // cross axis — the same thing `_box.scss` states for `<gtk-box>`.\n align-items: stretch;\n}\n","// _grid.scss — <gtk-grid>: a table of cells, sized by what is in them.\n//\n// libadwaita styles the `grid` node nowhere — the grid has no node of its own beyond what\n// GtkGridLayout builds — so this partial is `display: grid` and the one default worth\n// stating: a child written without a position is attached along the columns, which is\n// `grid-auto-flow: row` (`gtk_grid_buildable_add_child`, gtkgrid.c:493-507).\n//\n// Everything else is per-instance and inline, because a selector cannot key on a number:\n// the two spacings, the two `homogeneous` flags and the orientation all go on the element\n// as `row-gap` / `column-gap` / `grid-auto-rows` / `grid-auto-columns` / `grid-auto-flow`.\n//\n// Reference: refs/gtk/gtk/gtkgrid.c:493-507\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-grid {\n display: grid;\n grid-auto-flow: row;\n}\n","// _fixed.scss — <gtk-fixed>: children at pixel positions, and a box around all of them.\n//\n// `gtk_fixed_init` sets `GTK_OVERFLOW_HIDDEN` (gtkfixed.c:189-195), so the fixed clips a\n// child that reaches past its own bounds — and the element sizes those bounds from the\n// union of the children (`gtk_fixed_layout_measure`, gtkfixedlayout.c:224-300), which is\n// what makes `overflow: hidden` a clipping rule rather than a layout one.\n//\n// The children are out of flow, which is what a position means: `position: absolute` against\n// the fixed's own padding box, which `gtk_fixed_layout_allocate` does by handing each child\n// its measured size at (x, y). `left` / `top` DEFAULT TO ZERO and not to CSS's `auto`\n// because `gtk_fixed_buildable_add_child` puts an unpositioned child at 0, 0\n// (gtkfixed.c:171-177), and `auto` would resolve it to its STATIC position instead.\n//\n// Reference: refs/gtk/gtk/gtkfixed.c:171-177, :189-195\n// Reference: refs/gtk/gtk/gtkfixedlayout.c:224-300\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-fixed {\n display: block;\n position: relative;\n overflow: hidden;\n\n > * {\n position: absolute;\n left: 0;\n top: 0;\n }\n}\n","// _style_classes.scss — libadwaita's documented, WIDGET-INDEPENDENT style classes.\n//\n// THE GAP THIS CLOSES\n//\n// `refs/libadwaita/doc/style-classes.md` is the public contract an app author\n// reads: put `.card` on a box, `.boxed-list` on a list, `.toolbar` on a bar,\n// `.linked` around a button group. Twenty-one of those classes had NO rule in\n// this package (#1049) — and two of them looked ported because their names\n// appear in comments (`.osd`, `.linked`) while the code spells its own\n// `.adw-linked`. A consumer following the upstream documentation got nothing,\n// silently, which is the worst failure mode for a styling contract.\n//\n// Widget-scoped classes are NOT here — they live with the widget whose markup\n// they modify (`.property` in `_action_row.scss`, `.compact` in\n// `_status_page.scss`, `.devel` in `_headerbar.scss`, `.osd`'s button and\n// progress-bar variants in theirs), because that is where their selector needs\n// to see the widget's inner nodes. `scripts/check-adwaita-style-classes.mjs`\n// holds the ledger of which class lives where and fails when one has no rule at\n// all.\n//\n// Reference: refs/libadwaita/doc/style-classes.md (the documented surface)\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:25-28,43-60,90-104\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:4-7,21-32,197-236\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:1-18\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:520-600\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss:91-102\n// Reference: refs/libadwaita/src/stylesheet/widgets/_linked.scss:1-45\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scrolling.scss:150-166\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — GTK node names (`row`,\n// `list`, `button`) become the custom-element tags and `.adw-*` structure\n// classes this package renders, and GTK-only drawing (`image()`,\n// `-gtk-icon-shadow`, `border-spacing` on a box) becomes its CSS equivalent.\n\n/************\n * Surfaces *\n ************/\n\n// _common.scss:25-28 — an opaque window-coloured background on any node.\n.background {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n\n// _views.scss:1-18 — the content-area surface. `:disabled` and `:selected` are\n// GTK pseudo-classes with no DOM counterpart; `[disabled]`/`[aria-selected]`\n// are how the same states are spelled here, and both are what our own widgets\n// already set.\n.view {\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n\n &:disabled,\n &[disabled] {\n color: color-mix(in srgb, var(--view-fg-color) var(--disabled-opacity), transparent);\n background-color: color-mix(in srgb, var(--window-bg-color) 60%, var(--view-bg-color));\n }\n\n &[aria-selected='true'] {\n background-color: color-mix(in srgb, var(--accent-bg-color) 25%, transparent);\n border-radius: var(--button-radius);\n }\n}\n\n// _misc.scss:4-7 — the default border. `--border-color` is derived from\n// `currentColor`, so this follows the foreground of whatever it is drawn on.\n.frame {\n border: 1px solid var(--border-color);\n}\n\n/*********\n * Cards *\n *********/\n\n// _misc.scss:197-236. The ONE card recipe: `adw-card` and the preferences\n// group's list box each carried their own copy of these five declarations\n// before this placeholder existed.\n%card {\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n border-radius: var(--card-radius);\n box-shadow:\n 0 0 0 1px rgb(0 0 6 / 3%),\n 0 1px 3px 1px rgb(0 0 6 / 7%),\n 0 2px 6px 2px rgb(0 0 6 / 3%);\n\n @media (prefers-contrast: more) {\n box-shadow:\n 0 0 0 1px var(--border-color),\n 0 1px 3px 1px rgb(0 0 6 / 7%),\n 0 2px 6px 2px rgb(0 0 6 / 3%);\n }\n}\n\n.card {\n @extend %card;\n\n // `.card.activatable` gets the hover/active states of an activatable row\n // (:225-235). GTK's `background-image: image(…)` is a solid-colour layer over\n // the background; a one-stop gradient is its CSS equivalent, and it composes\n // with `background-color` the same way — so a re-themed card keeps its colour\n // and only gains the wash.\n &.activatable {\n transition:\n background-color 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),\n box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n\n &:hover {\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 3%, transparent),\n color-mix(in srgb, currentColor 3%, transparent)\n );\n }\n\n &:active {\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 8%, transparent),\n color-mix(in srgb, currentColor 8%, transparent)\n );\n }\n }\n\n // A card inside (or itself) an OSD surface loses its own elevation and reads\n // as a translucent inset instead (:212-220).\n .osd &,\n &.osd {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n color: rgb(255 255 255 / 90%);\n box-shadow: none;\n\n @media (prefers-contrast: more) {\n box-shadow: 0 0 0 1px var(--border-color);\n }\n }\n}\n\n/***************\n * Boxed lists *\n ***************/\n\n// _lists.scss:520-556. In GTK the row separators are drawn by the rows\n// themselves and the list only supplies the card box plus the rounding of its\n// two ends — which is exactly how this package's rows behave already\n// (`adw-action-row` and friends draw their own `border-bottom` and drop it on\n// `:last-child`), so the class is the box and the clip.\n.boxed-list {\n @extend %card;\n\n display: flex;\n flex-direction: column;\n // The rounding of the first and last row is a CLIP here rather than per-row\n // corner radii: a row is a custom element whose own background paints over\n // the list's corners, and every row type would otherwise need the same four\n // radii repeated.\n overflow: hidden;\n}\n\n// :556-600 — same content, each row its own card. The list drops its box, and\n// the rows carry it, spaced 12px apart.\n.boxed-list-separate {\n display: flex;\n flex-direction: column;\n gap: 12px;\n background: none;\n color: var(--card-fg-color);\n\n > * {\n @extend %card;\n\n overflow: hidden;\n // A row that draws a separator for its neighbours must not draw one when it\n // IS the card (:585-586: `border: none`).\n border-bottom: none;\n }\n}\n\n/************\n * Toolbars *\n ************/\n\n// _toolbars.scss:91-102 + doc \"Toolbars\". GTK's `border-spacing: 6px` on a box\n// is the gap between children; the flex row is what makes that expressible.\n//\n// The automatic flat appearance follows upstream's rule list exactly: icon-only\n// buttons, buttons with an `adw-button-content` (icon + label), menu buttons and\n// split buttons go flat — unless they are `.raised`, `.suggested-action`,\n// `.destructive-action`, `.opaque`, or sit inside a `.linked` group. Text-only\n// buttons keep their frame, which is why this cannot be a blanket\n// `.toolbar gtk-button { … }`.\n$_keeps-frame: ':not(.raised):not(.suggested-action):not(.destructive-action):not(.opaque)';\n\n.toolbar {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px;\n\n gtk-button#{$_keeps-frame} .adw-button.icon-only,\n gtk-button#{$_keeps-frame}:has(adw-button-content) .adw-button,\n gtk-menu-button#{$_keeps-frame} .adw-button,\n adw-split-button#{$_keeps-frame} .adw-button {\n background-color: transparent;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Inside a linked group the frames come BACK — upstream states this as its own\n // rule (`_toolbars.scss:20-26`) rather than as an exclusion, because a linked\n // group only reads as one control if its members are raised.\n .linked,\n .adw-linked {\n gtk-button#{$_keeps-frame} .adw-button,\n gtk-menu-button#{$_keeps-frame} .adw-button,\n adw-split-button#{$_keeps-frame} .adw-button {\n background-color: var(--button-bg-color);\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n }\n\n // Stand-alone OSD toolbars — the floating video-player-controls shape\n // (:99-102).\n &.osd {\n padding: 12px;\n border-radius: calc(var(--button-radius) + 6px);\n }\n}\n\n// _misc.scss:21-32 — a separator that reserves whitespace instead of drawing a\n// line, for separating groups inside a toolbar.\n.spacer {\n background: none;\n border: none;\n flex-shrink: 0;\n\n &,\n &.horizontal {\n min-width: 12px;\n }\n\n &.vertical {\n min-height: 12px;\n }\n}\n\n/*******\n * OSD *\n *******/\n\n// _common.scss:43-60. The exclusions are upstream's: a progress bar, button,\n// menu button, split button and inline view switcher each define what `.osd`\n// means for them, and must not get the dark surface treatment on top.\n//\n// This is a token REBIND, not just a colour: everything accent-coloured inside\n// an OSD surface turns white without knowing it is inside one.\n.osd:not(gtk-progress-bar):not(gtk-button):not(gtk-menu-button):not(adw-split-button):not(\n adw-inline-view-switcher\n ) {\n --accent-bg-color: rgb(255 255 255 / 75%);\n --accent-fg-color: rgb(0 0 0 / 75%);\n --accent-color: oklab(from var(--accent-bg-color) max(l, 0.85) a b);\n --destructive-color: oklab(from var(--destructive-bg-color) max(l, 0.85) a b);\n --success-color: oklab(from var(--success-bg-color) max(l, 0.85) a b);\n --warning-color: oklab(from var(--warning-bg-color) max(l, 0.85) a b);\n --error-color: oklab(from var(--error-bg-color) max(l, 0.85) a b);\n\n color: rgb(255 255 255 / 90%);\n border: none;\n background-color: rgb(0 0 0 / 70%);\n background-clip: padding-box;\n}\n\n/*******************\n * Linked controls *\n *******************/\n\n// _linked.scss:1-45 + doc \"Linked Controls\": the children of a linked box share\n// their touching edges. Upstream squares the inner corners and overlaps the\n// borders by -1px; this package's controls have no border, so the overlap is\n// dropped and only the corner squaring remains.\n//\n// `.adw-linked` is this package's own earlier spelling, kept as an alias — and\n// it USED to add a 2px gap between children, which is a segmented look, not a\n// linked one. The gap is gone; a consumer who wanted it can say `gap`.\n// The styled node is either the child itself (a bare `.adw-button` /\n// `.adw-entry`) or one rendered inside the child host element (`<gtk-button>`,\n// `<gtk-menu-button>`, `<gtk-drop-down>`, …) — so both spellings are matched\n// rather than enumerating host tags the way GTK has to.\n$_linked-nodes: '.adw-button', '.adw-entry';\n\n.linked,\n.adw-linked {\n display: inline-flex;\n\n &:not(.vertical) > * {\n @each $node in $_linked-nodes {\n &:not(:first-child) #{$node},\n &:not(:first-child)#{$node} {\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n }\n\n &:not(:last-child) #{$node},\n &:not(:last-child)#{$node} {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n }\n }\n\n &.vertical {\n flex-direction: column;\n\n > * {\n @each $node in $_linked-nodes {\n &:not(:first-child) #{$node},\n &:not(:first-child)#{$node} {\n border-start-start-radius: 0;\n border-start-end-radius: 0;\n }\n\n &:not(:last-child) #{$node},\n &:not(:last-child)#{$node} {\n border-end-start-radius: 0;\n border-end-end-radius: 0;\n }\n }\n }\n }\n}\n\n/*************\n * App icons *\n *************/\n\n// _common.scss:90-104. `-gtk-icon-shadow` has no CSS counterpart; `filter:\n// drop-shadow()` is the equivalent that follows the icon's alpha rather than its\n// box, which is what makes these legible on a light background. Each upstream\n// shadow layer becomes one `drop-shadow()`.\n.lowres-icon {\n filter: drop-shadow(0 -1px rgb(0 0 6 / 5%)) drop-shadow(1px 0 rgb(0 0 6 / 10%))\n drop-shadow(0 1px rgb(0 0 6 / 30%)) drop-shadow(-1px 0 rgb(0 0 6 / 10%));\n}\n\n.icon-dropshadow {\n filter: drop-shadow(0 1px 12px rgb(0 0 6 / 5%)) drop-shadow(0 -1px rgb(0 0 6 / 5%))\n drop-shadow(1px 0 rgb(0 0 6 / 10%)) drop-shadow(0 1px rgb(0 0 6 / 30%))\n drop-shadow(-1px 0 rgb(0 0 6 / 10%));\n}\n\n/************************\n * Undershoot indicators *\n ************************/\n\n// _scrolling.scss:150-166 — a shadow on the given edge of a scrolling box,\n// telling the reader there is content past it. GTK draws them with an inset\n// background; an inset `box-shadow` on the scroll container is the CSS\n// equivalent and, unlike a `::before`, stays put while the content scrolls.\n//\n// `-start`/`-end` follow text direction, same as `margin-start`/`margin-end`,\n// which `:dir()` expresses directly.\n//\n// THESE FOUR NAMES HAVE TWO WRITERS, so both of them are excluded here and this\n// rule is left to the third: an author applying the documented style class by\n// hand to markup adwaita-web does not drive.\n//\n// - `adw-toolbar-view` carries `undershoot-top`/`-bottom` as its own STATE\n// (`update_undershoots`), and hands the two flags down to the scrollers.\n// - `src/scroll-shading.ts` stamps all four onto every scroller under a toolbar\n// view and marks it `.adw-scroll-shaded`; `_scrolling.scss` draws that one,\n// per scroller, as the 1px line + 4px fade GTK paints on a `scrolledwindow`.\n//\n// Without the second exclusion each shaded scroller drew BOTH — a 6px blurred\n// host shadow under the new gradient — and on the horizontal axis, which\n// `_scrolling.scss` deliberately leaves unpainted because neither AdwTabBox nor\n// AdwCarousel has a `scrolledwindow` node, this rule was the only thing drawing\n// at all: an overflowing tab strip lost its own `inset 0 -1px` bottom hairline to\n// this more specific `box-shadow` and gained an edge shadow libadwaita never\n// draws there.\n$undershoot-color: color-mix(in srgb, currentColor 6%, transparent);\n\n.undershoot-top:not(adw-toolbar-view):not(.adw-scroll-shaded) {\n box-shadow: inset 0 6px 6px -6px $undershoot-color;\n}\n\n.undershoot-bottom:not(adw-toolbar-view):not(.adw-scroll-shaded) {\n box-shadow: inset 0 -6px 6px -6px $undershoot-color;\n}\n\n.undershoot-start:not(.adw-scroll-shaded) {\n &:dir(ltr) {\n box-shadow: inset 6px 0 6px -6px $undershoot-color;\n }\n\n &:dir(rtl) {\n box-shadow: inset -6px 0 6px -6px $undershoot-color;\n }\n}\n\n.undershoot-end:not(.adw-scroll-shaded) {\n &:dir(ltr) {\n box-shadow: inset -6px 0 6px -6px $undershoot-color;\n }\n\n &:dir(rtl) {\n box-shadow: inset 6px 0 6px -6px $undershoot-color;\n }\n}\n","// _window.scss — adw-window styling.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_window.scss (the frame; the\n// `.maximized`/`.fullscreen` rules at 66-72 are the ones an in-page frame can use)\n// Reference: refs/adwaita-web/adwaita-web/scss/_window.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `adw-application-window` is `adw-window` plus a menubar (it extends the class and adds nothing\n// else), so it is the same frame: without this an application window was an inline box with no\n// size at all, and a tree rooted at one measured 0 x 0.\nadw-window,\nadw-application-window {\n display: flex;\n flex-direction: column;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n border-radius: var(--window-radius);\n box-shadow:\n 0 0 14px 5px rgb(0 0 0 / 15%),\n 0 0 5px 2px rgb(0 0 0 / 10%),\n 0 0 0 1px rgb(0 0 0 / 5%);\n overflow: hidden;\n outline: 1px solid rgb(255 255 255 / 7%);\n outline-offset: -1px;\n\n // `window.maximized` / `window.fullscreen` zero the radius and drop the shadow\n // (_window.scss:66-72). A page-sized window IS the maximised one here: the frame\n // is in-page, so there is nothing outside it to cast a shadow on.\n &.maximized,\n &.fullscreen {\n --window-radius: 0px;\n outline: none;\n box-shadow: none;\n }\n}\n\n// The content area — the one child slot `Adw.Window:content` fills. It takes the\n// window's own column, so a toolbar view dropped in stretches both ways.\n.adw-window-content {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n min-height: 0;\n min-width: 0;\n}\n\n// A window hands its one child the WHOLE allocation, whatever that child's own expand flags say.\n// On the web a box is only as tall as what it holds, so the `Gtk.Box` a `.blp` roots its content\n// in stopped at its header bar and the split view below it drew a quarter of the window.\n.adw-window-content > gtk-box {\n flex: 1 1 auto;\n min-height: 0;\n}\n\n// <gtk-window> — the GTK frame, in the SAME file upstream styles `Adw.Window` in: libadwaita\n// keys `window { &.csd { … } }` off the GtkWindow CSS node\n// (refs/libadwaita/src/stylesheet/widgets/_window.scss:1-31), and this element IS a window\n// as far as the stylesheet is concerned.\n//\n// The frame rules are `<adw-window>`'s, restated for the `gtk-` tag rather than shared\n// through a selector list: `_reset.scss` re-roots the box model at each registered element,\n// and a shared `adw-window, gtk-window` block would put two component resets in one rule.\n//\n// NOT the same as `<adw-window>`, deliberately. `Adw.Window` is a plain styled container —\n// nothing about it is GTK's `GtkWindow` — while this one answers the FRAME properties:\n// `decorated` drops the titlebar strip, `maximized` and `fullscreened` square the corners\n// off and drop the shadow (`_window.scss:66-72`), and the strip itself is either the\n// application's `titlebar` or the two `<gtk-window-controls>` a server-side decoration would\n// have had. See `gtk-window.ts` for the whole list and each source line.\ngtk-window,\ngtk-application-window {\n display: flex;\n flex-direction: column;\n position: relative;\n box-sizing: border-box;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n border-radius: var(--window-radius);\n outline: 1px solid rgb(255 255 255 / 7%);\n outline-offset: -1px;\n box-shadow:\n 0 0 14px 5px rgb(0 0 0 / 15%),\n 0 0 5px 2px rgb(0 0 0 / 10%),\n 0 0 0 1px rgb(0 0 0 / 5%);\n overflow: hidden;\n\n // `_window.scss:66-72` — a maximized or fullscreen window fills the screen, so it has no\n // corners to round and no frame to cast a shadow from.\n &.maximized,\n &.fullscreen {\n --window-radius: 0px;\n outline: none;\n box-shadow: none;\n }\n\n // The strip: an application's `titlebar` slot, or the two window-control groups and the\n // window's own title. `min-width: 0` on the title is what lets a long one ellipsize\n // instead of pushing the end controls out of the frame.\n > .adw-gtk-window-titlebar {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n min-height: 47px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n\n > .adw-gtk-window-title {\n flex: 1;\n min-width: 0;\n padding: 0 12px;\n font-weight: bold;\n text-align: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // A window with no title shows no title; GTK would draw the empty SSD label, and an\n // empty flex track is exactly that.\n &:has(> .adw-gtk-window-title:not([title])) > .adw-gtk-window-title {\n display: none;\n }\n }\n\n > .adw-gtk-application-window-menubar {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n gap: 6px;\n padding: 0 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n }\n\n // `Gtk.Box`'s own `border-spacing` is 0 here; the gap between the window's children is the\n // application's business, and the content box exists so it can have one without the strip\n // taking part.\n > .adw-gtk-window-content {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n overflow: auto;\n }\n}\n","// _application_window.scss — the application window's menubar strip.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (`menubar`, the\n// row libadwaita styles for GtkPopoverMenuBar — the GTK 4 menubar this widget\n// stands in for)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_header-bar.scss (the bar it sits\n// above, for the background and the border between them)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n.adw-application-window-menubar {\n display: flex;\n flex: 0 0 auto;\n align-items: center;\n gap: 2px;\n padding: 0 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n // The rule between the bar and the header bar below it, which is the whole of what\n // separates one bar from another in a stacked window.\n box-shadow: inset 0 -1px 0 var(--headerbar-border-color);\n\n &[hidden] {\n display: none;\n }\n}\n","// _headerbar.scss — adw-header-bar styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_headerbar.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_header-bar.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// A GRID, not a flex row, because `Adw.HeaderBar` puts its three sections in a\n// `GtkCenterBox` (adw-header-bar.c:992) — and a center box centres its middle\n// child in the WHOLE box, not in whatever space the sides left over. As a flex\n// row with `flex: 1` on the centre, the title was centred between the buttons\n// instead: any bar whose two sides differ in width — which is most of them, e.g.\n// a storybook preview header with no start buttons and two end buttons — drew its\n// title visibly off-centre.\n//\n// `1fr` is `minmax(auto, 1fr)`, and that auto floor is what makes this the LOOSE\n// centering policy (the default) rather than STRICT: the side tracks share the\n// free space equally, so the title sits dead centre while both sides fit, but a\n// side whose content is wider than its share pushes the title off centre rather\n// than truncating itself. STRICT — `adw_header_bar_set_centering_policy`, which\n// size-groups the two sides — would instead keep the title centred at all cost.\nadw-header-bar {\n display: grid;\n grid-template-columns: 1fr minmax(0, auto) 1fr;\n align-items: center;\n min-height: 47px;\n padding: 0 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--separator-color);\n // flex-shrink: 0 ensures the headerbar never collapses inside a flex-column\n // adw-window, preventing a spurious spacing band between bar and content.\n flex-shrink: 0;\n\n .adw-header-bar-center {\n // STRETCHED into its track, never `justify-self: center`. A grid item that is\n // centred is sized `fit-content`, whose floor is the item's own MIN-CONTENT —\n // and a `nowrap` title's min-content is the whole string. Centred, a 260px bar\n // with a back button and two end buttons therefore drew a 277px centre section\n // starting 6.6px OUTSIDE the bar and running straight over all three buttons,\n // with the ellipsis never reached. Stretched, the item is exactly its track,\n // and the track is what is left once both sides have their natural width.\n //\n // That leftover is the rule `gtk_center_layout_distribute` applies while\n // `shrink-center-last` is FALSE (gtkcenterlayout.c:155-157): the centre is\n // CLAMPed to `size - spacing - (start.natural + end.natural)` and then pushed\n // in from either side, so it cannot overlap them. The centring above still\n // holds wherever the bar HAS room, because the two `1fr` side tracks split the\n // free space evenly and `justify-content: center` centres the title in the\n // middle track.\n display: flex;\n justify-content: center;\n // min-width: 0 prevents the title from pushing the end buttons off-screen.\n // `shrink-center-last` is FALSE on the center box, so the TITLE is what gives\n // way when the bar runs out of room, not the buttons.\n min-width: 0;\n }\n\n .adw-header-bar-title {\n font-weight: bold;\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .adw-header-bar-start {\n justify-self: start;\n display: flex;\n align-items: center;\n padding: 0 6px;\n gap: 4px;\n }\n\n .adw-header-bar-end {\n justify-self: end;\n display: flex;\n align-items: center;\n // justify-content: flex-end aligns end buttons to the right edge of the\n // end section, fixing the pause-button misposition bug.\n justify-content: flex-end;\n padding: 0 6px;\n gap: 4px;\n }\n\n .adw-header-btn {\n position: relative;\n width: 34px;\n height: 34px;\n border: none;\n border-radius: var(--button-radius);\n background: transparent;\n color: var(--headerbar-fg-color);\n cursor: pointer;\n padding: 0;\n margin: 0;\n flex-shrink: 0;\n\n &:hover {\n background: rgba(128, 128, 128, 0.12);\n }\n\n &:active {\n background: rgba(128, 128, 128, 0.22);\n }\n }\n}\n\n// `.devel` on the WINDOW gives every header bar inside it a striped background —\n// the marker for a nightly or unstable build (style-classes.md \"Development\n// Window\", `_toolbars.scss:345-354`).\n//\n// Upstream cross-fades a 5% recoloured SVG (`assets/devel-stripes.svg`) and\n// masks it so it fades out downwards. The stripe geometry is read off that\n// asset: a 64px tile, 32px of stripe per period, leaning left as it descends.\n//\n// The fade is the top LAYER here rather than a mask: `mask-image` on the bar\n// would fade its title and buttons with the stripes, and a masked pseudo-element\n// would paint over them. Washing the stripes out with the bar's own opaque\n// background colour renders identically and leaves the content alone.\n.devel adw-header-bar,\nadw-window.devel adw-header-bar,\nadw-application-window.devel adw-header-bar {\n background-image:\n linear-gradient(to bottom, transparent 0%, var(--headerbar-bg-color) 100%),\n repeating-linear-gradient(\n 116.565deg,\n color-mix(in srgb, currentColor 5%, transparent) 0 32px,\n transparent 32px 64px\n );\n}\n\n/*********************\n * Gtk.HeaderBar *\n *********************/\n\n// GTK's own bar, in the SAME file upstream styles `Adw.HeaderBar` in: libadwaita keys\n// `headerbar`, `windowhandle > box` and `box.start`/`box.end` off the GtkHeaderBar CSS tree\n// (refs/gtk/gtk/gtkheaderbar.c:99-116), and the element builds that tree here — so the\n// selectors are the same ones and the two bars sit on the same surface.\n//\n// `order` on the three children rather than their DOM order: the title widget is ADOPTED\n// into the centre `box` after the two side boxes are already in it, and a flex row lays out\n// in DOM order. The centring itself is the `flex: 1` centre track, which is\n// `gtk_center_layout_distribute`'s rule that the centre is clamped to\n// `size - (start.natural + end.natural)` (gtkcenterlayout.c:155-157) — the two ends keep\n// their natural width and the title takes what is left.\n//\n// The `.title` label is the derived one, and `min-width: 5ch` is `width-chars = 5`\n// (MIN_TITLE_CHARS, gtkheaderbar.c:117, :287) as CSS: a bar with a short title must not\n// collapse its centre to nothing and drop the ends on each other.\ngtk-header-bar {\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n min-height: 47px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n\n > .adw-gtk-header-bar-handle > .adw-gtk-header-bar-box {\n display: flex;\n align-items: center;\n flex: 1;\n // `_header-bar.scss:20-26` — the padding around the bar's whole content, and the 6px\n // spacing between the packed children at either side.\n padding: 6px 7px 7px 7px;\n\n > .adw-gtk-header-bar-start {\n order: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n // `:29-37` — the gap libadwaita puts between the centre and a side.\n margin-right: 6px;\n }\n\n > .adw-gtk-header-bar-end {\n order: 2;\n display: flex;\n align-items: center;\n gap: 6px;\n margin-left: 6px;\n }\n\n > :not(.adw-gtk-header-bar-start):not(.adw-gtk-header-bar-end) {\n order: 1;\n flex: 1;\n min-width: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n }\n\n // The derived `GtkLabel` (gtkheaderbar.c:274-290): no wrap, `single-line-mode`,\n // `ellipsize = END`, `width-chars = 5`, and the `title` style class on top — which\n // `_header-bar.scss:213-219` gives 12px of padding either side and a bold weight.\n > .adw-gtk-header-bar-handle > .adw-gtk-header-bar-box > .adw-gtk-header-bar-title {\n min-width: 5ch;\n padding: 0 12px;\n font-weight: bold;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n\n/************************\n * Gtk.WindowControls *\n ************************/\n\n// The three frame buttons, off libadwaita's own `windowcontrols > button > image`\n// (refs/libadwaita/src/stylesheet/widgets/_header-bar.scss:175-207). A button is a 24px\n// square with 5px of padding; the IMAGE carries the whole hover/active affordance — a\n// circular `$button_color` disc that grows darker — which is why the disc and not the button\n// is what has a background here.\ngtk-window-controls {\n display: flex;\n align-items: center;\n // `:176` — the gap between two controls.\n gap: 3px;\n\n > .adw-window-controls-button {\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 24px;\n min-height: 24px;\n padding: 5px;\n border: none;\n background: none;\n color: inherit;\n cursor: pointer;\n\n > .adw-icon {\n // `:189-199` — the disc, its radius and its transitions.\n background-color: var(--button-bg-color);\n border-radius: 100%;\n padding: 4px;\n transition:\n background-color 150ms ease-out,\n box-shadow 150ms ease-out;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n\n &:hover > .adw-icon {\n background-color: var(--button-hover-color);\n }\n\n &:active > .adw-icon {\n background-color: var(--button-active-color);\n }\n\n // `:204-206` — the window icon is not a button, so it takes a margin, not a padding.\n > .icon {\n margin: 9px;\n }\n }\n}\n","// _action_bar.scss — <gtk-action-bar>, GTK's bottom bar of packed widgets.\n//\n// libadwaita styles the bar's inner box (`actionbar > revealer > box`); this element has\n// no revealer, so the host carries that box's surface and the three sections are its\n// start box, centre and end box. `border-spacing: 6px` there is the gap between the\n// packed children here.\n//\n// `revealed` is applied by toggling the `hidden` attribute, and `[hidden]` is re-asserted\n// as an AUTHOR rule for the reason `_view_switcher_bar.scss` gives: the UA rule loses to\n// this block's own `display` by cascade origin.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (GtkActionBar)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-action-bar {\n display: flex;\n align-items: center;\n gap: 6px;\n box-sizing: border-box;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 1px var(--headerbar-shade-color);\n padding: 7px 6px 6px 6px;\n\n &[hidden] {\n display: none;\n }\n\n > .adw-action-bar-start,\n > .adw-action-bar-end {\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n > .adw-action-bar-start {\n flex: 1 1 0;\n justify-content: flex-start;\n }\n\n > .adw-action-bar-center {\n display: flex;\n align-items: center;\n }\n\n > .adw-action-bar-end {\n flex: 1 1 0;\n justify-content: flex-end;\n }\n}\n","// _window_title.scss — adw-window-title styling (header-bar title widget).\n// Reference: refs/adwaita-web/adwaita-web/docs/widgets/windowtitle.md\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-window-title {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n line-height: 1.15;\n min-width: 0;\n\n // Both labels carry 12px sides upstream (_header-bar.scss:214-227). Without them the\n // gallery's window title measured 27px narrower than GTK's render of the same `.blp`,\n // and a header bar's title could run up against the buttons beside it.\n .adw-window-title-title,\n .adw-window-title-subtitle {\n padding-left: 12px;\n padding-right: 12px;\n }\n\n .adw-window-title-title {\n font-size: var(--font-size-base);\n font-weight: 700;\n color: var(--headerbar-fg-color);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n }\n\n .adw-window-title-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--headerbar-fg-color);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n }\n}\n","// _button.scss — gtk-button + Adwaita button styles + symbolic icons + .linked.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// <gtk-button> is a thin host that renders an inner <button class=\"adw-button\">;\n// the class set is the real styling API and works on a plain <button> too.\ngtk-button {\n display: inline-flex;\n}\n\n.adw-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n min-height: 34px;\n min-width: 34px;\n margin: 0;\n padding: 4px 14px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n text-decoration: none;\n cursor: pointer;\n transition: background-color 0.1s ease;\n user-select: none;\n -webkit-user-select: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &:disabled {\n opacity: 0.45;\n cursor: default;\n }\n\n // Flat — no resting background; only reacts on hover/active. The header bar's\n // navigation buttons use this.\n &.flat {\n background-color: transparent;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Suggested action — accent-coloured primary button.\n &.suggested-action {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n\n &:hover {\n background-color: var(--accent-color);\n }\n\n &:active {\n background-color: var(--accent-color);\n filter: brightness(0.92);\n }\n }\n\n // Destructive action — libadwaita's `%destructive_button` (_buttons.scss:183-210):\n // red TEXT on a 15% tint of it, not a filled red button. It was filled here, so the\n // gallery's \"Delete\" read as a second primary action beside the GTK render of the\n // same `.blp`. The accent tokens are rebound as upstream does, so anything accent-\n // coloured inside the button (a focus ring) turns red with it.\n &.destructive-action {\n --accent-bg-color: var(--destructive-bg-color);\n --accent-fg-color: var(--destructive-fg-color);\n --accent-color: var(--destructive-color);\n\n color: var(--destructive-color);\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 20%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 35%, transparent);\n }\n }\n\n // A label-only button — GTK's `.text-button`, which `gtk_button_set_label` puts on the\n // button (_buttons.scss:72-75). 17px against the 14px every web button had, so each\n // text button in the gallery's button row was 6px narrower than GTK's. Before the pill,\n // circular and icon-only rules, which upstream also lets win.\n &.text-button {\n padding-left: 17px;\n padding-right: 17px;\n }\n\n // Icon-only square button (no label).\n &.icon-only {\n padding: 0;\n width: 34px;\n }\n\n // Circular — round icon button.\n &.circular {\n padding: 0;\n width: 34px;\n border-radius: 9999px;\n }\n\n // Pill — fully-rounded ends, and libadwaita's `%pill_button` padding\n // (_buttons.scss: `padding: 10px 32px`). It was 6px 20px, which drew every pill\n // 10px shorter and 24px narrower than GTK beside a GTK render of the same `.blp`.\n // GTK's height is `min-height: 24px` plus that padding, so 44; the floor is\n // restated because the base's 34 would otherwise hold the box at the text height.\n &.pill {\n min-height: 44px;\n padding: 10px 32px;\n border-radius: 9999px;\n }\n\n // Raised — the documented opt-OUT of the automatic flat appearance a button\n // gets inside a `.toolbar` or a header bar (style-classes.md \"Raised\"). It is\n // the default look, stated explicitly, so it must also beat `.flat` when both\n // are present, the way `_toolbars.scss` treats it.\n &.raised {\n background-color: var(--button-bg-color);\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // OSD — a standalone button overlapping content (style-classes.md \"OSD ›\n // Overlay Buttons\"). `_common.scss:44` excludes buttons from the generic OSD\n // surface precisely so this can define what `.osd` means for one:\n // `_buttons.scss:111-135` gives it a dark translucent background whose hover\n // and active states mix TOWARDS the foreground rather than changing alpha, so\n // it stays readable over any content. It composes with `.circular` / `.pill`.\n &.osd {\n min-height: 32px;\n min-width: 32px;\n color: rgb(255 255 255 / 90%);\n background-color: rgb(0 0 0 / 65%);\n\n @media (prefers-contrast: more) {\n box-shadow: 0 0 0 1px currentColor;\n }\n\n &:hover {\n color: #ffffff;\n background-color: color-mix(in srgb, black calc(0.85 * 65%), currentColor calc(0.15 * 65%));\n }\n\n &:active {\n color: #ffffff;\n background-color: color-mix(in srgb, black calc(0.75 * 65%), currentColor calc(0.25 * 65%));\n }\n }\n\n // Checked — `<gtk-toggle-button>`'s pressed state, libadwaita's `:checked`\n // (_buttons.scss:44-56, 136-140, 169-177, 199-210). Last in the block so it outranks the\n // hover/active/`.raised` rules of equal specificity above, which is also why the flat,\n // suggested and destructive variants restate their own checked colours: upstream\n // resolves them by the same source order.\n &.checked {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 35%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n }\n\n &.flat.checked {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n\n &.suggested-action.checked {\n background-color: var(--accent-bg-color);\n }\n\n &.destructive-action.checked {\n background-color: color-mix(in srgb, currentColor 35%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 45%, transparent);\n }\n }\n}\n\n// The symbolic icon (`.adw-icon`) used to be declared here, because the first\n// widget that needed one was the button. It is `scss/_icon.scss` now — every\n// other widget needs one too, and `<gtk-image>` is an element.\n\n// The linked group is `scss/_style_classes.scss` now, under libadwaita's own\n// `.linked` name (with `.adw-linked` kept as an alias): the documented class is\n// what a consumer reading style-classes.md reaches for, and it applies to\n// entries and drop-downs too, not only to buttons.\n","// _link.scss — `link` and `button.link`, libadwaita's link treatment.\n//\n// UNSCOPED, because upstream's rule is on the node and the class together\n// (`_links.scss:1-2`) and both spellings have a reader: a `Gtk.Label` that is a link is\n// the `link` node, and a `Gtk.LinkButton` is `button.link`. `<gtk-link-button>` renders an\n// inner `<button class=\"adw-button link\">`, so the class is what the selector needs.\n//\n// THE TWO COLOURS ARE THE PALETTE'S, not new tokens: `$link_color: var(--accent-color)`\n// and `$link_visited_color: color-mix(in srgb, var(--accent-color) 80%, var(--view-fg-color))`\n// (`_colors.scss:265-266`) are Sass variables over tokens this package already has, so a\n// consumer overriding `--accent-color` recolours its links with everything else.\n//\n// THE `:visited` CLAUSE IS PORTED AS A CLASS. Upstream styles GTK's `:visited` state\n// (`:7-9`), which is a state FLAG on the widget (`GTK_STATE_FLAG_VISITED`,\n// gtklinkbutton.c:743) rather than anything a selector can name from outside.\n// `gtk_link_button_set_visited()` flips exactly that flag and no CSS class, so\n// `<gtk-link-button>` writes `.visited` on the inner button and the rule below reads it.\n// `:disabled` needs no such translation: a disabled `<button>` is already the UA's.\n//\n// `font-weight: inherit` and the transparent background in EVERY state (`:38-44`) are\n// upstream's point: a link is a link, not a button that happens to be blue, so the\n// hover/active/checked rules must not paint over it.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_links.scss:1-49\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:265-266\n// Reference: refs/gtk/gtk/gtklinkbutton.c:380 (the `.link` style class), :646-672 (the\n// URI tooltip), :742-749 (the VISITED state flag)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — `:visited` becomes `.visited`, because\n// a state flag has no CSS spelling a selector can match on.\n\n$link-color: var(--accent-color);\n$link-visited-color: color-mix(in srgb, var(--accent-color) 80%, var(--view-fg-color));\n$osd-link-color: color-mix(in srgb, var(--accent-bg-color) 50%, white);\n\n.link,\n.adw-button.link {\n color: $link-color;\n text-decoration: underline;\n font-weight: inherit;\n\n &:hover {\n color: hsl(from $link-color h calc(s * 1.1) calc(l * 1.1));\n }\n\n &:active {\n color: $link-color;\n }\n\n &:disabled {\n color: color-mix(in srgb, currentColor var(--disabled-opacity), transparent);\n }\n\n &.visited {\n color: $link-visited-color;\n }\n\n // `.osd &` — a link over content, where the accent is too dark to read.\n .osd & {\n color: $osd-link-color;\n\n &:visited,\n &.visited {\n color: color-mix(in srgb, $osd-link-color 60%, currentColor);\n }\n\n &:active {\n color: $osd-link-color;\n }\n }\n\n // Every state transparent: upstream gives `button.link` no background at rest, on\n // hover, on active or when checked (_links.scss:38-44), so a toggle-button-styled link\n // cannot paint one.\n &,\n &:hover,\n &:active,\n &:checked,\n &.checked {\n background-color: transparent;\n }\n}","// _scale_button.scss — `<gtk-scale-button>`: the icon button, its `.scale-popup` dock and\n// the range inside it.\n//\n// The node is `scalebutton.scale` holding `button.toggle`\n// (gtkscalebutton.c:87-97), and the DOCK is a `GtkPopover` with the `scale-popup` style\n// class holding a box of [minus, scale, plus] with 4px margins and 4px spacing\n// (gtk/ui/gtkscalebutton.ui) — all three of those numbers restated here, because the box is the\n// dock's whole layout and GTK sizes the scale to `SCALE_SIZE` (100px) along its axis.\n//\n// The RANGE ITSELF is libadwaita's `scale` node (_scale.scss:19-251): the 12px padding,\n// the 99px trough, the accent-coloured `highlight`, the 20px round slider with a `-8px`\n// negative margin and a two-part shadow. An `<input type=\"range\">` is the element the\n// NativeScript port already substitutes for `GtkScale`, and the trough/highlight/slider\n// are drawn with `appearance: none` and the same numbers. The vertical case is the\n// `writing-mode` + `direction` pair that makes a range grow UPWARD, which is\n// `gtk_range_set_inverted (scale, TRUE)` for the vertical orientation (:883) — and\n// `scale-button-box` reverses its column for the same reason `apply_orientation`\n// reorders the children (:869-889).\n//\n// Reference: refs/gtk/gtk/gtkscalebutton.c:87-97 (the node), :869-889 (the orientation),\n// :1099-1100 (the steppers' sensitivity)\n// Reference: refs/gtk/gtk/ui/gtkscalebutton.ui:13-25 (the dock, its box, its margins)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scale.scss:1-60 (trough, highlight, slider)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — the scale is `<input type=\"range\">`\n// rather than a `scale` node, and the slider is drawn with `appearance: none`.\n\n/** `SCALE_SIZE` (gtkscalebutton.c:88) — the scale's size request along its own axis. */\n$scale-size: 100px;\n\n// libadwaita's own values (`_colors.scss:280-288`), which are Sass variables over tokens\n// this package already has rather than new ones: a trough is 15% of the current text\n// colour and a slider is 80% white over the view background.\n$trough-color: color-mix(in srgb, currentColor 15%, transparent);\n$trough-hover-color: color-mix(in srgb, currentColor 20%, transparent);\n$slider-color: color-mix(in srgb, white 80%, var(--view-bg-color));\n$slider-border-color: rgb(0 0 6 / 10%);\n\ngtk-scale-button {\n display: inline-flex;\n position: relative;\n}\n\n.scale-button-icon {\n min-width: 34px;\n}\n\n// The dock's own box: 4px of margin on all four sides, 4px between the three children.\n.scale-button-box {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 4px;\n margin: 4px;\n\n // `apply_orientation` moves plus ABOVE minus when the scale is vertical\n // (gtkscalebutton.c:876-878). Reversing the column is the same arrangement without\n // moving nodes, which would take focus off a stepper mid-click.\n .vertical & {\n flex-direction: column-reverse;\n }\n}\n\n.scale-button-step {\n min-width: 24px;\n min-height: 24px;\n padding: 2px;\n}\n\n.scale-button-range {\n appearance: none;\n background: none;\n margin: 0;\n padding: 12px;\n min-width: 10px;\n min-height: 10px;\n flex: 1;\n cursor: pointer;\n\n // libadwaita sizes the SLIDER at 20px and pulls it 8px back out of the trough\n // (_scale.scss:49-58) — the negative margin is upstream's, not decoration.\n &::-webkit-slider-runnable-track {\n height: 4px;\n border-radius: 99px;\n background-color: $trough-color;\n transition: background-color 0.2s ease;\n }\n\n &::-webkit-slider-thumb {\n appearance: none;\n width: 20px;\n height: 20px;\n margin: -8px;\n border: none;\n border-radius: 100%;\n background-color: $slider-color;\n box-shadow: 0 0 0 1px $slider-border-color, 0 2px 4px rgb(0 0 6 / 20%);\n }\n\n &::-moz-range-track {\n height: 4px;\n border-radius: 99px;\n background-color: $trough-color;\n transition: background-color 0.2s ease;\n }\n\n &::-moz-range-progress {\n height: 4px;\n border-radius: 99px;\n background-color: var(--accent-bg-color);\n }\n\n &::-moz-range-thumb {\n width: 20px;\n height: 20px;\n border: none;\n border-radius: 100%;\n background-color: $slider-color;\n box-shadow: 0 0 0 1px $slider-border-color, 0 2px 4px rgb(0 0 6 / 20%);\n }\n\n &:hover::-webkit-slider-runnable-track,\n &:active::-webkit-slider-runnable-track {\n background-color: $trough-hover-color;\n }\n\n &:hover::-moz-range-track,\n &:active::-moz-range-track {\n background-color: $trough-hover-color;\n }\n\n &:disabled {\n filter: opacity(var(--disabled-opacity));\n }\n\n // A VERTICAL scale: `writing-mode` gives the axis and `direction: rtl` makes the value\n // grow upward, which is `gtk_range_set_inverted (scale, TRUE)` for the vertical\n // orientation (gtkscalebutton.c:883) and the only reason a media volume button fills\n // from the bottom.\n .vertical & {\n writing-mode: vertical-lr;\n direction: rtl;\n width: 24px;\n height: $scale-size;\n flex: none;\n\n &::-webkit-slider-runnable-track {\n width: 4px;\n height: $scale-size;\n }\n\n &::-webkit-slider-thumb {\n margin: -8px;\n }\n\n &::-moz-range-track {\n width: 4px;\n height: $scale-size;\n }\n }\n\n .horizontal & {\n height: 24px;\n width: $scale-size;\n flex: none;\n }\n}","// _color_button.scss — `<gtk-color-dialog-button>`: the `button.color` node and the\n// swatch it holds.\n//\n// THE SWATCH IS NOT LIBADWAITA'S, and saying so is the point of this partial. GTK paints\n// the `GtkColorSwatch` from GTK's OWN theme — libadwaita's `_color-chooser.scss` styles the\n// `colorchooser` popover, and `grep` finds no rule for the swatch or for `colorbutton` at\n// all. So what upstream does have is this:\n//\n// · the node `colorbutton > button.color` and the `.color` style class\n// (gtkcolordialogbutton.c:63-70, :163) — which is what puts the button in the\n// `.linked` group and makes it square;\n//\n// and what this partial adds is the geometry `gtk_color_dialog_button_init` asks for: a\n// swatch as wide as the word \"Black\" rendered at the base size and as tall as its line\n// (:139-148). 24x18 is that box at the base font size, so the button around it is the\n// usual 34px-tall button.\n//\n// THE TRANSLUCENT CLAUSE IS GTK's own drawing, keyed off the element's `data-translucent`:\n// `GtkColorSwatch` draws a checkerboard under a colour with alpha, and `rgba_to_gdk_rgba`\n// is how it decides. A browser has no such thing, and a translucent colour on a plain\n// background is unreadable without one.\n//\n// Reference: refs/gtk/gtk/gtkcolordialogbutton.c:63-70 (the node), :139-163 (the swatch,\n// the `.color` class), :329-347 (the accessible name's rounding)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_linked.scss:6 (`colorbutton > button`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — the swatch is a `<span>` painted with\n// `background-color`, and its checkerboard is this package's drawing of GtkColorSwatch.\n\ngtk-color-dialog-button {\n display: inline-flex;\n}\n\n.color-button-swatch {\n display: block;\n width: 24px;\n height: 18px;\n border-radius: 4px;\n box-shadow: 0 0 0 1px var(--shade-color);\n // The checkerboard, only while the colour is translucent — the element writes\n // `data-translucent` from `rgba[3] < 1`, which is GtkColorSwatch's own test.\n &[data-translucent='true'] {\n background-image:\n linear-gradient(45deg, rgb(0 0 6 / 12%) 25%, transparent 25%),\n linear-gradient(-45deg, rgb(0 0 6 / 12%) 25%, transparent 25%),\n linear-gradient(45deg, transparent 75%, rgb(0 0 6 / 12%) 75%),\n linear-gradient(-45deg, transparent 75%, rgb(0 0 6 / 12%) 75%);\n background-position:\n 0 0,\n 0 4px,\n 4px -4px,\n -4px 0;\n background-size: 8px 8px;\n }\n}\n\n// The chooser itself: visually nothing, and reachable only from the button's click, which\n// is why it is `aria-hidden` and out of the tab order rather than merely transparent.\n.color-button-input {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n border: none;\n opacity: 0;\n pointer-events: none;\n}","// _font_button.scss — `<gtk-font-dialog-button>`: the `button.font` node and the two\n// labels it holds.\n//\n// libadwaita has no rule for it either: `_linked.scss:7` is the only place upstream names\n// `fontbutton`, and it is there because the node is a button that participates in a linked\n// group. So this partial is the node's layout and nothing else — and the node's layout IS\n// the C's, which builds a horizontal box of the family label (hexpand, so it takes the\n// room) and the size box, the latter a vertical separator followed by the size label\n// (gtkfontdialogbutton.c:121-140).\n//\n// The element hides the size box itself when the level is below FONT, because\n// `update_font_info` ends with `gtk_widget_set_visible (self->font_size_box, self->level >=\n// GTK_FONT_LEVEL_FONT)` (:685) — a family chooser shows one word where a font chooser shows\n// two, and the separator with it.\n//\n// Reference: refs/gtk/gtk/gtkfontdialogbutton.c:52-60 (the node), :118-152 (init, the box,\n// the labels), :649-687 (update_font_info, and the size box's visibility)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_linked.scss:7 (`fontbutton > button`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web — the labels are `<span>`s inside an\n// ordinary `<button>`, and `use-font` sets their inline `font` (apply_use_font).\n\ngtk-font-dialog-button {\n display: inline-flex;\n position: relative;\n}\n\n.font-button-label {\n flex: 1;\n text-align: start;\n}\n\n// The size box: a separator and the size, in a row of their own — which is why the element\n// wraps them in a span rather than appending both to the button.\n.font-button-size {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n margin-inline-start: 6px;\n color: color-mix(in srgb, currentColor var(--dim-opacity), transparent);\n}\n\n.font-button-size-label {\n min-width: 2ch;\n font-variant-numeric: tabular-nums;\n}\n\n// The chooser: one row of families. A popover rather than a `<select>` on the button\n// itself, because `gtk_font_dialog_button_new()` is given a dialog and shows nothing until\n// it is pressed.\n.font-button-popover {\n .font-button-chooser {\n min-width: 180px;\n max-width: 320px;\n padding: 4px;\n border: none;\n border-radius: 6px;\n background-color: var(--popover-bg-color);\n color: var(--popover-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n }\n}","// _button_content.scss — adw-button-content styling (icon + label box used as a\n// button child). Mirrors libadwaita's `buttoncontent > box > {image, label}`\n// node: a horizontal box with 6px spacing between icon and label and a bold\n// label, plus optional ellipsizing when `.can-shrink` is set.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss (buttoncontent)\n// Reference: refs/libadwaita/src/adw-button-content.c (AdwButtonContent)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The class <adw-button-content> stamps on the button hosting it\n// (adw-button-content.c:115), removed again on unroot (:126).\n//\n// libadwaita: `button.image-text-button { padding-left: 9px; padding-right: 9px }`\n// (_buttons.scss:77-80) — against the 17px a plain `.text-button` gets (:72-75).\n// This rule lived in NEITHER renderer, so every icon+label button was drawn with\n// the wrong horizontal padding.\n//\n// Only the PADDING half of that block applies here. The same selector also\n// declares `> box, > box > box { border-spacing: 4px }` (:82-84), and neither\n// matches: the node tree is `button > buttoncontent > box` (:47-52), so the\n// button's direct child is the `buttoncontent`, not a box. The icon↔label gap\n// stays the 6px `buttoncontent > box` gives it (:626-628), which is the `gap`\n// below. It lives in this file rather than in `_button.scss` because the class\n// belongs to this widget, and `.adw-button.image-text-button` beats `.adw-button`\n// on specificity regardless of order.\n//\n// `:not(.pill)` because upstream states `.pill` (:322-323) AFTER this block at the same\n// specificity, so a pill keeps its `10px 32px` whatever it holds. This file is emitted\n// after `_button.scss`, so without the exclusion the order flipped: a pill button with\n// button content was drawn 9px from its label, 47px narrower than GTK.\n.adw-button.image-text-button:not(.pill) {\n padding-left: 9px;\n padding-right: 9px;\n}\n\n// Inside a split button the class sits on the `splitbutton` node instead, and a\n// DIFFERENT block wins: `splitbutton.image-text-button > button` (:499-502).\n.adw-split-button.image-text-button > .adw-split-button-action {\n padding-left: 9px;\n padding-right: 9px;\n}\n\nadw-button-content {\n display: inline-flex;\n align-items: center;\n // Centered as a group, matching the box's halign:center in AdwButtonContent.\n justify-content: center;\n min-width: 0;\n\n // The inner box holds the image + label nodes (border-spacing 6px upstream).\n .adw-button-content-box {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n min-width: 0;\n }\n\n .adw-button-content-label {\n // libadwaita: `buttoncontent > box > label { font-weight: bold; }` with a\n // 2px trailing pad (LTR) so the label does not hug the button edge.\n font-weight: 700;\n line-height: 1;\n padding-right: 2px;\n }\n\n // can-shrink — the label ellipsizes instead of forcing the button wider\n // (Gtk.Label PANGO_ELLIPSIZE_END). The icon keeps its natural size.\n &.can-shrink {\n .adw-button-content-box {\n min-width: 0;\n }\n\n .adw-button-content-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 0;\n }\n }\n}\n","// _popover.scss — <gtk-popover>, the one popover surface in this package.\n//\n// It replaces three hand-rolled copies (`.adw-menu-button-popover`,\n// `.adw-drop-down-popover`, `.adw-split-button-menu`) that disagreed with\n// libadwaita AND with each other: 12px / 12px / 9px radius against libadwaita's\n// 15px, two correct three-layer shadows and one invented two-layer one. Nothing\n// compared any of them to the vendored stylesheet, so all three shipped.\n//\n// GROUND TRUTH, AND THE SELECTOR THAT WINS THE CASCADE\n//\n// `popover > contents` is `padding: 8px; border-radius: $popover_radius` plus a\n// three-layer shadow (_popovers.scss:13-21), with a `prefers-contrast: more`\n// variant that swaps the innermost layer for a hairline border (:23-27).\n// `$popover_radius` is `$menu_radius + 6` = 15px (_common.scss:10,13) — not\n// `$card_radius` (12px) and not `$button_radius` (9px), the two tokens the\n// copies reached for.\n//\n// The PADDING has a second, more specific rule: `popover.menu > contents`\n// re-declares `padding: 0` and moves the inset onto the item box as\n// `$menu_margin` (6px) at _menus.scss:58-66. Two element selectors plus a class\n// beats one element selector plus a child, so a MENU popover renders a 6px inset\n// and a plain one an 8px inset. The three copies all used 6px — they were right\n// about the inset for the menus they drew, and wrong only about the radius.\n//\n// We reproduce the menu inset with ONE node instead of GTK's contents+box pair:\n// `[menu]` puts the 6px directly on the surface. Same rendered geometry, and\n// there is no separate box element to hang it on in the DOM.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_popovers.scss:7-28\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss:58-66, :134-156\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:10-13 ($menu_radius, $menu_margin, $popover_radius)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for the @gjsify/adwaita-web light-DOM custom elements.\n\n// Distance between the anchor and the surface. GTK gets this gap from the\n// popover's arrow, which this port does not draw (`has-arrow` is not modelled —\n// GtkPopover's C is not vendored here). 6px is what the menu button and the\n// drop-down already used; the split button's 4px was the odd one out.\n$popover-gap: 6px;\n\ngtk-popover {\n // $popover_radius = $menu_radius + 6 (_common.scss:10,13). Exposed as a token\n // so consumers re-theme it the same way as the rest (ADR 0010), with the\n // libadwaita value as the fallback.\n --popover-radius: 15px;\n\n position: absolute;\n z-index: 10;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n min-width: 120px; // popover.menu > contents (_menus.scss:2-4)\n padding: 8px; // popover > contents (_popovers.scss:14)\n border-radius: var(--popover-radius);\n background-color: var(--popover-bg-color, var(--window-bg-color, #fff));\n color: var(--popover-fg-color, var(--window-fg-color));\n\n // The exact three layers of _popovers.scss:18-20. The COUNT is load-bearing:\n // the split button shipped two.\n box-shadow:\n 0 0 0 1px rgba(0, 0, 0, 0.05),\n 0 1px 5px 1px rgba(0, 0, 0, 0.09),\n 0 2px 14px 3px rgba(0, 0, 0, 0.05);\n\n // _popovers.scss:23-27 — the innermost layer becomes a real hairline so the\n // surface has a visible edge when the shadow alone is not enough. Missing\n // from all three copies.\n @media (prefers-contrast: more) {\n box-shadow:\n 0 0 0 1px var(--separator-color),\n 0 1px 5px 1px rgba(0, 0, 0, 0.09),\n 0 2px 14px 3px rgba(0, 0, 0, 0.05);\n }\n\n // `popover.menu > contents { padding: 0 }` + `$menu_margin` on the item box\n // (_menus.scss:58-66), flattened onto the single surface node.\n //\n // `[menu]` is the attribute the element sets; `.menu` is the name libadwaita\n // DOCUMENTS for the same thing (style-classes.md \"Menu Popovers\"). Both are\n // accepted, because a consumer following the upstream documentation reaches\n // for the class and would otherwise get an 8px inset and no explanation.\n &[menu],\n &.menu {\n padding: 6px;\n }\n\n // --- Placement. Pure CSS, as it always was: nothing measures a rect and\n // --- nothing flips on overflow, in either the element or the core.\n &[data-position='bottom'] {\n top: calc(100% + #{$popover-gap});\n }\n\n &[data-position='top'] {\n bottom: calc(100% + #{$popover-gap});\n }\n\n &[data-position='start'] {\n top: 0;\n right: calc(100% + #{$popover-gap});\n }\n\n &[data-position='end'] {\n top: 0;\n left: calc(100% + #{$popover-gap});\n }\n\n // `align` picks the edge the surface lines up with, and only applies on the\n // vertical axis — a start/end popover is already pinned horizontally.\n &[data-position='bottom'],\n &[data-position='top'] {\n &[data-align='start'] {\n left: 0;\n }\n\n &[data-align='end'] {\n right: 0;\n }\n }\n}\n\n// A popover row — libadwaita's `modelbutton` (_menus.scss:134-156).\n.adw-popover-item {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n width: 100%;\n min-height: 32px; // :135\n min-width: 40px; // :136\n margin: 0;\n // `padding: 0 $menu_padding` (:137) — $menu_padding is 12px (_common.scss:12),\n // and the vertical inset comes from min-height, not from padding. No 12px\n // spacing token exists in this port, so the value is literal like the radius.\n padding: 0 12px;\n border: none;\n border-radius: 9px; // $menu_radius (:138) — NOT calc(--button-radius - 2px), which two copies invented\n background-color: transparent; // :139\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n // `&:hover, &:selected { background-color: $selected_color }` (:141-144).\n // `:selected` is GTK's keyboard-highlight pseudo-class; in the DOM that state\n // is focus, so `.selected` (the drop-down's chosen row) and `:focus` share it.\n &:hover,\n &:focus,\n &.selected {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color); // $selected_active_color (:146-148)\n }\n\n // :150-156 — a contrast-mode ring on the same three states.\n @media (prefers-contrast: more) {\n &:hover,\n &:focus,\n &.selected,\n &:active {\n box-shadow: inset 0 0 0 1px var(--separator-color);\n }\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n &[disabled] {\n opacity: var(--disabled-opacity);\n pointer-events: none;\n }\n}\n\n// Optional heading atop a menu. libadwaita's `label.title` is `font-weight: bold`\n// + `padding: 4px ($menu_padding + 20px)` (_menus.scss:180-183) — 32px of\n// horizontal padding to centre the title over icon-indented rows, which\n// libadwaita's own comment calls out as fragile. This port keeps the tighter\n// inset `.adw-menu-button-title` already shipped rather than changing how the\n// existing menus look; only the class name moved here. A DELIBERATE deviation,\n// not a reading of :180-183.\n.adw-popover-title {\n padding: 4px var(--spacing-s) 6px;\n font-weight: 700;\n opacity: var(--dim-opacity);\n}\n\n// --- The menu INSIDE the popover (ADR 0042) -----------------------------------\n//\n// One rule set for both menu-bearing elements, because the split button's dropdown\n// half IS a GtkMenuButton and its popup is the same `popover.menu`. SIX nodes, none of\n// which has a counterpart in the port's previous menus — they drew a flat list of labels\n// and nothing else: the separator, the section title, the accelerator, the check/radio\n// mark (plus the two nested `[aria-checked='true']` rules that draw it), the submenu\n// chevron and the back row.\n\n// `popover.menu separator { margin: 6px 0 }` (_menus.scss:68-70). GTK's separator is\n// a real widget with its own background; in the DOM the hairline is the border, so\n// the 6px is split above and below it rather than being a margin on a 1px box.\n.adw-popover-separator {\n height: 1px;\n margin: 6px 0;\n background-color: var(--separator-color, rgba(0, 0, 0, 0.15));\n}\n\n// A section's heading. `.adw-popover-title` already carries the weight and the dim;\n// this is the tighter top inset a heading needs when it follows a separator rather\n// than opening the menu.\n.adw-popover-section-title {\n padding-top: 2px;\n}\n\n// `popover.menu accelerator { color: dim; margin-left: $menu_padding }`\n// (_menus.scss:78-82). `margin-inline-start` rather than `margin-left`, so it follows\n// the writing direction the way GTK's `:dir(ltr)`/`:dir(rtl)` pair does — the two\n// rules are one logical property here.\n.adw-popover-item-accel {\n margin-inline-start: auto;\n padding-inline-start: 12px;\n opacity: var(--dim-opacity);\n font-size: 0.9em;\n}\n\n// `popover.menu check, radio { min-width: 14px; min-height: 14px; padding: 2px }`\n// (_menus.scss:85-90). The slot is reserved whether or not the row is checked, so the\n// labels of a group line up — the reason it is a node and not a `::before`.\n//\n// A DELIBERATE SUBSTITUTION, the same kind `<adw-split-button>`'s pan-up arrow already\n// documents: GTK draws the tick with `object-select-symbolic`, and this port's icon set\n// ships no checkmark (`_icons.generated.scss` has 42 glyphs and none of them is one). A\n// two-sided rotated border is the tick, so nothing here depends on an asset that would\n// silently render as `image-missing`.\n.adw-popover-item-check {\n position: relative;\n box-sizing: border-box;\n flex: none;\n width: 14px;\n height: 14px;\n padding: 2px;\n\n // Drawn off `aria-checked`, never off a class of its own: the accessible state and\n // the visible state are then the same fact rather than two that can disagree.\n [aria-checked='true'] > &::after {\n content: '';\n position: absolute;\n inset-inline-start: 4px;\n top: 1px;\n width: 4px;\n height: 8px;\n border: solid currentcolor;\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n }\n\n // A radio's mark is a filled dot, so the tick becomes a disc.\n &.radio {\n border-radius: 9999px;\n }\n\n [aria-checked='true'] > &.radio::after {\n inset-inline-start: 4px;\n top: 4px;\n width: 6px;\n height: 6px;\n border: none;\n border-radius: 9999px;\n background-color: currentcolor;\n transform: none;\n }\n}\n\n// The chevron on a row that opens a submenu.\n.adw-popover-item-arrow {\n margin-inline-start: auto;\n width: 16px;\n height: 16px;\n flex: none;\n opacity: var(--dim-opacity);\n}\n\n// The row that leaves a submenu. It carries the parent's own label, so it reads as\n// the heading of the page it returns to rather than as a bare \"Back\".\n.adw-popover-back {\n font-weight: 700;\n}\n","// _popover_menu_bar.scss — <gtk-popover-menu-bar>: a horizontal bar of items that pop up\n// a menu when clicked.\n//\n// libadwaita styles `menubar` in ONE place — the tail of `_menus.scss:244-269`, beside the\n// `popover.menu` rules rather than in a file of its own — so this partial holds that block\n// and nothing else. The values are libadwaita's:\n//\n// menubar box-shadow: inset 0 -1px $border_color; padding-bottom: 1px;\n// menubar > item min-height: 16px; padding: 4px 8px;\n// border-radius: $button_radius (9px, `_common.scss:8`);\n// menubar > item:selected background-color: $selected_color, plus the\n// `prefers-contrast: more` inset hairline.\n//\n// `:selected` is GTK's keyboard-highlight pseudo-class, which has no DOM counterpart: it is\n// the SELECTED item (`set_active_item` sets and unsets `GTK_STATE_FLAG_SELECTED`,\n// gtkpopovermenubar.c:145-152), and this package spells it `.selected` for the same reason\n// `.checked` stands in for `:checked` elsewhere. The hover and focus states are this\n// element's own addition, not libadwaita's: the upstream rule keys only on `:selected`\n// (with the comment \"seems like it :hover even with keyboard focus\"), and a DOM item takes\n// real focus where a GTK item is merely highlighted, so without them a keyboard reader would\n// see nothing move at all.\n//\n// NOTHING ELSE IS HERE, and the omissions are load-bearing. Each item's popover is a\n// `<gtk-popover-menu>`, so its surface, its 15px radius and its item rows are\n// `_popover.scss`'s — which is the point of this partial being small. The NESTED SUBMENU\n// rules libadwaita adds under `> item` (`popover.menu popover.menu` drops its top radius,\n// _menus.scss:257-263) are NOT ported: they exist to flatten the seam where two popovers\n// OVERLAP, and this port's surfaces never do — placement is the `position`/`align` pair\n// with a 6px gap, so there is no seam to flatten.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss:244-269 (`menubar`)\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:8 ($button_radius)\n// Reference: refs/gtk/gtk/gtkpopovermenubar.c:38-51 (the node tree and `.active`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+\n// Modifications: Adapted for the @gjsify/adwaita-web light-DOM custom elements —\n// `menubar > item` becomes `.adw-popover-menu-bar-item`, whose BUTTON is the `item`, and\n// `:selected` becomes `.selected`.\n\n.adw-popover-menu-bar {\n display: flex;\n align-items: center;\n box-sizing: border-box;\n box-shadow: inset 0 -1px var(--separator-color, rgba(0, 0, 0, 0.15));\n padding-bottom: 1px;\n\n // The wrapper carries GTK's `item` NODE, which is the positioning context the popover\n // hangs off — `<gtk-popover>` places itself against `parentElement`, and this is it.\n .adw-popover-menu-bar-item {\n position: relative;\n display: flex;\n align-items: center;\n }\n\n .adw-popover-menu-bar-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n min-height: 16px;\n padding: 4px 8px;\n margin: 0;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n // The two states libadwaita and the DOM each contribute: `.selected` for GTK's\n // `:selected`, `:hover`/`:focus` because a DOM item takes focus where a GTK item is\n // merely highlighted.\n &.selected,\n &:hover,\n &:focus {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n @media (prefers-contrast: more) {\n &.selected,\n &:hover,\n &:focus,\n &:active {\n box-shadow: inset 0 0 0 1px var(--separator-color);\n }\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n\n // `.active` is the item whose POPOVER IS OPEN, not the selected one\n // (gtkpopovermenubar.c:50-51), so hovering the bar selects without lighting anything and\n // the bar looks lit exactly while its menu is up.\n .adw-popover-menu-bar-item.active > .adw-popover-menu-bar-button {\n background-color: var(--button-active-color);\n }\n}","// _popover_bin.scss — <gtk-popover-bin>: the container around a widget that owns a popover.\n//\n// libadwaita has NO `popoverbin` rule — the node is new in GTK 4.22\n// (`gtk_widget_class_set_css_name (widget_class, \"popoverbin\")`, gtkpopoverbin.c:382) and\n// libadwaita 1.10 never styles it. So this partial is small on purpose, and the claim it\n// makes is exactly what GTK does with the class GTK ITSELF puts on the child:\n//\n// `on_popover_map` / `on_popover_unmap` (gtkpopoverbin.c:117-126) add and remove\n// `.has-open-popup` on the bin's CHILD, and libadwaita's `_lists.scss:57` comments that\n// class as \"indicathing which row generated a popover\" — a list row and a sidebar row\n// (`:132`) both keep their selected tint while their popup is up.\n//\n// The rules below are therefore the two libadwaita ALREADY ships, restated against this\n// package's tokens, because this package spells a row as a custom element rather than as\n// GTK's `row` node. Both values are libadwaita's own:\n//\n// row.activatable.has-open-popup background-color: $view_hover_color;\n// row.activatable:selected.has-open-popup $view_selected_hover_color;\n//\n// A bin whose child is a `<gtk-list-box-row>` or a `<gtk-button>` therefore stays highlighted\n// while its menu is open, which is the whole reason the class exists and the reason this\n// element toggles it rather than merely mirroring GTK's signal wiring.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:57, :64 (`row.has-open-popup`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss:132 (the sidebar row)\n// Reference: refs/gtk/gtk/gtkpopoverbin.c:117-126 (`.has-open-popup` on the child)\n// Copyright (c) GNOME contributors (GTK, libadwaita). LGPLv2.1+\n// Modifications: Adapted for the @gjsify/adwaita-web light-DOM custom elements.\n\n// The bin itself draws nothing: it is a bin layout holding one child and the popover, and\n// `gtk_popover_bin_compute_expand` (gtkpopoverbin.c:289-306) simply forwards the child's\n// expand to the bin. A `display: inline-flex` here would be an invented box, and the one\n// thing it must not do is take the popover out of flow — `_popover.scss` already positions\n// it absolutely against this element.\n.adw-popover-bin {\n position: relative;\n}\n\n// `row.activatable.has-open-popup { background-color: $view_hover_color }`\n// (_lists.scss:57). `view-hover-color` is the token `_lists.scss` uses for an activatable\n// row under the pointer, which is the closest thing this package has to a row that is\n// \"activated\" by a popup it did not ask for.\n.adw-popover-bin > .has-open-popup {\n background-color: var(--view-hover-color, var(--button-hover-color));\n}\n\n// `_lists.scss:64` — the same, for a row that is ALSO selected: libadwaita darkens to\n// `$view_selected_hover_color` rather than repeating the plain hover colour, which is what\n// keeps a selected row readable while its popup covers the list.\n.adw-popover-bin > .has-open-popup[aria-selected='true'],\n.adw-popover-bin > .has-open-popup.selected {\n background-color: var(--view-selected-hover-color, var(--button-hover-color));\n}","// _split_button.scss — adw-split-button styling: a primary action button fused\n// with a dropdown that opens a menu of related actions, split by a thin divider.\n// The suggested/destructive/flat style classes recolor the whole control like\n// the matching Adwaita button variants.\n// Reference: refs/libadwaita/src/adw-split-button.c (splitbutton CSS node)\n// Reference: refs/adwaita-web/adwaita-web/scss/_split_button.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n.adw-split-button {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: stretch;\n vertical-align: middle;\n min-height: 34px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n user-select: none;\n -webkit-user-select: none;\n\n &:focus-within {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // Primary action half — fills the available width, rounded on the leading\n // side only so it meets the dropdown flush.\n .adw-split-button-action {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n flex-grow: 1;\n min-height: 34px;\n margin: 0;\n padding: 4px 14px;\n border: none;\n border-radius: var(--button-radius) 0 0 var(--button-radius);\n background-color: transparent;\n color: inherit;\n font: inherit;\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n }\n\n // Icon-only action half — square, no horizontal text padding.\n &.icon-only {\n padding: 0;\n width: 34px;\n flex-grow: 0;\n }\n }\n\n // Thin divider between the two halves (the splitbutton `separator` node).\n .adw-split-button-dropdown {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-height: 34px;\n // libadwaita: `splitbutton > menubutton > button { padding: 0 4px }` over the button's\n // 16px minimum (_buttons.scss:486-489), so the arrow half is 24px. It was 28, and the\n // gallery's split button measured 5px wider than GTK's render of the same `.blp`.\n width: 24px;\n margin: 0;\n padding: 0 4px;\n border: none;\n border-left: 1px solid var(--separator-color);\n border-radius: 0 var(--button-radius) var(--button-radius) 0;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n .adw-icon {\n width: 14px;\n height: 14px;\n mask-size: 14px;\n -webkit-mask-size: 14px;\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n }\n }\n\n // The dropdown menu is `<gtk-popover>` (`_popover.scss`), and this was the\n // WORST of the three hand-rolled surfaces: `--button-radius` (9px) where\n // libadwaita's popover is 15px, under a two-layer shadow that exists nowhere\n // in the vendored stylesheet (`popover > contents` has three,\n // _popovers.scss:18-20), and a `calc(var(--button-radius) - 2px)` (7px) row\n // where `modelbutton` is 9px. Nothing element-specific was left to keep.\n\n // --- Suggested action — accent-coloured whole control ---\n &.suggested-action {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n\n .adw-split-button-dropdown {\n border-left-color: rgba(255, 255, 255, 0.3);\n }\n\n .adw-split-button-action:hover,\n .adw-split-button-dropdown:hover {\n background-color: var(--accent-color);\n }\n\n .adw-split-button-action:active,\n .adw-split-button-dropdown:active {\n background-color: var(--accent-color);\n filter: brightness(0.92);\n }\n }\n\n // --- Destructive action — red whole control ---\n &.destructive-action {\n background-color: var(--destructive-bg-color);\n color: var(--destructive-fg-color);\n\n .adw-split-button-dropdown {\n border-left-color: rgba(255, 255, 255, 0.3);\n }\n\n .adw-split-button-action:hover,\n .adw-split-button-dropdown:hover {\n filter: brightness(1.06);\n }\n\n .adw-split-button-action:active,\n .adw-split-button-dropdown:active {\n filter: brightness(0.9);\n }\n }\n\n // --- Flat — no resting background; only reacts on hover/active ---\n &.flat {\n background-color: transparent;\n }\n\n // --- Disabled ---\n &.disabled {\n opacity: 0.45;\n cursor: default;\n\n .adw-split-button-action,\n .adw-split-button-dropdown {\n cursor: default;\n pointer-events: none;\n }\n }\n}\n","// _menu_button.scss — gtk-menu-button styling: a flat (or circular) icon button\n// that drops an Adwaita-styled popover menu (the web counterpart of\n// Adw.MenuButton / Gtk.MenuButton). The button mirrors libadwaita's flat/circular\n// `menubutton > button`; the popover reproduces `popover.menu > contents` with\n// its soft triple-shadow surface and `modelbutton`-style item rows.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss (menubutton flat/circular)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_popovers.scss (popover > contents)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss (popover.menu modelbutton)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n.adw-menu-button {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n vertical-align: middle;\n\n // The icon button — square with the button radius by default.\n .adw-menu-button-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 34px;\n min-height: 34px;\n margin: 0;\n padding: 0 8px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n .adw-menu-button-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n\n // Flat — no resting fill (the header app-menu idiom).\n &.flat .adw-menu-button-button {\n background-color: transparent;\n }\n\n // The open state keeps a subtle fill so the button reads as \"checked\".\n &.active .adw-menu-button-button {\n background-color: var(--button-active-color);\n }\n\n // Circular — a round 34×34 button (window-control / FAB idiom).\n &.circular .adw-menu-button-button {\n padding: 0;\n border-radius: 9999px;\n }\n\n &.disabled {\n opacity: 0.45;\n\n .adw-menu-button-button {\n cursor: default;\n pointer-events: none;\n }\n }\n\n // The surface, the heading and the item row are `<gtk-popover>`'s —\n // `_popover.scss` (`gtk-popover`, `.adw-popover-title`, `.adw-popover-item`).\n // What used to be here was one of three hand-rolled copies: a\n // `--card-radius` (12px) surface where libadwaita's is 15px, and a\n // `calc(var(--button-radius) - 2px)` (7px) row where `modelbutton` is 9px.\n // Only the icon slot is a menu-button fact.\n .adw-menu-button-item-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n}\n","// _drop_down.scss — gtk-drop-down: a standalone dropdown selector (the web\n// counterpart of Gtk.DropDown). A normal Adwaita button showing the current\n// selection + a `pan-down` chevron, dropping an elevated Adwaita popover list of\n// options. The popover reproduces libadwaita's popover.menu > contents surface\n// (soft triple shadow), the items its modelbutton rows, matching <gtk-menu-button>.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_popovers.scss (popover > contents)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_menus.scss (modelbutton rows)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dropdowns.scss (dropdown button)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n.adw-drop-down {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n vertical-align: middle;\n\n // The selection button — a normal Adwaita button (label + dim chevron).\n .adw-drop-down-button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n gap: var(--spacing-xs);\n min-width: 100px;\n min-height: 34px;\n margin: 0;\n padding: 0 8px 0 12px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &:disabled {\n cursor: default;\n pointer-events: none;\n }\n }\n\n .adw-drop-down-label {\n flex: 1 1 auto;\n min-width: 0;\n text-align: start;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // The chevron — a smaller, dimmed down-glyph after the label.\n .adw-drop-down-arrow {\n width: 12px;\n height: 12px;\n mask-size: 12px;\n -webkit-mask-size: 12px;\n flex: none;\n opacity: var(--dim-opacity);\n }\n\n &.disabled {\n opacity: 0.55;\n }\n\n // The popover SURFACE is `<gtk-popover>`'s (`_popover.scss`, the `[menu]`\n // variant — a dropdown's popover is a `popover.menu`, _dropdowns.scss:22).\n // What stays here is what libadwaita ALSO scopes to `dropdown`:\n // - the extra 6px above the contents (`popover.menu { padding-top: 6px }`,\n // _dropdowns.scss:23). GTK puts it on the popover node while the 6px inset\n // sits on `> contents`; flattened onto one node they add, which is what\n // the two-node original renders too.\n // - the width tracking the button rather than libadwaita's flat `min-width`.\n .adw-drop-down-popover {\n padding-top: 12px;\n min-width: 100%;\n max-width: 320px;\n }\n\n // Search entry atop the popover (enable-search). It reuses the .adw-entry skin\n // but needs its own bottom margin to separate it from the list.\n .adw-drop-down-search {\n margin-bottom: var(--spacing-xs);\n }\n\n // Scrollable column of option rows.\n .adw-drop-down-list {\n display: flex;\n flex-direction: column;\n max-height: 320px;\n overflow-y: auto;\n }\n\n // An option row is `.adw-popover-item` (`_popover.scss` — libadwaita's\n // `modelbutton`). Only the trailing-check layout is a drop-down fact: the\n // label and the check sit at opposite ends of the row.\n .adw-drop-down-item {\n justify-content: space-between;\n gap: var(--spacing-s);\n }\n\n .adw-drop-down-item-label {\n flex: 1 1 auto;\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // The selected-row check — a CSS checkmark, shown only on `.selected`.\n .adw-drop-down-item-check {\n position: relative;\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n .adw-drop-down-item.selected .adw-drop-down-item-check::after {\n content: '';\n position: absolute;\n left: 5px;\n top: 2px;\n width: 4px;\n height: 8px;\n border: solid var(--accent-color);\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n }\n}\n","// _toggle_group.scss — adw-toggle-group styling (a linked set of toggle buttons\n// with a single active item, recolored with the Adwaita active-toggle accent).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toggle-group.scss (AdwToggleGroup)\n// Reference: refs/adwaita-web/adwaita-web/scss/_toggle_group.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The active toggle uses a white-on-fg \"raised\" chip. These tokens default to\n// libadwaita's light-theme values; _theme.scss overrides them for dark.\n:root {\n --active-toggle-bg-color: #ffffff;\n --active-toggle-fg-color: var(--window-fg-color);\n}\n\nadw-toggle-group {\n // libadwaita's ---group-padding: a small inset so the active chip floats\n // inside the group's pill, leaving a hairline of group background around it.\n --group-padding: 3px;\n\n display: inline-flex;\n box-sizing: border-box;\n padding: var(--group-padding);\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n\n // `toggle-group:disabled` (libadwaita `_toggle-group.scss:16`) — the whole group's\n // background mixed toward transparent. Written against `[disabled]` and not `:disabled`:\n // a custom element is never `:disabled`, the way `_expander.scss` records.\n &[disabled] {\n background-color: color-mix(in srgb, var(--button-bg-color) var(--disabled-opacity), transparent);\n }\n\n .adw-toggle-group-inner {\n display: flex;\n align-items: stretch;\n gap: var(--group-padding);\n }\n\n // Each toggle is a button-shaped chip with the group's inner radius.\n .adw-toggle {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n min-width: 34px;\n min-height: 28px;\n margin: 0;\n padding: 4px 11px;\n border: none;\n border-radius: calc(var(--button-radius) - var(--group-padding));\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease,\n box-shadow 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // A `<button disabled>` carries GTK's `:disabled` dimming — `_buttons.scss:58`,\n // `filter: Opacity(var(--disabled-opacity))` — and `cursor: default` with it\n // (`_button.scss`). Hover and active are suppressed because a disabled button takes\n // neither, so the hover fill would linger over a toggle that cannot be pressed.\n &:disabled {\n opacity: var(--disabled-opacity);\n cursor: default;\n\n &:hover,\n &:active {\n background-color: transparent;\n }\n }\n\n // The active toggle — a raised white chip, the way libadwaita draws it.\n &.active {\n background-color: var(--active-toggle-bg-color);\n color: var(--active-toggle-fg-color);\n box-shadow:\n 0 1px 3px 1px rgba(0, 0, 6, 0.07),\n 0 2px 6px 2px rgba(0, 0, 6, 0.03);\n\n &:hover {\n background-color: var(--active-toggle-bg-color);\n }\n\n // The raised chip is what makes it read as raised; libadwaita drops the shadow on a\n // disabled active toggle (`_toggle-group.scss:131`) so an unavailable choice does not\n // look pressed.\n &:disabled {\n box-shadow: none;\n }\n }\n }\n\n // Round — group + toggles become pill-shaped.\n &.round {\n border-radius: 17px;\n\n .adw-toggle {\n border-radius: calc(17px - var(--group-padding));\n padding-left: calc(15px - var(--group-padding));\n padding-right: calc(15px - var(--group-padding));\n }\n }\n\n // Flat — no group background; the active toggle uses a subtle fill instead of\n // the raised white chip.\n &.flat {\n --group-padding: 0px;\n\n padding: 0;\n background: none;\n\n .adw-toggle {\n border-radius: var(--button-radius);\n\n &.active {\n background-color: var(--button-active-color);\n color: inherit;\n box-shadow: none;\n\n &:hover {\n background-color: var(--button-active-color);\n }\n }\n }\n\n &.round .adw-toggle {\n border-radius: 17px;\n }\n }\n}\n","// _switch.scss — the <gtk-switch> control: a track, a hidden checkbox and a\n// sliding knob. UNSCOPED, which is the whole point of the partial.\n//\n// WHY IT IS ITS OWN FILE. These rules used to live inside `_switch_row.scss`,\n// nested under `adw-switch-row { … }` — so `.adw-switch` did not exist anywhere\n// else, and the moment a second widget needed a toggle it could not use it.\n// `_expander_row.scss` therefore carried a character-for-character copy of the\n// whole block (same 44×24 box, same hidden input, same 20px knob, same\n// `translateX(20px)`, same focus ring) under a different class name. Two copies\n// of a control is how a hover state gets fixed in one of them.\n//\n// FIDELITY, RECORDED RATHER THAN \"FIXED\": the 44×24 track with the 20px knob is\n// `refs/adwaita-web/adwaita-web/scss/_switch.scss`'s geometry, NOT libadwaita's.\n// libadwaita draws `switch` as a 3px-padded trough around a 20px slider with\n// `border-radius: 14px` (refs/libadwaita/src/stylesheet/widgets/_switch.scss:3-4,\n// :24-26) — about 26px tall, not 24, and correspondingly narrower. What ships\n// here is the vendored web port's box, unchanged by the extraction; changing the\n// geometry is a visual decision for a separate change, and citing libadwaita for\n// numbers that came from somewhere else would be the misreading the conformance\n// header warns about.\n//\n// Reference: refs/adwaita-web/adwaita-web/scss/_switch.scss (the geometry that ships)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_switch.scss:3-4,20-26 (the geometry that does not, + the disabled treatment)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components; lifted out of\n// `adw-switch-row {}` so <gtk-switch> is usable anywhere.\n\n.adw-switch {\n position: relative;\n display: inline-block;\n width: 44px;\n height: 24px;\n flex-shrink: 0;\n\n // The real control: focusable and keyboard-toggleable, but never painted —\n // the slider below is what the user sees and clicks.\n input {\n opacity: 0;\n width: 0;\n height: 0;\n position: absolute;\n }\n}\n\n.adw-switch-slider {\n position: absolute;\n cursor: pointer;\n inset: 0;\n background-color: var(--switch-off-bg);\n border-radius: 12px;\n transition: background-color 0.15s ease-out;\n\n &::before {\n content: \"\";\n position: absolute;\n height: 20px;\n width: 20px;\n left: 2px;\n bottom: 2px;\n background-color: var(--switch-knob-bg);\n border-radius: 50%;\n transition: transform 0.15s ease-out;\n box-shadow: 0 1px 2px rgb(0 0 0 / 20%);\n }\n}\n\n// The KNOB follows `active` — GTK moves the handle from the user's own position\n// (gtkswitch.c:795-798), which is `Gtk.Switch:active`.\n.adw-switch input:checked + .adw-switch-slider::before {\n transform: translateX(20px);\n}\n\n// The TROUGH follows `state`. GTK raises and clears the `:checked` state flag from\n// `gtk_switch_set_state` (gtkswitch.c:853-856) — NOT from `active` — and libadwaita\n// paints `switch:checked` from it (refs/libadwaita/src/stylesheet/widgets/_switch.scss:\n// 41-55). That separation is the whole point of the two booleans: a switch whose\n// backend has not caught up yet shows the user where they put it (knob) over where the\n// thing actually is (trough).\n.adw-switch.checked .adw-switch-slider {\n background-color: var(--accent-bg-color);\n}\n\n.adw-switch input:focus-visible + .adw-switch-slider {\n outline: 2px solid var(--accent-color);\n outline-offset: 2px;\n}\n\n// libadwaita dims the whole widget (`filter: Opacity(var(--disabled-opacity))`,\n// _switch.scss:20-22), and `--disabled-opacity` is a real token here now — it\n// used to be stood in for by `--dim-opacity`, which is a different number and\n// moves the OTHER way under high contrast.\n.adw-switch.disabled {\n opacity: var(--disabled-opacity);\n\n .adw-switch-slider {\n cursor: not-allowed;\n }\n}\n","// _entry.scss — gtk-entry / .adw-entry text input (e.g. a browser URL bar).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// <gtk-entry> hosts an inner <input class=\"adw-entry\">; it fills its flex slot.\ngtk-entry {\n display: flex;\n flex: 1;\n min-width: 0;\n}\n\n.adw-entry {\n box-sizing: border-box;\n width: 100%;\n min-height: 34px;\n margin: 0;\n padding: 5px 12px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--entry-bg-color);\n color: var(--view-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n // NO FRAME. `%entry_basic` (_entries.scss:1-11) draws a fill and a radius and\n // nothing else: the one-pixel border appears ONLY under `prefers-contrast: more`\n // (:13-15). The frame sat here unconditionally, so every entry — entry, search entry,\n // password entry, the text view — read as an outlined box where libadwaita draws a\n // flat grey one. Confirmed against the native reference: a focused entry carries the\n // accent ring, an unfocused one carries no edge at all.\n transition: box-shadow 0.1s ease;\n\n &::placeholder {\n color: var(--view-fg-color);\n opacity: var(--dim-opacity);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n // Dimmed disabled state, mirroring .adw-button:disabled.\n &:disabled {\n opacity: 0.45;\n cursor: default;\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--entry-border-color);\n\n &:hover {\n box-shadow: inset 0 0 0 1px var(--entry-border-hover-color);\n }\n }\n}\n","// _search_entry.scss — <gtk-search-entry>: the same `entry` box with a magnifying glass\n// leading and a clear button trailing.\n//\n// libadwaita has no `entry.search` rule at all: `Gtk.SearchEntry`'s CSS node is `entry`\n// carrying the `.search` STYLE CLASS (gtksearchentry.c:884), and every rule that reaches it\n// is one `_entries.scss` already states for `entry` (:1-96) — the box, the focus ring, the\n// icons at 70%, and their `&.right { margin-left: 6px }`. So this partial is those same\n// rules applied to the two extra nodes this widget has, and it deliberately adds nothing of\n// its own: a rule that could select `entry.search` but does not is a rule that rots, which\n// is the reasoning `_progress_bar.scss` records for `progressbar.vertical`.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-96\n// Reference: refs/gtk/gtk/gtksearchentry.c:884 (the `.search` style class, and the CSS node name `entry`)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-search-entry {\n display: flex;\n flex: 1;\n min-width: 0;\n align-items: center;\n box-sizing: border-box;\n min-height: 34px;\n padding: 0 9px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n background-clip: padding-box;\n caret-color: currentColor;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n\n // `@include focus-ring($focus-state: ':focus-within')` (_entries.scss:17). The host is the\n // focusable node here rather than a wrapping box, so it is the host's own focus that\n // paints the ring — which is the same ring `:focus-within` draws, one node further out.\n &:focus-within {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n .adw-entry {\n flex: 1;\n min-width: 0;\n min-height: auto;\n padding: 0 6px;\n background-color: transparent;\n box-shadow: none;\n\n &:focus,\n &:focus-visible {\n box-shadow: none;\n }\n }\n\n // `> image { opacity: 70%; &.left { margin-right: 6px } }` (_entries.scss:42-61)\n .adw-search-entry-icon {\n flex: none;\n margin-right: 6px;\n opacity: 70%;\n color: inherit;\n\n @media (prefers-contrast: more) {\n opacity: 85%;\n }\n }\n\n .adw-search-entry-clear {\n flex: none;\n margin-left: 6px;\n opacity: 70%;\n color: inherit;\n\n @media (prefers-contrast: more) {\n opacity: 85%;\n }\n\n &:hover {\n opacity: 100%;\n }\n\n &:active {\n opacity: 80%;\n }\n }\n}","// _password_entry.scss — <gtk-password-entry>: an `entry.password` box with a Caps Lock\n// warning leading and a peek button trailing.\n//\n// libadwaita styles `entry` and `entry.password` in ONE partial (_entries.scss:1-96), and the\n// password half is four rules: the entry shape itself, `> image { opacity: 70% }` for the\n// icons inside an entry (:42-61), and `&.password image.caps-lock-indicator { opacity:\n// $dimmer_opacity }` (:63-69). Everything else here is the box this package's\n// `_entry.scss` already gives `gtk-entry`, restated because the Caps Lock indicator is a\n// TEXT glyph rather than a masked icon and would otherwise take the entry's own padding.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-96\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-password-entry {\n display: flex;\n flex: 1;\n min-width: 0;\n align-items: center;\n box-sizing: border-box;\n min-height: 34px;\n padding: 0 9px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n background-clip: padding-box;\n caret-color: currentColor;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n\n // The entry shape `_entry.scss` gives the inner input, narrowed to this widget's own parts.\n .adw-entry {\n flex: 1;\n min-width: 0;\n min-height: auto;\n padding: 6px 0;\n background-color: transparent;\n box-shadow: none;\n\n &:focus,\n &:focus-visible {\n box-shadow: none;\n }\n }\n\n // `&.password image.caps-lock-indicator { opacity: $dimmer_opacity }` (:63-69). The glyph\n // is text — `caps-lock-symbolic` is in no icon theme this renderer can compile — so it is\n // DIMMED rather than masked, and it carries the canonical name in `data-icon-name`.\n .adw-password-entry-caps-lock {\n flex: none;\n margin-right: 6px;\n color: currentColor;\n opacity: 0.45;\n font-size: var(--font-size-base);\n line-height: 1;\n\n @media (prefers-contrast: more) {\n opacity: 0.6;\n }\n }\n\n // `> image { … &.right { margin-left: 6px } }` (:42-61): the icons inside an entry are at\n // 70% and go to 100% on hover, which is the rule the peek button is a `gtk-image` for.\n .adw-password-entry-peek {\n flex: none;\n margin-left: 6px;\n opacity: 70%;\n color: inherit;\n\n @media (prefers-contrast: more) {\n opacity: 85%;\n }\n\n &:hover {\n opacity: 100%;\n }\n\n &:active {\n opacity: 80%;\n }\n }\n}","// _separator.scss — <gtk-separator>: a one-pixel rule, and the `.spacer` variant that draws\n// nothing and only keeps its distance.\n//\n// libadwaita's whole rule is `separator { background: $border_color; min-width: 1px;\n// min-height: 1px }` plus `.spacer` (_misc.scss:21-31). GTK gives the widget its extent from\n// the orientation: a horizontal separator is 1px tall and as wide as it is given, a vertical\n// one the reverse. A flex or block parent hands that width through `align-self: stretch`,\n// which is why the cross-axis size is `auto` rather than a number.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:21-31\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-separator {\n display: block;\n flex: none;\n align-self: stretch;\n background: var(--border-color);\n min-width: 1px;\n min-height: 1px;\n\n &.horizontal {\n height: 1px;\n }\n\n &.vertical {\n width: 1px;\n }\n\n &.spacer {\n background: none;\n\n &.horizontal {\n min-width: 12px;\n }\n\n // The generic `.spacer` in `_style_classes.scss` also floors the WIDTH at 12px for an\n // element with no orientation; a vertical separator's width is its 1px, so say so.\n &.vertical {\n min-width: 1px;\n min-height: 12px;\n }\n }\n}\n","// _text.scss — the three GTK widgets whose content is text: `<gtk-text>`,\n// `<gtk-text-view>` and `<gtk-editable-label>`.\n//\n// ONE PARTIAL, because upstream's rules for them are three small blocks in two files that\n// are about the same two things — libadwaita paints a `text` node either as `%view`\n// (`_views.scss:1-18`, `textview > text` at :23-29) or, inside an editable label, as the\n// same view pair (`_labels.scss:94-97`) — and the entry metrics (`_entries.scss:4-11`,\n// `19-28`) that `<gtk-text>` shares with the entry it is the delegate of. Where the text\n// NODE is the thing being styled upstream and the WIDGET is the element here, the inner\n// control carries the rule and the host carries the layout.\n//\n// WHAT UPSTREAM DOES NOT STYLE, and this file does not either: a standalone `text` node has\n// no rule of its own in libadwaita — `%entry` is written for `entry`, and a `Gtk.Text` is\n// only ever seen as an entry's delegate (`gtktext.c:78-91`) — so the metrics below are the\n// ENTRY's, which is the widget this one is a delegate of, not an invention. `text[.read-only]`\n// is a selector hook with no rule behind it (`_views.scss` has none, `gtktext.c:155-167`\n// documents the node), so the class is applied and an author may style it.\n//\n// `:backdrop` and `:disabled` are the two states upstream reaches for that this port has no\n// state for, the same trade `_labels.scss` records for `<gtk-label>`.\n//\n// The font stack is `inherit` rather than a second `--font-family` declaration, so that the\n// `.monospace` CLASS — libadwaita's own (`_labels.scss:81-84`), which `<gtk-text-view>` puts\n// on its HOST — reaches the inner control through the cascade instead of a copied rule.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:1-18,20-45\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss:1-11,81-84,90-97\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-28\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// <gtk-text> hosts an inner <input class=\"adw-text\">; it fills its flex slot, and\n// `propagate-text-width` is the C's \"grow and shrink with the content\" made a layout.\ngtk-text {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n\n // `gtk_text_set_propagate_text_width` (gtktext.c:7400-7420): the widget's width follows\n // its text, which is the input's own `size` mechanism, so the HOST only has to stop\n // stretching to its container.\n &.propagate-text-width {\n width: fit-content;\n max-width: 100%;\n }\n\n .adw-text {\n box-sizing: border-box;\n width: 100%;\n // `%entry_basic`'s three metrics (_entries.scss:4-6).\n min-height: 34px;\n padding: 5px 9px;\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--entry-bg-color);\n // `%view`'s colours: `text` is a view wherever libadwaita styles it\n // (_views.scss:1-18), and an entry is one (_entries.scss:9).\n color: var(--view-fg-color);\n font-family: inherit;\n font-size: inherit;\n caret-color: currentColor;\n\n // `entry > text > placeholder { @extend .dimmed }` (_entries.scss:19-22).\n &::placeholder {\n color: var(--view-fg-color);\n opacity: var(--dim-opacity);\n }\n\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n}\n\n// `<gtk-text-view>` hosts a <textarea>. GTK's own property doc for the margins says what a\n// text view's spacing IS — \"In CSS terms, the value set here is padding, and it is applied in\n// ADDITION to the padding from the theme\" (gtktextview.c:1050-1057) — so the four margin\n// attributes are four custom properties the element writes, and the padding below is the sum.\ngtk-text-view {\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n\n // `textview { caret-color: currentColor }` (_views.scss:21): the caret is the inner\n // control's, and `cursor-visible` is what turns it off there.\n .adw-text-view {\n box-sizing: border-box;\n width: 100%;\n margin: 0;\n // `top-margin` and friends, ADDED to the theme's own padding (gtktextview.c:1050-1057).\n // The four are custom properties so the sum stays here and the element writes pixels.\n --adw-text-view-margin-top: 0px;\n --adw-text-view-margin-end: 0px;\n --adw-text-view-margin-bottom: 0px;\n --adw-text-view-margin-start: 0px;\n padding-top: calc(6px + var(--adw-text-view-margin-top));\n padding-right: calc(6px + var(--adw-text-view-margin-end));\n padding-bottom: calc(6px + var(--adw-text-view-margin-bottom));\n padding-left: calc(6px + var(--adw-text-view-margin-start));\n border: none;\n border-radius: var(--button-radius);\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n font-family: inherit;\n font-size: inherit;\n overflow: auto;\n resize: vertical;\n\n &:focus,\n &:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n\n // `&.inline` (_views.scss:31-36): an inline text view has no surface of its own, which is\n // how a text view behaves inside a row or a page of prose. An AUTHOR class, as upstream:\n // nothing in the element sets it.\n &.inline .adw-text-view {\n background-color: transparent;\n color: inherit;\n }\n}\n\n// `<gtk-editable-label>` is `stack > { label, entry }`, one of them visible\n// (gtkeditablelabel.c:66-73): an inline row, and the entry inside it wears the view colours\n// upstream writes for that node (_labels.scss:94-97).\ngtk-editable-label {\n display: inline-flex;\n align-items: baseline;\n max-width: 100%;\n // Focus follows the WIDGET, not the entry, while the label is showing\n // (gtkeditablelabel.c:377-388), so the host owns the focus ring.\n border-radius: var(--button-radius);\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n .adw-editable-label-label {\n // A primary click starts editing (gtkeditablelabel.c:193-215), and GTK drags the\n // label's own text out of it (gtkeditablelabel.c:272-291), so it is selectable text.\n cursor: text;\n user-select: text;\n }\n\n .adw-editable-label-entry {\n box-sizing: border-box;\n margin: 0;\n padding: 2px 4px;\n border: none;\n border-radius: var(--button-radius);\n // `editablelabel > stack > text` (_labels.scss:94-97), verbatim as a pair.\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n font-family: inherit;\n font-size: inherit;\n caret-color: currentColor;\n\n &:focus,\n &:focus-visible {\n outline: none;\n }\n }\n\n // `GtkEditableLabel:editable` FALSE leaves the label a label — the C's actions are\n // disabled with it (gtkeditablelabel.c:414-427), so a click does nothing.\n &[editable='false'] .adw-editable-label-label {\n cursor: default;\n }\n}","// _search_bar.scss — `<gtk-search-bar>`, the strip that reveals a search entry.\n//\n// The whole of libadwaita's rule is `searchbar > revealer > box` plus a `.close` button\n// (_toolbars.scss:113-159): the box is a HEADER BAR surface — the same `--headerbar-bg-color`\n// pair and the same 1px shade along its bottom edge as `adw-header-bar` draws\n// (`_header-bar.scss`) — and the strip sits at the bottom of a window, so that edge is the\n// one that separates it from the content.\n//\n// THE REVEALER IS THE STATE. `search-mode-enabled` IS `reveal-child` (gtksearchbar.c:183-205,\n// 512-517), so the strip animates its own height and the element drives nothing else. One\n// grid row that goes `0fr` → `1fr` is the one CSS mechanism that animates to a height the\n// CONTENT decides; `max-height` would be a guess at that height, and `display: none` would\n// not animate at all.\n//\n// TWO RULES ARE DELIBERATELY ABSENT. `:backdrop` — the dimmed variant libadwaita draws when\n// the window is unfocused (_toolbars.scss:125-133) — has no state here: this port has no\n// toplevel whose focus it could follow. And `%toolbar`'s reset rules (_toolbars.scss:5-66)\n// only classify the BUTTON classes inside a toolbar, which `<gtk-button>` already owns\n// (`_button.scss`).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss:109-185 (searchbar)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-search-bar {\n display: grid;\n // THE REVEALER (`reveal-child`). `0fr` clips the box to nothing without taking it out of\n // the layout, which is what a GTK revealer does; `1fr` gives the box its own height.\n grid-template-rows: 0fr;\n transition: grid-template-rows 200ms ease;\n\n &.revealed {\n grid-template-rows: 1fr;\n }\n\n @media (prefers-reduced-motion: reduce) {\n transition: none;\n }\n\n .adw-search-bar-box {\n // The clip the `0fr` row needs, and the header-bar surface libadwaita puts on it\n // (_toolbars.scss:115-122).\n overflow: hidden;\n min-height: 0;\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px 6px 7px 6px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 -1px var(--separator-color);\n }\n }\n\n // The `GtkCenterBox` the C wraps the child in (gtksearchbar.c:378-386): the entry takes\n // the free space, the close button sits at its end.\n .adw-search-bar-center {\n display: flex;\n align-items: center;\n gap: 6px;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n // `button.close` (_toolbars.scss:137-153): a 18px round flat button, with the 10px/4px\n // ltr margins upstream writes and the 4px/10px rtl mirror.\n .adw-search-bar-close {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 18px;\n min-height: 18px;\n margin-left: 10px;\n margin-right: 4px;\n padding: 4px;\n border: none;\n border-radius: 50%;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &[hidden] {\n display: none;\n }\n }\n\n // `&:dir(rtl)` (_toolbars.scss:150-153) — the margins swap sides, not the order.\n &:dir(rtl) .adw-search-bar-close {\n margin-left: 4px;\n margin-right: 10px;\n }\n\n // `searchbar.inline` (_toolbars.scss:156-158) drops the header-bar surface, which is what\n // an author adds when the strip sits inside a page rather than at a window's edge.\n &.inline .adw-search-bar-box {\n background-color: transparent;\n color: inherit;\n box-shadow: none;\n padding-bottom: 6px;\n }\n}","// _drawing.scss — <gtk-drawing-area>, and the page's other hand-drawn surfaces.\n//\n// THERE IS NO UPSTREAM FILE TO PORT. `GtkDrawingArea` sets no CSS name of its own, so\n// its node is the default `widget` node (gtkwidget.c:1982), and libadwaita's stylesheet\n// has no rule for it — nor for `glarea`, which sets no name either, nor for\n// `graphicsoffload`, whose only rule is the widget-node layout GTK gives a bin. So this\n// partial is GEOMETRY, and every value in it is transcribed from a measure function in\n// the C rather than from a stylesheet upstream does not have. Saying that is the point:\n// the rules below are not a re-skin, they are the measurement written out.\n//\n// CONTENT-WIDTH IS A FLOOR, NOT A SIZE. `gtk_drawing_area_measure` returns\n// `content_width` as the minimum AND the natural width (gtkdrawingarea.c:210-231), so a\n// parent may hand the area MORE than it asked for — which is what `width: <length>`\n// means for a block box — and cannot hand it less, which is `min-width`. The zero default\n// is \"no intrinsic size\", and `auto` is the block box's own answer to that.\n//\n// Reference: refs/gtk/gtk/gtkdrawingarea.c:210-231,240-267\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-drawing-area {\n display: block;\n // The natural half: a parent with room to spare gives the area more, and a parent\n // without gives it exactly the floor below.\n width: var(--adw-drawing-width, auto);\n height: var(--adw-drawing-height, auto);\n // The minimum half — the same number, which is why both read one custom property.\n min-width: var(--adw-drawing-width, 0);\n min-height: var(--adw-drawing-height, 0);\n\n // The cairo region GTK hands the draw function is the whole allocation\n // (gtkdrawingarea.c:248-262), so the canvas is the whole box rather than a scaled\n // child of it.\n .adw-drawing-area-canvas {\n display: block;\n width: 100%;\n height: 100%;\n }\n}\n\n// <gtk-gl-area> — `GtkGLArea` sets no CSS name (no `gtk_widget_class_set_css_name` in\n// gtkglarea.c), so its node is the generic `widget` node and libadwaita has no rule for\n// it. It also has NO measure function, which is the rule that shapes what follows: the\n// area reports no intrinsic size on either axis, so a parent gives it one.\ngtk-gl-area {\n display: block;\n position: relative;\n\n .adw-gl-area-canvas {\n display: block;\n width: 100%;\n height: 100%;\n }\n\n // `gtk_gl_area_draw_error_screen` (:701-723): the error message laid out across the\n // widget's width and centred vertically — `pango_layout_set_width (width *\n // PANGO_SCALE)` and `PANGO_ALIGN_CENTER`, at `(height - layout_height) / 2`. The\n // canvas stays behind it, as GTK's snapshot replaces a frame's contents rather than\n // the widget's node.\n .adw-gl-area-error {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n padding: 12px;\n }\n}\n// <gtk-graphics-offload> — `GTK_TYPE_BIN_LAYOUT` (gtkgraphicsoffload.c:290) gives the\n// child the whole allocation, and the black rectangle `black_background` paints over that\n// allocation BEFORE the child (:222-229) is a BACKGROUND rather than a layer: what the\n// letterbox bars need is the wrapper black exactly where the child does not cover it.\ngtk-graphics-offload {\n display: block;\n position: relative;\n // No `overflow: hidden` here: GTK's subsurface is rectangular and a rounded corner or a\n // clip is one of the things that PROHIBITS offload (:66-68), so clipping this box would\n // be the very condition the widget exists to avoid. It does not clip.\n .adw-graphics-offload-child {\n display: block;\n width: 100%;\n height: 100%;\n }\n}\n","// _drag_icon.scss — <gtk-drag-icon>: the one widget whose CSS node libadwaita styles for\n// the WHOLE widget rather than for one state.\n//\n// `gtk_widget_class_set_css_name (widget_class, \"dnd\")` (gtkdragicon.c:383) is the whole\n// of the widget's styling, and libadwaita's only rule on that node is a foreground colour\n// (`_common.scss:30-32`). The second rule naming it — `dnd tab` in `_tab-view.scss` — is a\n// `GtkTabView` tab being dragged out of a tab view, which is that widget's node to style,\n// not a property of this one.\n//\n// EVERYTHING ELSE HERE IS GEOMETRY, and each value says which part of the C it stands in\n// for. The box is FIXED-POSITIONED because a drag icon has no parent to lay out in: it is\n// a `GtkRoot` with its own surface (:106-108), and `gtk_drag_icon_move_resize` (:138-150)\n// does the one thing a layout would have done — put the icon where the pointer is, at the\n// child's preferred size (`:180-188`).\n//\n// Reference: refs/gtk/gtk/gtkdragicon.c:106-108,138-150,180-188,380,386-390\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:30-32\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-drag-icon {\n // `dnd { color: var(--window-fg-color) }` — the whole of libadwaita's rule, and the\n // reason a drag icon's LABEL is the window foreground rather than its own.\n color: var(--window-fg-color);\n // `gtk_widget_set_can_target (self, FALSE)` (:386-390) has no CSS of its own, but this\n // is the layer it describes: an icon that is pointed at takes no pointer event.\n pointer-events: none;\n // The drag surface is a root of its own (:106-108), so it is placed against the\n // VIEWPORT rather than a parent box. The element writes the position itself, on every\n // `dragover` — which is `gtk_drag_icon_move_resize` (:138-150) on the surface.\n position: fixed;\n left: 0;\n top: 0;\n // Above the window chrome and below the toasts, which is where a drag image belongs: it\n // is over the window it was dragged out of, and under a toast that arrived after it.\n z-index: 5000;\n // `surface_compute_size` (:180-188) sizes the surface to the child's PREFERRED size, so\n // the icon is exactly as big as what it carries: `max-content` is the one CSS length that\n // measures content rather than a box.\n width: max-content;\n height: max-content;\n\n // The `GtkColorSwatch` `createWidgetForValue` builds for a `GdkRGBA`\n // (gtkdragicon.c:544-553), which is a square of the colour it carries — nothing else,\n // because `set_can_drag`/`set_can_drop` are FALSE and the two states are the only thing\n // a swatch has that this one does not need. The large size is `ICON_SIZE_LARGE`, which\n // is the 32px `.large-icons` sets (_common.scss:38-41).\n .adw-drag-icon-swatch {\n display: block;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n }\n}","// _overlay.scss — <gtk-overlay>: a main child, and siblings stacked on top of it.\n//\n// libadwaita has NO `_overlay.scss`: `grep` over `src/stylesheet/widgets/` finds no\n// `overlay` node rule, because an overlay draws nothing of its own — GTK's whole CSS\n// node contract for it is the `overlay` name plus the `.left` / `.right` / `.top` /\n// `.bottom` classes an edge-aligned child is given (gtkoverlay.c:66-71). So this partial\n// is LAYOUT, not a look, and the geometry it encodes is `gtk_overlay_get_child_position`\n// (gtkoverlay.c:130-196) rather than a style.\n//\n// · `.adw-overlay-child` is `display: contents` so the main child is laid out as a\n// DIRECT child of the host and the overlay takes its size — which is exactly\n// gtk_overlay_compute_expand and the \"sizes are those of its main child\" rule\n// (gtkoverlay.c:56-58, :291-308). A wrapper that generated a box would put a\n// layout node between the overlay and the child, and the child's own `hexpand`\n// would have to be re-implemented here.\n// · `.adw-overlay-layer` is the box an overlay child is placed in. `inset: 0` over\n// the whole host is the C's `graphene_rect_init (&bounds, 0, 0, width, height)`\n// (gtkoverlay.c:214-216), and `display: flex` is what lets a child's own\n// `[halign]` / `[valign]` auto-margin rules place it — `gtk_overlay_get_child_position`\n// reads nothing but those two properties.\n// · `align-items: stretch` is `GTK_ALIGN_FILL` on the cross axis, the default for\n// `GtkWidget:valign`. A child that names a `valign` carries an auto cross margin,\n// and a flex item with an auto cross margin does NOT stretch (CSS Flexbox § 9.4),\n// which is precisely the branch the C takes for START, CENTER and END.\n// · `pointer-events: none`, re-enabled per child: GTK hands an event to the widget\n// whose allocation contains it, so an overlay child that is smaller than the overlay\n// must not make the main child unreachable underneath it.\n//\n// The `:not([halign])` guard on the main axis is the whole of `GTK_ALIGN_FILL` there —\n// `flex-grow` WITHOUT it would be cancelled by the auto margin `_widget.scss` gives a\n// child that names an alignment, since free space is handed to flex-grow first and only\n// the remainder reaches an auto margin. Specificity has to beat `_widget.scss`'s\n// `[halign='start']` (0,1,0), which `:not([halign])` lifts this rule to.\n//\n// Reference: refs/gtk/gtk/gtkoverlay.c (get_child_position, the `overlay` CSS node)\n// Reference: refs/gtk/gtk/gtkoverlaylayout.c (gtk_overlay_child_allocate, clip bounds)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-overlay {\n display: block;\n position: relative;\n}\n\n.adw-overlay-child {\n // The main child, in the host's own flow — see the header.\n display: contents;\n}\n\n.adw-overlay-layer {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: stretch;\n justify-content: flex-start;\n pointer-events: none;\n\n > * {\n // GTK delivers an event to the widget whose ALLOCATION it lands in (gtkoverlay.c:150-193),\n // so only the overlay child's own box takes input.\n pointer-events: auto;\n }\n\n // GTK_ALIGN_FILL on the main axis: the child grows to the overlay's whole allocation.\n > *:not([halign]) {\n flex: 1 1 auto;\n }\n}\n","// _revealer.scss — <gtk-revealer>: the box that clips while its child slides or folds.\n//\n// libadwaita gives the revealer node NO rule of its own — `grep -rn revealer\n// src/stylesheet/` returns the one `actionbar > revealer > box` chain in `_toolbars.scss` —\n// so there is no look to copy and this partial is the CLIP.\n//\n// `overflow: hidden` is `GTK_OVERFLOW_HIDDEN`, which `gtk_revealer_start_animation` sets\n// for the four plain slide types and releases when the position lands\n// (gtkrevealer.c:230-236, :243-249). It is unconditional here instead, which differs\n// nowhere a reader can see: at a settled position the clip box is the child's own size, so\n// there is nothing to clip — and it has to be always, because a revealer that collapsed to\n// `display: none` at position 0 would hide its child from the accessibility tree too, and\n// the widget's doc section says the child stays in it whatever the state\n// (gtkrevealer.c:61-63).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (`actionbar > revealer`)\n// Reference: refs/gtk/gtk/gtkrevealer.c (GTK_OVERFLOW_HIDDEN, gtk_revealer_snapshot)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-revealer {\n display: block;\n // `gtk_revealer_measure` answers the CHILD's minimum and natural, scaled — so the\n // revealer's own size is the child's, and a block-level host would stretch to its parent\n // instead. `fit-content` is `min(max-content, available)`, which is the pair of numbers a\n // GTK size request is, and a flex parent can still grow it because `flex-basis: auto`\n // reads this value.\n width: fit-content;\n max-width: 100%;\n overflow: hidden;\n}\n\n// The box the element sizes to `ceil(natural × scale)`. It has to be a real box — the\n// height it is given is the revealer's own measured height in the C.\n.adw-revealer-clip {\n display: block;\n}\n","// _paned.scss — <gtk-paned>: two panes, and the hairline between them.\n//\n// This is libadwaita's `_paned.scss` transposed onto the element. Upstream styles the CSS\n// NODE TREE `paned > separator[.wide]` (gtkpaned.c:88-98) rather than a tag, so the selector\n// here is the element and the handle class it carries:\n//\n// · the rule draws NOTHING with a background — `background: none` upstream — and paints\n// the rule as an INSET BOX SHADOW on the leading edge, `inset 1px 0 $border_color` for a\n// horizontal paned in an LTR row and the mirrored `-1px` under RTL. `<gtk-separator>`'s\n// own partial fills its background instead, which is why the handle is a plain box with\n// the `separator` class rather than a `<gtk-separator>`: upstream's two selectors can\n// then mean different things, as they do in GTK.\n// · `.wide` is `gtk_paned_set_wide_handle` adding the class to the handle node\n// (gtkpaned.c:2566), and upstream widens the node itself to 5px rather than fattening a\n// 1px rule — so the rule's shadow moves to BOTH edges.\n//\n// The HIT AREA is the part upstream has no CSS for: `gtk_paned_handle_contains` insets the\n// node's border rect by `- HANDLE_EXTRA_SIZE` (6px) on every side unless the handle is wide\n// (gtkpanedhandle.c:49, :60-73), and `initiates_touch_drag` adds 50px more for a touch\n// sequence (gtkpaned.c:862-884). A `::before` with negative insets is the same rectangle\n// without moving the rule, and a pseudo-element is not itself an event target, so the events\n// land on the handle.\n//\n// `.adw-paned-child` is a flex column and its adopted child fills it, which is the pattern\n// `adw-navigation-view` / `adw-navigation-split-view` already use for the pane bins they\n// build themselves. `min-height: 0` / `min-width: 0` on the child is what lets a pane's\n// scroll container shrink inside the divider instead of pushing it.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_paned.scss\n// Reference: refs/gtk/gtk/gtkpanedhandle.c (HANDLE_EXTRA_SIZE, gtk_paned_handle_contains)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-paned {\n display: flex;\n flex-direction: row;\n min-height: 0;\n min-width: 0;\n\n &.vertical {\n flex-direction: column;\n }\n}\n\ngtk-paned > .adw-paned-child {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n\n > * {\n flex: 1 1 auto;\n min-width: 0;\n min-height: 0;\n }\n}\n\ngtk-paned > .adw-paned-handle {\n position: relative;\n flex: none;\n // The 1px (or 5px) node `gtk_paned_handle_new` measures with\n // `gtk_widget_measure (handle_widget, orientation, -1, NULL, &handle_size, …)`.\n min-width: 1px;\n min-height: 1px;\n // Upstream's `background: none` — the rule below is an inset shadow, not a fill, which is\n // what leaves the two separators (this one and `<gtk-separator>`) free to differ.\n background: none;\n\n &.wide {\n min-width: 5px;\n min-height: 5px;\n }\n\n // `graphene_rect_inset (&area, -HANDLE_EXTRA_SIZE, -HANDLE_EXTRA_SIZE)`.\n &::before {\n content: '';\n position: absolute;\n inset: -6px;\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 2px;\n }\n}\n\ngtk-paned.horizontal > .adw-paned-handle {\n &:dir(ltr) {\n box-shadow: inset 1px 0 var(--border-color);\n }\n\n &:dir(rtl) {\n box-shadow: inset -1px 0 var(--border-color);\n }\n\n &.wide {\n &:dir(ltr) {\n box-shadow:\n inset 1px 0 var(--border-color),\n inset -1px 0 var(--border-color);\n }\n\n &:dir(rtl) {\n box-shadow:\n inset -1px 0 var(--border-color),\n inset 1px 0 var(--border-color);\n }\n }\n}\n\ngtk-paned.vertical > .adw-paned-handle {\n box-shadow: inset 0 1px var(--border-color);\n\n &.wide {\n box-shadow:\n inset 0 1px var(--border-color),\n inset 0 -1px var(--border-color);\n }\n}\n\n// `gtk_widget_set_cursor_from_name (handle_widget, \"col-resize\")` (gtkpaned.c:1527) — the\n// C picks it from the handle node's own orientation, which the classes carry.\ngtk-paned.horizontal > .adw-paned-handle {\n cursor: col-resize;\n}\n\ngtk-paned.vertical > .adw-paned-handle {\n cursor: row-resize;\n}\n","// _expander.scss — <gtk-expander>: the disclosure title, its arrow, and the row beneath.\n//\n// libadwaita's `_expanders.scss` is TWO selectors — the `expander` node and\n// `expander-widget` — and the element has to keep them apart, because they are different\n// nodes: `expander` is the ARROW and `expander-widget` is the widget. So the arrow is the\n// `.adw-expander-arrow` box and the widget is the tag.\n//\n// THE ARROW is upstream's whole rule, with `-gtk-icon-source` as a mask swap:\n//\n// min-width/min-height 16px `.adw-icon`'s own size, so this repeats it only to say the\n// node has no intrinsic size of its own;\n// pan-end-symbolic the closed glyph;\n// pan-end-symbolic-rtl `:dir(rtl)`, as upstream's second `-gtk-icon-source`;\n// pan-down-symbolic `:checked`, which this stylesheet spells `.checked` — and\n// `gtk_expander_set_expanded` sets the pseudoclass on the\n// arrow, not on the widget (gtkexpander.c:897-900);\n// disabled `Opacity(var(--disabled-opacity))`.\n//\n// The `:disabled` line has nothing to bite on here, because a custom element is never\n// `:disabled` — the widget is a plain GtkWidget with no insensitive state of its own, and\n// upstream's rule exists for the `expander` node when a `Gtk.TreeView` row disables it.\n// It is written against `[disabled]` so an author who puts the attribute there gets\n// upstream's dimming rather than nothing.\n//\n// THE TITLE is `expander-widget > box > title` (`_expanders.scss:13-28`): a 6px radius, the\n// focus ring, and the arrow at 70% until the title is hovered or pressed. The box between\n// them is `.adw-expander-box`, so the selector chain is the node tree rather than a\n// coincidence.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_expanders.scss\n// Reference: refs/libadwaita/src/stylesheet/_drawing.scss (the focus-ring mixin: a 2px\n// outline at offset -2px, which is what `outline` below spells out)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-expander {\n display: block;\n\n > .adw-expander-box {\n display: flex;\n flex-direction: column;\n }\n\n > .adw-expander-box > .adw-expander-title {\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n min-height: 30px;\n padding: var(--spacing-xs) var(--spacing-m);\n border-radius: 6px;\n cursor: pointer;\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n // `focus-ring (\"> box > title\")` with its default `$width: 2px` and `$offset: -$width`.\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n .adw-expander-arrow {\n opacity: 0.7;\n }\n\n &:hover .adw-expander-arrow,\n &:active .adw-expander-arrow {\n opacity: 1;\n }\n }\n\n > .adw-expander-box > .adw-expander-content {\n display: flex;\n flex-direction: column;\n min-width: 0;\n min-height: 0;\n }\n}\n\n.adw-expander-arrow {\n min-width: 16px;\n min-height: 16px;\n flex-shrink: 0;\n // `expander { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic') }`. The element sets\n // `icon-name=\"pan-end\"`, so the `.checked` and `:dir(rtl)` rules below are the two\n // `-gtk-icon-source` overrides — same three glyphs, same two conditions.\n mask-image: var(--icon-pan-end);\n -webkit-mask-image: var(--icon-pan-end);\n\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n // `&:checked { -gtk-icon-source: -gtk-icontheme('pan-down-symbolic') }`\n &.checked {\n mask-image: var(--icon-pan-down);\n -webkit-mask-image: var(--icon-pan-down);\n }\n}\n\n:dir(rtl) .adw-expander-arrow:not(.checked) {\n // `&:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-end-symbolic-rtl') }` — upstream\n // states the RTL glyph on its own line, BEFORE the `:checked` one, so `:checked` wins for\n // an RTL expander that is open. The `:not(.checked)` keeps that order without relying on\n // it.\n mask-image: var(--icon-pan-end-rtl);\n -webkit-mask-image: var(--icon-pan-end-rtl);\n}\n","// _checks.scss — <gtk-check-button> AND <adw-radio>, in ONE partial.\n//\n// WHY ONE FILE FOR TWO ELEMENTS. Upstream's\n// `refs/libadwaita/src/stylesheet/widgets/_checks.scss` merges them deliberately:\n// everything but the corner radius and the glyph is a shared `check, radio { … }`\n// block (:20-65), and the indeterminate dash is re-declared for BOTH at the end\n// (:79-81). There is no `_radio.scss` upstream to mirror. `refs/adwaita-web` does\n// split them into `_checkbox.scss` + `_radio.scss`, and the split is exactly where\n// it drifted: its two indicators grew different sizes, different border treatments\n// and different selection-mode rules, and only one of them has a hover state.\n//\n// TWO PLACES THE VENDORED WEB PORT DISAGREES WITH LIBADWAITA. libadwaita is\n// followed in both:\n//\n// 1. INDETERMINATE. `refs/adwaita-web/adwaita-web/scss/_checkbox.scss` has no\n// indeterminate state at all — no dash, no third glyph, nothing. libadwaita\n// paints it with the same accent fill as checked (:52-60) and its own dash\n// glyph (:79-81). Ported.\n// 2. THE CHECKED RADIO. `refs/adwaita-web/adwaita-web/scss/_radio.scss:22-33`\n// colours only the BORDER and the dot with `--accent-color`, leaving the\n// indicator's background as the view colour. libadwaita FILLS the whole\n// control with `--accent-bg-color` and draws the bullet in\n// `--accent-fg-color` (:54-55) — the same treatment the checkbox gets, which\n// is the point of the shared block. Ported.\n//\n// THE GLYPHS ARE LIBADWAITA'S OWN ASSETS. GTK draws them with\n// `-gtk-icon-source: -gtk-recolor(url(\"assets/check.svg\"))` (:70, :76, :80),\n// which has no CSS spelling. The path data below is copied from\n// `refs/libadwaita/src/stylesheet/assets/{check,bullet,dash}.svg` and painted as\n// a mask filled with `currentColor` — the same technique `_icon.scss` already\n// uses, and what makes `-gtk-recolor` work here: the shared block sets\n// `color: var(--accent-fg-color)` on a checked indicator, so the glyph follows.\n// `bullet.svg` carries a `transform=\"translate(-381 -339)\"` on a path whose\n// commands after the first are all relative, so the translation is folded into\n// the absolute `M` (388,342 → 7,3) and nothing else changes.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_checks.scss (all of it)\n// Reference: refs/libadwaita/src/stylesheet/assets/{check,bullet,dash}.svg (the three glyphs)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:280-286 (the trough colours)\n// Reference: refs/adwaita-web/adwaita-web/scss/{_checkbox,_radio}.scss (the vendored port's split, NOT followed — see above)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Implemented as Web Components for @gjsify/adwaita-web; the GTK\n// icon sources are re-expressed as CSS masks.\n\n// assets/check.svg\n$check-glyph: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='black' d='m 12.599609,2.1992188 a 1,1 0 0 0 -1.40039,0.2011718 L 5.890625,9.4765625 2.7070313,6.2929687 a 1,1 0 0 0 -1.4140626,0 1,1 0 0 0 0,1.4140625 l 4,3.9999998 A 1.0001,1.0001 0 0 0 6.8007812,11.599609 L 12.800781,3.5996094 A 1,1 0 0 0 12.599609,2.1992188 Z'/%3E%3C/svg%3E\");\n// assets/bullet.svg\n$bullet-glyph: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='black' d='M 7 3 c -2.207 0 -4 1.793 -4 4 s 1.793 4 4 4 c 2.208 0 4 -1.793 4 -4 s -1.792 -4 -4 -4 z'/%3E%3C/svg%3E\");\n// assets/dash.svg\n$dash-glyph: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14'%3E%3Cpath fill='black' d='M 3 5 A 2 2 0 0 0 1 7 A 2 2 0 0 0 3 9 L 11 9 A 2 2 0 0 0 13 7 A 2 2 0 0 0 11 5 Z'/%3E%3C/svg%3E\");\n\n// `checkbutton { … }` (:3-18) — the host is the button, not the indicator.\ngtk-check-button,\nadw-radio {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 4px; // border-spacing: 4px (:4)\n padding: 3px; // (:6)\n border-radius: 9px; // $check_radius + 3px (:5)\n cursor: pointer;\n user-select: none;\n\n // The real control: focusable and keyboard-operable, never painted. The\n // indicator below is what the user sees; the host handles the pointer.\n .adw-check-input {\n position: absolute;\n width: 0;\n height: 0;\n margin: 0;\n opacity: 0;\n }\n\n // `check, radio { … }` (:20-31), shared by both elements.\n .adw-check-indicator {\n // GTK sizes the CONTENT box (`min-width`/`min-height: 14px`, :22-23) and\n // grows the drawn control with `padding: 3px` (:26), i.e. 20x20. Opting out\n // of the ADR-0010 descendant border-box pin keeps that arithmetic — and\n // keeps `checkbutton.selection-mode`'s one-line `padding: 7px` (:87)\n // working exactly as it does upstream instead of needing a second number.\n box-sizing: content-box;\n width: 14px;\n height: 14px;\n padding: 3px;\n flex-shrink: 0;\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 15%, transparent); // $trough_color\n transition:\n background 200ms ease-out,\n box-shadow 200ms ease-out;\n\n @media (prefers-contrast: more) {\n // $trough_color_hc (_colors.scss:284) stands in for $border_color: this\n // package defines no `--border-opacity`, and the two are the same 30%\n // mix of currentColor in the light theme.\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 30%, transparent);\n }\n\n // The glyph layer. No mask until a state supplies one, so an unchecked\n // control paints nothing here.\n &::after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n // Transparent until a state supplies a glyph: an unmasked currentColor box is a\n // solid square, which is what an unchecked control used to paint.\n background-color: transparent;\n mask-repeat: no-repeat;\n mask-position: center;\n mask-size: 14px; // -gtk-icon-size: 14px (:25)\n -webkit-mask-repeat: no-repeat;\n -webkit-mask-position: center;\n -webkit-mask-size: 14px;\n }\n }\n\n // `&:not(:checked):not(:indeterminate) { &:hover / &:active }` (:33-50).\n // Hover and active live on the HOST here — the indicator is 20px inside a\n // control whose label is part of the target, exactly as `checkbutton` is.\n &:not([checked]):not([indeterminate]):not([disabled]) {\n &:hover .adw-check-indicator {\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 20%, transparent); // $trough_hover_color\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 2px color-mix(in srgb, currentColor 60%, transparent);\n }\n }\n\n &:active .adw-check-indicator {\n background-color: color-mix(in srgb, currentColor 25%, transparent); // $trough_active_color\n box-shadow: none;\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 60%, transparent);\n }\n }\n }\n\n // `&:checked, &:indeterminate { … }` (:52-60) — ONE block for both states, so\n // they differ only in the glyph.\n &[checked] .adw-check-indicator,\n &[indeterminate] .adw-check-indicator {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n box-shadow: none;\n }\n\n // GTK's `background-image: image(<colour>)` (:58-59) is a flat fill; a\n // two-stop gradient of one colour is its CSS spelling, as `_button_row.scss`\n // already does.\n &[checked]:not([disabled]),\n &[indeterminate]:not([disabled]) {\n &:hover .adw-check-indicator {\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 10%, transparent),\n color-mix(in srgb, currentColor 10%, transparent)\n );\n }\n\n &:active .adw-check-indicator {\n background-image: linear-gradient(rgb(0 0 6 / 20%), rgb(0 0 6 / 20%));\n }\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:62-64).\n &[disabled] {\n cursor: not-allowed;\n opacity: var(--disabled-opacity);\n }\n\n // `@include focus-ring()` on `checkbutton` (:8). The ring follows the real\n // control's focus, not the host's, so keyboard focus is what shows it.\n .adw-check-input:focus-visible ~ .adw-check-indicator {\n outline: 2px solid var(--accent-color);\n outline-offset: 2px;\n }\n}\n\n// `check { border-radius: $check_radius }` (:67-68)\ngtk-check-button .adw-check-indicator {\n border-radius: 6px;\n}\n\n// `radio { border-radius: 100% }` (:73-74)\nadw-radio .adw-check-indicator {\n border-radius: 100%;\n}\n\n// `check:checked` → check.svg (:70) / `radio:checked` → bullet.svg (:76)\ngtk-check-button[checked] .adw-check-indicator::after {\n background-color: currentColor;\n mask-image: $check-glyph;\n -webkit-mask-image: $check-glyph;\n}\n\nadw-radio[checked] .adw-check-indicator::after {\n background-color: currentColor;\n mask-image: $bullet-glyph;\n -webkit-mask-image: $bullet-glyph;\n}\n\n// `check, radio { &:indeterminate { … dash.svg } }` (:79-81). Upstream this is a\n// SEPARATE rule after both `:checked` blocks at equal specificity, so the dash\n// wins over the check/bullet on a control that is both. Same order, same\n// specificity, same outcome here — and the same precedence `resolveCheckState`\n// in `@gjsify/adwaita-core` encodes for the a11y value.\ngtk-check-button[indeterminate] .adw-check-indicator::after,\nadw-radio[indeterminate] .adw-check-indicator::after {\n background-color: currentColor;\n mask-image: $dash-glyph;\n -webkit-mask-image: $dash-glyph;\n}\n\n// `checkbutton.selection-mode { … }` (:83-95) — the big round check used in a\n// selection-mode header bar.\ngtk-check-button.selection-mode,\nadw-radio.selection-mode {\n border-radius: 100px;\n\n .adw-check-indicator {\n padding: 7px;\n border-radius: 100px;\n }\n\n // `label { &:dir(ltr) { margin-right: 6px } &:dir(rtl) { margin-left: 6px } }`\n // (:91-94) — one logical property covers both directions.\n .adw-check-label {\n margin-inline-end: 6px;\n }\n}\n","// _spin_button.scss — <gtk-spin-button>: an entry-shaped box with a decrement and an\n// increment arrow inside it.\n//\n// libadwaita merges this into `_entries.scss`'s shape: `spinbutton { @extend %entry }`\n// (:1-2), so the OUTER box is an entry — `min-height: 34px`, the 9px horizontal padding,\n// `$button_radius` and `$button_color` — and only the two ARROWS are styled here. That is\n// why the partial below adds no background of its own and why the arrows are `.image-button`\n// with `border-radius: 0` and a hairline of their own.\n//\n// THE CHILD ORDER THE `&:last-child` / `&:first-child` RULES BELOW DEPEND ON is\n// `Gtk.SpinButton`'s, not the one a spinner usually draws: C parents its children as text,\n// down, up (gtkspinbutton.c:1091-1126) and the box layout lays them out in that order, so\n// the horizontal widget reads `text ▼ ▲` and the vertical one `▲ text ▼`. The element\n// re-parents on an orientation change exactly as `gtk_spin_button_set_orientation` does\n// (gtkspinbutton.c:1290-1299), so the selectors below select what they select on a desktop:\n// the up arrow hugs the rounded end, whichever end that is.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_spin-button.scss:1-76\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss:1-19 (%entry)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `> text { @extend .dimmed; > placeholder { @extend .dimmed } }` is the entry's own rule\n// (_entries.scss:19-28) and this package states it on `.adw-entry` instead; the placeholder\n// colour is the browser's.\n@use 'labels';\n\ngtk-spin-button {\n // `spinbutton { @extend %entry; @extend .numeric; }` (:1-3), taken apart: this package's\n // `_entry.scss` writes the entry shape as the `.adw-entry` CLASS on an `<input>` rather\n // than as a placeholder every node can extend, so the eight declarations `%entry`\n // contributes are written out here and `.numeric` is @extended on the text instead.\n display: flex;\n flex: 1;\n min-width: 0;\n align-items: center;\n box-sizing: border-box;\n min-height: 34px;\n padding: 0 9px;\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n background-clip: padding-box;\n caret-color: currentColor;\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (_entries.scss:40)\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n // The numeric text. `.numeric` is `spinbutton`'s own `@extend .numeric` (:3).\n .adw-spin-button-text {\n @extend .numeric;\n\n flex: 1;\n box-sizing: border-box;\n min-width: 0;\n padding: 6px;\n border: none;\n outline: none;\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n\n &:focus-visible {\n outline: none;\n }\n\n &::placeholder {\n @extend .dimmed;\n }\n }\n\n // `> button.image-button.up` and `.down` (:9-24) — `:not` there upstream only to outrank\n // the list button styling, which has no counterpart here; the flat treatment does.\n .image-button {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n margin: 0;\n padding: 4px;\n border: none;\n border-radius: 0;\n background-color: transparent;\n color: inherit;\n box-shadow: none;\n border-style: solid;\n border-width: 0;\n border-color: color-mix(in srgb, currentColor 10%, transparent);\n\n @media (prefers-contrast: more) {\n border-color: color-mix(in srgb, currentColor 50%, transparent);\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n // `update_buttons_sensitivity` (gtkspinbutton.c:1214-1226) disables an arrow that has\n // no room to move, and a disabled button has to LOOK it: libadwaita's `&:disabled`\n // dimming is on the widget, which is here.\n &:disabled {\n opacity: var(--disabled-opacity);\n cursor: default;\n }\n }\n\n &:not(.vertical) {\n .adw-spin-button-text {\n min-width: 28px;\n }\n\n .image-button {\n min-height: 16px;\n min-width: 22px;\n padding-top: 0;\n padding-bottom: 0;\n border-left-width: 1px;\n\n &:dir(rtl) {\n border-left-width: 0;\n border-right-width: 1px;\n }\n\n // The up arrow is the LAST child in a horizontal box (see the file header), so it is\n // the one that carries the rounded right end — and `:dir(rtl)` mirrors it.\n &:dir(ltr):last-child {\n border-radius: 0 var(--button-radius) var(--button-radius) 0;\n }\n\n &:dir(rtl):last-child {\n border-radius: var(--button-radius) 0 0 var(--button-radius);\n }\n }\n }\n\n &.vertical {\n flex-direction: column;\n padding: 9px 0;\n\n .adw-spin-button-text {\n min-height: 30px;\n min-width: 30px;\n padding: 0;\n text-align: center;\n }\n\n // The up arrow is FIRST here and the down arrow LAST, so the two rules land on the two\n // ends the way they do vertically on a desktop.\n .image-button {\n &:first-child {\n border-bottom-width: 1px;\n border-radius: var(--button-radius) var(--button-radius) 0 0;\n }\n\n &:last-child {\n border-top-width: 1px;\n border-radius: 0 0 var(--button-radius) var(--button-radius);\n }\n }\n }\n}","// _scale.scss — <gtk-scale>: the trough, its highlighted part, the fill level's second\n// bar, the knob and the value text.\n//\n// WHAT CAME FROM WHERE, and the one thing that did not come from anywhere:\n//\n// The trough and highlight are libadwaita's `%scale_trough` / `%scale_highlight`\n// (_scale.scss:1-17) with GTK's own `GTK_CSS` colour values inlined —\n// `_colors.scss:280-289` gives `$trough_color` 15% of `currentColor`,\n// `$trough_color_hc` 30%, `$trough_hover_color` 20%, `$trough_hover_color_hc` 40%, and\n// `$slider_color` as `color-mix (white 80%, var (--view-bg-color))`, the same two the\n// package's `_progress_bar.scss` already inlines for the same reason.\n//\n// The ONE NUMBER WITH NO CITABLE LINE is the trough's 4px thickness: `%scale_trough`\n// sets only the radius and the colour, because in GTK that thickness comes from the\n// TOOLKIT's Adwaita theme — `gtk-adwaita-theme`, a repository beside `refs/gtk`, not\n// inside it. It is a thickness; nothing else in this partial or in the element's\n// behaviour depends on it.\n//\n// The VALUE'S PLACE comes from GTK's own `gtk_scale_allocate` (gtkscale.c:373-421),\n// which is not a stylesheet at all: the four `value-pos` cases pick an edge of the\n// widget for the value, and `gtk_scale_get_range_border` (:1239-1272) keeps the trough\n// out of it. The container axis below is that switch.\n//\n// NOT PORTED, each because nothing here can select it — the same reasoning\n// `_progress_bar.scss` records for `progressbar.vertical`:\n// · the value's placement ON THE KNOB. `gtk_scale_allocate_value` (gtkscale.c:388-425)\n// centres it on the slider for `top`/`bottom` and on the trough for `left`/`right`, which\n// a flow layout cannot reach for either — `align-self: center` is the cross-axis centre,\n// the one half that needs no knowledge of the value's own width. It shows only once the\n// value is off the middle of its range.\n// · the `> marks` blocks and `.marks-before` / `.marks-after` (:98-111, :114-124,\n// :152-170, :212-226). Those style classes are added ONLY by `gtk_scale_add_mark()` /\n// `clear_marks()` (gtkscale.c:1638, :1696-1721), which have been deprecated since\n// GTK 4.10; a scale without marks has no marks node and no class.\n// · the `.fine-tune` blocks (:137-150, :197-210). `.fine-tune` is a `GtkRange` style\n// class it adds for the duration of a Shift-held drag (gtkrange.c:1799-1801), and\n// `<gtk-scale>`'s pointer handling does not run that zoom state.\n// · the `.color` variant (:229-250), which `Gtk.ScaleButton` adds to ITSELF; the\n// standalone `Gtk.Scale` node never carries it.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scale.scss:1-251\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:280-289\n// Reference: refs/gtk/gtk/gtkscale.c (gtk_scale_allocate_value, update_value_position,\n// gtk_scale_get_range_border), refs/gtk/gtk/gtkrange.c (clamp_dimensions)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// `> value` @extends `.dimmed` and `.numeric` exactly as the scale's value node does.\n@use 'labels';\n\ngtk-scale {\n display: flex;\n flex: 1;\n min-width: 10px;\n min-height: 10px;\n padding: 12px;\n\n // THE CONTAINER AXIS FOLLOWS `value-pos`, NOT THE ORIENTATION. GTK's\n // `gtk_scale_allocate` (gtkscale.c:373-421) puts the value BESIDE the trough for\n // `left`/`right` and ABOVE or BELOW it for `top`/`bottom` — for BOTH orientations,\n // because those four are the cross-axis ends of a horizontal scale and the main-axis\n // ends of a vertical one. Measured, not read off the switch: a 628px horizontal scale\n // with `draw-value` and `value-pos: top` allocates the value at `y=0` above a trough\n // that starts at `y=29` (`gtk_scale_get_range_border`, gtkscale.c:1239-1272), and the\n // same scale with `left` allocates the value at `x=0`, `y=0`, ON THE TROUGH'S LINE.\n //\n // The value node is the scale's FIRST child upstream — `gtk_scale_set_draw_value`\n // (gtkscale.c:1097-1101) does `gtk_widget_insert_after (…, GTK_WIDGET (scale), NULL)`,\n // ahead of the trough `gtk_range_init` appended — and `update_value_position`\n // (gtkscale.c:1042-1073) only ever puts a position class on it. Here the DOM runs\n // trough-then-value, so the two positions that mean \"ahead of the trough in the flow\"\n // upstream — `top` and `left` — are the ones that need the axis REVERSED. The four HOST\n // classes carry the same four names, so one `value-pos` attribute decides the axis as well\n // as the value node's own margins.\n &.value-top,\n &.value-bottom {\n flex-direction: column;\n align-items: stretch;\n\n // GTK centres the value on the KNOB for these two\n // (`value_alloc.x = slider_center_x - value_alloc.width / 2`, gtkscale.c:391, :397),\n // which the flow layout cannot reach — the cross-axis centre is what is left, and it\n // is the one half that does not need the value's width.\n .adw-scale-value {\n align-self: center;\n }\n }\n\n &.value-top {\n flex-direction: column-reverse;\n }\n\n &.value-left,\n &.value-right {\n flex-direction: row;\n // GTK centres the value on the trough (`value_alloc.y = trough_center_y -\n // value_alloc.height / 2`, gtkscale.c:376, :382), which for one line of children is\n // `align-items: center`.\n align-items: center;\n\n .adw-scale-value {\n flex: 0 0 auto;\n }\n }\n\n &.value-left {\n flex-direction: row-reverse;\n }\n\n // WHERE THE VALUE SITS BESIDE THE TROUGH, the value takes its width off the track and the\n // trough takes what is left — `gtk_scale_get_range_border` (gtkscale.c:1239-1272) shrinks\n // the trough's allocation by the value's, never the other way round. The axis there is the\n // scale's OWN, which is why `flex: 1` has to be asked for by orientation: the trough is an\n // empty bar whose only size is what the layout gives it.\n &.horizontal.value-left,\n &.horizontal.value-right,\n &.vertical.value-top,\n &.vertical.value-bottom {\n .adw-scale-trough {\n flex: 1 1 auto;\n }\n }\n\n // The other two pairs leave the trough across the cross axis, where `stretch` reaches it on\n // its own — except for a vertical one under `align-items: center` above.\n &.vertical.value-left,\n &.vertical.value-right {\n .adw-scale-trough {\n align-self: stretch;\n }\n }\n\n .adw-scale-trough {\n // %scale_trough (_scale.scss:1-10)\n position: relative;\n display: flex;\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n transition:\n background 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),\n box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n // %scale_highlight (_scale.scss:12-17) — the coloured part of the backing bit.\n .adw-scale-highlight {\n position: absolute;\n border-radius: 99px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n transition:\n background 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94),\n box-shadow 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n }\n\n // `> fill` (:43-47): a SECOND trough-styled bar for a media player's buffered range,\n // which is why it is not the highlight the `has-origin` block owns.\n .adw-scale-fill {\n position: absolute;\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n // `> slider` (:49-59). The negative margin is upstream's own comment: \"the slider is\n // inside the trough, so to make it bigger there's a negative margin\".\n .adw-scale-slider {\n position: absolute;\n min-width: 20px;\n min-height: 20px;\n margin: -8px;\n border-radius: 100%;\n background-color: color-mix(in srgb, white 80%, var(--view-bg-color));\n box-shadow:\n 0 0 0 1px rgb(0 0 6 / 10%),\n 0 2px 4px rgb(0 0 6 / 20%);\n transition: background 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n }\n\n // The element positions the knob by its CENTRE (`gtk_scale_init` fixes the slider size,\n // so `coord_to_value` divides the trough alone by it), hence the translate on both axes\n // and the fact that only ONE of `left` / `bottom` is ever written.\n &.horizontal {\n .adw-scale-trough {\n height: 4px;\n min-height: 4px;\n }\n\n .adw-scale-highlight,\n .adw-scale-fill {\n top: 0;\n bottom: 0;\n }\n\n .adw-scale-slider {\n top: 50%;\n transform: translate(-50%, -50%);\n }\n }\n\n &.vertical {\n .adw-scale-trough {\n width: 4px;\n min-width: 4px;\n // The trough is a fixed-width BAR and the axis above is the cross axis, so it must\n // not stretch: `align-items: stretch` on a column would give it the full width.\n align-self: center;\n }\n\n .adw-scale-highlight,\n .adw-scale-fill {\n right: 0;\n left: 0;\n }\n\n .adw-scale-slider {\n left: 50%;\n transform: translate(-50%, 50%);\n }\n }\n\n // `&:hover, &:active { > trough { … } }` (:62-78). `currentColor` on the highlight is\n // the accent FOREGROUND, which is why upstream's 10% wash lands as a light film.\n &:hover,\n &:active {\n .adw-scale-trough {\n background-color: color-mix(in srgb, currentColor 20%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n }\n\n .adw-scale-highlight {\n background-image: image(color-mix(in srgb, currentColor 10%, transparent));\n }\n\n .adw-scale-slider {\n background-color: white;\n }\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:80-91)\n &[disabled] {\n opacity: var(--disabled-opacity);\n\n .adw-scale-slider {\n box-shadow:\n 0 0 0 1px rgb(0 0 6 / 10%),\n 0 2px 4px transparent;\n }\n }\n\n // `> value { @extend .dimmed; @extend .numeric; }` (:93-96) — literally upstream's two\n // lines, now that `.dimmed` and `.numeric` exist here as the same utility classes.\n .adw-scale-value {\n @extend .dimmed;\n @extend .numeric;\n\n // `> value.top { margin-bottom: $_marks_size }` / `.bottom { margin-top: … }` /\n // `.left { margin-right: 9px }` / `.right { margin-left: 9px }` (:126-135). The marks\n // they were sized against are not ported; the offsets themselves still decide where the\n // value sits beside the trough.\n &.top {\n margin-bottom: 12px;\n }\n\n &.bottom {\n margin-top: 12px;\n }\n\n &.left {\n margin-right: 9px;\n }\n\n &.right {\n margin-left: 9px;\n }\n }\n\n // A keyboard-focused scale draws the ring on the KNOB, as `@include focus-ring(\"> trough >\n // slider\", $offset: 0)` does upstream (:29). The host is the focusable node, so its\n // `:focus-visible` is what stands in for the slider's.\n &:focus-visible {\n outline: none;\n\n .adw-scale-slider {\n outline: 2px solid var(--accent-color);\n outline-offset: 0;\n }\n }\n}","// _progress_bar.scss — <gtk-progress-bar>, the determinate partner to\n// <adw-spinner>.\n//\n// TWO SOURCES, AND WHICH HALF CAME FROM WHICH — the two disagree, so this is not\n// bookkeeping:\n//\n// GEOMETRY + COLOUR + THE OSD VARIANT come from\n// `refs/libadwaita/src/stylesheet/widgets/_progress-bar.scss`: an 8px trough\n// (:6), the 99px `$_progress-radius` (:33-35), the `%scale_trough` /\n// `%scale_highlight` placeholders it shares with the scale\n// (`_scale.scss:1-17`), the `> trough.empty > progress { all: unset }` rule\n// that makes a zero fraction draw NOTHING rather than a 0px sliver (:85), and\n// the `.osd` variant — a 2px bar with no trough, for under a header bar\n// (:59-83).\n//\n// THE INDETERMINATE ANIMATION comes from\n// `refs/adwaita-web/adwaita-web/scss/_progressbar.scss:25-66`, because\n// libadwaita has NO CSS equivalent: GTK animates a pulsing block from C\n// (`gtk_progress_bar_pulse`), so the stylesheet has nothing to copy. Its\n// keyframes and its `prefers-reduced-motion` fallback are the only parts taken\n// from there. Its GEOMETRY is NOT: it draws a 6px bar with a 3px radius and\n// has no trough placeholder, no OSD variant and no text node, so copying its\n// numbers would put a bar in this package that matches neither source.\n//\n// NOT PORTED, deliberately: `progressbar.vertical` (:10-15) and the four\n// `progress.{left,right,top,bottom}` corner-radius rules (:37-55). Both exist\n// for orientations and trough-splitting `<gtk-progress-bar>` does not expose —\n// there is no `orientation` attribute — and a rule nothing can ever select is a\n// rule that rots.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_progress-bar.scss:5-6,17-21,23-25,27-35,59-85\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scale.scss:1-17 (%scale_trough, %scale_highlight)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:280-286 (the trough colours)\n// Reference: refs/adwaita-web/adwaita-web/scss/_progressbar.scss:25-66 (indeterminate keyframes + reduced-motion fallback ONLY)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Implemented as a Web Component for @gjsify/adwaita-web.\n\n// `.dimmed` / `.numeric`, which the text node @extends exactly as upstream does.\n@use 'labels';\n\ngtk-progress-bar {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-xs);\n // `progressbar.horizontal > trough { min-width: 150px }` (:5) is a WIDGET\n // minimum in GTK, so it belongs on the element rather than on the trough.\n min-width: 150px;\n\n .adw-progress-bar-trough {\n // %scale_trough (_scale.scss:1-10)\n position: relative;\n display: flex;\n overflow: hidden;\n height: 8px; // :6 — `&, > progress { min-height: 8px }`\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n transition: background 200ms ease-out;\n\n @media (prefers-contrast: more) {\n // $trough_color_hc (_colors.scss:284)\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n .adw-progress-bar-progress {\n // %scale_highlight (_scale.scss:12-17) + $_progress-radius (:33-35)\n height: 100%;\n border-radius: 99px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n transition:\n width 200ms ease-out,\n background 200ms ease-out;\n }\n\n // `> text { @extend .dimmed; @extend .numeric; font-size: smaller; }` (:17-21)\n // — literally upstream's three lines, now that `.dimmed` and `.numeric` exist\n // here as the same utility classes they are there.\n .adw-progress-bar-text {\n @extend .dimmed;\n @extend .numeric;\n\n font-size: smaller;\n }\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:23-25).\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n // Fill from the far end. GTK spells this `:inverted`; flexbox handles the\n // writing direction, so nothing here needs an RTL branch.\n &[inverted] .adw-progress-bar-trough {\n justify-content: flex-end;\n }\n\n // `> trough.empty > progress { all: unset }` (:85) — at fraction 0 the\n // indicator DISAPPEARS instead of drawing a rounded 0px stub.\n .adw-progress-bar-trough.empty .adw-progress-bar-progress {\n all: unset;\n }\n\n // The `.osd` variant (:59-83): a hairline bar with no trough at all, the way\n // it is drawn under a header bar. `[osd]` is the attribute this element takes;\n // `.osd` is libadwaita's DOCUMENTED spelling for the same variant, and\n // `_style_classes.scss` excludes `gtk-progress-bar` from the generic OSD\n // surface exactly so the class lands here instead of turning the bar into a\n // dark translucent box.\n &[osd],\n &.osd {\n min-width: 2px;\n\n .adw-progress-bar-trough {\n height: 2px;\n border-radius: 0;\n background-color: transparent;\n box-shadow: none;\n }\n\n .adw-progress-bar-progress {\n border-radius: 0;\n }\n }\n\n // Indeterminate. The block leaves the flex flow and bounces across the trough;\n // this is the ONLY part of the widget taken from the vendored web port, since\n // GTK pulses from C and its stylesheet has no equivalent to copy.\n &[pulsing] .adw-progress-bar-progress {\n position: absolute;\n inset-block: 0;\n width: 30%;\n animation: adw-progress-bar-indeterminate 1.5s infinite ease-in-out;\n\n // `_progressbar.scss:42-49` — with motion suppressed the block stops moving\n // and fills the trough, so the bar still reads as \"busy\" and not as \"0%\".\n @media (prefers-reduced-motion: reduce) {\n left: 0;\n width: 100%;\n animation: none;\n }\n }\n}\n\n// refs/adwaita-web/adwaita-web/scss/_progressbar.scss:53-66, verbatim offsets.\n// `left` rather than `inset-inline-start`: the port animates a physical offset,\n// and a keyframe that flipped with the writing direction would no longer be the\n// animation being cited.\n@keyframes adw-progress-bar-indeterminate {\n 0% {\n left: -35%;\n width: 30%;\n }\n\n 50% {\n left: 50%;\n width: 40%;\n }\n\n 100% {\n left: 105%;\n width: 30%;\n }\n}\n","// _level_bar.scss — <gtk-level-bar>: the trough, the block, and the four colours the\n// offset classes select.\n//\n// THE GEOMETRY IS libadwaita's, VERBATIM, because this widget has no other styling\n// anywhere: refs/libadwaita/src/stylesheet/widgets/_level-bar.scss is the only\n// stylesheet that touches a `levelbar` node, and it is entirely radii, sizes and\n// block colours.\n//\n// WHAT C SUPPLIES INSTEAD. `levelbar > trough > block` is GTK's node tree\n// (gtklevelbar.c:99-116) — the element writes `.adw-level-bar-trough` and\n// `.adw-level-bar-block` with `.filled` / `.empty` plus the offset's class, because the\n// offsets are a RUNTIME list (`gtk_level_bar_add_offset_value`, gtklevelbar.c:1395-1411)\n// and no stylesheet can enumerate what an application adds. The four colours below are\n// therefore written for the classes GTK itself installs: `low`, `high`, `full`\n// (:1058-1060), and an application's own offset reaches them the same way.\n//\n// CONTINUOUS IS TWO NODES, NOT ONE. GTK allocates the empty level full size and paints\n// the filled one over it (gtklevelbar.c:344-362, :424-461), and the filled node is NOT\n// allocated at all when the value is 0 (:429-430) — which is why this partial positions\n// both absolutely inside the trough instead of flowing them, and why `overflow: hidden`\n// stands in for GTK's rounded clip.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_level-bar.scss:1-93\n// Reference: refs/gtk/gtk/gtklevelbar.c:99-116,285-303,344-362,424-461,467-524\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// $_levelbar_size (level-bar.scss:1)\n$levelbar-size: 8px;\n// $_levelbar_border_radius (level-bar.scss:2)\n$levelbar-radius: 99px;\n\ngtk-level-bar {\n display: flex;\n\n // `&:disabled { filter: Opacity(var(--disabled-opacity)) }` (:5-7).\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n .adw-level-bar-trough {\n // `> trough { padding: 0 }` (:67-68) — the trough is the whole box, not a padded\n // container around a smaller trough.\n padding: 0;\n position: relative;\n display: flex;\n // The rounded clip `gtk_snapshot_push_rounded_clip` puts on a progress node\n // (gtkprogressbar.c:462-465), and the reason a value past `max-value` is cut off\n // here rather than drawn beyond the end.\n overflow: hidden;\n width: 100%;\n }\n\n .adw-level-bar-block {\n position: absolute;\n border-radius: $levelbar-radius;\n }\n\n // The unfilled level, which is what `block.empty` paints ($trough_color,\n // level-bar.scss:85-92) — the same 15%-of-currentColor mix the scale trough uses\n // (_scale.scss:1-10) and the 30% one under high contrast.\n .adw-level-bar-block.empty {\n inset: 0;\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n\n // The block colours (`> trough > block`, :71-93). `&:not(.empty)` is upstream's own\n // selector, kept as written: it is what lets an offset an application invents paint in\n // the accent without a rule of its own.\n .adw-level-bar-block {\n &.low {\n background-color: var(--warning-bg-color);\n }\n\n &:not(.empty) {\n background-color: var(--accent-bg-color);\n }\n\n &.full {\n background-color: var(--success-bg-color);\n }\n\n &.high {\n background-color: var(--accent-bg-color);\n }\n }\n\n // `&.horizontal` (:9-35): 8px tall, one filled level in proportion to the interval.\n &.horizontal {\n .adw-level-bar-trough {\n height: $levelbar-size;\n }\n\n .adw-level-bar-block {\n min-height: $levelbar-size;\n }\n\n .adw-level-bar-block.filled {\n inset-block: 0;\n inset-inline-start: 0;\n // `(cur_value - min_value) / (max_value - min_value)` (gtklevelbar.c:434-435).\n width: calc(var(--level-fraction, 0) * 100%);\n }\n\n // `if (inverted) block_area.x += width - block_area.width` (:447-448).\n &[inverted] .adw-level-bar-block.filled {\n inset-inline-start: auto;\n inset-inline-end: 0;\n }\n }\n\n // `&.vertical` (:38-64): the same bar across the other axis.\n &.vertical {\n .adw-level-bar-trough {\n height: 100%;\n }\n\n .adw-level-bar-block {\n min-width: $levelbar-size;\n }\n\n .adw-level-bar-block.filled {\n inset-inline: 0;\n inset-block-start: 0;\n height: calc(var(--level-fraction, 0) * 100%);\n }\n\n // `if (inverted) block_area.y += height - block_area.height` (:455-456).\n &[inverted] .adw-level-bar-block.filled {\n inset-block-start: auto;\n inset-block-end: 0;\n }\n }\n\n // DISCRETE IS FLOW, NOT ABSOLUTE. GTK lays the blocks out in one run and divides the\n // trough between them (gtklevelbar.c:467-524); libadwaita puts a 2px gap between them\n // and a 26px minimum (:20-35 horizontal, :50-64 vertical), with the outer corners\n // rounded and the inner ones square.\n &.discrete {\n .adw-level-bar-block {\n position: relative;\n inset: auto;\n flex: 1 1 0;\n border-radius: 0;\n }\n\n &.horizontal {\n .adw-level-bar-trough {\n gap: 2px;\n }\n\n .adw-level-bar-block {\n min-width: 26px;\n\n &:first-child {\n border-radius: $levelbar-radius 0 0 $levelbar-radius;\n }\n\n &:last-child {\n border-radius: 0 $levelbar-radius $levelbar-radius 0;\n }\n }\n }\n\n &.vertical {\n .adw-level-bar-trough {\n flex-direction: column;\n gap: 2px;\n }\n\n .adw-level-bar-block {\n min-height: 26px;\n\n &:first-child {\n border-radius: $levelbar-radius $levelbar-radius 0 0;\n }\n\n &:last-child {\n border-radius: 0 0 $levelbar-radius $levelbar-radius;\n }\n }\n }\n }\n}\n","// _list_view.scss — <gtk-list-view>, and the ROW rules its two relatives reuse.\n//\n// UNSCOPED on purpose: `gridview > child` and `columnview > listview > row` are the same\n// selectable, activatable surface as `listview > row`, and upstream writes them as one\n// set of colours in `_lists.scss` and `_views.scss`. The shared half is the\n// `adw-list-selectable` MIXIN below, which `_grid_view.scss` and `_column_view.scss`\n// include rather than restate — the hover/active/selected quartet is four colours per\n// state and a drifted copy is four wrong ones. A mixin and not a `%placeholder`: a\n// placeholder extended across a `@use` boundary emits into the module that DECLARED it,\n// which would put the grid's and the column view's selectors inside this file's output.\n//\n// The colour tokens are libadwaita's own, spelled with this package's variables:\n// `$view_hover_color` is `currentColor 4%`, `$view_active_color` `currentColor 8%` and\n// `$view_selected_color` `var(--accent-bg-color) 25%` (_colors.scss:274-276).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:5-45, 74-95 (listview, row)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:47-50 (rubberband)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:263-276 (the four tokens)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The hover / active / selected quartet every item surface in the three views wears.\n@mixin adw-list-selectable {\n background-clip: padding-box;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 4%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 8%, transparent);\n }\n\n &.selected {\n background-color: color-mix(in srgb, var(--accent-bg-color) 25%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n}\n\n// The band is positioned against the row container, which is why every view's row\n// container is a containing block.\n.adw-rubberband {\n position: absolute;\n border: 1px solid var(--accent-color);\n background-color: color-mix(in srgb, var(--accent-color) 20%, transparent);\n pointer-events: none;\n}\n\n// The node a factory's label lands in, in all three views.\n.adw-list-item-label {\n display: block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\ngtk-list-view {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n background-clip: padding-box;\n\n .adw-list-view-rows {\n // `position: relative` is the rubber band's containing block, not decoration.\n position: relative;\n display: flex;\n flex-direction: column;\n }\n\n &.horizontal .adw-list-view-rows {\n flex-direction: row;\n }\n\n .adw-list-view-row {\n @include adw-list-selectable;\n\n // `listview > row { padding: 2px }` (_lists.scss:16-19).\n padding: 2px;\n box-sizing: border-box;\n }\n\n // `.separators` is the class GTK adds for `show-separators`; upstream draws the rule on\n // the BOTTOM of every row but the separator itself, and on the LEFT when horizontal.\n &.separators:not(.horizontal) .adw-list-view-row:not(:last-child) {\n border-bottom: 1px solid var(--border-color);\n }\n\n &.separators.horizontal .adw-list-view-row:not(:last-child) {\n border-right: 1px solid var(--border-color);\n }\n}\n","// _grid_view.scss — <gtk-grid-view>: the same selectable items as a list view, reflowed\n// into equal columns.\n//\n// Upstream writes `flowbox > flowboxchild, gridview > child` as ONE rule — the same\n// padding, the same `$button_radius` corner and the same four state colours a list row\n// has — so this partial includes `adw-list-selectable` from `_list_view.scss` and adds\n// only the two things a grid has: the track container and the cell floor the column\n// count is computed against.\n//\n// THE `min-width` IS LOAD-BEARING, not cosmetic. `gtk-grid-view.ts` reads it as the item\n// size for `gridViewColumns` — GTK's `GTK_SCROLL_MINIMUM` branch — because the rendered\n// width is `1fr`, i.e. the answer the count already produced. An author who wants wider\n// cells sets `min-width` on `.adw-grid-view-child` and the count follows.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:52-91 (gridview > child)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'list_view';\n\ngtk-grid-view {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n\n .adw-list-view-rows {\n position: relative;\n display: grid;\n // Replaced per measurement by `_applyColumns`; one column is what a view with\n // nothing to measure shows.\n grid-template-columns: repeat(1, 1fr);\n gap: 6px;\n }\n\n .adw-grid-view-child {\n @include list_view.adw-list-selectable;\n\n // `gridview > child { padding: 3px; border-radius: $button_radius }`.\n padding: 3px;\n border-radius: var(--button-radius);\n box-sizing: border-box;\n min-width: 120px;\n text-align: center;\n }\n}\n","// _column_view.scss — <gtk-column-view>: a header of column buttons over the same rows a\n// list view draws, with one cell per column.\n//\n// Every number here is upstream's: the header button's `3px 6px` padding and its\n// `border-left: 1px solid transparent` (which `.column-separators` then COLOURS rather\n// than adds, so turning separators on cannot shift the layout), the cells' `8px 6px`, and\n// the header text at 40% of `currentColor` rising to 70% on hover\n// (_column-view.scss:12-48).\n//\n// `.separators` is deliberately the SAME class a list view uses: `show-row-separators` is\n// passed straight through to the inner list view upstream, whose node then carries\n// `.separators` — so the rule reads `columnview.separators > row`, one hop shorter than\n// the C's node tree and with the same meaning.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_column-view.scss:1-112\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss (.caption-heading)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'list_view';\n\ngtk-column-view {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n\n .adw-column-view-header {\n display: grid;\n }\n\n .adw-column-view-header-cell {\n display: flex;\n align-items: center;\n gap: 6px;\n // `> header > button { padding: 3px 6px; border-radius: 0; background: transparent }`.\n padding: 3px 6px;\n border: 0;\n border-left: 1px solid transparent;\n border-radius: 0;\n background: transparent;\n font: inherit;\n font-size: var(--font-size-small);\n font-weight: 700;\n text-align: start;\n color: color-mix(in srgb, currentColor 40%, transparent);\n cursor: pointer;\n\n &:first-child {\n border-left-width: 0;\n }\n\n &:hover {\n color: color-mix(in srgb, currentColor 70%, transparent);\n }\n\n &:active {\n color: currentColor;\n }\n\n // A column with no sorter is not a button in any useful sense: upstream simply never\n // activates it, and the cursor is what says so here.\n &:disabled {\n cursor: default;\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n }\n\n .adw-column-view-header-title {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n // `sort-indicator { min-height: 16px; min-width: 16px }`, drawn as pan-up when\n // ascending — here one `go-down` icon turned over, the substitution the element header\n // records.\n .adw-column-view-sort-indicator {\n flex: none;\n margin-inline-start: auto;\n\n &.ascending {\n transform: rotate(180deg);\n }\n }\n\n .adw-list-view-rows {\n position: relative;\n display: flex;\n flex-direction: column;\n }\n\n .adw-column-view-row {\n @include list_view.adw-list-selectable;\n\n // `> listview > row { padding: 0 }` — the padding moved to the cells.\n display: grid;\n padding: 0;\n box-sizing: border-box;\n }\n\n .adw-column-view-cell {\n padding: 8px 6px;\n box-sizing: border-box;\n border-left: 1px solid transparent;\n\n &:first-child {\n border-left-width: 0;\n }\n }\n\n &.column-separators {\n .adw-column-view-cell,\n .adw-column-view-header-cell {\n border-left-color: var(--border-color);\n }\n }\n\n &.separators .adw-column-view-row:not(:last-child) {\n border-bottom: 1px solid var(--border-color);\n }\n}\n","// _tree_expander.scss — <gtk-tree-expander>: the indents and the disclosure arrow in\n// front of a tree row's contents.\n//\n// libadwaita gives the widget itself ONE declaration — `treeexpander { border-spacing:\n// 4px }` (_column-view.scss:128-130), which is the gap between the indents, the expander\n// and the child — and styles the arrow through the generic `expander` node: a 16×16 box\n// drawn with `pan-end-symbolic`, turning to `pan-down-symbolic` when `:checked`\n// (_expanders.scss:1-10).\n//\n// An INDENT has no rule upstream at all: `GtkBuiltinIcon` with css-name `indent` draws\n// nothing and occupies the icon's own 16px. That is why the indent below is a fixed box\n// rather than a margin on the child — the child keeps its own box, and an expandable row\n// and its leaf sibling line up because they have the SAME number of boxes in front of\n// them, which is the whole point of `indent-for-icon`.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_column-view.scss:128-130\n// Reference: refs/libadwaita/src/stylesheet/widgets/_expanders.scss:1-10\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-tree-expander {\n display: flex;\n align-items: center;\n // `border-spacing: 4px` between every node the widget holds.\n gap: 4px;\n box-sizing: border-box;\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n border-radius: var(--button-radius);\n }\n\n .adw-tree-expander-indent {\n flex: none;\n display: block;\n // The `indent` node is an icon-sized box that draws nothing.\n width: 16px;\n height: 16px;\n }\n\n .adw-tree-expander-icon {\n flex: none;\n opacity: 0.7;\n transform: rotate(0deg);\n transition: transform 0.2s ease-out;\n cursor: pointer;\n\n // `:checked` turns pan-end into pan-down; one quarter turn is the same picture.\n &.expanded {\n transform: rotate(90deg);\n }\n\n &:hover {\n opacity: 1;\n }\n }\n\n &[aria-disabled='true'] .adw-tree-expander-icon {\n filter: opacity(var(--disabled-opacity));\n }\n}\n","// _picture.scss — <gtk-picture>: the fit box, and the isolation boundary.\n//\n// libadwaita has NO `_picture.scss` of its own. Its only `picture` rule is a conditional\n// inside a card's selector (`refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:216`,\n// `&.card > picture`), because a picture needs no styling of its own until a card asks for\n// rounded corners. So everything structural below comes from the C, and the header of\n// `gtk-picture.ts` says which C.\n//\n// WHY `object-fit` GOES ON THE CHILD AND NOT HERE. The four `GtkContentFit` members ARE\n// the four CSS `object-fit` values, including `scale-down` (gtkpicture.c:162-167), so the\n// mapping is exact rather than approximate — but `object-fit` applies to a REPLACED element's\n// content box, and `<gtk-picture>` is a `<div>` with no content of its own. The element\n// therefore writes `--gtk-picture-content-fit` and this rule hands it down with the explicit\n// `inherit` keyword, which takes the parent's computed value whether or not the property is\n// an inherited one.\n//\n// `can-shrink` IS THE MEASURE, AND `min-content` IS ITS OPPOSITE. A picture that may shrink\n// reports a minimum of ZERO on both axes whatever the paintable is (gtkpicture.c:245-248);\n// a picture that may not asks the paintable for a CONCRETE minimum — its own minimum at the\n// style's icon size (gtkpicture.c:249-254) — which is what `min-content` is for a replaced\n// element with an intrinsic size. The class is set from the NORMALIZED property, so a\n// `can-shrink=\"false\"` attribute and `canShrink = false` agree, and an absent attribute is\n// TRUE (the C's own default, gtkpicture.c:554) rather than falling into the `min-content`\n// branch by accident.\n//\n// `isolation: isolate` IS `gtk_snapshot_push_isolation`. The property brackets the snapshot\n// (gtkpicture.c:148-149, :203-204), which stops the paintable's alpha compositing against\n// whatever is behind the widget WITHOUT changing how the widget is positioned or sized —\n// `contain: paint` would also establish a boundary and would additionally make the element a\n// containing block for fixed and absolutely positioned descendants, which\n// `push_isolation` does not do.\n//\n// `overflow: hidden` is not a styling choice: it is `gtk_widget_set_overflow (widget,\n// GTK_OVERFLOW_HIDDEN)` in `init` (gtkpicture.c:557), which is what makes `cover` clip its\n// overflow instead of painting outside the box.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:216 (the only upstream\n// `picture` rule, a card's conditional rounded corner)\n// Reference: refs/gtk/gtk/gtkpicture.c:146-205,245-254,538-557\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-picture {\n display: inline-flex;\n\n // `gtk_widget_set_overflow (widget, GTK_OVERFLOW_HIDDEN)` (gtkpicture.c:557).\n overflow: hidden;\n\n // `GtkPicture:isolate-contents` (gtkpicture.c:538-549, :555) as the stacking boundary\n // `gtk_snapshot_push_isolation` creates (gtkpicture.c:148-149).\n isolation: isolate;\n\n // The content fit, handed to the replaced child below. `fill` is the C's first branch\n // (gtkpicture.c:146) and the initial value of the custom property, so a picture with no\n // `content-fit` written yet and no stylesheet loaded behaves like the C's default arm\n // rather than like a broken one.\n --gtk-picture-content-fit: fill;\n\n &:not(.can-shrink) {\n // `gtk_picture_measure`'s `else` arm (gtkpicture.c:249-254): the paintable's own\n // concrete minimum, which is `min-content` for a replaced element.\n min-width: min-content;\n min-height: min-content;\n }\n\n // The four `GtkContentFit` members are the four CSS values (gtkpicture.c:146-205). The\n // replaced-element list is what `GdkPaintable` can stand in for here: an image, a video\n // frame (which is exactly what `<gtk-video>` puts inside its own picture), a canvas, an\n // inline SVG.\n > :is(img, video, canvas, picture, svg) {\n object-fit: var(--gtk-picture-content-fit);\n\n // The element is `display: inline-flex`, so a replaced child is a flex item and gets\n // `min-width: auto` — the same \"never smaller than my content\" floor a flex row gives,\n // which would defeat `can-shrink` before `min-content` was ever consulted.\n min-width: 0;\n min-height: 0;\n }\n}\n","// _inscription.scss — <gtk-inscription>: a flex row whose two pseudo-elements are `xalign`,\n// and whose four custom properties are the size request the C measures in characters and\n// lines.\n//\n// `GtkInscription`'s CSS NAME IS `label` (gtkinscription.c:780), so libadwaita's whole\n// `label {}` cascade reaches it — which means there is no `inscription` block in\n// `refs/libadwaita/src/stylesheet/` to port and none is invented here. `_labels.scss` already\n// styles every class on this node (`.dimmed`, `.numeric`, `.title-1`), and the element\n// carries the same two of those: the `tnum` in `text-overflow` is the label's own.\n//\n// THE FOUR COUNTS ARE `ch` AND `lh`, NOT PIXELS. `gtk_inscription_measure_width` multiplies\n// `min_chars` by the font's average character width and returns\n// `MAX (min_chars, nat_chars)` for the natural (gtkinscription.c:347-348);\n// `measure_height` does the same over a line height (gtkinscription.c:383-384). CSS `ch` IS\n// the advance width of the `0` glyph — the same \"average character\" Pango measures — and `lh`\n// IS the line box, which is `line_pixels`. So the element sets these four and this rule\n// applies them; `--gtk-inscription-width` carries the `MAX` because\n// `labelWidthCharsExtent` already encodes it in `@gjsify/adwaita-core`.\n//\n// THE `auto` FALLBACK IS THE ZERO CASE, AND IT IS NOT THE SAME AS `0`. Both measures\n// return NOTHING when the two counts are zero at once (gtkpicture's sibling,\n// gtkinscription.c:344-345, :378-379) — the inscription does not participate in sizing, and\n// its minimum is whatever the widget already had. `min-width: 0ch` would be a very\n// different, much smaller widget, so the element writes `auto` and this rule leaves the\n// declaration off entirely when it sees it.\n//\n// `xalign`'s SPACERS. GTK places the text at `xalign * (width − text width)` inside the\n// allocation (the same `gtk_label_get_layout_location` arithmetic, transcribed for this\n// widget in `gtk-inscription.ts`'s header). Flexbox's `flex-grow` takes a ratio, so\n// splitting the free space between `::before` and `::after` in the ratio\n// `xalign : 1 − xalign` IS that formula. The default is 0 (gtkinscription.c:67, :791), so\n// out of the box `::before` has zero growth and all the free space lands before the text —\n// which is what a caption under a centred icon wants, with no flex rule of its own.\n//\n// `yalign` IS `--gtk-inscription-align-items`, NOT A SECOND SPACER PAIR. CSS gives\n// `align-items` three keywords and no continuum the way `flex-grow` gives `xalign` one, and\n// `labelYalignAlignItems` (`@gjsify/adwaita-core`) maps to the nearest of the three. That\n// is a DECLARED divergence and `_labels.scss`'s header states it at length for\n// `<gtk-label>`; it is the same declaration here and is not re-argued.\n//\n// `white-space: pre` BECAUSE THE STRING IS TEXT AND A NEWLINE IS A NEWLINE. Pango keeps a\n// newline and a run of spaces, and an inscription that does not wrap is as wide as its\n// text. There is no `[wrap]` attribute on this widget — unlike `<gtk-label>`, an inscription\n// always has a box to lay out in, because that is what it is FOR — so `pre-wrap` is the\n// base rule and `white-space: pre` is not needed at all. The wrap-mode rules below change\n// where a line MAY break, which is a different question from whether one exists.\n//\n// `overflow-wrap: anywhere` IS THE DEFAULT HERE, NOT AN OPT-IN. The pspec says so in its own\n// comment (gtkinscription.c:738-740): unlike `GtkLabel`, the default is\n// `PANGO_WRAP_WORD_CHAR`, because an inscription reserves a box of a known character count\n// and a word longer than that box has to break inside it. `word` therefore needs a rule to\n// turn the default OFF, and `char` needs one to break anywhere. This is the reverse of\n// `_labels.scss`, where `word` is the browser's un-overridden behaviour and needs none —\n// a deliberate inversion, and the reason it reads the other way round.\n//\n// `text-overflow` NEEDS A BOX, WHICH IS WHY `overflow` IS NOT `visible`. CSS only ellipsises\n// a block container with a constrained width, so the same `overflow: hidden` `_labels.scss`\n// puts on its clamp is here — unconditionally, because `text-overflow` is a property of\n// this widget with `clip` as its default rather than an ellipsize a label opts into. With\n// `clip` the value `labelEllipsizeOverflowValue` supplies is `clip`, so nothing disappears\n// silently; with any of the three `ellipsize-*` members it is `ellipsis`, the one truncating\n// value CSS has, which is the declared `start`/`middle` divergence\n// `labelEllipsizeOverflowValue`'s own doc comment carries.\n//\n// Reference: refs/gtk/gtk/gtkinscription.c:59-69,338-412,726-777,780\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss (the `label {}` cascade this\n// widget's CSS name selects)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-inscription {\n display: flex;\n\n // `gtk_inscription_measure_width`/`_height` in `ch` and `lh`\n // (gtkinscription.c:347-348, :383-384), with the element's `auto` standing for the C's\n // \"both counts are zero, this widget does not participate in sizing\" case\n // (gtkinscription.c:344-345, :378-379).\n min-width: var(--gtk-inscription-min-ch, auto);\n width: var(--gtk-inscription-width, auto);\n min-height: var(--gtk-inscription-min-lh, auto);\n height: var(--gtk-inscription-height, auto);\n\n // `--gtk-inscription-align-items` is `labelYalignAlignItems` — nearest-of-three, the\n // DECLARED divergence `_labels.scss`'s header explains.\n align-items: var(--gtk-inscription-align-items, center);\n\n // An inscription always has a box, so it always wraps; `white-space: pre-wrap` keeps a\n // newline and a run of spaces as Pango does while still honouring the wrap below.\n white-space: pre-wrap;\n // CSS ellipsises only inside a box with a constrained width.\n overflow: hidden;\n text-overflow: var(--gtk-inscription-text-overflow, clip);\n\n // GTK's `xalign * (width − text width)`, as a `flex-grow` ratio pair.\n &::before,\n &::after {\n content: '';\n flex-shrink: 1;\n flex-basis: 0;\n }\n\n &::before {\n flex-grow: var(--gtk-inscription-xalign, 0);\n }\n\n &::after {\n flex-grow: calc(1 - var(--gtk-inscription-xalign, 0));\n }\n\n // `PANGO_WRAP_WORD_CHAR` is the pspec DEFAULT (gtkinscription.c:738-740), so `anywhere`\n // is the base rule and the other two nicks are the overrides — the reverse of\n // `_labels.scss`, where `word` is the browser's own behaviour.\n overflow-wrap: anywhere;\n\n &[wrap-mode='word'] {\n overflow-wrap: normal;\n }\n\n // Pango's CHAR is \"break anywhere\", which is CSS `break-all` — the same mapping\n // `_labels.scss:112-126` states for `<gtk-label>`, from the same two CSS declarations.\n &[wrap-mode='char'] {\n word-break: break-all;\n }\n}\n","// _video.scss — <gtk-video>: the overlay, the big circular play glyph, and the controls\n// bar that reveals itself for three seconds.\n//\n// libadwaita styles `GtkVideo` in ONE place, and it is three lines\n// (refs/libadwaita/src/stylesheet/widgets/_misc.scss:74-81):\n//\n// video {\n// & image.osd {\n// min-width: 64px;\n// min-height: 64px;\n// border-radius: 32px;\n// }\n// }\n//\n// Those three values are kept VERBATIM below, and the reason they are interesting is that\n// they are a `.circular` button at a LARGER size: libadwaita's own circular button is 34px\n// with a 9999px radius (refs/libadwaita/src/stylesheet/widgets/_buttons.scss:311-319), and\n// the video's icon is 64px with a 32px radius — half its own width, which for a circle is\n// the same shape at twice the size. So the radius here is `min-width / 2` and not the 9999px\n// the button uses, and that difference is upstream's, not a porting shortcut.\n//\n// The `.osd` HALF is `%osd` (refs/libadwaita/src/stylesheet/_common.scss:43-60): the\n// on-screen-display surface — a translucent dark plate, a near-white foreground and the\n// accent colours recomputed to sit on it. `_style_classes.scss` already owns `.osd` for every\n// widget, so the icon here gets it for free and nothing in this partial restates it.\n//\n// The controls bar wears `.osd` AND `.bottom` (refs/gtk/gtk/ui/gtkvideo.ui). `.osd` is the\n// half with a rule — the same `%osd` surface — and `.bottom` is a PLACEMENT class with no\n// libadwaita rule anywhere: `grep` over `refs/libadwaita/src/stylesheet/` finds `bottom`\n// only on `bottom-sheet`, `bottom-bar`, `notebook.bottom` and `colorchooser.bottom`, none of\n// which is a video. It is GTK's own hint from the template and it is honoured here as the\n// vertical placement it plainly is — the bar sits at the end of the cross axis — with the\n// padding the `.osd` toolbar takes (12px, refs/libadwaita/src/stylesheet/widgets/\n// _toolbars.scss:96-100).\n//\n// THE REVEALER IS A TRANSITION, NOT A TOGGLE WITH A DELAY. `gtk_video_reveal_controls`\n// (gtkvideo.c:125-133) reveals a `GtkRevealer` and arms a 3 s timeout that hides it again,\n// and the motion controller re-arms on every movement — so the bar is out after three\n// seconds of stillness, not three seconds after the first movement, and the element's\n// `revealControls()` re-arms for the same reason. The `transition` below is the revealer's\n// own cross-fade, and `.revealed` is the only state selector: there is no `hidden` to fight\n// because the revealer never leaves the layout.\n//\n// `graphics-offload` HAS NO RULE, AND SAYS SO. `GtkGraphicsOffload` moves a subtree into a\n// shared GL texture so it and its neighbours composite on the GPU; CSS has no such\n// mechanism, so the class the element sets is deliberately UNSTYLED. A page may target it,\n// nothing in this package does, and the property is observed rather than listed as a gap in\n// `check-adwaita-element-properties.mjs` — the property is read and written faithfully, what\n// it does not buy is a faster composite.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:74-81 (the whole GtkVideo\n// block), _common.scss:43-60 (`%osd`), _buttons.scss:311-319 (`.circular`),\n// _toolbars.scss:96-100 (`.toolbar.osd`)\n// Reference: refs/gtk/gtk/ui/gtkvideo.ui (the `.osd .circular` icon, the `.osd .bottom`\n// controls, the 3 s reveal), gtkvideo.c:125-133\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-video {\n position: relative;\n display: block;\n overflow: hidden;\n\n // The overlay of ui/gtkvideo.ui: the media underneath, the icon over it, the revealer\n // over that.\n .adw-video-surface {\n position: relative;\n display: flex;\n\n > video {\n width: 100%;\n height: 100%;\n object-fit: contain;\n }\n }\n\n // `ui/gtkvideo.ui`'s `overlay_icon`: `halign`/`valign` 3, i.e. FILL, which is what makes\n // it centred in an overlay on both axes — GTK's own `GTK_ALIGN_FILL` on an overlay child\n // stretches it, and this is the web's answer for \"fill the overlay and centre inside it\".\n .adw-video-overlay-icon {\n position: absolute;\n inset: 0;\n margin: auto;\n\n // `min-width: 64px; min-height: 64px; border-radius: 32px` — libadwaita's own three\n // lines for `video image.osd` (_misc.scss:76-80). The radius is half the width, which is\n // the same shape `.circular` gives at 34px (_buttons.scss:311-319) at twice the size.\n min-width: 64px;\n min-height: 64px;\n border-radius: 32px;\n\n // `GtkImage`'s icon inside the button, and `icon-size` 2 in the template\n // (ui/gtkvideo.ui) is GTK's dialog-scale — which is the 64px above.\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n border: none;\n // A GtkImage with `has-frame` unset inside an OSD plate: the plate IS the surface, so\n // the button adds no background of its own.\n background: none;\n color: inherit;\n cursor: pointer;\n\n // `gtk_video_update_playing` (gtkvideo.c:665) sets the icon's VISIBILITY to\n // `!playing`, so this is `visibility` rather than `display`: the icon keeps its box and\n // the OSD plate under it is unaffected either way, which is what `[hidden]` would also\n // give — but `hidden` is the UA rule and this one is the C's.\n &[hidden] {\n visibility: hidden;\n }\n }\n\n // `ui/gtkvideo.ui`'s `controls_revealer`: a `GtkRevealer` with `valign` 2 (END) and\n // `transition-type` 1 (CROSS-FADE), and `measure` 1 so the bar is allocated even while\n // hidden — which is why this is an opacity transition and not `display: none`.\n .adw-video-controls-revealer {\n position: absolute;\n inset: auto 0 0 0;\n opacity: 0;\n pointer-events: none;\n transition: opacity 150ms ease-out;\n\n &.revealed {\n opacity: 1;\n pointer-events: auto;\n }\n\n // `.osd .bottom` (ui/gtkvideo.ui). The bar is `osd` — the `%osd` surface from\n // `_common.scss:43-60` — with the padding a standalone OSD toolbar takes: 12px against\n // the 6px of a plain one (_toolbars.scss:91-102).\n gtk-media-controls {\n padding: 12px;\n }\n }\n\n // Playing hides the overlay icon and shows nothing over the frames. Declared as a class so\n // a page can see the state without reading the icon's `hidden`, and because GTK's own state\n // is a widget VISIBILITY (gtkvideo.c:665) rather than a style class.\n &.playing .adw-video-overlay-icon {\n pointer-events: none;\n }\n\n // `GtkVideo:graphics-offload` — deliberately UNSTYLED. See the header.\n}\n","// _media_controls.scss — <gtk-media-controls>: a box of six pixels' spacing, two labels in\n// tabular figures, and a range input.\n//\n// libadwaita has NO `_media-controls.scss`. `GtkMediaControls` is styled only through the\n// `.osd` and `.bottom` classes `ui/gtkvideo.ui` puts on it, which is what `_video.scss` has\n// already spent itself on: the `%osd` surface (_common.scss:43-60) and the 12px padding a\n// standalone OSD toolbar takes (_toolbars.scss:96-100). So this partial is the C's layout\n// and nothing else — the six numbers below are all the template says.\n//\n// THE TEMPLATE'S `spacing` 6 IS THE ONLY LAYOUT PROPERTY THAT SURVIVES.\n// `box { spacing: 6 }` in `ui/gtkmediacontrols.ui` becomes the gap between the play button,\n// the time box and the volume button. Nothing else in the template is a spacing: the time\n// box has none of its own, and the labels sit against the scale with no gap at all, which is\n// why `gap` is applied to the OUTER box only.\n//\n// `font-variant-numeric: tabular-nums` IS BOTH LABELS' `font-features \"tnum=1\"`. That\n// attribute on each label (`ui/gtkmediacontrols.ui`) is the only reason the class exists, and\n// it is load-bearing rather than cosmetic: a position counting 9→10 must not change the\n// width of the string, or the seek scale beside it shifts sideways once a second. The same\n// declaration `_labels.scss` applies to the `.numeric` utility class reaches a\n// `Gtk.Label`; this widget's labels are spans of the element's own tree, so the class is\n// applied here.\n//\n// THE SEEK SCALE IS `<input type=\"range\">` WITH GTK'S ADJUSTMENT SPELLED OUT.\n// `time_adjustment` is `upper` 10, `step-increment` 1, `page-increment` 10\n// (`ui/gtkmediacontrols.ui`), and every real duration arrives by resetting the adjustment's\n// range to the media's own — so `min` 0, `max` the duration in seconds and `step` 1 second.\n// `page-increment` 10 has no HTML equivalent: a range input's Page key moves by ten STEPS,\n// not by ten units, which is a different thing and cannot be made to agree. That is the one\n// adjustment property that does not survive, and it is worth naming rather than leaving to be\n// discovered.\n//\n// THE VOLUME SLIDE IS THE OTHER ADJUSTMENT, AND IT IS A DIFFERENT SHAPE.\n// `volume_adjustment` is `upper` 1, `step-increment` 0.1, `page-increment` 1, `value` 1 —\n// full scale in tenths — so `min` 0, `max` 1, `step` 0.1. It lives in the volume button's\n// popover because `GtkVolumeButton` IS a menu button with an adjustment popover; the\n// popover surface is `_popovers.scss`'s, reused through the `.adw-popover` class rather than\n// restated here.\n//\n// `.insensitive` IS THE TEMPLATE'S `sensitive` 0. `ui/gtkmediacontrols.ui` sets it on the\n// whole box, and `gtk_media_controls_set_sensitive` is what re-enables it — so a controls\n// bar with no stream attached is inert, which is the state the element renders by default.\n// GTK's `:disabled` opacity is `_buttons.scss`'s `$disabled-opacity`, and the same token is\n// used here for the whole bar rather than per button, because in the C the insensitivity is\n// the CONTAINER's.\n//\n// Reference: refs/gtk/gtk/ui/gtkmediacontrols.ui (the node tree and both adjustments)\n// Reference: refs/libadwaita/src/stylesheet/_common.scss:43-60 (`%osd`, applied by\n// `_video.scss`), widgets/_toolbars.scss:96-100 (the `.osd` toolbar's 12px padding)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss (`:disabled` opacity)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-media-controls {\n display: flex;\n align-items: center;\n color: var(--window-fg-color);\n\n // `box { sensitive: 0; spacing: 6 }` (ui/gtkmediacontrols.ui).\n gap: 6px;\n\n // `gtk_media_controls_set_sensitive` — the container's own insensitivity, which is where\n // the template puts it. Same token `_buttons.scss` uses for a `:disabled` button.\n &.insensitive,\n &:disabled {\n opacity: var(--disabled-opacity);\n }\n\n .adw-media-controls-box {\n display: flex;\n flex: 1;\n gap: 6px;\n align-items: center;\n min-width: 0;\n }\n\n // `play_button` is a `GtkButton` with `has-frame` 0 — a flat button — and so is the\n // `volume_button` beside it. `.adw-flat` is this package's flat-button class; `_button.scss`\n // owns the shape, and nothing here restates it.\n .adw-media-controls-button {\n flex-shrink: 0;\n }\n\n // `time_box` — the middle `GtkBox`, `hexpand` on the scale inside it.\n .adw-media-controls-time-box {\n display: flex;\n flex: 1;\n align-items: center;\n min-width: 0;\n }\n\n // BOTH labels' `font-features \"tnum=1\"` (ui/gtkmediacontrols.ui). Tabular figures, so a\n // position counting 9→10 does not resize its own string and shift the scale sideways.\n .adw-media-controls-time-label,\n .adw-media-controls-duration-label {\n // `font-variant-numeric: tabular-nums` is a UTILITY class on a label in libadwaita\n // (`_labels.scss`); it is applied here directly because these are spans of this element's\n // own tree rather than `<gtk-label>`s a consumer styled.\n font-variant-numeric: tabular-nums;\n // The two labels must never be squeezed: they are the numbers the seek bar is read\n // against, and a truncated `-1:02:03` is worse than a narrower scale.\n flex-shrink: 0;\n padding: 0 2px;\n }\n\n // `seek_scale` — the `GtkScale`, `hexpand` 1 and `restrict-to-fill-level` 0.\n .adw-media-controls-seek-scale {\n flex: 1;\n min-width: 0;\n accent-color: var(--accent-color);\n }\n\n // The volume button is a POSITIONING context for its own popover, which is what makes the\n // surface sit below the button rather than beside the bar — `GtkVolumeButton` is a\n // `GtkMenuButton`, so the surface hangs off its anchor.\n .adw-media-controls-volume-button {\n position: relative;\n }\n\n // `<gtk-popover>` is this package's ONE popover surface and `_popover.scss`'s header says\n // why: three hand-rolled copies of the plate disagreed with libadwaita and with each\n // other before it was lifted out. So the volume slide goes in a real one and this partial\n // states nothing about its shape — only that it hangs from the button and does not take\n // clicks meant for the slide.\n .adw-media-controls-volume-popover {\n top: calc(100% + 6px);\n left: 50%;\n // `_popover.scss`'s own `$popover-gap`, restated here rather than imported: the gap is\n // the DISTANCE from anchor to surface, which is a property of the anchor's positioning\n // and belongs to the widget that owns the anchor.\n transform: translateX(-50%);\n }\n\n .adw-media-controls-volume-scale {\n width: 120px;\n accent-color: var(--accent-color);\n }\n}\n","// _list_box.scss — <gtk-list-box> and its rows, the elements GTK names `list` and `row`.\n//\n// The `list` NODE and the `row` NODE, because upstream writes them as one block and because\n// libadwaita styles them against EACH OTHER: the separator rule is\n// `&.separators:not(.horizontal) > row:not(.separator)` (_lists.scss:29-32), which is a rule\n// about the list's class and the row's own — a port that styled the rows alone could not\n// express it at all.\n//\n// `<gtk-list-box>` IS NOT AN ORIENTABLE, which is worth the header repeating: `GtkListBase` is\n// (gtklistbase.c:2070) and `<gtk-list-view>` therefore takes an `orientation`, while\n// `GtkListBox` has no such property and its rows always run down. So the\n// `&.horizontal` arm of the upstream separator rule has no counterpart here, and the partial\n// draws only the vertical half.\n//\n// The colour tokens are libadwaita's own, spelled with this package's variables:\n// `$view_hover_color` is `currentColor 4%`, `$view_active_color` `currentColor 8%` and\n// `$view_selected_color` `var(--accent-bg-color) 25%` (_colors.scss:263-276).\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:5-38 (list), :47-95 (row)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-list-box {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n background-clip: padding-box;\n\n // `listview, list { border-color: $border_color }` (_lists.scss:10) — the upstream rule\n // names a COLOUR and nothing else, because GTK draws a border only where a width or a\n // style is set alongside it. So a bare list has no frame, and that is what this is: the\n // frame used to sit here unconditionally, which made every list read as a card where\n // libadwaita draws one only for `list.boxed-list` (_lists.scss:520) — `Adw.PreferencesGroup`\n // carries that one, through `%card` (_preferences.scss:83), so nothing needed it here.\n border-color: var(--border-color);\n\n &.view:disabled {\n color: var(--view-fg-color);\n }\n}\n\ngtk-list-box-row {\n display: block;\n box-sizing: border-box;\n background-clip: padding-box;\n // `listview > row { padding: 2px }` (_lists.scss:16-19).\n padding: 2px;\n\n &.activatable {\n cursor: pointer;\n }\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 4%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 8%, transparent);\n }\n\n // `row &:selected { background-color: $view_selected_color }` (_lists.scss:92-94), with the\n // hover and active shades over it (_lists.scss:83-89).\n &.selected {\n background-color: color-mix(in srgb, var(--accent-bg-color) 25%, transparent);\n }\n\n &.selected:hover {\n background-color: color-mix(in srgb, var(--accent-bg-color) 40%, transparent);\n }\n\n &.selected:active {\n background-color: color-mix(in srgb, var(--accent-bg-color) 50%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n}\n\n// `.separators` is the class GTK adds for `show-separators` (gtklistbox.c:4127-4134), and the\n// rule goes on every row but the last — upstream `> row:not(.separator)`, and a\n// `<gtk-separator>` row is not one, so the port's `:last-child` is the same exclusion without\n// giving the separator a class GTK would then have to know about.\ngtk-list-box.separators > gtk-list-box-row:not(:last-child) {\n border-bottom: 1px solid var(--border-color);\n}","// _flow_box.scss — <gtk-flow-box> and its cells, the elements GTK names `flowbox` and\n// `flowboxchild`.\n//\n// Upstream writes `flowbox > flowboxchild, gridview > child` as ONE rule (_views.scss:52-91):\n// the same 3px padding, the same `$button_radius` corner, the same focus ring and the same four\n// state colours — and `<gtk-grid-view>` already wears the grid half in `_grid_view.scss`, which\n// `@include`s `adw-list-selectable` from `_list_view.scss` for exactly that reason. The cell\n// here therefore includes the same mixin rather than restating four colours, because a drifted\n// copy is four wrong ones and the hover-over-selected pair is the pair nobody checks by eye.\n//\n// `flex-flow: row wrap` IS the allocation. GTK hands each child a slot on a running line in\n// the given orientation and starts a new one when the next would not fit\n// (gtkflowbox.c:1640-1900), and a wrapping flex line with a per-child size share is that rule\n// expressed in the browser's own layout language: `max-width: 100% / max-children-per-line`\n// caps how many can share a line, and `min-width: 100% / min-children-per-line` is\n// `min-children-per-line`, whose own documented job is that \"a reasonably small height will be\n// requested for the overall minimum width of the box\" (gtkflowbox.c:3747-3755).\n//\n// `homogeneous` is `flex: 1 1 0` — GTK's \"all children should be allocated the same size\"\n// (:3736-3739), which in a wrapping line is exactly equal growth from a zero basis.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_views.scss:1-16 (.view), :52-91\n// (flowbox > flowboxchild), :88-91 (flowbox, gridview disabled)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'list_view';\n\ngtk-flow-box {\n display: block;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n\n // The line container. `--adw-flow-box-*` are written by `gtk-flow-box.ts` from the\n // properties, so the stylesheet stays declarative and a `homogeneous` write is one class.\n display: flex;\n flex-flow: row wrap;\n gap: var(--adw-flow-box-row-spacing, 0px) var(--adw-flow-box-column-spacing, 0px);\n\n &.vertical {\n flex-flow: column wrap;\n }\n\n &.view:disabled {\n color: var(--view-fg-color);\n }\n}\n\ngtk-flow-box-child {\n @include list_view.adw-list-selectable;\n\n display: block;\n box-sizing: border-box;\n // `flowbox > flowboxchild { padding: 3px; border-radius: $button_radius }`\n // (_views.scss:52-56).\n padding: 3px;\n border-radius: var(--button-radius);\n // The line share. A browser lays the children out, so this is where GTK's\n // `min`/`max-children-per-line` and `homogeneous` are honoured — and the share has to\n // LEAVE ROOM FOR THE SPACING. `100% / N` alone does not: N children then need N shares\n // PLUS the (N-1) gaps between them, so the row overflows by the gaps and the browser\n // breaks it one child early. Measured on the gallery's flow box — `min-children-per-line`\n // 2, `max` 4, a 6px spacing in a 320px box — the share came out at 50% (160px), two\n // children plus one gap came to 326px, and the box showed ONE child per line where\n // libadwaita packs four. The share is therefore (100% - (N-1) × spacing) / N.\n max-width: calc(\n (100% - (var(--adw-flow-box-max-children-per-line, 7) - 1) *\n var(--adw-flow-box-column-spacing, 0px)) / var(--adw-flow-box-max-children-per-line, 7)\n );\n min-width: calc(\n (100% - (var(--adw-flow-box-min-children-per-line, 1) - 1) *\n var(--adw-flow-box-column-spacing, 0px)) / var(--adw-flow-box-min-children-per-line, 1)\n );\n cursor: pointer;\n}\n\ngtk-flow-box.vertical > gtk-flow-box-child {\n // The same arithmetic down the other axis, against the ROW spacing.\n max-height: calc(\n (100% - (var(--adw-flow-box-max-children-per-line, 7) - 1) *\n var(--adw-flow-box-row-spacing, 0px)) / var(--adw-flow-box-max-children-per-line, 7)\n );\n max-width: none;\n min-height: calc(\n (100% - (var(--adw-flow-box-min-children-per-line, 1) - 1) *\n var(--adw-flow-box-row-spacing, 0px)) / var(--adw-flow-box-min-children-per-line, 1)\n );\n min-width: 0;\n}\n\ngtk-flow-box.homogeneous > gtk-flow-box-child {\n flex: 1 1 0;\n}","// _calendar.scss — <gtk-calendar>: the `calendar` node, its header, and the grid of\n// `day-name` / `week-number` / `day-number` labels.\n//\n// libadwaita's block is 58 lines and almost all of it is state: `:checked` for a MARKED day,\n// `:selected` for the SELECTED one, `.today` for today's, `.other-month` for the spill. The\n// port spells those as four classes off one element — `gtk-calendar.ts` raises the same four\n// widget state flags `calendar_update_day_labels` does (gtkcalendar.c:1015-1046) — and the\n// selectors below are the same four, in the same specificity order, so the cascade resolves\n// the way the C's stylesheet resolves it.\n//\n// THE CASCADE ORDER MATTERS and it is why the rules are not merged: `label.today` sets an\n// inset box-shadow and then CANCELS it under `:selected` (_calendar.scss:24-30), and\n// `.day-number:checked` sets a 30% accent tint that `:selected` then replaces with the solid\n// accent (_calendar.scss:37-51). A merged rule that applied `:checked` last would tint the\n// selected day, which is exactly what upstream avoids.\n//\n// `font-variant-numeric: tabular-nums` is the load-bearing line for a grid of day numbers: the\n// column widths come from the widest number, and proportional digits would make 1 narrower than\n// 8 and the whole grid breathe as the month changes.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_calendar.scss:1-58\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-calendar {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n color: var(--view-fg-color);\n background-color: var(--view-bg-color);\n background-clip: padding-box;\n // `calendar { border: 1px solid $border_color }` (_calendar.scss:4).\n border: 1px solid var(--border-color);\n border-radius: var(--window-radius);\n font-variant-numeric: tabular-nums;\n\n &.view:disabled {\n color: var(--view-fg-color);\n }\n}\n\n.adw-calendar-header {\n display: flex;\n align-items: center;\n gap: 2px;\n padding: 4px;\n // `> header { border-bottom: 1px solid $border_color }` (_calendar.scss:12).\n border-bottom: 1px solid var(--border-color);\n}\n\n.adw-calendar-month {\n font-weight: bold;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.adw-calendar-year {\n // The C measures the year label once and adds 10px so \"changing the year does not increase\n // the calendar width\" (gtkcalendar.c:853-858) — a fixed slot is the same promise.\n flex: 0 0 auto;\n font-weight: bold;\n}\n\n.adw-calendar-nav-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: 0 0 auto;\n // `@extend %button_basic_flat` with `border-radius: 0` (_calendar.scss:15-16).\n border-radius: 0;\n\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n}\n\n.adw-calendar-grid {\n display: grid;\n // Column 0 is the week-number column upstream (gtkcalendar.c:786-790), and it exists whether\n // or not the numbers are shown, so the day names and the days line up under it either way.\n grid-template-columns: auto repeat(7, 1fr);\n // `> grid { padding-left: 3px; padding-bottom: 3px }` (_calendar.scss:21-22).\n padding: 3px 0 3px 3px;\n}\n\n.adw-calendar-day-name,\n.adw-calendar-week-number,\n.adw-calendar-week-spacer {\n // `margin-top: 3px; margin-right: 3px` (_calendar.scss:34-35), applied to the labels.\n margin-top: 3px;\n margin-right: 3px;\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n text-align: center;\n}\n\n.adw-calendar-week-number,\n.adw-calendar-week-spacer {\n // The week-number column is the day names' share of a cell: a number is narrower than a name,\n // and letting it size itself would make the grid jitter between a wide and a narrow month.\n max-width: 2.5em;\n}\n\n.adw-calendar-cell {\n // `> label { margin-top: 3px; margin-right: 3px }` and `.day-number { padding: 3px }`\n // (_calendar.scss:32-38).\n margin-top: 3px;\n margin-right: 3px;\n padding: 3px;\n border: none;\n border-radius: 0;\n background: none;\n color: inherit;\n font: inherit;\n font-variant-numeric: inherit;\n line-height: 1;\n text-align: center;\n cursor: pointer;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 6%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 12%, transparent);\n }\n\n &:focus-visible,\n &.focused {\n // `@include focus-ring($focus-state: ':focus')` (_calendar.scss:33) — the C focuses the\n // LABEL rather than the grid, which is what `.focused` is on this port.\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // `:checked` — `background-color: color-mix(… var(--accent-bg-color) 30%, transparent)`\n // (_calendar.scss:39-43), the MARKED day.\n &.marked {\n border-radius: var(--button-radius);\n background-color: color-mix(in srgb, var(--accent-bg-color) 30%, transparent);\n }\n\n // `:selected { background-color: var(--accent-bg-color); color: var(--accent-fg-color) }`\n // (_calendar.scss:45-50), and it comes AFTER `:checked` so the selected day is not tinted.\n &.selected {\n border-radius: var(--button-radius);\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n }\n\n // `.other-month { color: color-mix(in srgb, currentColor 30%, transparent) }`\n // (_calendar.scss:53-55), the leading and trailing spill.\n &.other-month {\n color: color-mix(in srgb, currentColor 30%, transparent);\n }\n\n // `label.today { box-shadow: inset 0 0 0 -2px $border_color }` (_calendar.scss:24-25) — an\n // inset rule, not a border, so it does not change the cell's size.\n &.today {\n box-shadow: inset 0 -2px var(--border-color);\n }\n\n // `label.today:selected { box-shadow: none }` (_calendar.scss:27-29): the selected day's\n // accent fill IS the emphasis, so today's underline steps aside rather than doubling up.\n &.today.selected {\n box-shadow: none;\n }\n\n &[disabled] {\n // `lower_limit_reached` / `upper_limit_reached` blank those cells and make them\n // insensitive (gtkcalendar.c:1004-1015), so there is nothing to dim — just nothing.\n background: none;\n cursor: default;\n }\n}","// _preferences.scss — adw-preferences-group styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_preferences.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_preferences.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'style_classes';\n\nadw-preferences-group {\n display: block;\n\n // An author `display` beats the UA `[hidden] { display: none }` regardless of\n // specificity, so without this a group hidden through the DOM `hidden`\n // property would keep rendering — the search treats it as invisible\n // (`is_visible_group`), and the two must agree.\n &[hidden] {\n display: none;\n }\n\n // The header is a flex row: a title/description label column on the left\n // (stretches to fill) and the optional header-suffix on the trailing edge.\n .adw-preferences-group-header {\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n padding: var(--spacing-xs) 2px;\n\n // An author `display` beats the UA `[hidden] { display: none }` no matter\n // the specificity, so `headerEl.hidden = true` did NOTHING here: an empty\n // group kept its header box and its padding.\n &[hidden] {\n display: none;\n }\n\n // libadwaita's own metrics, keyed off `is_single_line`:\n // `> box.header:not(.single-line) { margin-bottom: 6px }` and\n // `> box.single-line { min-height: 34px }`\n // (refs/libadwaita/src/stylesheet/widgets/_preferences.scss:6-13). A\n // title-only or suffix-only header is one line tall and needs the height\n // floor instead of the gap below it.\n &:not(.single-line) {\n margin-bottom: 6px;\n }\n\n &.single-line {\n min-height: 34px;\n }\n }\n\n .adw-preferences-group-labels {\n display: flex;\n flex: 1 1 auto;\n flex-direction: column;\n min-width: 0;\n }\n\n .adw-preferences-group-suffix {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n }\n\n .adw-preferences-group-title {\n font-size: var(--font-size-base);\n font-weight: 700;\n margin: 0;\n color: var(--window-fg-color);\n }\n\n // Dimmed description line below the title.\n .adw-preferences-group-description {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n margin: 0;\n color: var(--window-fg-color);\n }\n\n // A preferences group's list IS a boxed list — same card surface, same clip\n // for the rounding of the first and last row. It used to carry its own copy of\n // the five card declarations.\n .adw-preferences-group-listbox {\n @extend %card;\n\n overflow: hidden;\n }\n}\n","// _preferences_row.scss — <adw-preferences-row>, the base of every boxed-list row.\n//\n// The row is a GTK `row` node inside the group's list, so its box comes from two places\n// in `_lists.scss`: `row` itself (a focus ring, `background-clip: padding-box`, and the\n// hover/active/selected colours under `.activatable`) and `list > row { padding: 2px }`\n// (:23-25). The metrics below are this package's shared row floor — the 50px minimum and\n// the card-fg hairline every `_row.scss` row uses — because libadwaita's own row height\n// is its theme's and a browser needs the number written down.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss:1-90 (`row`, `list > row`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_preferences.scss (the group's card)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components — the GTK `row` node\n// becomes the tag, and `:selected` becomes the row surface `<adw-preferences-group>`'s\n// list box already paints.\n\nadw-preferences-row {\n display: flex;\n align-items: center;\n min-height: 50px;\n padding: var(--spacing-s) var(--spacing-m);\n gap: var(--spacing-m);\n background-clip: padding-box;\n color: var(--card-fg-color);\n // The hairline between rows, which `_lists.scss` draws as\n // `&:not(.horizontal) > row:not(.separator) { border-bottom: 1px solid $border_color }`\n // (:32-34) — on the row, from the list it belongs to.\n border-bottom: 1px solid var(--card-shade-color);\n\n // `Gtk.Label:selectable` is `user-select: text`, and the element writes it on the\n // title span itself; this is the row-level floor so a copyable title survives a\n // stylesheet that resets selection.\n .adw-row-title {\n user-select: none;\n\n // A row with NO content section has a `hidden` one, and `[hidden]` is\n // `display: none !important` — so the row's free space belongs to no part at all and\n // `tooltip-text`, which rides a part (`src/row-tooltip.ts`), reaches only the label's\n // own width. Taking that space moves it into a box that draws nothing: the label is\n // start-aligned and the content's items are `flex-end`, so nothing on screen moves.\n &:has(~ .adw-preferences-row-content[hidden]) {\n flex: 1 1 auto;\n }\n }\n\n // The slot the `child` property lands in: the preference's own controls, which sit\n // after the title and take the rest of the row.\n .adw-preferences-row-content {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n flex: 1 1 auto;\n min-width: 0;\n justify-content: flex-end;\n }\n\n &:last-child {\n border-bottom: none;\n }\n}\n","// _card.scss — adw-card styling.\n//\n// The card SURFACE (colours, radius, elevation) is `%card` in\n// `_style_classes.scss`, shared with the documented `.card` class and with\n// `.boxed-list`; this element adds only what makes it an element: a block box\n// and the padding a bare `.card` deliberately does not have.\n//\n// Reference: refs/adwaita-web/adwaita-web/scss/_card.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss:197-236\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'style_classes';\n\nadw-card,\n.adw-card {\n @extend %card;\n\n display: block;\n padding: var(--spacing-l);\n overflow: hidden;\n}\n","// _data_grid.scss — adw-data-grid: a slim, aligned numeric grid for genuinely\n// tabular data (an accounting BWA / P&L statement, invoice line-items). The web\n// mirror of the native Gtk.Grid the Buchhaltung app fills for its financial\n// statements — labels left, amounts right-aligned with tabular figures so\n// columns of numbers line up, plus the section / subtotal / total emphasis a\n// statement needs. NOT a Gtk.ColumnView (no sorting, no zebra striping); boxed\n// lists stay the default for record lists. Uses CSS subgrid so each row is a\n// real element (hover, hairline rules, activation) while columns stay aligned.\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss (separator / card / dim tokens)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (boxed-list density)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_labels.scss:13-15,81-88 (.dimmed / .monospace / .numeric)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// `.dimmed` / `.monospace` / `.numeric`. This file used to declare\n// `font-variant-numeric: tabular-nums` twice, inline a whole monospace font\n// stack, and dim its header row with a raw `opacity: var(--dim-opacity)` — i.e.\n// three private copies of utilities libadwaita publishes. It composes them now,\n// the way upstream's own `_progress-bar.scss:17-21` composes the same two.\n@use 'labels';\n\n.adw-data-grid {\n display: block;\n box-sizing: border-box;\n color: var(--card-fg-color);\n font-size: var(--font-size-base);\n\n // Optional title above the grid.\n .adw-data-grid-caption {\n font-size: var(--font-size-heading);\n font-weight: 700;\n color: var(--window-fg-color);\n margin: 0 0 var(--spacing-s);\n padding: 0 var(--spacing-xs);\n }\n\n // Horizontal scroll is CONTAINED here — a wide statement (many month columns)\n // scrolls sideways within the grid instead of overflowing the page.\n .adw-data-grid-scroll {\n overflow-x: auto;\n overflow-y: hidden;\n }\n\n // The grid owns the column tracks; each row is a subgrid spanning them, so\n // figures in the same column line up across every row. `min-width: max-content`\n // keeps columns from crushing — they overflow into the scroller instead.\n .adw-data-grid-table {\n display: grid;\n box-sizing: border-box;\n width: 100%;\n min-width: max-content;\n // grid-template-columns is set inline from the column descriptors.\n }\n\n .adw-data-grid-row {\n display: grid;\n grid-template-columns: subgrid;\n grid-column: 1 / -1;\n align-items: center;\n }\n\n // Airy Adwaita cell density (matching the boxed-list row rhythm), single-line.\n .adw-data-grid-cell {\n box-sizing: border-box;\n min-width: 0;\n padding: var(--spacing-s) var(--spacing-m);\n white-space: nowrap;\n text-align: left;\n\n &.align-end {\n text-align: right;\n }\n\n &.align-center {\n text-align: center;\n }\n\n // Tabular figures are the WHOLE POINT vs a boxed list — numbers line up.\n // `numeric` needs no rule at all: the cell carries the bare class, so\n // libadwaita's own `.numeric` (_labels.scss:86-88) already applies.\n // A mono cell is monospace AND tabular, so it composes both.\n &.mono {\n @extend .monospace;\n @extend .numeric;\n }\n }\n\n // Header row — dim, small, uppercase caps with a hairline underline (Adwaita\n // list-column headings), never sortable.\n .adw-data-grid-row.header {\n .adw-data-grid-cell {\n @extend .dimmed;\n\n font-size: var(--font-size-small);\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n border-bottom: 1px solid var(--separator-color);\n }\n }\n\n // A section header spans all columns as a bold group title (a BWA's sections).\n .adw-data-grid-row.variant-section {\n .section-cell {\n font-weight: 700;\n color: var(--window-fg-color);\n padding-top: var(--spacing-m);\n }\n }\n\n // A subtotal is bold with a hairline rule above it (Gesamtleistung, Rohertrag…).\n .adw-data-grid-row.variant-subtotal {\n border-top: 1px solid var(--separator-color);\n\n .adw-data-grid-cell {\n font-weight: 700;\n }\n }\n\n // The final total is bold with a STRONGER rule above (the accounting result —\n // Betriebsergebnis), plus a thin rule below to evoke the ruled grand-total line.\n .adw-data-grid-row.variant-total {\n border-top: 2px solid var(--separator-color);\n border-bottom: 1px solid var(--separator-color);\n\n .adw-data-grid-cell {\n font-weight: 800;\n color: var(--window-fg-color);\n }\n }\n\n // Optional interactive rows (master-detail). Hairline separators only where\n // Adwaita would — NOT zebra striping — so no default row borders; the hover /\n // focus affordance carries the interaction.\n .adw-data-grid-row.interactive {\n cursor: pointer;\n border-radius: var(--button-radius);\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n }\n}\n","// _bin.scss — <adw-bin>, the one-child container.\n//\n// libadwaita has NO `bin` node: `adw_bin_class_init` sets no CSS name and the\n// stylesheet never mentions one (the widget's whole rule is the layout manager, and\n// `GtkBinLayout` gives the child the widget's entire allocation). So the only rule here\n// is the block box that allocation needs, and the one cross-axis stretch that says\n// \"the child fills the bin\" — a `GtkBinLayout` gives its child the bin's height too,\n// which a block child would otherwise size to its own content.\n//\n// Reference: refs/libadwaita/src/adw-bin.c:123 (GtkBinLayout)\n// Reference: refs/gtk/gtk/gtkbinlayout.c:81 (`gtk_bin_layout_allocate` hands the child the\n// allocation on both axes)\n// Copyright (c) GNOME contributors (GTK, libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-bin {\n display: block;\n\n // One child, and it fills — `gtk_bin_layout_allocate` allocates the whole widget to\n // its single child. `:only-child` rather than `> *` because a bin keeps ONE\n // (`adw_bin_set_child` unparents the one it replaces), so the case where the selector\n // could match two is one the element has already refused.\n > :only-child {\n block-size: 100%;\n }\n}\n","// _clamp.scss — adw-clamp styling.\n//\n// The element itself is deliberately UNCAPPED and full-width: it is the box the\n// tightening curve is evaluated against, so it has to keep reporting the\n// AVAILABLE width. The cap and the centring live on the children, written by the\n// element from `clampAllocate` (see src/elements/adw-clamp.ts) — an element that\n// capped itself would feed its own capped width back into its ResizeObserver.\n//\n// Reference: refs/libadwaita/src/adw-clamp-layout.c (adw_clamp_layout_allocate)\n// Reference: refs/adwaita-web/adwaita-web/scss/_clamp.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-clamp {\n display: block;\n width: 100%;\n}\n","// _stack.scss — <gtk-stack>: one visible child out of many, with the animated\n// change between them.\n//\n// Upstream libadwaita styles the stack itself NOT AT ALL: `stack` appears in exactly\n// two rules of the whole stylesheet — `notebook > stack:not(:only-child)` for the\n// background (refs/libadwaita/src/stylesheet/widgets/_notebook.scss:213-215) and the\n// `stackswitcher`/`placessidebar` drop-target carve-out\n// (refs/libadwaita/src/stylesheet/_common.scss:81-89). Everything visible about a stack\n// is GTK's own node contract, which C declares: the `stack` css name and the GROUP\n// accessible role (gtkstack.c:1067-1068), the child that is laid out at all\n// (:2778-2831), the overlapping pair a transition paints (:1509-1519, :2662-2700) and\n// the measured size (:2833-2945). What follows is that contract written as CSS, with the\n// two libadwaita rules that reach a stack carried over verbatim where they apply.\n//\n// `<gtk-stack-switcher>` and `<gtk-stack-sidebar>` extend this same partial: libadwaita\n// styles their internals out of `_buttons.scss` and `_sidebars.scss` respectively, so the\n// three widgets share one stylesheet the way upstream shares three files.\n//\n// Reference: refs/gtk/gtk/gtkstack.c\n// Reference: refs/libadwaita/src/stylesheet/widgets/_notebook.scss:213-215\n// Copyright (c) The GTK Team. LGPLv2.1+.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-stack {\n display: flex;\n box-sizing: border-box;\n position: relative;\n min-width: 0;\n min-height: 0;\n\n // GTK allocates every child the stack's own size and lays out only the visible one\n // (gtkstack.c:2778-2831), so a page is a stretched box: `flex: 1 1 auto` plus the\n // cross-axis stretch `align-items: stretch` already gives. A page with a size\n // request of its own keeps it — `flex-basis: auto` is what makes the basis the\n // content rather than 0.\n > .adw-stack-page {\n box-sizing: border-box;\n flex: 1 1 auto;\n min-width: 0;\n min-height: 0;\n\n &:not(.visible-page) {\n display: none;\n }\n\n // An animated page is positioned, because two pages overlap for its duration\n // (gtkstack.c:1509-1519 keeps `last_visible_child` alive until the tracker is\n // AFTER, and the snapshot node paints both, :2662-2700).\n &.transitioning-in,\n &.transitioning-out {\n position: absolute;\n inset: 0;\n display: flex;\n flex-direction: column;\n }\n }\n\n // `hhomogeneous` is TRUE by default (gtkstack.c:981-987), and the measure pass then\n // looks at the VISIBLE child alone on that axis (gtkstack.c:2899-2905) — the stack is\n // as big as the current page. Turned off, the stack is as big as the LARGEST page,\n // which is `max-content` on the cross axis and `flex: 1 1 auto` along the main one.\n &:not([hhomogeneous]) > .adw-stack-page {\n flex: 0 1 auto;\n width: max-content;\n max-width: 100%;\n }\n\n &:not([vhomogeneous]) > .adw-stack-page {\n height: max-content;\n max-height: 100%;\n }\n\n // `interpolate-size` (gtkstack.c:2148-2172) smooths the SIZE change too, by\n // interpolating the measured min/natural between the two pages (gtkstack.c:2847-2859,\n // :2935-2943). A browser negotiates one layout, so the analogue is a CSS transition\n // on the stack's own box for the duration of the page change — which is the same\n // promise, reached through the mechanism this renderer actually has.\n &[interpolate-size] {\n transition-property: width, height;\n transition-duration: var(--stack-transition-duration, 200ms);\n transition-timing-function: cubic-bezier(0.2, 0, 0, 1);\n }\n}\n\n// ── Transitions ────────────────────────────────────────────────────────────\n// `transition-duration` is the progress tracker's length (gtkstack.c:1408-1411) and\n// `transition-running` is the flag the tick callback sets and clears\n// (gtkstack.c:1283-1286, :1313-1315). Every animation below is therefore written for\n// the FORWARD direction and mirrored by `animation-direction: reverse` for a backward\n// one — which is what `get_simple_transition_type` decides in C (gtkstack.c:1539-1556),\n// the incoming page sitting after the outgoing one meaning forward.\n// The mixins take the property/value PAIRS as a map and interpolate whole declarations,\n// because a declaration list cannot be interpolated into a `from { … }` block: `@content`\n// would be the way to accept declarations, but the keyframe names then cannot vary.\n@mixin stack-transition($name, $in-from, $in-to, $out-from, $out-to) {\n &[data-transition-type='#{$name}'] > .adw-stack-page.transitioning-in {\n animation-name: stack-in-#{$name};\n animation-duration: var(--stack-transition-duration, 200ms);\n animation-fill-mode: both;\n }\n\n &[data-transition-type='#{$name}'] > .adw-stack-page.transitioning-out {\n animation-name: stack-out-#{$name};\n animation-duration: var(--stack-transition-duration, 200ms);\n animation-fill-mode: both;\n }\n\n @keyframes stack-in-#{$name} {\n from {\n @each $prop, $value in $in-from {\n #{$prop}: $value;\n }\n }\n\n to {\n @each $prop, $value in $in-to {\n #{$prop}: $value;\n }\n }\n }\n\n @keyframes stack-out-#{$name} {\n from {\n @each $prop, $value in $out-from {\n #{$prop}: $value;\n }\n }\n\n to {\n @each $prop, $value in $out-to {\n #{$prop}: $value;\n }\n }\n }\n}\n\n@mixin stack-transition-in-only($name, $in-from, $in-to) {\n &[data-transition-type='#{$name}'] > .adw-stack-page.transitioning-in {\n animation-name: stack-in-#{$name};\n animation-duration: var(--stack-transition-duration, 200ms);\n animation-fill-mode: both;\n }\n\n @keyframes stack-in-#{$name} {\n from {\n @each $prop, $value in $in-from {\n #{$prop}: $value;\n }\n }\n\n to {\n @each $prop, $value in $in-to {\n #{$prop}: $value;\n }\n }\n }\n}\n\n// CROSSFADE — GTK_STACK_TRANSITION_TYPE_CROSSFADE (gtkstack.c:98): both pages are on\n// screen at once and their opacity is interpolated (gtkstack.c:2432-2454).\n@include stack-transition(crossfade, (opacity: 0), (opacity: 1), (opacity: 1), (opacity: 0));\n\n// SLIDE — `slide-right` … `slide-down` (gtkstack.c:99-102). The outgoing page LEAVES in\n// the named direction and the incoming one arrives from the opposite side, which is why\n// one pair of keyframes covers both (gtkstack.c:2597-2660).\n@include stack-transition(\n slide-right,\n (transform: translateX(-100%)),\n (transform: translateX(0)),\n (transform: translateX(0)),\n (transform: translateX(100%))\n);\n@include stack-transition(\n slide-left,\n (transform: translateX(100%)),\n (transform: translateX(0)),\n (transform: translateX(0)),\n (transform: translateX(-100%))\n);\n@include stack-transition(\n slide-up,\n (transform: translateY(100%)),\n (transform: translateY(0)),\n (transform: translateY(0)),\n (transform: translateY(-100%))\n);\n@include stack-transition(\n slide-down,\n (transform: translateY(-100%)),\n (transform: translateY(0)),\n (transform: translateY(0)),\n (transform: translateY(100%))\n);\n\n// THE TWO-WAY TYPES HAVE NO RULES OF THEIR OWN. `slide-left-right`, `slide-up-down`,\n// the four `over-*-*` pairs and `rotate-left-right` (gtkstack.c:103-106, :118) are\n// resolved by `get_simple_transition_type` into ONE of the one-directional types above,\n// before the animation starts (gtkstack.c:1546-1561, :1162-1200) — so the element\n// writes `slide-left` or `slide-right` into `data-transition-type` and never the\n// two-way nick. That is C's own arrangement, and it is why this partial has no\n// direction attribute to key on.\n\n// OVER-… — the incoming page slides IN OVER the outgoing one, which stays put\n// (gtk_stack_snapshot_over, gtkstack.c:2456-2513).\n@include stack-transition-in-only(over-up, (transform: translateY(100%)), (transform: translateY(0)));\n@include stack-transition-in-only(over-down, (transform: translateY(-100%)), (transform: translateY(0)));\n@include stack-transition-in-only(over-left, (transform: translateX(100%)), (transform: translateX(0)));\n@include stack-transition-in-only(over-right, (transform: translateX(-100%)), (transform: translateX(0)));\n\n// UNDER-… — the incoming page slides in UNDERNEATH the outgoing one, which therefore\n// gets the z-index it does not have for OVER (gtkstack.c:2456-2513).\n@include stack-transition-in-only(under-up, (transform: translateY(100%)), (transform: translateY(0)));\n@include stack-transition-in-only(under-down, (transform: translateY(-100%)), (transform: translateY(0)));\n@include stack-transition-in-only(under-left, (transform: translateX(100%)), (transform: translateX(0)));\n@include stack-transition-in-only(under-right, (transform: translateX(-100%)), (transform: translateX(0)));\n\n// The stacking order is the whole difference between OVER and UNDER, and it is a single\n// declaration: the outgoing page stays above the incoming one for UNDER, and below it\n// for OVER.\ngtk-stack[data-transition-type^='over-'] > .adw-stack-page.transitioning-in {\n z-index: 1;\n}\n\ngtk-stack[data-transition-type^='under-'] > .adw-stack-page.transitioning-out {\n z-index: 1;\n}\n\n// ROTATE — `rotate-left` / `rotate-right` / `rotate-left-right` (gtkstack.c:116-118):\n// a Y-axis rotation of the crossfade, `perspective` standing in for GTK's 3D context.\n@include stack-transition-in-only(\n rotate-left,\n (transform: perspective(800px) rotateY(90deg)),\n (transform: perspective(800px) rotateY(0deg))\n);\n@include stack-transition-in-only(\n rotate-right,\n (transform: perspective(800px) rotateY(-90deg)),\n (transform: perspective(800px) rotateY(0deg))\n);\n\n// CUBE (gtkstack.c:107) and the transition's `NONE`: no animation, so nothing to write.\n// `gtk_stack_start_transition` skips the whole tracker when the effective type is NONE\n// or the duration is 0 (gtkstack.c:1400-1403), which is what the element does too — the\n// `transition-running` attribute is simply never set.\n// ── Gtk.StackSwitcher ──────────────────────────────────────────────────────\n// A linked row of toggle buttons, one per page (gtkstackswitcher.c:277-300), and C puts\n// the `.linked` class on the switcher itself (gtkstackswitcher.c:49-57) so the buttons\n// share one rounded group instead of being individually rounded.\ngtk-stack-switcher {\n display: flex;\n box-sizing: border-box;\n min-width: 0;\n\n > .adw-stack-switcher-button {\n display: inline-flex;\n flex: 1 1 0;\n min-width: 0;\n align-items: center;\n justify-content: center;\n gap: 6px;\n box-sizing: border-box;\n margin: 0;\n padding: 3px 12px;\n min-height: 30px;\n border: 1px solid var(--border-color, var(--separator-color));\n background-color: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background-color 150ms ease-in-out, color 150ms ease-in-out;\n\n // `.linked` (gtkstackswitcher.c:49-57): the inner corners lose their radius and\n // the neighbours' borders collapse, so the row reads as one control. This is the\n // same shape `_linked.scss` builds for `.linked > button` in libadwaita.\n &:first-child {\n border-start-start-radius: var(--button-radius);\n border-end-start-radius: var(--button-radius);\n }\n\n &:last-child {\n border-start-end-radius: var(--button-radius);\n border-end-end-radius: var(--button-radius);\n }\n\n &:not(:first-child) {\n border-inline-start-width: 0;\n }\n\n &:not(:last-child) {\n border-inline-end-width: 0;\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The active button is the SELECTED page: `on_button_toggled` drives the stack's\n // selection from the toggle (gtkstackswitcher.c:117-133), so the checked styling\n // has to sit on the same state. `_buttons.scss` gives the checked button the\n // `--button-active-color` fill, and the switcher's own padding is widened by\n // 6px on each side for the needs-attention dot (_buttons.scss:282-292).\n &.active {\n background-color: var(--button-active-color);\n color: var(--window-fg-color);\n }\n\n &:disabled {\n opacity: var(--strong-disabled-opacity, 0.45);\n\n > * {\n opacity: 1;\n }\n }\n\n .adw-stack-switcher-title {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .adw-stack-switcher-icon {\n flex: none;\n width: 16px;\n height: 16px;\n }\n\n // `%needs_attention` (_buttons.scss:294-300, _sidebars.scss:101-105): a 6px dot\n // behind the label, drawn rather than themed, because a custom SVG mask has no\n // libadwaita counterpart to borrow.\n &.needs-attention::after {\n content: '';\n display: inline-block;\n width: 6px;\n height: 6px;\n margin-inline-start: 6px;\n border-radius: 50%;\n background-color: var(--accent-bg-color);\n }\n }\n\n // `icon-button` vs `text-button` (gtkstackswitcher.c:158-176): an icon-only button\n // gets a square min-width, a titled one a 100px floor (`&.text-button { min-width:\n // 100px }`, _buttons.scss:296).\n &[data-button-mode='icon'] > .adw-stack-switcher-button {\n min-width: 34px;\n }\n\n &[data-button-mode='text'] > .adw-stack-switcher-button {\n min-width: 100px;\n }\n\n // `GtkStackSwitcher` is a `GtkOrientable` (gtkstackswitcher.c:47), so the row can be\n // vertical — the C installs a GtkBoxLayout whose orientation follows the property\n // (:500-513).\n &[orientation='vertical'] {\n flex-direction: column;\n\n > .adw-stack-switcher-button {\n flex: 0 1 auto;\n\n &:not(:first-child) {\n border-inline-start-width: 1px;\n border-inline-end-width: 1px;\n border-top-width: 0;\n }\n\n &:not(:last-child) {\n border-bottom-width: 0;\n }\n }\n }\n}\n\n// ── Gtk.StackSidebar ───────────────────────────────────────────────────────\n// `stacksidebar row` — a vertical list of the stack's pages\n// (refs/libadwaita/src/stylesheet/widgets/_sidebars.scss:95-108): 10px 4px padding, a\n// label inset by 6px, and the same `.needs-attention` treatment. The rows live in a\n// `.navigation-sidebar` list (gtkstacksidebar.c:155), which is the list libadwaita\n// already styles — so the list's own background comes from there and this partial only\n// gives the ROW its metrics.\ngtk-stack-sidebar {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow-y: auto;\n\n > .adw-stack-sidebar-list {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n }\n\n > .adw-stack-sidebar-list > .adw-stack-sidebar-row {\n display: flex;\n align-items: center;\n gap: 6px;\n box-sizing: border-box;\n padding: 10px 4px;\n min-height: 36px;\n border: none;\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The row carries the selection, exactly as a `GtkListBoxRow` does\n // (gtkstacksidebar.c:317-338 selects and unselects rows).\n &.selected {\n background-color: var(--button-active-color);\n color: var(--window-fg-color);\n }\n\n .adw-stack-sidebar-title {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n // `> label { padding-left: 6px; padding-right: 6px }`\n // (_sidebars.scss:97-100), here as padding so the ellipsis measures right.\n padding: 0 6px;\n }\n\n // `%needs_attention` (_sidebars.scss:101-105): a 6px dot in front of the label,\n // drawn as a gradient because a custom SVG mask has no libadwaita counterpart\n // to borrow.\n &.needs-attention .adw-stack-sidebar-title {\n background-image: radial-gradient(circle, var(--accent-bg-color) 6px, transparent 6px);\n background-size: 6px 6px;\n background-repeat: no-repeat;\n background-position: left center;\n }\n }\n}\n\n// ── Gtk.Notebook ───────────────────────────────────────────────────────────\n// A stack with its own tab bar on one edge — which libadwaita styles in full, in\n// ONE file, because the tab strip is styled as part of the notebook rather than as a\n// widget of its own: refs/libadwaita/src/stylesheet/widgets/_notebook.scss.\n//\n// The node tree is C's and libadwaita's: `notebook > header > tabs > tab` for the strip\n// and `notebook > stack:not(:only-child)` for the page area (_notebook.scss:4-10,\n// :213-215). The `:not(:only-child)` on the page area is there for a \"hidden\" notebook\n// whose header is the stack's only sibling — the element reproduces the intent directly,\n// by giving the page area its background only when the header is there too.\n//\n// `show-border` IS a CSS CLASS in C and not a branch of this rule: `gtk_notebook_set_show_border`\n// adds `.frame` and clearing the property removes it (gtknotebook.c:6134-6146), and this\n// stylesheet carries libadwaita's rule for that class already — `frame, .frame { border: 1px\n// solid $border_color }` (widgets/_misc.scss:4-7), ported whole into `_style_classes.scss` — so\n// the element toggles the class and nothing here restates it. Its own docs say the bevel only\n// shows when the TABS are not (gtknotebook.c:6125-6131), which is what the header's border below\n// does to it.\n@each $pos, $edge, $shadow in (\n ('top', 'bottom', 'inset 0 -4px'),\n ('bottom', 'top', 'inset 0 4px'),\n ('left', 'right', 'inset -4px 0'),\n ('right', 'left', 'inset 4px 0'),\n) {\n // The header's border is on the edge FACING the pages — `&.top { border-bottom-style:\n // solid }` and its three siblings (_notebook.scss:12-58) — and the tab strip is pulled\n // onto it by the negative margin just below, so the tab's own inset shadow lands ON the\n // border line. Written as four rules rather than nested under `&`, because the edge is a\n // property of the NOTEBOOK and a tab is three levels down from it.\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header {\n border-#{$edge}-style: solid;\n }\n\n // `> tabs { margin-bottom: -2px }` on `.top` (_notebook.scss:15, and its siblings): the\n // strip overlaps the border by one more pixel, so a 37 px tab makes a 37 px header.\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header > .adw-notebook-tabs {\n margin-#{$edge}: -2px;\n }\n\n // `:hover` and `:checked` each get the same inset, in the border colour and in the\n // accent respectively (_notebook.scss:17-19 and its three siblings). The shadow is a\n // whole `box-shadow` value rather than a bare inset, so it is interpolated whole.\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab:hover {\n box-shadow: #{$shadow} var(--border-color, var(--separator-color));\n }\n\n gtk-notebook[data-tab-pos='#{$pos}'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab.active {\n box-shadow: #{$shadow} var(--accent-bg-color);\n }\n}\n\ngtk-notebook {\n display: flex;\n box-sizing: border-box;\n min-width: 0;\n min-height: 0;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n\n // `tab-pos` decides the EDGE, not the document order, so the two directions are one\n // `flex-direction` each rather than a re-ordering of the children — and RTL swaps left\n // and right (`get_effective_tab_pos`, gtknotebook.c:1741-1756), which is what the\n // `data-tab-pos` the element reflects is for.\n &[data-tab-pos='top'] {\n flex-direction: column;\n }\n\n &[data-tab-pos='bottom'] {\n flex-direction: column-reverse;\n }\n\n &[data-tab-pos='left'] {\n flex-direction: row;\n }\n\n &[data-tab-pos='right'] {\n flex-direction: row-reverse;\n }\n\n > .adw-notebook-header {\n flex: none;\n box-sizing: border-box;\n padding: 1px;\n\n // `border-width: 1px` with no style, so that only the edge `@each` above turns\n // solid is drawn: a GTK border is `none` until something says otherwise\n // (_notebook.scss:6-9).\n border-width: 1px;\n border-style: none;\n border-color: var(--border-color, var(--separator-color));\n background-clip: padding-box;\n\n // `gtk_widget_set_visible (header_widget, show_tabs)` (gtknotebook.c:5467).\n &[hidden] {\n display: none;\n }\n }\n\n // `> tabs { margin: -1px }` (_notebook.scss:11) plus the four-pixel inner padding\n // `_notebook.scss:165-207`, which keep the strip off the header's own padding and off\n // the border `@each` drew on the facing edge.\n > .adw-notebook-header > .adw-notebook-tabs {\n display: flex;\n align-items: stretch;\n margin: -1px;\n padding: 0 4px;\n\n // `scrollable`'s arrows are not ported (gtknotebook.c:1139-1148), so the strip\n // overflows and scrolls instead of the two arrow buttons GTK scrolls with.\n overflow-x: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n &::-webkit-scrollbar {\n display: none;\n }\n }\n\n // The two vertical edges turn the strip: the padding and the margin that were\n // horizontal become vertical, and so does the overflow (_notebook.scss:188-207).\n &[data-tab-pos='left'] > .adw-notebook-header > .adw-notebook-tabs,\n &[data-tab-pos='right'] > .adw-notebook-header > .adw-notebook-tabs {\n flex-direction: column;\n padding: 4px 0;\n overflow-x: visible;\n overflow-y: auto;\n }\n\n // …and the four-pixel gap between two tabs, which was `margin-left/right: 4px` on the\n // horizontal edges and is `margin-top/bottom: 4px` on the vertical ones\n // (_notebook.scss:181-183, mirrored at :197-199).\n &[data-tab-pos='left'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab,\n &[data-tab-pos='right'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n margin: 4px 0;\n }\n\n > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n // GTK's `min-height`/`min-width` size the CONTENT box, so the padding comes on top:\n // 30 + 3 + 4 = 37 high, 30 + 2 * 12 = 54 wide, measured on a native Gtk.Notebook.\n box-sizing: content-box;\n\n // `min-height: 30px; min-width: 30px; padding: 3px 12px; font-weight: normal`\n // (_notebook.scss:117-124) and the four-pixel gap `margin-left/right: 4px`\n // (_notebook.scss:181-183, mirrored at :197-199).\n min-width: 30px;\n min-height: 30px;\n margin: 0 4px;\n padding: 3px 12px;\n border: none;\n border-radius: var(--button-radius);\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: normal;\n line-height: 1;\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background-color 150ms ease-in-out, box-shadow 150ms ease-in-out;\n\n // `tab-fill` (TRUE by default, gtknotebook.c:672-681) only decides whether an\n // EXPANDED tab fills the space it was given; without `tab-expand` a tab keeps its\n // natural width, which the native measurement shows (54 px, not stretched).\n flex: 0 0 auto;\n\n &.expand {\n flex: 1 1 0;\n min-width: 0;\n }\n\n // `$hover_color` (color-mix in srgb currentColor 7%, transparent), the pair\n // `&:hover, &:active` sets (_notebook.scss:126-128, _colors.scss:268).\n &:hover,\n &:active {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n // `:checked` on the tab, which C sets when the page becomes current\n // (gtknotebook.c:5466) — `$selected_color` behind it (_colors.scss:270) and the\n // accent underline of `_notebook.scss:19` in front of it.\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n }\n\n // The focus ring, `focus-ring(\"> header > tabs > tab:checked\", $offset: -2px)`\n // (_notebook.scss:3).\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // A page whose child is hidden takes its tab with it\n // (`gtk_widget_set_visible (page->tab_label, … && gtk_widget_get_visible\n // (page->child))`, gtknotebook.c:4117-4118), which is what `tab.hidden` reflects.\n &[hidden] {\n display: none;\n }\n }\n\n // `&.top > tabs > tab { padding-bottom: 4px }` and its mirror (_notebook.scss:209-210).\n &:not([data-tab-pos]) > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab,\n &[data-tab-pos='top'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n padding-bottom: 4px;\n }\n\n &[data-tab-pos='bottom'] > .adw-notebook-header > .adw-notebook-tabs > .adw-notebook-tab {\n padding-top: 4px;\n }\n\n // The page area, which is a GtkStack inside the C (`gtk_stack_set_visible_child` at\n // gtknotebook.c:5476) and so is one visible child here. `notebook > stack:not(:only-\n // child)` gives it the view background (_notebook.scss:213-215).\n > .adw-notebook-page {\n box-sizing: border-box;\n flex: 1 1 auto;\n min-width: 0;\n min-height: 0;\n\n &:not(.visible-page) {\n display: none;\n }\n }\n\n // `enable-popup`'s menu (gtknotebook.c:6420-6462 builds it, :2684-2692 pops it up),\n // as a DOM listbox over the page.\n > .adw-notebook-menu {\n position: absolute;\n z-index: 20;\n box-sizing: border-box;\n min-width: 160px;\n padding: var(--spacing-xs) 0;\n border-radius: var(--window-radius);\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 2px 8px 2px rgba(0, 0, 0, 0.06);\n }\n\n > .adw-notebook-menu > .adw-notebook-menu-item {\n display: block;\n box-sizing: border-box;\n width: 100%;\n min-height: 30px;\n margin: 0 var(--spacing-xs) 2px;\n padding: 3px 14px;\n border: none;\n border-radius: var(--button-radius);\n background: none;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n\n &:hover,\n &[aria-selected='true'] {\n background-color: var(--button-active-color);\n }\n }\n}\n","// _clamp_scrollable.scss — <adw-clamp-scrollable>.\n//\n// The widget has NO node of its own: `adw_clamp_scrollable_class_init` ends with\n// `set_layout_manager_type(ADW_TYPE_CLAMP_LAYOUT)` and `set_css_name(\"clamp\")`\n// (adw-clamp-scrollable.c:328-329), so it draws exactly what `<adw-clamp>` draws — which\n// is nothing, since there is no `clamp {}` block in the libadwaita stylesheet either. A\n// clamp measures; the cap and the `small`/`medium`/`large` classes are written onto the\n// CHILD by the element, out of `clampAllocate`.\n//\n// What this element adds is `overflow`. In C the CHILD is the `Gtk.Scrollable` and four\n// `g_object_bind_property` calls forward the adjustments onto it\n// (adw-clamp-scrollable.c:440-455); a DOM scrollport is the element itself, so the\n// scrolling moves one level up and the element writes `overflow-x`/`overflow-y` from\n// `hscroll-policy`/`vscroll-policy`. This rule is the floor for an author who set\n// neither policy — GTK's default is GTK_POLICY_AUTOMATIC, which shows a scrollbar only\n// when there is something to scroll, which is `auto` here.\n//\n// Reference: refs/libadwaita/src/adw-clamp-scrollable.c:328-329 (the `clamp` node)\n// Reference: refs/libadwaita/src/adw-clamp-layout.c (adw_clamp_layout_allocate — the\n// size classes the element stamps on the child)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components; the scrollport is the\n// element where C's is the child, for the reason the element's header records.\n\nadw-clamp-scrollable {\n display: block;\n overflow: auto;\n}\n","// _spinner.scss — the two spinners: <adw-spinner> and <gtk-spinner>. ONE partial\n// because upstream merges them too (refs/libadwaita/src/stylesheet/widgets/\n// _spinner.scss styles `spinner` and `image.spinner` in the same file), and because\n// they are two answers to one question rather than two widgets.\n//\n// Almost nothing is left for <adw-spinner> on purpose. The ring is an SVG the element\n// draws per frame from `@gjsify/adwaita-core`'s `spinnerArc`, because the arc BREATHES\n// (2.7 to 102.8 degrees) and CSS cannot express that: the `border-top-color`\n// chase this file used to carry was a fixed 90-degree quarter-circle at 0.8s\n// against libadwaita's 1.2s, with a hardcoded grey track and square-cut ends.\n//\n// What CSS still owns is the box: the element is `size × size` and the ring is\n// centred inside it, which is how a 200px spinner shows a 64px ring\n// (adw-spinner.c:95-99 hands the widget's real size to the paintable, which caps\n// only the radius).\n//\n// There is deliberately NO `prefers-reduced-motion` rule for it. The C opts out of the\n// animation setting explicitly (`adw_animation_set_follow_enable_animations_setting\n// (…, FALSE)`, adw-spinner-paintable.c:537) — a frozen busy indicator reads as a\n// hang. This file used to stop the animation there.\n//\n// Reference: refs/libadwaita/src/adw-spinner.c\n// Reference: refs/libadwaita/src/adw-spinner-paintable.c\n// Reference: refs/adwaita-web/adwaita-web/scss/_spinner.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-spinner {\n // The element writes the measured box onto `style` when it upgrades; these are\n // the values in force until then, which are Adwaita's own minimum\n // (adw-spinner.c:14, reported as both minimum and natural at :78-81).\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: 16px;\n height: 16px;\n // The arc strokes `currentColor` — `gtk_widget_get_color` (:432), the widget's\n // TEXT colour, never the accent. The track is the same colour at 15%, which\n // the SVG applies as `stroke-opacity`.\n color: inherit;\n\n svg {\n display: block;\n // The ring never grows past its own diameter, so an over-large box centres\n // it rather than stretching it.\n flex: none;\n }\n}\n\n// <gtk-spinner> is the GTK picture, and it is CSS's job in a way the Adw one is not:\n// `process-working-symbolic.svg` is a STATIC quarter arc on a faint ring, and all\n// `GtkSvg` does is turn it (gtkspinner.c:158-171). So the geometry is fixed here and\n// only the rotation is animated — which is why this widget needs no per-frame ticker\n// and no `spinnerArc`.\ngtk-spinner {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n // GTK measures the `icon-size` CSS property and reports it as BOTH minimum and\n // natural (gtkspinner.c:110-123); 16px is that icon's own intrinsic size.\n width: 16px;\n height: 16px;\n color: inherit;\n\n // `spinner:disabled { opacity: var(--disabled-opacity) }`\n // (refs/libadwaita/src/stylesheet/widgets/_spinner.scss:1-3).\n &[disabled] {\n opacity: var(--disabled-opacity);\n }\n\n .adw-spinner-ring {\n display: block;\n width: 100%;\n height: 100%;\n overflow: visible;\n }\n\n // Both strokes are `url(#gpa:foreground)` in the icon, i.e. the widget's text colour;\n // `stroke-width: 2` and round caps are the icon's own, on a 16-unit viewBox.\n .adw-spinner-track,\n .adw-spinner-arc {\n fill: none;\n stroke: currentColor;\n stroke-width: 2;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n\n // The icon's track path carries `stroke-opacity: 0.2`.\n .adw-spinner-track {\n stroke-opacity: 0.2;\n }\n\n // GTK puts the `:checked` pseudoclass on the node while `spinning` is set\n // (gtkspinner.c:59-63), which is the only thing that distinguishes the turning arc\n // from the standing one; the element writes `.checked` for exactly that.\n //\n // THE PERIOD IS THIS PORT'S. `GtkSvg` cycles the `.gpa`'s frames on the frame clock\n // and the frame count lives in the icon, not in `gtkspinner.c`, so one turn per second\n // is the honest place to land rather than a number quoted from nowhere.\n &.checked .adw-spinner-arc {\n animation: gtk-spinner-rotate 1s linear infinite;\n transform-origin: center;\n }\n\n // Under reduced motion GTK loads `sand-watch.svg` — a STATIC hourglass — instead of\n // the turning arc (gtkspinner.c:145-161). A browser has no icon loader, so the\n // equivalent is holding the arc still. Note this is the OPPOSITE of <adw-spinner>\n // above, and deliberately so.\n @media (prefers-reduced-motion: reduce) {\n &.checked .adw-spinner-arc {\n animation: none;\n }\n }\n}\n\n@keyframes gtk-spinner-rotate {\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n}\n","// _shortcut_label.scss — <adw-shortcut-label> and its keycaps.\n//\n// TWO SOURCES, AND WHY ONLY ONE IS FOLLOWED. libadwaita styles the widget in\n// `_shortcuts-dialog.scss:33-58`: a 6px `border-spacing` at both levels (between\n// the boxes AND between the keycaps inside one), keycaps filled with 10% of the\n// current colour, an inset bottom shadow that reads as a key's edge, a 6px\n// radius, 6px padding and a 20px minimum width — plus `> .dimmed { padding: 6px\n// 0 }` so a separator lines up with the caps beside it.\n//\n// `refs/adwaita-web/adwaita-web/scss/_shortcut_label.scss` styles ONE outlined\n// tag for the whole shortcut: monospace, a border, small text, and an empty\n// `kbd, .keycap {}` block with a comment saying the real thing has per-keycap\n// styling. It is a placeholder for this widget, not a port of it, so nothing is\n// taken from it — the geometry above is libadwaita's.\n//\n// The keycap fill is `currentColor`-relative, so a shortcut label inside a\n// dimmed or coloured context stays legible without a second token.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_shortcuts-dialog.scss:33-58\n// Reference: refs/adwaita-web/adwaita-web/scss/_shortcut_label.scss (NOT followed — see above)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components; GTK's\n// `border-spacing` on a box becomes flex `gap`.\n\nadw-shortcut-label {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n border-radius: 6px;\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // One combination — the keycaps of a single accelerator. Its own 6px gap is\n // the second `border-spacing` in `&, > box { border-spacing: 6px }` (:37-39).\n .adw-shortcut-label-keys {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n }\n\n .keycap {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n min-width: 20px;\n padding: 6px;\n border-radius: 6px;\n background: color-mix(in srgb, currentColor 10%, transparent);\n box-shadow: inset 0 -2px var(--card-shade-color);\n\n @media (prefers-contrast: more) {\n box-shadow:\n inset 0 -2px var(--card-shade-color),\n 0 0 0 1px var(--border-color);\n }\n }\n\n // The `L` / `R` of a sided modifier key — `%s <small><b>%s</b></small>` in the\n // C (adw-shortcut-label.c:195), i.e. smaller and bold, riding along inside the\n // same keycap rather than being a cap of its own.\n .adw-shortcut-label-side {\n margin-inline-start: 2px;\n font-size: 82%;\n font-weight: 700;\n // `<sub>` lowers the baseline by default; the marker is part of the key's\n // label, not a subscript of a formula.\n vertical-align: baseline;\n bottom: 0;\n }\n\n // `> .dimmed { padding: 6px 0 }` (:55-57) — the separators and the\n // disabled-text placeholder, aligned with the keycaps' text.\n > .dimmed {\n padding: 6px 0;\n }\n}\n","// _avatar.scss — adw-avatar styling (round, initials or fallback icon).\n// Reference: refs/adwaita-web/adwaita-web/scss/_avatar.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_avatar.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-avatar {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n border-radius: 50%;\n overflow: hidden;\n box-sizing: border-box;\n font-weight: 700;\n user-select: none;\n background-color: rgba(127, 127, 127, 0.25);\n color: var(--window-fg-color);\n\n .adw-avatar-text {\n line-height: 1;\n text-align: center;\n }\n\n .adw-avatar-icon {\n background-color: currentColor;\n opacity: 0.7;\n -webkit-mask-size: contain;\n mask-size: contain;\n }\n\n // `custom-image`. The avatar's own `border-radius: 50%` + `overflow: hidden`\n // already clip it, so the image only has to FILL the box — `cover`, not\n // `contain`, because GTK scales the paintable to the widget and crops inside a\n // rounded clip, where `contain` would letterbox a non-square photo inside the\n // circle.\n .adw-avatar-custom-image {\n display: block;\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n}\n","// _banner.scss — adw-banner styling (full-width accent message strip).\n// Reference: refs/adwaita-web/adwaita-web/scss/_banner.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (AdwBanner)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-banner {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--spacing-m);\n padding: var(--spacing-xs) var(--spacing-m);\n width: 100%;\n box-sizing: border-box;\n // Adw.Banner uses a neutral elevated surface, not the accent colour.\n background-color: var(--sidebar-bg-color);\n color: var(--window-fg-color);\n\n // Adw.Banner stays hidden until revealed.\n &:not(.revealed) {\n display: none;\n }\n\n // The title is a `.heading` label and the button a plain GTK text button\n // (adw-banner.ui:25, :29), so the title is bold and the button 34px tall with the 17px\n // `.text-button` sides. Both were lighter here, and the banner stood 8px shorter than\n // GTK's render of the gallery's banner `.blp`.\n .adw-banner-title {\n flex: 1 1 auto;\n min-width: 0;\n font-size: var(--font-size-base);\n font-weight: 700;\n }\n\n .adw-banner-button {\n flex-shrink: 0;\n box-sizing: border-box;\n min-height: 34px;\n border: none;\n border-radius: var(--button-radius);\n padding: 5px 17px;\n background: var(--button-bg-color);\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n cursor: pointer;\n\n &:hover {\n background: var(--button-hover-color);\n }\n\n // `button-style` (Since 1.7). ADW_BANNER_BUTTON_SUGGESTED adds\n // `.suggested-action` to the banner button (adw-banner.c:769), which is the\n // shared accent appearance — the same declaration `.adw-button.suggested-action`\n // carries, restated here because the banner button is not an `.adw-button`.\n &.suggested-action {\n background: var(--accent-bg-color);\n color: var(--accent-fg-color);\n\n &:hover {\n background: var(--accent-color);\n }\n }\n }\n}\n","// _status_page.scss — adw-status-page styling (centered empty state).\n// Reference: refs/adwaita-web/adwaita-web/scss/_status_page.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss (AdwStatusPage)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// THE METRICS ARE UPSTREAM'S, measured against a GTK render of the gallery's status page\n// `.blp`. They were the vendored web port's — a 96px icon, an 18pt title, the description\n// capped at 32ch and 12px gaps all round — and beside GTK the page was a different\n// composition: the description wrapped at 290px where GTK sets it on one line, and the child\n// sat 61px higher. `_misc.scss` (statuspage) has a 36px 12px margin, 12px between icon,\n// title and description, 24px more under the icon, `.title-1` for the title and 36px\n// between that column and the child; `adw-status-page.ui` clamps the column at AdwClamp's\n// default 600px.\nadw-status-page {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n text-align: center;\n gap: 12px;\n padding: 36px 12px;\n color: var(--window-fg-color);\n\n .adw-status-page-icon {\n width: 128px;\n height: 128px;\n margin-bottom: 24px;\n background-color: currentColor;\n opacity: 0.45;\n -webkit-mask-size: contain;\n mask-size: contain;\n }\n\n // `.title-1` (`_labels.scss`), restated: each partial compiles on its own, so an\n // `@extend` across them finds no target.\n .adw-status-page-title {\n font-weight: 800;\n font-size: 181%;\n max-width: 600px;\n }\n\n .adw-status-page-description {\n font-size: var(--font-size-base);\n opacity: var(--dim-opacity);\n max-width: 600px;\n }\n\n // 36px from the column, of which the flex gap already gives 12.\n .adw-status-page-child {\n margin-top: 24px;\n }\n\n // `.compact` — the documented smaller status page, for a sidebar or a popover\n // (style-classes.md \"Compact Status Page\"): margins 24px 12px, the icon 96px with 12px\n // under it, `.title-2`, and 12px to the child (`_misc.scss`, statuspage.compact).\n &.compact {\n padding: 24px 12px;\n\n .adw-status-page-icon {\n width: 96px;\n height: 96px;\n margin-bottom: 12px;\n }\n\n .adw-status-page-title {\n font-size: 136%;\n }\n\n .adw-status-page-child {\n margin-top: 12px;\n }\n }\n}\n","// _row.scss — Shared base styling for rows in preferences groups.\n// Reference: refs/adwaita-web/adwaita-web/scss/_row_types.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (AdwActionRow, row.entry)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-switch-row,\nadw-combo-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-height: 54px;\n padding: 0 var(--spacing-m);\n gap: var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n}\n\n// A `tooltip-text` part must cover the ROW, not just the label text inside it: the browser\n// resolves a tooltip by walking UP from the hovered node, so a part that stops at the text's\n// own height lets the walk reach the host — whose `title` is the row's LABEL — over the rest\n// of the widget. Measured on a 54px `adw-action-row`: the label text is 18px of it. The\n// marker is `applyRowTooltip`'s (`src/row-tooltip.ts`); stretching changes nothing drawn,\n// because these columns centre their own children.\n[data-row-tooltip] {\n align-self: stretch;\n}\n\n// Shared title/subtitle text column used by every row type (action/switch/\n// combo/spin). The title is the primary label; the subtitle is dimmed and\n// hidden when empty.\n.adw-row-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n}\n\n// NO `.adw-row-title` default HERE, deliberately. `.adw-row-title` is also the class\n// `<adw-entry-row>` and `<adw-preferences-row>` put on their titles, so a global\n// `white-space: nowrap` here silently made those two rows un-wrapping too — a change\n// to row types this feature was never scoped to. Each row type that wants a wrapping\n// title says so in its own partial at its own specificity (see `_action_row.scss`,\n// `_expander_row.scss`); a global default can only ever be the losing side of that.\n.adw-row-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--card-fg-color);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n// Trailing edit pencil shared by editable rows (entry/password) — the\n// Adw.EntryRow edit affordance. Dimmed; clicking focuses the entry.\n//\n// The BOX is upstream's, rule for rule: `row.entry > .editable-area > .edit-icon`\n// (_lists.scss:194-196) is a 24px floor with 5px of padding around the glyph inside it. The\n// glyph stays 16px and centred here (`.adw-icon` centres its mask), so the box settles at\n// exactly that 24px — GTK's own measures 40x34 because the toolkit's `adw-entry-edit-symbolic`\n// is 30x24. That gap is the theme's ICON SIZE, not this rule.\n//\n// NOT PORTED from the same block, each for a reason rather than for want of a selector:\n// · the 6px margin-start on `.edit-icon` (:198-200). These rows already keep the pencil off\n// the text with `gap: var(--spacing-m)` = 12px, which is upstream's own arithmetic — 6px\n// of `.editable-area` padding plus this 6px — so adding the margin would make it 18px.\n// · the same 24px box on `.indicator`, which is only on the host through a per-subclass\n// class (`${prefix}-indicator`); the caps-lock warning it belongs to needs a real Caps\n// Lock source, which this port has no event for.\n.adw-row-edit {\n flex-shrink: 0;\n min-width: 24px;\n min-height: 24px;\n padding: 5px;\n color: var(--card-fg-color);\n opacity: 0.55;\n cursor: pointer;\n}\n\n// Utility separator (used by content layouts)\n.adw-separator-vertical {\n width: 1px;\n align-self: stretch;\n background-color: var(--card-shade-color);\n flex-shrink: 0;\n}\n","// _action_row.scss — adw-action-row styling (title/subtitle + prefix/suffix).\n// Reference: refs/adwaita-web/adwaita-web/scss/_action_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-action-row,\nadw-switch-row,\nadw-combo-row,\nadw-spin-row {\n // These row types inherit from AdwActionRow upstream and have\n // title-lines/subtitle-lines properties. Match libadwaita: wrap by default\n // (GtkLabel with wrap=true, lines=0), clamp via CSS custom property when\n // title-lines/subtitle-lines > 0. See adw-action-row.ui lines 54-61, 70-81.\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 54px;\n padding: 0 var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n color: var(--card-fg-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n &.activatable {\n cursor: pointer;\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n .adw-action-row-prefix,\n .adw-action-row-suffix,\n .adw-switch-row-prefix {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n flex-shrink: 0;\n }\n\n // The text column's own rule is `_row.scss`'s shared `.adw-row-text` — one spelling\n // for all five rows, so the clamp selectors below can name it too.\n\n // Title/subtitle WRAP BY DEFAULT, matching libadwaita's GtkLabel wrap=true,\n // lines=0. The typography is this row type's own (it was here before the wrap); only\n // `white-space` moves, and `overflow`/`text-overflow` are left to the clamped state\n // below, where the ellipsis has a line count to truncate to.\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n .adw-row-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n // Clamped state — enabled by JS toggling .adw-row-clamp on the text container.\n .adw-row-text.adw-row-clamp {\n .adw-row-title,\n .adw-row-subtitle {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: var(--adw-row-ellipsize-overflow, ellipsis);\n }\n\n .adw-row-title {\n -webkit-line-clamp: var(--adw-row-title-lines, 1);\n }\n\n .adw-row-subtitle {\n -webkit-line-clamp: var(--adw-row-subtitle-lines, 1);\n }\n }\n}\n\n// `.property` SWAPS the emphasis of a row: the title becomes the small dimmed\n// label and the subtitle carries the value at full weight — a read-only property\n// rather than an action (style-classes.md \"Property Rows\", `_lists.scss:426-455`).\n//\n// It is written against the shared `.adw-row-title` / `.adw-row-subtitle` nodes,\n// so it works on every row type that renders them (action, expander header,\n// entry, switch), which is the same reach upstream gives it.\nadw-action-row.property,\nadw-expander-row.property {\n .adw-row-title {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n }\n\n .adw-row-subtitle {\n font-size: var(--font-size-base);\n opacity: 1;\n }\n\n // `.monospace` on a property row monospaces the VALUE only — the label and any\n // suffix widget stay in the UI font (`_lists.scss:445-455`). Put `.monospace`\n // on the list instead to get all of it.\n &.monospace {\n font-family: inherit;\n font-size: inherit;\n\n .adw-row-subtitle {\n font-family: var(--monospace-font-family);\n font-size: var(--monospace-font-size);\n }\n }\n}\n","// _entry_row.scss — adw-entry-row styling (inline editable boxed-list row).\n// Reference: refs/adwaita-web/adwaita-web/scss/_entry_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_entries.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-entry-row {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 50px;\n padding: 0 var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n // Focus ring matching libadwaita's row focus (inset accent outline).\n &:focus-within {\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n // Filled Adw.EntryRow layout: a small floating title above the value,\n // both left-aligned in a column.\n .adw-entry-row-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n gap: 1px;\n }\n\n .adw-row-title {\n font-size: var(--font-size-small);\n color: var(--card-fg-color);\n opacity: var(--dim-opacity);\n }\n\n .adw-entry-row-input {\n width: 100%;\n min-width: 0;\n border: none;\n background: transparent;\n color: var(--card-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: left;\n outline: none;\n padding: 0;\n }\n}\n","// _switch_row.scss — adw-switch-row styling.\n//\n// The TOGGLE is not here: it is `<gtk-switch>` and `scss/_switch.scss`. It used\n// to be, nested under `adw-switch-row {`, which is exactly why `.adw-switch` was\n// unreachable from anywhere else and `_expander_row.scss` grew a\n// character-for-character copy of it.\n//\n// Reference: refs/adwaita-web/adwaita-web/scss/_switch_row.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-switch-row {\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n }\n\n // Adw.SwitchRow is an AdwActionRow upstream (adw-switch-row.c:50), so it inherits\n // `add_prefix` and the box that carries it. Same rules as `.adw-action-row-prefix`:\n // a fixed-size icon must not be squeezed by the text column, which grows.\n .adw-switch-row-prefix {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n flex-shrink: 0;\n }\n}\n","// _combo_row.scss — adw-combo-row styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_combo_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (AdwComboRow)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-combo-row {\n position: relative;\n cursor: pointer;\n\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n pointer-events: none;\n }\n\n // Hidden <select> overlay — stretches across the row to capture clicks\n // anywhere. The visual dropdown arrow is rendered by .adw-row-value::after\n // below, so the select itself doesn't need a background image.\n select {\n appearance: none;\n -webkit-appearance: none;\n background-color: transparent;\n border: none;\n padding: 6px 24px 6px 8px;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n cursor: pointer;\n text-align: right;\n position: absolute;\n inset: 0;\n opacity: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -1px;\n }\n\n option {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n }\n }\n\n .adw-row-value {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n opacity: var(--dim-opacity);\n display: flex;\n align-items: center;\n gap: 4px;\n\n // Dropdown arrow — rendered via CSS mask so `currentColor` drives the\n // fill, making the icon theme-aware (matches libadwaita's dark theme).\n // Using background-image with a data-URI SVG would NOT resolve\n // `currentColor` in most browsers.\n //\n // `model_changed` (adw-combo-row.c:187-195) hides the arrow box entirely on\n // a model of one item or none, so the row stops presenting itself as a\n // chooser. `[data-presents-chooser='false']` below is that rule; the element\n // publishes the attribute and disables the overlaid <select> alongside.\n &::after {\n content: \"\";\n display: inline-block;\n width: 12px;\n height: 12px;\n background-color: currentColor;\n -webkit-mask-image: var(--icon-go-down);\n mask-image: var(--icon-go-down);\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-size: contain;\n mask-size: contain;\n -webkit-mask-position: center;\n mask-position: center;\n }\n }\n}\n\n// A model with one item or none: no arrow, and the row is not activatable\n// (`model_changed`, adw-combo-row.c:187-195). Written as its own block rather\n// than a modifier inside `.adw-row-value` so the two selectors that draw the\n// arrow and the one that removes it read at the same specificity depth.\nadw-combo-row[data-presents-chooser='false'] {\n .adw-row-value::after {\n display: none;\n }\n\n select {\n cursor: default;\n }\n}\n","// _spin_row.scss — adw-spin-row styling.\n// Reference: refs/adwaita-web/adwaita-web/scss/_spin_button.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_spin-button.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (the `row.spin` block,\n// :241-275, which is what the two stepper buttons are)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n//\n// NOT PORTED, and why:\n// - `%button_basic`'s focus ring (`_buttons.scss:25`). `row.spin`'s OWN rule already\n// takes the ring away from the entry (`&, &:focus { outline: none }`, :246-248) and\n// asks the ROW to draw one instead (`row.entry, row.spin { @include focus-ring(...) }`,\n// :277-279), so a per-button ring would double it.\n// - `&:disabled { filter: Opacity(var(--disabled-opacity)) }` and the\n// `&:disabled spinbutton > button… { filter: none }` that cancels it for these two\n// buttons (:264-274). The port's steppers never get disabled: `AdwSpinRow` clamps at\n// the bounds instead, and there is no `.disabled` to filter.\n// - `font-weight: bold` from `%button_basic` (:23) — the glyphs here are text nodes, and\n// `+`/`−` at bold weight is a different glyph size, not a bolder one.\n// - The ENTRY still differs from upstream and is left alone here: `row.spin spinbutton`\n// sets `background: none; box-shadow: none` (:242-244), so the native row's number\n// field is flat card white, while `.adw-spin-control input` below still paints a\n// 10% grey fill and a 9px radius. A native pixel run over the row finds nothing but\n// white between the title and the first stepper. That is the input's deviation, not\n// the steppers', and it is a separate fix.\n\nadw-spin-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-height: 54px;\n padding: 0 var(--spacing-m);\n gap: var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n }\n}\n\n.adw-spin-control {\n display: flex;\n align-items: center;\n // `border-spacing: 6px` (refs/libadwaita/src/stylesheet/widgets/_lists.scss:242). GTK\n // spreads the spinbutton's three boxes with it, so this is the 6px between the entry and\n // the first stepper AND the 6px between the two — which, with the 2px margins below,\n // is the 10px the native circles actually stand apart.\n gap: 6px;\n\n // `row.spin spinbutton > button.image-button.up/.down` (_lists.scss:250-262) extends\n // `%button_basic` AND `%circular_button` (_buttons.scss:19-27, :312-320). It was a\n // 32px rounded SQUARE on a transparent background, so both steppers read as flat\n // 32px squares beside a GTK render of the same `.blp`. Measured natively\n // (Adw.SpinRow, libadwaita 1.9.3, light, `Adw.PreferencesGroup` capture): each button is\n // allocated 34x50 with min = nat, its painted area a 30px circle of flat\n // rgb(235,235,235) with an rgb(47,47,52) glyph. 34x50 = the 30px floor plus\n // `margin: 10px 2px`; and in a 54px row those margins put the circle at y=12..41,\n // which is exactly where the native capture paints it.\n button {\n // A FLOOR, not a size: upstream sets `min-width`/`min-height`, and a glyph wider than\n // 30px grows the circle rather than overflowing it.\n min-width: 30px;\n min-height: 30px;\n margin: 10px 2px;\n padding: 0;\n border: none;\n // `%circular_button`'s `border-radius: 9999px`, beating `%button_basic`'s\n // `var(--button-radius)`, which is what the 32px square drew before.\n border-radius: 9999px;\n // `%button_basic` pulls in `%button_basic_raised`'s background through the same nested\n // `@at-root`, so these buttons are FILLED at rest — this is upstream's\n // `$button_color` (_buttons.scss:1), the mix that resolves to the measured 235.\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n color: var(--card-fg-color);\n cursor: pointer;\n font-size: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n\n // `$button_hover_color` / `$button_active_color` (_buttons.scss:2-3). The rest state\n // was transparent, so only the hover existed before and it was an unblended grey.\n &:hover {\n background-color: color-mix(in srgb, currentColor 15%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n input {\n width: 56px;\n text-align: center;\n border: none;\n border-radius: var(--button-radius);\n background: rgba(128, 128, 128, 0.1);\n color: var(--card-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n padding: 4px 2px;\n\n &:focus {\n outline: 2px solid var(--accent-color);\n outline-offset: -1px;\n }\n }\n}\n","// _button_row.scss — adw-button-row styling (a boxed-list row that acts as a\n// button: centered title + optional start icon, with suggested/destructive\n// recoloring).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (row.button)\n// Reference: refs/adwaita-web/adwaita-web/scss/_button_row.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-button-row {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n // libadwaita: `row.button > box { min-height: 40px; margin: 0 12px }` (_lists.scss:458-462),\n // and the row around it measures 44 in a GTK render of the gallery's button-row `.blp`.\n // It was a plain row's 50 here, so the button row stood 6px taller than GTK's.\n min-height: 44px;\n padding: 0 var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n color: var(--card-fg-color);\n cursor: pointer;\n transition: background-color 0.1s ease;\n\n &:last-child {\n border-bottom: none;\n }\n\n // Contents are centered as a group (libadwaita's GtkBox halign:center), with\n // the start icon hugging the title via a small gap (border-spacing 6px).\n .adw-button-row-contents {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n min-width: 0;\n // The row centres its one button (`justify-content: center` above), so without this the\n // contents box is exactly as wide as the button and `tooltip-text` reaches only that\n // much of the row. Growing it and letting its own `justify-content: centre` do the\n // centring draws the same button in the same place.\n flex: 1 1 auto;\n }\n\n .adw-button-row-title {\n font-size: var(--font-size-base);\n font-weight: 700;\n text-align: center;\n color: inherit;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // Default (no style class): button-like hover/active feedback.\n &.activatable {\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Suggested action — accent-coloured, full-bleed (no separator line).\n &.suggested-action {\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n border-bottom: none;\n\n &.activatable {\n &:hover {\n background-color: var(--accent-bg-color);\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 10%, transparent),\n color-mix(in srgb, currentColor 10%, transparent)\n );\n }\n\n &:active {\n background-color: var(--accent-bg-color);\n background-image: linear-gradient(rgba(0, 0, 6, 0.2), rgba(0, 0, 6, 0.2));\n }\n }\n }\n\n // Destructive action — red, same full-bleed treatment as suggested.\n &.destructive-action {\n background-color: var(--destructive-bg-color);\n color: var(--destructive-fg-color);\n border-bottom: none;\n\n &.activatable {\n &:hover {\n background-color: var(--destructive-bg-color);\n background-image: linear-gradient(\n color-mix(in srgb, currentColor 10%, transparent),\n color-mix(in srgb, currentColor 10%, transparent)\n );\n }\n\n &:active {\n background-color: var(--destructive-bg-color);\n background-image: linear-gradient(rgba(0, 0, 6, 0.2), rgba(0, 0, 6, 0.2));\n }\n }\n }\n}\n","// _expander_row.scss — adw-expander-row styling (disclosure header + nested rows).\n// Reference: refs/adwaita-web/adwaita-web/scss/_expander_row.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_lists.scss (AdwExpanderRow)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-expander-row {\n display: block;\n border-bottom: 1px solid var(--card-shade-color);\n color: var(--card-fg-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n // Header — styled like an activatable action row.\n .adw-expander-row-header {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 50px;\n padding: var(--spacing-s) var(--spacing-m);\n cursor: pointer;\n\n &:hover {\n background-color: var(--button-bg-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n }\n\n // Title/subtitle WRAP BY DEFAULT, matching libadwaita's GtkLabel wrap=true,\n // lines=0 — stated HERE, at this row's own specificity, because `_row.scss` carries\n // a `white-space: nowrap` default for `.adw-row-subtitle` and an inherited one reaches\n // the title. A rule that only turns `white-space` on inside the clamp selector cannot\n // make a row wrap by DEFAULT: the clamp is the minority state.\n .adw-row-title {\n font-size: var(--font-size-base);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n .adw-row-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n color: var(--card-fg-color);\n white-space: normal;\n overflow-wrap: break-word;\n }\n\n // Clamped state — JS toggles `.adw-row-clamp` on the TEXT COLUMN, the same node and\n // the same class `_action_row.scss` keys off; reading it off the header instead never\n // matched anything.\n .adw-row-text.adw-row-clamp {\n .adw-row-title,\n .adw-row-subtitle {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: var(--adw-row-ellipsize-overflow, ellipsis);\n }\n\n .adw-row-title {\n -webkit-line-clamp: var(--adw-row-title-lines, 1);\n }\n\n .adw-row-subtitle {\n -webkit-line-clamp: var(--adw-row-subtitle-lines, 1);\n }\n }\n\n // The text column takes the free space so prefix/suffix widgets, the enable\n // switch and the chevron sit at their respective edges.\n .adw-expander-row-header > .adw-row-text {\n flex: 1;\n min-width: 0;\n }\n\n // Header prefix / suffix widget slots (Adw.ExpanderRow add_prefix/add_suffix).\n .adw-expander-row-prefix,\n .adw-expander-row-suffix {\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n flex-shrink: 0;\n }\n\n // Disclosure chevron — points down when collapsed, flips up when expanded,\n // matching libadwaita's Adw.ExpanderRow arrow.\n .adw-expander-row-chevron {\n opacity: var(--dim-opacity);\n transform: rotate(0deg);\n transition: transform 0.2s ease-out;\n flex-shrink: 0;\n }\n\n &.expanded .adw-expander-row-chevron {\n transform: rotate(180deg);\n }\n\n // The optional enable switch is `<gtk-switch>` and needs no geometry of its\n // own — `.adw-expander-row-enable-switch` is a query/override hook only. This\n // block used to be a character-for-character copy of the switch row's toggle\n // (44×24 box, hidden input, 20px knob, translateX(20px), focus ring), because\n // `.adw-switch` was nested inside `adw-switch-row {` and unreachable from here.\n\n // Disclosed content — a nested listbox of rows, hidden until expanded. The\n // nested surface is slightly inset/recessed, the way libadwaita draws it.\n .adw-expander-row-content {\n display: none;\n flex-direction: column;\n background-color: var(--window-bg-color);\n border-top: 1px solid var(--card-shade-color);\n\n &.expanded {\n display: flex;\n }\n\n // Nested rows: indent the text column and keep the hairline separators,\n // dropping the last one (the content area's own edge closes it off).\n > adw-action-row,\n > adw-entry-row,\n > adw-switch-row,\n > adw-combo-row,\n > adw-spin-row {\n padding-left: var(--spacing-xl);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n }\n }\n}\n","// _password_entry_row.scss — adw-password-entry-row styling (masked entry row\n// with a trailing peek toggle). Mirrors _entry_row.scss (the password row is a\n// specialization of the entry row) and adds the flat peek button.\n// Reference: refs/adwaita-web/adwaita-web/scss/_entry_row.scss (no password variant upstream)\n// Reference: refs/libadwaita/src/adw-password-entry-row.c\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-password-entry-row {\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 50px;\n padding: var(--spacing-xs) var(--spacing-m);\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n // Focus ring matching libadwaita's row focus (inset accent outline).\n &:focus-within {\n box-shadow: inset 0 0 0 2px var(--accent-color);\n }\n\n // Filled Adw.EntryRow layout: a small floating title above the value,\n // both left-aligned in a column.\n .adw-password-entry-row-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n gap: 1px;\n }\n\n .adw-row-title {\n font-size: var(--font-size-small);\n color: var(--card-fg-color);\n opacity: var(--dim-opacity);\n }\n\n .adw-password-entry-row-input {\n width: 100%;\n min-width: 0;\n border: none;\n background: transparent;\n color: var(--card-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: left;\n outline: none;\n padding: 0;\n\n // Slightly wider tracking for the masked dots, like the native entry.\n &[type='password'] {\n letter-spacing: 0.125em;\n }\n }\n\n // Trailing peek toggle — flat circular icon button, vertically centred.\n .adw-password-entry-row-toggle {\n flex-shrink: 0;\n align-self: center;\n }\n}\n","// _toast.scss — adw-toast and adw-toast-overlay styling.\n// adw-toast-overlay wraps content and layers transient `.adw-toast` banners over\n// the bottom of its own bounds (the Adw.ToastOverlay model). Each banner carries\n// a title, an optional action button and a CSS-drawn \"×\" close button, and slides\n// up on show / down on dismiss (mirroring Adw.Toast).\n// Reference: refs/adwaita-web/adwaita-web/scss/_toast.scss\n// Reference: refs/adwaita-web/adwaita-web/scss/_toast_overlay.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_misc.scss (Toasts)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-toast-overlay {\n position: relative;\n display: block;\n\n // The wrapped content (Adw.ToastOverlay :child) occupies the overlay's box.\n .adw-toast-overlay-content {\n width: 100%;\n height: 100%;\n }\n\n // The toast slot: layered over the bottom edge of the overlay and centered,\n // the way AdwToastOverlay floats a toast above its child. Like\n // Adw.ToastOverlay only ONE toast is mounted at a time (the queue lives in\n // `@gjsify/adwaita-core`); the flex column keeps it centered and lets an\n // outgoing `.hiding` strip finish its exit transition in place.\n .adw-toast-overlay-toasts {\n position: absolute;\n bottom: var(--spacing-m);\n left: 50%;\n transform: translateX(-50%);\n z-index: 9999;\n display: flex;\n flex-direction: column-reverse;\n gap: var(--spacing-s);\n align-items: center;\n pointer-events: none;\n }\n}\n\n.adw-toast {\n background-color: #3d3846;\n color: #ffffff;\n padding: var(--spacing-s) var(--spacing-m);\n border-radius: var(--card-radius);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.25);\n display: flex;\n align-items: center;\n gap: var(--spacing-s);\n width: max-content;\n max-width: 400px;\n min-height: 36px;\n pointer-events: auto;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n\n opacity: 0;\n transform: translateY(100%) scale(0.9);\n transition: opacity 0.2s cubic-bezier(0, 0, 0.2, 1),\n transform 0.2s cubic-bezier(0, 0, 0.2, 1);\n will-change: transform, opacity;\n\n &.visible {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n &.hiding {\n opacity: 0;\n transform: translateY(100%) scale(0.9);\n transition-duration: 0.15s;\n transition-timing-function: cubic-bezier(0.4, 0, 1, 1);\n }\n\n .adw-toast-content-wrapper {\n flex: 1 1 auto;\n min-width: 0;\n }\n\n .adw-toast-title {\n font-weight: normal;\n line-height: 1.3;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // Action button — a flat pill tinted with the accent color so it reads as\n // suggested against the dark toast surface (Adw.Toast:button-label).\n .adw-toast-action-button {\n flex-shrink: 0;\n box-sizing: border-box;\n margin: 0;\n padding: 4px var(--spacing-m);\n border: none;\n border-radius: var(--button-radius);\n background-color: rgba(255, 255, 255, 0.12);\n color: #ffffff;\n font-family: inherit;\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: rgba(255, 255, 255, 0.2);\n }\n\n &:active {\n background-color: rgba(255, 255, 255, 0.26);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n\n // Close affordance — `window-close-symbolic` in a 24px circle, as upstream builds it\n // (adw-toast-widget.ui:64). The element supplies the <gtk-image>; this only places it.\n .adw-toast-close-button {\n box-sizing: border-box;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 9999px;\n background-color: transparent;\n color: #ffffff;\n cursor: pointer;\n opacity: 0.7;\n transition:\n background-color 150ms ease-in-out,\n opacity 150ms ease-in-out;\n\n &:hover {\n opacity: 1;\n background-color: rgba(255, 255, 255, 0.12);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n }\n}\n","// _toolbar_view.scss — adw-toolbar-view styling (content framed by top/bottom bars).\n// Reference: refs/adwaita-web/adwaita-web/scss/_toolbar_view.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-toolbar-view {\n display: flex;\n flex-direction: column;\n min-height: 0;\n min-width: 0;\n flex: 1 1 auto;\n // Positioning context for the extend-content-to-*-edge overlays below.\n position: relative;\n\n .adw-toolbar-view-top,\n .adw-toolbar-view-bottom {\n flex-shrink: 0;\n display: flex;\n flex-direction: column;\n }\n\n .adw-toolbar-view-content {\n flex: 1 1 auto;\n min-height: 0;\n min-width: 0;\n overflow: auto;\n display: flex;\n flex-direction: column;\n background-color: var(--window-bg-color);\n }\n\n // THE CONTENT WIDGET FILLS THE CONTENT RECT. `adw_toolbar_view_size_allocate`\n // (adw-toolbar-view.c:390-397) hands `self->content` the whole rect between the\n // bars, and a GTK widget that wants less of it says so through its own\n // alignment. This port collects the content into a flex COLUMN, where an item\n // declaring no `flex-grow` is content-sized instead, so the child stopped\n // wherever its content did and the pane below it stayed empty. Measured on the\n // docs Navigation Split View preview: a 293px sidebar pane holding a 176px\n // `adw-sidebar`, i.e. 117px of window-coloured dead strip under the last row,\n // and beside it a status page top-aligned in a pane it was supposed to centre in.\n // The web storybook had been papering over it in its own sheet\n // (`.sb-sidebar-scroll { flex: 1 1 auto }`), deleted now that the widget carries\n // it: a per-consumer copy is what a missing widget rule looks like from the\n // outside, and it keeps the widget green while the next consumer hits the same\n // wall.\n //\n // `:only-child` because Adw.ToolbarView HAS one content widget. Several stacked\n // children are this port's own extension, and GTK defines no distribution for\n // them, so inventing one here would be a claim rather than a copy.\n //\n // NO `min-height: 0` alongside it, deliberately: the automatic minimum size is\n // already the right answer per child. A scroller (`adw-sidebar`, any\n // `overflow: auto` box) gets an automatic minimum of 0 and shrinks to scroll\n // itself, as its GtkScrolledWindow would; a status page keeps its content-based\n // minimum, so a pane too short to hold it scrolls THIS box instead of crushing a\n // centred column into overflow its reader cannot scroll back up to.\n .adw-toolbar-view-content > :only-child {\n flex: 1 1 auto;\n }\n\n // …UNLESS IT ASKED FOR LESS. A content widget with a `valign` other than fill is\n // allocated its natural height and placed by that alignment (`_widget.scss`'s auto\n // margin), which a growing flex item cannot be: the grow claims the free space before\n // an auto margin sees any. Measured on the gallery's navigation view, whose `.blp`\n // centres a pill button in a toolbar view: GTK drew it 44px tall mid-pane, this port\n // stretched it over the whole 293px content rect.\n .adw-toolbar-view-content > :only-child:is([valign='start'], [valign='end'], [valign='center']) {\n flex-grow: 0;\n }\n\n // top-bar-style / bottom-bar-style: an opaque background plus a persistent\n // shadow, which `.border` swaps for a hairline (adw-toolbar-view.c:1011-1024,\n // _toolbars.scss `> .top-bar.raised`).\n .adw-toolbar-view-top.raised,\n .adw-toolbar-view-bottom.raised {\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n }\n\n .adw-toolbar-view-top.raised {\n box-shadow:\n 0 1px var(--headerbar-shade-color),\n 0 2px 4px var(--headerbar-shade-color);\n\n &.border {\n box-shadow: 0 1px var(--headerbar-shade-color);\n }\n }\n\n .adw-toolbar-view-bottom.raised {\n box-shadow:\n 0 -1px var(--headerbar-shade-color),\n 0 -2px 4px var(--headerbar-shade-color);\n\n &.border {\n box-shadow: 0 -1px var(--headerbar-shade-color);\n }\n }\n\n // A bar in a toolbar view is INLINE — `%headerbar-inline` → `%headerbar-flat`:\n // no background of its own, no separator, the content's foreground\n // (_toolbars.scss :313-317, _header-bar.scss :110-147). That is what makes a\n // flat-style view read as ONE surface with the bar sitting in it rather than as\n // a bar bolted on top of a pane, and it is why the shading below is the ONLY\n // thing that ever draws a line between them.\n //\n // Not folded into `%headerbar` itself: a header bar used as a WINDOW titlebar\n // keeps its own background and shade, which is what `adw-header-bar` outside a\n // toolbar view still renders.\n .adw-toolbar-view-top,\n .adw-toolbar-view-bottom {\n &:not(.raised) adw-header-bar {\n background: none;\n color: inherit;\n box-shadow: none;\n }\n }\n\n // The scroll shading under a FLAT bar belongs to the SCROLLER, not to the view:\n // upstream's selector is `toolbarview.undershoot-top scrolledwindow`, and GTK\n // draws that node only while the scroller is off the edge. Drawn from the view\n // instead — which is what this did — the fade is unconditional, so every flat\n // bar sat behind a permanent hairline that native shows only after scrolling.\n // `_scrolling.scss` + `src/scroll-shading.ts` now own it, per scroller.\n}\n\n// extend-content-to-*-edge: the content spans the full height and the bar is\n// drawn OVER it, which is `content_offset = 0` / `content_height = height` in\n// adw_toolbar_view_size_allocate (adw-toolbar-view.c:390-397).\nadw-toolbar-view[extend-content-to-top-edge] > .adw-toolbar-view-top,\nadw-toolbar-view[extend-content-to-bottom-edge] > .adw-toolbar-view-bottom {\n position: absolute;\n left: 0;\n right: 0;\n}\n\nadw-toolbar-view[extend-content-to-top-edge] > .adw-toolbar-view-top {\n top: 0;\n}\n\nadw-toolbar-view[extend-content-to-bottom-edge] > .adw-toolbar-view-bottom {\n bottom: 0;\n}\n","// _scrollbar.scss — <gtk-scrollbar>: libadwaita's trough, slider and the two overlay\n// variants, with GTK's `range` level collapsed.\n//\n// THE SELECTOR REWRITE, and why it is not a guess. libadwaita addresses\n// `scrollbar > range > trough > slider` (`_scrolling.scss:6-8`) because `GtkScrollbar` builds\n// a `GtkRange` and parents it to itself (gtkscrollbar.c:263-278). There is no `<gtk-range>`\n// element in this package — `Gtk.Range` is the ancestor of `GtkScale` and `Gtk.Scrollbar` and\n// is documented through them — so the trough-and-slider pair IS the node below the range and\n// the two class names stand in for the two GTK nodes. Everything else is upstream's\n// declaration in upstream's order: the trough's `margin: 9px` (and the 8px it gives back on\n// the cross axis, `_scrolling.scss:38-48`), the slider's `$_slider_width: 8px`, its\n// `border: 8px solid transparent` with `background-clip: padding-box` — which is how an 8px\n// dot becomes a 24px pill — and the `$_slider_min_length: 40px` floor.\n//\n// THE BAR'S BOX IS THE TROUGH'S MARGINS, 24px on the cross axis, and the slider's negative\n// margin is what centres it: the border box is 24px where the trough is 8px, so\n// `top: 0; margin-top: -8px` puts the visible 8px exactly on the trough. `GtkScrollbar`\n// measures its range to the trough's size and its own allocation is what is left, so the\n// numbers here are the same ones GTK adds up.\n//\n// THE SLIDER'S LENGTH IS COMPUTED, not written here. `gtk_range_compute_slider_position`\n// derives it from `page_size / (upper - lower)` and its position from\n// `(value - lower) / (upper - lower - page_size)`, and the element writes both as\n// `--adw-scrollbar-size` / `--adw-scrollbar-position` in px. That is why the slider is\n// absolutely positioned rather than sized by a percentage: the two fractions have DIFFERENT\n// denominators, and a percentage of the trough is the wrong unit for either.\n//\n// `--scrollbar-outline-color` is upstream's own token and this package does not define it,\n// so every use falls back to the window foreground — the outline exists to keep an overlay\n// indicator legible over whatever is beneath it, which is the job the foreground does.\n\n$_slider_min_length: 40px;\n$_slider_width: 8px;\n$_scrollbar_transition: all 200ms linear;\n\ngtk-scrollbar {\n position: relative;\n display: block;\n flex: none;\n color: var(--window-fg-color);\n touch-action: none;\n\n // The cross axis, which is the trough's own 8px plus the 8px margin on each side.\n &.horizontal {\n height: $_slider_width + 16px;\n }\n\n &.vertical {\n width: $_slider_width + 16px;\n }\n\n // `> range > trough` — the trough is the whole node and the slider rides inside it.\n .adw-scrollbar-trough {\n position: absolute;\n margin: 9px;\n border-radius: 99px;\n transition: $_scrollbar_transition;\n\n > .adw-scrollbar-slider {\n position: absolute;\n min-width: $_slider_width;\n min-height: $_slider_width;\n margin: -8px;\n border: 8px solid transparent;\n border-radius: 99px;\n background-clip: padding-box;\n transition: $_scrollbar_transition;\n background-color: color-mix(in srgb, currentColor 20%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 60%, transparent);\n }\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 40%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 60%, transparent);\n }\n\n &:active {\n background-color: currentColor;\n }\n }\n }\n }\n\n &.horizontal > .adw-scrollbar-trough {\n top: 8px;\n right: 9px;\n bottom: 8px;\n left: 9px;\n\n // `&.horizontal > range > trough > slider { min-width: $_slider_min_length }`, as a floor\n // on the computed length rather than a minimum: the element writes the WIDTH, and\n // upstream's `MIN (width, trough_width)` with the slider's own floor in front of it is\n // exactly `max()`.\n > .adw-scrollbar-slider {\n top: 0;\n left: 0;\n height: $_slider_width;\n width: max(var(--adw-scrollbar-size, #{$_slider_min_length}), #{$_slider_min_length});\n transform: translateX(var(--adw-scrollbar-position, 0));\n }\n }\n\n &.vertical > .adw-scrollbar-trough {\n top: 9px;\n right: 8px;\n bottom: 9px;\n left: 8px;\n\n // The vertical twin of the rule above — `min-height`, in libadwaita's own words.\n > .adw-scrollbar-slider {\n top: 0;\n left: 0;\n width: $_slider_width;\n height: max(var(--adw-scrollbar-size, #{$_slider_min_length}), #{$_slider_min_length});\n transform: translateY(var(--adw-scrollbar-position, 0));\n }\n }\n\n // `&:disabled { opacity: 0 }` on the slider upstream, which is what an INOPERABLE bar\n // looks like — `gtk_widget_set_sensitive (FALSE)` reaches the slider through the widget.\n // Nothing in GTK makes a scrollbar insensitive on its own, so nothing here sets\n // `disabled` either: the rule stands for an author that writes it, which is what the\n // `[disabled]` selector (and not `:disabled`) is for — a custom element carrying\n // `disabled` is not one the UA's `:disabled` matches.\n &[disabled] {\n pointer-events: none;\n\n .adw-scrollbar-slider {\n opacity: 0;\n }\n }\n\n // `> range.fine-tune > trough > slider` — the accent, which upstream paints for a range that\n // is being FINE-TUNED, which in GTK is what `update_zoom_state` turns on: while Shift is\n // held (gtkrange.c:1793-1804).\n &.fine-tune > .adw-scrollbar-trough > .adw-scrollbar-slider {\n &,\n &:hover,\n &:active {\n background-color: color-mix(in srgb, var(--accent-color) 60%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: var(--accent-color);\n }\n }\n }\n\n // `.overlay-indicator` — `setup_indicator`'s class, which is what turns GTK's permanent\n // scrollbar into the \"narrow, auto-hiding indicator\" (`_scrolling.scss:56-118`). It sits\n // OVER the content, so the trough keeps no background and the slider carries an outline to\n // stay legible against whatever is beneath it. The opacity is `indicator_start_fade`'s,\n // driven by `--adw-indicator-opacity` and transitioned over the fade duration.\n &.overlay-indicator {\n z-index: 2;\n background: none;\n box-shadow: none;\n padding: 0;\n opacity: var(--adw-indicator-opacity, 1);\n transition: opacity 1000ms linear;\n\n > .adw-scrollbar-trough {\n outline: 1px solid transparent;\n\n > .adw-scrollbar-slider {\n outline: 1px solid color-mix(in srgb, var(--scrollbar-outline-color, var(--window-fg-color)) 60%, transparent);\n outline-offset: -8px;\n\n @media (prefers-contrast: more) {\n outline: 1px solid var(--scrollbar-outline-color, var(--window-fg-color));\n }\n }\n }\n\n &:not(.hovering) > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-width: 3px;\n min-height: 3px;\n outline-color: color-mix(in srgb, var(--scrollbar-outline-color, var(--window-fg-color)) 35%, transparent);\n\n @media (prefers-contrast: more) {\n outline-color: color-mix(in srgb, var(--scrollbar-outline-color, var(--window-fg-color)) 60%, transparent);\n }\n }\n\n &.hovering > .adw-scrollbar-trough {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n @media (prefers-contrast: more) {\n background-color: color-mix(in srgb, currentColor 25%, transparent);\n }\n }\n\n &.horizontal {\n > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-width: $_slider_min_length;\n }\n\n &.hovering > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-height: $_slider_width;\n }\n\n &:not(.hovering) > .adw-scrollbar-trough {\n margin-top: 4px;\n margin-bottom: 4px;\n }\n }\n\n &.vertical {\n > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-height: $_slider_min_length;\n }\n\n &.hovering > .adw-scrollbar-trough > .adw-scrollbar-slider {\n min-width: $_slider_width;\n }\n\n &:not(.hovering) > .adw-scrollbar-trough {\n margin-left: 4px;\n margin-right: 4px;\n }\n }\n }\n}","// _viewport.scss — <gtk-viewport>: the scrollport a `GtkScrolledWindow` puts its child in.\n//\n// LIBADWAITA STYLES NOTHING HERE, and that is the whole file's justification for existing:\n// `_scrolling.scss` has rules for `scrollbar` and for `scrolledwindow` and none for\n// `viewport`, because GTK gives the node no surface to paint (gtkviewport.c:353). What is\n// below is therefore the CSS of the NODE GTK builds — the measurement, the clipping and the\n// one allocation `gtk_viewport_size_allocate` performs — and each declaration says which half\n// of it it is.\n//\n// THE CHILD IS ALLOCATED ITS NATURAL SIZE. GTK measures the child and hands it that\n// (gtkviewport.c:517-560), so content wider than the window scrolls sideways instead of being\n// squeezed into it. A flex container whose items are `flex: none` is that rule in CSS:\n// `flex-basis: auto` sizes an item to its content and `flex-shrink: 0` keeps it there, and\n// `align-items: flex-start` stops the cross axis from stretching it to fill.\n//\n// THE SCROLLING IS THE PLATFORM'S. GTK's viewport translates its child by the adjustment\n// instead of scrolling it, and the browser's equivalent of a scrollport that scrolls is a\n// scroll container — with the SCROLLBAR hidden, because in GTK those belong to the scrolled\n// window (which builds them, gtkscrolledwindow.c:4356-4363) and never to the viewport. The one\n// consequence worth writing down is the momentum after a touch release: GTK's\n// `GtkKineticScrolling` is a deceleration curve a page cannot hand a browser, so what a reader\n// gets is the platform's own — see `GtkScrolledWindow:kinetic-scrolling`.\n//\n// `overflow: auto`, not `hidden`: a browser clamps either way, but only `auto` runs the\n// platform's momentum and rubber-banding, which is the whole of what a touch scroll does here.\n\ngtk-viewport {\n display: flex;\n // A COLUMN, which is a statement about markup rather than about GTK: a GtkViewport holds\n // exactly ONE child, so a row and a column are the same layout there. Markup can hand a\n // viewport several children, and stacking them is the arrangement every one of them came\n // for — a row would lay ten labels side by side, which is the one answer no reader of a\n // scrollable expects. A single child is unaffected by the direction.\n flex-direction: column;\n align-items: flex-start;\n justify-content: flex-start;\n overflow: auto;\n // Both axes' scrollbars, hidden — `-webkit-scrollbar` for the engine that honours\n // `scrollbar-width: none` only since 121, the pairing `_carousel.scss` already uses.\n scrollbar-width: none;\n\n &::-webkit-scrollbar {\n display: none;\n }\n\n // `flex: none` is `flex: 0 0 auto` — GTK's \"the child's natural size, not less\".\n > * {\n flex: none;\n }\n}","// _scrolled_window.scss — <gtk-scrolled-window>: the allocation GTK's\n// `gtk_scrolled_window_allocate_child` / `allocate_scrollbar` pair performs.\n//\n// THE PLACEMENT IS A GRID of two cells and one corner, because that is what\n// `gtk_scrolled_window_allocate_scrollbar` (gtkscrolledwindow.c:3227-3305) computes: the\n// content takes what is left after each bar has taken its edge, and which edge that is comes\n// from two booleans the C derives from `window-placement`.\n//\n// · `is_top` — `window-placement` is `top-left` or `top-right` — decides whether the\n// HORIZONTAL bar is on the far (bottom) row or the near (top) one.\n// · `is_left = ltr != is_start` — `is_start` being the same corner's left half — decides\n// whether the VERTICAL bar is on the end edge or the start one. The direction half is\n// `:dir(rtl)` here rather than a class, because C reads it off the widget and CSS reads it\n// off the document.\n//\n// The third corner cell is `junction`, the node GTK draws where two bars meet\n// (gtkscrolledwindow.c:134-135); libadwaita paints nothing there, and neither does this — an\n// empty grid cell is the same absence with no node to hold it.\n//\n// AN OVERLAY INDICATOR IS LAID OUT INSIDE THE CONTENT, not beside it. That is\n// `priv->use_indicators` in the same function (gtkscrolledwindow.c:3255-3300): the bar's\n// allocation starts at the content's far edge MINUS the bar's own thickness, so it lies over\n// the content instead of shrinking it. Hence the second template — positioned against the\n// window, which is `position: relative` here for the reason GTK's is a child of the\n// scrolledwindow node.\n//\n// `.frame` is `GtkScrolledWindow:has-frame`, which its own CSS-node documentation spells out:\n// \"It gets a .frame style class added when `has-frame` is TRUE\" (gtkscrolledwindow.c:122-124).\n// The rule behind the class is libadwaita's `_misc.scss:4-7`, which `_style_classes.scss`\n// already carries, so no selector for it is repeated here.\n\ngtk-scrolled-window {\n position: relative;\n display: grid;\n // GTK asks its parent for as little as it can: `gtk_scrolled_window_measure` reports the\n // child's minimum only under `POLICY_NEVER` (gtkscrolledwindow.c:1846-1895) and the bars'\n // own thickness otherwise. `minmax(0, 1fr)` is that request — a track that may collapse to\n // nothing rather than one that demands its content's height, which is what\n // `gtk_widget_set_size_request` lets an author override afterwards.\n grid-template-columns: minmax(0, 1fr) auto;\n grid-template-rows: minmax(0, 1fr) auto;\n min-width: 0;\n min-height: 0;\n // GTK GIVES THIS WIDGET AN ALLOCATION from its parent and never decides its own size:\n // `gtk_scrolled_window_measure` reports the child's MINIMUM and the bars' own thickness\n // (gtkscrolledwindow.c:1846-1895), and `size_allocate` fills whatever it is\n // given. A browser scrolled window needs the same from its author — a height, a\n // `flex-basis`, a parent track — because an auto-height box grows with its content and then\n // has nothing to scroll. `flex: 1 1 0%` is that allocation for the ordinary case of a\n // window in a column, and it is 0 in an auto-height column, so an author who wants the\n // natural size writes one.\n flex: 1 1 0%;\n overflow: hidden;\n\n > gtk-viewport {\n grid-area: 1 / 1;\n }\n\n // The vertical bar spans BOTH rows, which is `gtk_widget_size_allocate` giving it the\n // whole content height (gtkscrolledwindow.c:3295-3305) minus whatever the horizontal bar\n // takes when that one is a layout neighbour rather than an overlay.\n > gtk-scrollbar.vertical {\n grid-row: 1 / 3;\n grid-column: 2;\n justify-self: end;\n }\n\n > gtk-scrollbar.horizontal {\n grid-column: 1 / 3;\n grid-row: 2;\n align-self: end;\n }\n\n // `is_top` false: the horizontal bar takes the NEAR row, and the content is what is left.\n &.bottom-left,\n &.bottom-right {\n grid-template-rows: auto minmax(0, 1fr);\n\n > gtk-scrollbar.horizontal {\n grid-row: 1;\n align-self: start;\n }\n }\n\n // `is_left` true: the vertical bar takes the START column.\n &.top-right,\n &.bottom-right {\n grid-template-columns: auto minmax(0, 1fr);\n\n > gtk-scrollbar.vertical {\n grid-column: 1;\n justify-self: start;\n }\n }\n\n // The direction half of `is_left = ltr != is_start`: everything the C inverts under RTL.\n &:dir(rtl) {\n grid-template-columns: auto minmax(0, 1fr);\n\n > gtk-scrollbar.vertical {\n grid-column: 1;\n justify-self: start;\n }\n\n &.top-right,\n &.bottom-right {\n grid-template-columns: minmax(0, 1fr) auto;\n\n > gtk-scrollbar.vertical {\n grid-column: 2;\n justify-self: end;\n }\n }\n }\n\n // The overlay case, which is the whole of what `use_indicators` changes in the allocation:\n // both bars leave the grid and lie over the content.\n &.overlay-scrolling > gtk-scrollbar.overlay-indicator {\n position: absolute;\n\n &.vertical {\n inset-block: 0;\n right: 0;\n }\n\n &.horizontal {\n inset-inline: 0;\n bottom: 0;\n }\n }\n}","// _window_handle.scss — <gtk-window-handle>: the box GTK's `GtkBinLayout` gives the child.\n//\n// `gtk_window_handle_class_init` sets `GTK_TYPE_BIN_LAYOUT` and the `windowhandle` CSS name\n// (gtkwindowhandle.c:553-554), and libadwaita has NO rule for either — the widget contributes\n// no surface, a shadow or a border, only the titlebar's gestures. `display: contents` is that\n// in CSS: the child keeps its own box, participates in its PARENT's layout as if the handle\n// were not there, and a titlebar strip can go anywhere a header bar goes without moving\n// anything around it.\n//\n// `user-select: none` is the one declaration that is not C: a titlebar is dragged, not\n// selected, and GTK's drag gesture swallows the text selection a browser would otherwise\n// start on the way to a triple click.\n\ngtk-window-handle {\n display: contents;\n\n // The drag belongs to the strip, not to the text inside it, and a double click on the\n // title is the `toggle-maximize` gesture rather than a word selection.\n user-select: none;\n}","// _scrolling.scss — GtkScrolledWindow's edge indicators.\n//\n// The two states are drawn by ONE pseudo-element per edge, because they cannot be\n// live at once: an undershoot means content is hidden past the edge, an overshoot\n// means the position is past it. `src/scroll-shading.ts` decides which, and carries\n// the overshoot's size in `--adw-overshoot`.\n//\n// Both boxes are sticky with a negative margin of their own height, so they weld to\n// the scrollport edge and consume no layout — an absolutely positioned child of a\n// scroll container scrolls away with the content instead of staying at the edge.\n//\n// Reference: refs/libadwaita/src/stylesheet/_drawing.scss (undershoot/overshoot mixins)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_scrolling.scss\n// Reference: refs/gtk/gtk/gtkscrolledwindow.c (UNDERSHOOT_SIZE, MAX_OVERSHOOT_DISTANCE)\n// Copyright (c) GNOME contributors (GTK, libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web.\n\n// `UNDERSHOOT_SIZE` — the band the node is allocated. Mostly transparent: the\n// gradient over it is done after 4px.\n$undershoot_size: 40px;\n\n// The shade both gradients start from — `color-mix(… var(--shade-color) 75% …)`.\n$undershoot_shade: color-mix(in srgb, var(--shade-color) 75%, transparent);\n\n.adw-scroll-shaded {\n // The two indicator boxes exist for every shaded scroller and stay invisible\n // until a state class turns them on, so nothing has to be inserted or removed\n // while scrolling.\n &::before,\n &::after {\n content: '';\n display: block;\n position: sticky;\n z-index: 1;\n flex-shrink: 0;\n pointer-events: none;\n height: 0;\n background: none;\n box-shadow: none;\n }\n\n &::before {\n top: 0;\n }\n\n &::after {\n bottom: 0;\n }\n\n // --- Undershoot: \"there is content past this edge\" ---\n //\n // A 1px line at the very edge plus a 4px fade, both at 75% of the shade colour.\n // Constant size: it says THAT content is hidden, never how much.\n &.undershoot-top::before {\n height: $undershoot_size;\n margin-bottom: -$undershoot_size;\n box-shadow: inset 0 1px $undershoot_shade;\n background: linear-gradient(to bottom, $undershoot_shade, transparent 4px);\n }\n\n &.undershoot-bottom::after {\n height: $undershoot_size;\n margin-top: -$undershoot_size;\n box-shadow: inset 0 -1px $undershoot_shade;\n background: linear-gradient(to top, $undershoot_shade, transparent 4px);\n }\n\n // --- Overshoot: \"there is nothing past this edge\" ---\n //\n // Two stacked radial gradients in the CURRENT text colour — a tight 3% band at\n // the edge over a soft 50% wash — sized to how far past the edge the position\n // was pushed. `--adw-overshoot` is set per scroller by the shading controller.\n &.overshoot-top::before,\n &.overshoot-bottom::after {\n height: var(--adw-overshoot, 0px);\n background-repeat: no-repeat;\n box-shadow: none;\n // The spring-back: the size is driven from JS, the fade rides the transition\n // so releasing the wheel eases out instead of cutting.\n transition: height 200ms ease-out, opacity 200ms ease-out;\n }\n\n &.overshoot-top::before {\n margin-bottom: calc(var(--adw-overshoot, 0px) * -1);\n background-image:\n radial-gradient(farthest-side at top, color-mix(in srgb, currentColor 12%, transparent) 85%, transparent),\n radial-gradient(farthest-side at top, color-mix(in srgb, currentColor 5%, transparent), transparent);\n background-size: 100% 3%, 100% 50%;\n background-position: top;\n }\n\n &.overshoot-bottom::after {\n margin-top: calc(var(--adw-overshoot, 0px) * -1);\n background-image:\n radial-gradient(farthest-side at bottom, color-mix(in srgb, currentColor 12%, transparent) 85%, transparent),\n radial-gradient(farthest-side at bottom, color-mix(in srgb, currentColor 5%, transparent), transparent);\n background-size: 100% 3%, 100% 50%;\n background-position: bottom;\n }\n\n @media (prefers-reduced-motion: reduce) {\n &.overshoot-top::before,\n &.overshoot-bottom::after {\n transition: none;\n }\n }\n}\n","// _wrap_box.scss — adw-wrap-box styling (a box that wraps its children onto new\n// lines, the web analog of flexbox `flex-wrap: wrap`). Mirrors Adw.WrapBox.\n// Reference: refs/adwaita-web/adwaita-web/scss/_wrap_box.scss\n// Reference: refs/libadwaita/src/adw-wrap-box.c / adw-wrap-layout.c (Adw.WrapBox)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// Direction, gaps, `justify-content` and `align-content` are driven imperatively\n// by the component from its attributes — these are the libadwaita defaults\n// (horizontal, packed to the start of each line, lines wrapping downwards from\n// the top). A wrap box is a pure layout container, so it carries no background\n// of its own; children handle their own theming.\nadw-wrap-box {\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n justify-content: flex-start;\n // Each child is allocated the FULL cross extent of its line — `h = line_size`\n // in adw-wrap-layout.c:746-751 — which is `stretch`, the flexbox default. The\n // port used to write `flex-start` here and drive it from `align`, which is a\n // MAIN-axis property in libadwaita and belongs on `justify-content`.\n align-items: stretch;\n align-content: flex-start;\n}\n\n// `wrap-policy`, published by the component as a custom property. The FALLBACK\n// is the load-bearing part: it is `ADW_WRAP_NATURAL`, libadwaita's default\n// (adw-wrap-box.c:491-495), where CSS defaults `flex-shrink` to 1 — so a wrap\n// box that has not upgraded yet, or one whose policy is unset, draws Adwaita's\n// choice rather than the cascade's.\nadw-wrap-box > * {\n flex-shrink: var(--adw-wrap-box-child-shrink, 0);\n}\n\n// FILL grows the children and keeps the spacing constant\n// (adw-wrap-layout.c:317-319, :326-341); SPREAD deliberately does NOT, so the\n// gaps take the leftover instead. `data-line-justify` is the mode the component\n// resolved for a COMPLETE line.\n//\n// A lone child is excluded because it is not on a complete line: a box with one\n// element child has exactly one line, and that line is the final one — see\n// below.\nadw-wrap-box[data-line-justify='fill'] > *:not(:only-child) {\n flex-grow: 1;\n}\n\n// `:only-child` is the one line-membership fact CSS knows without a layout pass,\n// and libadwaita treats that line as the LAST one. Both justified modes stretch\n// it: FILL by definition, SPREAD because its \"keep the children at their minimum\n// size\" branch is guarded by `n_children > 1` (adw-wrap-layout.c:338), so a lone\n// child is stretched regardless (adw-wrap-box.c:349-352).\nadw-wrap-box[data-last-line-justify='fill'] > :only-child,\nadw-wrap-box[data-last-line-justify='spread'] > :only-child {\n flex-grow: 1;\n}\n\n// The final line, when it is NOT justified (`justify-last-line` unset — the C\n// default, adw-wrap-box.c:379-381): a generated flex item absorbs that line's\n// leftover space, so it packs at the start of the main axis the way an\n// un-justified line does, while `justify-content: space-between` keeps spreading\n// the complete lines above it. `::after` is the only per-line hook flexbox\n// offers, and it lands on the final line by construction.\n//\n// The negative main-axis margin cancels exactly the one gap the filler would\n// otherwise add, so an exactly-full line can never be pushed into a new one.\nadw-wrap-box[data-line-justify='spread'][data-last-line-justify='none']::after {\n content: '';\n flex: 1 0 0;\n min-width: 0;\n min-height: 0;\n margin-left: calc(-1 * var(--adw-wrap-box-child-spacing, 0px));\n}\n\n// A vertical box packs along the block axis, so the gap to cancel is the one\n// before the filler in that direction.\nadw-wrap-box[orientation='vertical'][data-line-justify='spread'][data-last-line-justify='none']::after {\n margin-left: 0;\n margin-top: calc(-1 * var(--adw-wrap-box-child-spacing, 0px));\n}\n","// _panes.scss — `.sidebar-pane` / `.content-pane` / `.overlay-pane`.\n//\n// These are libadwaita STYLE CLASSES, not private markup of one widget. Both\n// split views document them as their CSS node tree\n// (adw-navigation-split-view.c:157-165, adw-overlay-split-view.c:136-152) and\n// both apply them to their pane bins, which makes them the supported hook an\n// app themes a pane through. They lived nowhere in this stylesheet, so each\n// split view hard-coded `--sidebar-bg-color` onto its own private pane div\n// instead — with two consequences.\n//\n// The first is that an app writing the documented selector styles nothing, and\n// gets no error saying so. Our own docs site is the evidence: every split-view\n// example carried `class=\"sidebar\"` on the sidebar toolbar view, hand-written\n// by someone reaching for exactly this, matching no rule in the build.\n//\n// The second is a rendering defect, because the class is not constant — it is\n// how the widget says which of its states a pane is in. A collapsed overlay\n// sidebar is an `.overlay-pane`, on the WINDOW background, not the sidebar one\n// (adw-overlay-split-view.c:718-741); a collapsed navigation split view has no\n// pane bins at all, its pages being ordinary navigation pages. Painting the\n// sidebar colour at every width, as the private rules did, got both wrong.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss (.sidebar-pane, .overlay-pane)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n.sidebar-pane {\n background-color: var(--sidebar-bg-color);\n color: var(--sidebar-fg-color);\n}\n\n// A pane nested inside another sidebar pane defers to it rather than stacking a\n// second tint (`.sidebar-pane .sidebar-pane`, _sidebars.scss). libadwaita also\n// recolours the MIDDLE pane of a three-pane setup through\n// `--secondary-sidebar-*`; that needs a split view nested in a split view to\n// mean anything, and no such composition is rendered yet, so the tokens are\n// defined (they are public API an app may already reference) and the selector\n// is left for whoever builds the composition that can test it.\n.sidebar-pane .sidebar-pane {\n background-color: transparent;\n color: inherit;\n}\n\n// `.content-pane` deliberately has NO rule here. libadwaita gives it no colour\n// of its own — the window shows through — and writing `transparent` would be a\n// claim, not a copy: it would override the `--window-bg-color` the navigation\n// split view sets on its own content pane for the case where the view is not a\n// window's direct child. The class is still applied, because being able to\n// select it is the point.\n\n// Collapsed: the sidebar floats ABOVE the content as a temporary panel, and\n// libadwaita gives it the window colours rather than the sidebar ones — a panel\n// over the content is not the same surface as a pane beside it.\n.overlay-pane {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n","// _overlay_split_view.scss — adw-overlay-split-view styling.\n//\n// The GEOMETRY is no longer here. It used to be four `transform: translateX(±100%)`\n// rules keyed on `.collapsed` / `.show-sidebar` / `.sidebar-end`, which can only\n// express the two END STATES of a reveal — so `show-progress` was 0 or 1, the\n// five `OVERLAY_SWIPE_*` conformance tables shipped unexercised, and the docked\n// hide slid the wrong way for an `end` sidebar because the JS wrote `marginRight`\n// whichever edge the pane was on.\n//\n// The element now writes the pane rect per frame from\n// `layoutOverlaySplitView`, which is continuous and knows the edge (including\n// under RTL, where a `start` sidebar is drawn on the RIGHT —\n// `get_start_or_end`, adw-overlay-split-view.c:227-234). What is left here is\n// what CSS genuinely owns: the box model, the stacking, and the transition that\n// smooths a programmatic toggle.\n//\n// Reference: refs/libadwaita/src/adw-overlay-split-view.c\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented as Web Component for @gjsify/adwaita-web.\n\nadw-overlay-split-view {\n display: flex;\n flex-direction: row;\n flex: 1;\n min-height: 0;\n position: relative;\n overflow: hidden;\n\n // NO background here. The pane colour comes from the `.sidebar-pane` /\n // `.overlay-pane` class the element toggles (see _panes.scss), because which\n // of the two a pane is in is exactly what decides its colour — hard-coding\n // `--sidebar-bg-color` on this private class painted a collapsed overlay,\n // which libadwaita puts on the window background, as though it were docked.\n // A flex column, as the content pane is, so the pane's widget fills it: GTK allocates the\n // sidebar the whole pane. A block pane sized a toolbar view by its content, and the\n // gallery's `.blp` sidebar list stopped 130px above the pane's bottom edge.\n .adw-osv-sidebar {\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n flex-shrink: 0;\n z-index: 10;\n align-self: stretch;\n // Only `opacity` transitions. The offset is driven per frame, so animating\n // it here would fight the swipe: a gesture would lag its own finger.\n transition: opacity 0.2s ease;\n }\n\n // THE CONTAINER MINIMUM, as CSS spells it. `measure_uncollapsed`\n // (adw-overlay-split-view.c:558-563) is `trunc(sidebar_min * progress) +\n // content_min`, and a flex row reaches exactly that on its own PROVIDED the\n // content is allowed to claim its own minimum: the sidebar is `flex-shrink: 0`\n // with a `min-width` of `sidebar_min`, so the sum is the container's floor.\n //\n // `min-width: 0` was here instead — the flex idiom for \"let this be crushed so\n // an ellipsis can happen\" — which is precisely how the content pane could be\n // squeezed to nothing while the sidebar kept its whole width. A child that\n // needs to truncate can still ask for `min-width: 0` itself; the PANE may not.\n //\n // Not computed in JS: a measured number would need the content's min-content\n // size, which the DOM does not expose without a reflow, and the first attempt\n // used `scrollWidth` — the pane's CURRENT width — which pinned the view at\n // whatever it happened to be and stopped it responding to its breakpoint.\n .adw-osv-content {\n flex: 1;\n min-width: min-content;\n min-height: 0;\n display: flex;\n flex-direction: column;\n align-self: stretch;\n }\n\n // Docked — the sidebar sits in the flex row and the hidden part is taken off\n // its own edge by a negative margin the element computes.\n &:not(.collapsed) .adw-osv-sidebar {\n position: relative;\n }\n\n // Docked + sidebar-end — dock the sidebar to the far side of the content\n // (the Adw.OverlaySplitView { sidebar-position: end } layout). flex `order`\n // flips the visual order without changing the slotting DOM order.\n &:not(.collapsed).sidebar-end {\n .adw-osv-content {\n order: 1;\n }\n\n .adw-osv-sidebar {\n order: 2;\n }\n }\n\n // THE DIVIDER FOLLOWS THE VISUAL SIDE, not the logical one. `_sidebars.scss`\n // makes it `:dir()` × `.end` (:21-39), which is exactly the product\n // `.sidebar-at-visual-start` already carries: under RTL a `start` sidebar is\n // drawn on the right and its divider belongs on its left edge.\n &:not(.collapsed) {\n .adw-osv-sidebar {\n border-inline-end: none;\n border-inline-start: none;\n }\n\n &.sidebar-at-visual-start .adw-osv-sidebar {\n border-right: 1px solid var(--separator-color);\n }\n\n &:not(.sidebar-at-visual-start) .adw-osv-sidebar {\n border-left: 1px solid var(--separator-color);\n }\n }\n\n // Overlay (collapsed) — the sidebar floats above the content at the absolute\n // offset the element writes into `left`, which is the only property that can\n // carry a mid-swipe position.\n &.collapsed .adw-osv-sidebar {\n position: absolute;\n top: 0;\n bottom: 0;\n box-shadow: 0 0 12px rgb(0 0 0 / 25%);\n }\n\n // THE TWO RESTING STATES ARE CSS. Everything BETWEEN them is JS.\n //\n // Dropping these is what shipped the docs-site regression. The offset is\n // driven per frame from `layoutOverlaySplitView` — but a view that has never\n // been measured drives nothing, and an absolutely-positioned pane with no\n // `left` resolves to `left: 0` at full opacity. So a HIDDEN sidebar was\n // painted over the content at the wrong edge, on a page whose slideshow\n // builds each slide inside `display: none` and moves it in, so the first\n // measurement never arrived and this fallback was the whole rendering.\n //\n // Not a second copy of the arithmetic: 0% and 100% ARE the two ends the JS\n // interpolates between, and neither of them needs a pixel to say. The element\n // clears its inline placement whenever it has no measurement, which is what\n // hands control back to these rules instead of stranding a stale offset.\n &.collapsed {\n // Revealed: flush against the edge the pane is drawn on.\n &.sidebar-at-visual-start .adw-osv-sidebar {\n left: 0;\n right: auto;\n }\n\n &:not(.sidebar-at-visual-start) .adw-osv-sidebar {\n left: auto;\n right: 0;\n }\n\n // Hidden: entirely off that same edge, and untouchable while it is there.\n &:not(.show-sidebar) {\n .adw-osv-sidebar {\n opacity: 0;\n pointer-events: none;\n }\n\n &.sidebar-at-visual-start .adw-osv-sidebar {\n left: auto;\n right: 100%;\n }\n\n &:not(.sidebar-at-visual-start) .adw-osv-sidebar {\n left: 100%;\n right: auto;\n }\n }\n }\n\n // Docked and hidden — the pane takes no room in the row. The JS expresses\n // this as a negative margin so it can animate; unmeasured, the end state is\n // simply a pane of no width.\n &:not(.collapsed):not(.show-sidebar) .adw-osv-sidebar {\n width: 0;\n min-width: 0;\n overflow: hidden;\n opacity: 0;\n pointer-events: none;\n }\n\n // Backdrop — the click-outside shield. `hidden` is the element's, off\n // `shieldVisible`; the OPACITY is the shadow-helper progress, so it fades with\n // the reveal instead of appearing whole.\n .adw-osv-backdrop {\n display: none;\n }\n\n &.collapsed .adw-osv-backdrop:not([hidden]) {\n display: block;\n position: absolute;\n inset: 0;\n background: rgb(0 0 0 / 30%);\n z-index: 9;\n transition: opacity 0.2s ease;\n }\n}\n\n// Sidebar content layout helper — wraps the sidebar's children with the\n// standard Adwaita spacing scale (12px padding, 12px gap between groups).\n.adw-sidebar-content {\n padding: var(--spacing-m);\n display: flex;\n flex-direction: column;\n gap: var(--spacing-m);\n}\n\n// Sidebar toggle button — sidebar-show-symbolic icon via CSS mask\n.adw-sidebar-toggle-icon::after {\n content: '';\n position: absolute;\n inset: 0;\n background-color: currentColor;\n -webkit-mask-image: var(--icon-sidebar-show);\n mask-image: var(--icon-sidebar-show);\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-size: 16px 16px;\n mask-size: 16px 16px;\n -webkit-mask-position: center;\n mask-position: center;\n pointer-events: none;\n}\n","// _navigation_split_view.scss — adw-navigation-split-view styling (docked sidebar).\n//\n// Visibility is `data-pane-visible`, written by the element from\n// `update_navigation_stack` (adw-navigation-split-view.c:342-405), not from the\n// two flags. Two of that table's rules are not expressible as\n// `.collapsed.show-content`: a LONE child stays visible whatever `show-content`\n// says (:389-401), and with `sidebar-position: end` the CONTENT is the root page\n// so the sidebar is pushed ON TOP of it rather than replacing it. This file used\n// to key off the flags and got both wrong — a collapsed view with only a sidebar\n// rendered blank.\n//\n// Reference: refs/adwaita-web/adwaita-web/docs/widgets/navigationsplitview.md\n// Reference: refs/libadwaita/src/adw-navigation-split-view.c\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-navigation-split-view {\n display: flex;\n flex-direction: row;\n min-height: 0;\n min-width: 0;\n flex: 1 1 auto;\n\n // NO background here — it comes from the `.sidebar-pane` class the element\n // applies while DOCKED (see _panes.scss). Collapsed, libadwaita builds no\n // pane bins at all and the sidebar is an ordinary full-window navigation\n // page; a background nailed to this private class made it sidebar-coloured\n // at every width.\n .adw-nsv-sidebar {\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex-shrink: 0;\n }\n\n // The container MINIMUM, as CSS spells it: `measure_uncollapsed`\n // (adw-navigation-split-view.c:264-267) is `sidebar_min + content_min`, which\n // a flex row reaches by itself once the content may claim its own minimum.\n // `min-width: 0` — the flex idiom for \"let this be crushed\" — was here, which\n // is how the content pane could be squeezed to nothing while the sidebar,\n // being `flex-shrink: 0`, kept its whole width.\n .adw-nsv-content {\n display: flex;\n flex-direction: column;\n min-width: min-content;\n min-height: 0;\n flex: 1 1 auto;\n background-color: var(--window-bg-color);\n }\n\n // A pane's page fills the pane, as GTK allocates it the whole pane. The two panes are\n // flex columns and an `<adw-navigation-page>` is a block, so a page in one — which is\n // what a `.blp` writes, `sidebar: Adw.NavigationPage { … }` — was sized by its content:\n // the gallery's sidebar list stopped 118px short of the pane it sat in. Its child fills\n // it in turn, the way `.adw-navigation-page > *` does inside a navigation view.\n .adw-nsv-sidebar > adw-navigation-page,\n .adw-nsv-content > adw-navigation-page {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n\n > * {\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n\n // `sidebar-position: end` docks the sidebar past the content. flex `order`\n // flips the visual order without changing the slotting DOM order.\n &.sidebar-end {\n .adw-nsv-content {\n order: 1;\n }\n\n .adw-nsv-sidebar {\n order: 2;\n }\n }\n\n // THE DIVIDER FOLLOWS THE VISUAL SIDE. `_sidebars.scss:1293-1302` makes it\n // `:dir()` × `.end`, which is the product `.sidebar-at-visual-start` carries:\n // under RTL a `start` sidebar is drawn on the right and its divider belongs on\n // its left edge. A fixed `border-right` drew it on the wrong side for half the\n // four combinations.\n &.sidebar-at-visual-start .adw-nsv-sidebar {\n border-right: 1px solid var(--separator-color);\n }\n\n &:not(.sidebar-at-visual-start) .adw-nsv-sidebar {\n border-left: 1px solid var(--separator-color);\n }\n\n // Collapsed: whichever pane the STACK puts on top fills the view, and the\n // other is not rendered at all.\n &.collapsed {\n [data-pane-visible='false'] {\n display: none;\n }\n\n .adw-nsv-sidebar[data-pane-visible='true'] {\n flex: 1 1 auto;\n max-width: none;\n border-right: none;\n border-left: none;\n }\n }\n}\n","// _carousel.scss — adw-carousel + its dot/line page indicators.\n//\n// A horizontal scroll-snap pager (adw-carousel) plus two indicator widgets that\n// bind to it. The indicators reproduce libadwaita's snapshot drawing as CSS: a\n// per-marker `--adw-carousel-progress` (0 = inactive, 1 = focused) lerps between\n// the inactive and selected size/opacity exactly as AdwCarousel does.\n//\n// Dots: DOTS_RADIUS 3 → DOTS_RADIUS_SELECTED 4 (6px → 8px), DOTS_SPACING 7,\n// DOTS_OPACITY 0.3 → DOTS_OPACITY_SELECTED 0.9, active fill = accent.\n// Lines: LINE_LENGTH 35, LINE_WIDTH 3, LINE_SPACING 5, LINE_OPACITY 0.3 →\n// LINE_OPACITY_ACTIVE 0.9, active fill = accent.\n//\n// Reference: refs/libadwaita/src/adw-carousel.c\n// Reference: refs/libadwaita/src/adw-carousel-indicator-dots.c\n// Reference: refs/libadwaita/src/adw-carousel-indicator-lines.c\n// Reference: refs/adwaita-web/adwaita-web/scss/_carousel_indicators.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-carousel {\n display: block;\n overflow: hidden;\n // A carousel's own width is its parent's to give, never its pages laid end to end. The\n // track is a row of full-width pages, so its max-content width is their SUM, and a\n // carousel in a stretching box (the gallery's `.blp`) pushed that box 274px past its\n // window. GTK measures a carousel by its widest page; CSS has no \"max of the children\"\n // for a scrolling row, so the width comes from outside, as a filled GTK allocation does.\n contain: inline-size;\n\n .adw-carousel-track {\n display: flex;\n flex-direction: row;\n height: 100%;\n overflow-x: auto;\n scroll-snap-type: x mandatory;\n // Hide the scrollbar — the carousel is paged, not scrolled by chrome.\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n &::-webkit-scrollbar {\n display: none;\n }\n }\n\n // `100%` is the FALLBACK basis, used until the element has measured its pages:\n // libadwaita gives every page the largest natural size capped at the carousel\n // (adw-carousel.c:748-765), which is only 100% when a page asks for it all. The\n // element narrows `flex-basis` to the measured size and pads the track by the\n // half-gap that leaves, so the neighbours peek in as they do in GTK.\n //\n // `center` and not `start` for the same reason: the strip is drawn centred\n // (:801), and centre-snapping is what makes the track padding cancel out of the\n // scroll offset, leaving `scrollLeft = position * distance` exactly true.\n //\n // `min-width: 0` because a flex item floors at its own min-content size: without\n // it a page whose content is wider than the carousel keeps that width instead of\n // being capped at it, and GTK allocates the capped one (:754) and clips.\n .adw-carousel-page {\n flex: 0 0 100%;\n min-width: 0;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n scroll-snap-align: center;\n scroll-snap-stop: always;\n }\n}\n\n// Shared layout for both indicator kinds — a centered, horizontally-laid-out\n// row of markers (matching the AdwCarouselIndicator* widgets).\nadw-carousel-indicator-dots,\nadw-carousel-indicator-lines {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-xs);\n\n // The clickable marker resets the button chrome — the visible shape is drawn\n // by the per-kind rules below.\n button {\n appearance: none;\n -webkit-appearance: none;\n margin: 0;\n padding: 0;\n border: none;\n background: none;\n cursor: pointer;\n flex: 0 0 auto;\n }\n}\n\n// Dots — DOTS_SPACING 7px between centers; base diameter 6px (radius 3) growing\n// to 8px (radius 4) on the focused dot, opacity ramping 0.3 → 0.9.\nadw-carousel-indicator-dots {\n gap: 7px;\n\n .adw-carousel-dot {\n width: 8px;\n height: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n // The painted disc lives in ::before so the 8px hit-target stays constant\n // while the visible dot grows from 6px → 8px with progress.\n &::before {\n content: '';\n display: block;\n // 6px + (8px - 6px) * progress\n width: calc(6px + 2px * var(--adw-carousel-progress, 0));\n height: calc(6px + 2px * var(--adw-carousel-progress, 0));\n border-radius: 50%;\n background-color: var(--window-fg-color);\n // 0.3 + (0.9 - 0.3) * progress\n opacity: calc(0.3 + 0.6 * var(--adw-carousel-progress, 0));\n transition:\n width 0.2s ease,\n height 0.2s ease,\n opacity 0.2s ease,\n background-color 0.2s ease;\n }\n\n &.active::before {\n background-color: var(--window-fg-color);\n }\n }\n}\n\n// Lines — LINE_LENGTH 35px, LINE_WIDTH 3px, LINE_SPACING 5px; opacity ramps\n// 0.3 → 0.9; the active line recolors to the accent.\nadw-carousel-indicator-lines {\n gap: 5px;\n\n .adw-carousel-line {\n width: 35px;\n height: 3px;\n border-radius: 1.5px;\n background-color: var(--window-fg-color);\n // 0.3 + (0.9 - 0.3) * progress\n opacity: calc(0.3 + 0.6 * var(--adw-carousel-progress, 0));\n transition:\n opacity 0.2s ease,\n background-color 0.2s ease;\n\n &.active {\n background-color: var(--window-fg-color);\n }\n }\n}\n","// _tab_bar.scss — <adw-tab-bar>, libadwaita's tab bar as the separate widget it is: a\n// headerbar-coloured strip holding one chip per page, with an action widget on either\n// side of the chips and a two-pixel overflow bar underneath them.\n//\n// The chip rules below are the SAME declarations `scss/_tab_view.scss` writes for\n// `<adw-tab-view>`'s merged bar, from the same upstream block: `tabbar` / `tabbox` / `tab`\n// in refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:1-95 with the chip's own\n// metrics from :154-176. Two copies rather than one shared partial, and deliberately so —\n// the merged bar is what every existing `<adw-tab-view>` test measures (it queries\n// `.adw-tab-bar` inside the view), so lifting its rules into a placeholder both selectors\n// `@extend` would change the compiled stylesheet for a widget this package did not touch.\n// The chip's own MARKUP is shared instead, in src/tab-chip.ts, which is where a change to\n// what a chip contains belongs.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss (tabbar .box,\n// tabbox + its separator / revealer > indicator, tab, tabbox.single-tab tab,\n// .start-action / .end-action, %tabbar-inline)\n// Reference: refs/libadwaita/src/stylesheet/_colors.scss:270 ($selected_color, the 10% the\n// selected chip and the hover/active terms above it are mixed from)\n// Copyright (c) 2024-2025 Alice Mikhaylenko / Purism SPC. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-tab-bar {\n display: flex;\n align-items: stretch;\n flex-shrink: 0;\n box-sizing: border-box;\n // `padding: 1px; padding-top: 0` — the strip's own 1px inset, which is where the\n // separator between it and the view below comes from.\n padding: 0 1px 1px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n // libadwaita's inset bottom shade under the bar.\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n // The strip is the ONE scroll window in the widget: `AdwTabBox` sits in a\n // `GtkScrolledWindow`, and pinned tabs stay outside it.\n overflow-x: auto;\n scrollbar-width: none;\n\n &[hidden] {\n display: none;\n }\n\n @media (prefers-contrast: more) {\n box-shadow: inset 0 -1px var(--border-color);\n }\n\n // `%tabbar-inline`, the `.inline` style class (adw-tab-bar.c:65-69): the bar looks like\n // part of an AdwHeaderBar by default, and this removes its background so it can sit in\n // another context instead.\n &.inline {\n background-color: transparent;\n color: inherit;\n box-shadow: none;\n padding-bottom: 0;\n }\n\n // `AdwBin`s either side of the box (adw-tab-bar.ui). The two `padding-*-: 0` rules are\n // libadwaita's `:dir()` pair for exactly this: the action widget sits flush against the\n // chips on the side it is on, which logical properties say once instead of twice.\n .adw-tab-bar-start-action,\n .adw-tab-bar-end-action {\n flex-shrink: 0;\n box-sizing: border-box;\n padding: 6px 5px;\n\n &:empty {\n display: none;\n }\n }\n\n .adw-tab-bar-start-action {\n padding-inline-end: 0;\n }\n\n .adw-tab-bar-end-action {\n padding-inline-start: 0;\n }\n\n .adw-tab-box {\n display: flex;\n align-items: stretch;\n flex: 1 1 auto;\n // `padding-bottom: 6px; padding-top: 6px; min-height: 34px`.\n padding: 6px 0;\n min-height: 34px;\n }\n\n // `inverted` — the box lays its children out the other way round, which is what puts a\n // non-pinned tab's close button at the BEGINNING and its indicator at the end\n // (adw-tab-bar.c:636-644).\n &[inverted] .adw-tab-box {\n flex-direction: row-reverse;\n }\n\n // A single tab draws no background at all (`tabbox.single-tab tab`, :79-87).\n &.single-tab .adw-tab {\n &,\n &:hover,\n &:active {\n background: none;\n }\n }\n\n // `revealer > indicator` (:44-55): the two-pixel accent bar under the chips, shown\n // exactly while the strip cannot show them all.\n .adw-tab-box-overflow {\n flex: none;\n align-self: center;\n min-width: 2px;\n border-radius: 2px;\n margin: 3px 6px;\n background-color: color-mix(in srgb, var(--accent-color) 50%, transparent);\n\n &[hidden] {\n display: none;\n }\n\n @media (prefers-contrast: more) {\n background-color: var(--accent-color);\n }\n }\n\n // --- a single tab ------------------------------------------------------------\n // `tabbar, dnd > tab` (:154-176) for the metrics, `tab` (:56-77) for the states.\n .adw-tab {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n // `min-height: 26px; padding: 4px`.\n min-height: 26px;\n padding: 4px;\n margin: 0;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n line-height: 1;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background 150ms ease-in-out;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n\n // `:selected` is libadwaita's, and `$selected_color` is the currentColor 10% mix\n // (_colors.scss:270); the two hover/active terms under it are the 13% and the 19%.\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n\n @media (prefers-contrast: more) {\n &:hover,\n &:active,\n &.active {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n }\n\n // The thin separators between tabs (`tabbox > separator`, :29-38), hidden next to the\n // selected or the hovered one — which is `update_separators` in the element.\n .adw-tab + .adw-tab::before {\n content: '';\n position: absolute;\n left: 0;\n top: 3px;\n bottom: 3px;\n width: 1px;\n background-color: currentColor;\n opacity: 0.2;\n transition: opacity 150ms ease-in-out;\n pointer-events: none;\n }\n\n .adw-tab.active + .adw-tab::before,\n .adw-tab + .adw-tab.active::before,\n .adw-tab:hover + .adw-tab::before,\n .adw-tab + .adw-tab:hover::before {\n opacity: 0;\n }\n\n .adw-tab-title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n }\n\n .adw-tab-icon,\n .adw-tab-indicator {\n flex-shrink: 0;\n // `indicator` (:166-172): the two-pixel accent underline, which is the page's own\n // attention indicator and NOT the overflow bar above.\n width: 16px;\n height: 16px;\n\n &[hidden] {\n display: none;\n }\n }\n\n // `AdwTabPage:loading` swaps the icon image for the SAME paintable `Adw.Spinner` uses, so\n // the chip mounts a real `<adw-spinner>` rather than a second ring drawn in CSS.\n .adw-tab-spinner {\n flex: none;\n\n &[hidden] {\n display: none;\n }\n }\n\n // A pinned tab is a single-glyph chip: libadwaita hides both the title and the close\n // button at construction (adw-tab.c:645-650), and `tabCloseVisible` carries the same rule\n // in the element.\n .adw-tab.pinned {\n padding: 0 4px;\n\n .adw-tab-title {\n display: none;\n }\n }\n\n // `AdwTabPage:needs-attention` — the accent underline libadwaita animates in.\n .adw-tab.needs-attention::after {\n content: '';\n position: absolute;\n bottom: 2px;\n left: 50%;\n width: 12px;\n height: 2px;\n transform: translateX(-50%);\n border-radius: 1px;\n background-color: var(--accent-bg-color);\n }\n\n // The close affordance: `button.image-button` inside a tab (:158-164) — a 24px round\n // button with no fill of its own. Presence is decided in JS by `tabCloseVisible`.\n .adw-tab-close {\n box-sizing: border-box;\n flex-shrink: 0;\n position: relative;\n min-width: 24px;\n min-height: 24px;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 99px;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n opacity: 0.7;\n transition:\n background-color 150ms ease-in-out,\n opacity 150ms ease-in-out;\n\n &[hidden] {\n display: none;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--button-hover-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 9px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n }\n\n // `expand-tabs` — chips stretch to fill the strip evenly instead of sitting at their\n // minimum size (adw-tab-bar.c:622-634, delegated to the tab box).\n &[expand-tabs] .adw-tab {\n flex: 1 1 0;\n max-width: 200px;\n }\n}","// _tab_view.scss — adw-tab-view styling (a dynamic tabbed container with a tab\n// bar header; one page visible at a time). The bar is a headerbar-colored strip\n// of rounded chips; the selected chip is raised onto the view background, the\n// way libadwaita draws AdwTabBar over an AdwTabView.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss (tabbar/tabbox/tab)\n// Reference: refs/adwaita-web/adwaita-web/scss/_tabs.scss\n// Copyright (c) 2020-2022 Purism SPC / GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-tab-view {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n // --- Tab bar (the AdwTabBar strip) ---\n // Faithful port of libadwaita's `tabbar` (refs/libadwaita _tab-view.scss +\n // _colors.scss): a headerbar-colored box with an inset bottom shade; tabs\n // FILL their slot as rounded rects and use the currentColor alpha fills —\n // selected 10% (hover 13%, active 19%), plain hover 7%, active 16%.\n .adw-tab-bar {\n display: flex;\n align-items: stretch;\n flex-shrink: 0;\n box-sizing: border-box;\n padding: 0 1px 1px;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n // libadwaita's inset bottom shade under the bar.\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n overflow-x: auto;\n scrollbar-width: none;\n\n &[hidden] {\n display: none;\n }\n }\n\n .adw-tab-box {\n display: flex;\n align-items: stretch;\n flex: 1 1 auto;\n padding: 4px 0;\n }\n\n // --- A single tab ---\n .adw-tab {\n position: relative;\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n max-width: 200px;\n min-height: 30px;\n margin: 0;\n padding: 0 var(--spacing-m);\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n line-height: 1;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition: background-color 150ms ease-in-out;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The selected tab — libadwaita's currentColor alpha fill covering the\n // whole tab slot (NOT a raised chip on the view background).\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n }\n\n // Thin separators between tabs, hidden next to the selected or hovered tab\n // (libadwaita tabbox > separator + its .hidden state).\n .adw-tab + .adw-tab::before {\n content: '';\n position: absolute;\n left: 0;\n top: 3px;\n bottom: 3px;\n width: 1px;\n background-color: currentColor;\n opacity: 0.2;\n transition: opacity 150ms ease-in-out;\n pointer-events: none;\n }\n\n .adw-tab.active + .adw-tab::before,\n .adw-tab + .adw-tab.active::before,\n .adw-tab:hover + .adw-tab::before,\n .adw-tab + .adw-tab:hover::before {\n opacity: 0;\n }\n\n .adw-tab-title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n min-width: 0;\n }\n\n // --- Icon + indicator slots (AdwTab update_icons) ---\n // Both are mask-image spans carrying `adw-icon adw-icon--<name>`; the element\n // toggles `hidden` from `tabIconState`, whose rules decide which of the two\n // shows — on a pinned tab the indicator REPLACES the icon.\n // Reference: refs/libadwaita/src/adw-tab.c (update_icons, :171-198)\n .adw-tab-icon,\n .adw-tab-indicator {\n flex-shrink: 0;\n width: 16px;\n height: 16px;\n\n &[hidden] {\n display: none;\n }\n }\n\n // `AdwTabPage:loading` swaps the icon image for an `AdwSpinnerPaintable`\n // (`update_icons`, adw-tab.c:172-190) — the SAME paintable `Adw.Spinner` uses.\n // So the tab mounts a real `<adw-spinner>` in the icon's slot and this block\n // only places it. It used to restate `border: 2px`,\n // `rgba(127, 127, 127, 0.25)` and `0.8s` under a comment claiming the geometry\n // and keyframes were adw-spinner's and \"not a second copy of them\" — which is\n // how it inherited every spinner defect independently.\n .adw-tab-spinner {\n flex: none;\n\n &[hidden] {\n display: none;\n }\n }\n\n // A pinned tab is a single-glyph chip: libadwaita hides both the title and the\n // close button at construction (refs/libadwaita/src/adw-tab.c:645-650). The\n // close button is gated in JS by `tabCloseVisible`, which carries the same rule.\n .adw-tab.pinned {\n padding: 0 var(--spacing-xs);\n\n .adw-tab-title {\n display: none;\n }\n }\n\n // `AdwTabPage:needs-attention` — the accent underline libadwaita animates in\n // (refs/libadwaita/src/adw-tab.c update_needs_attention).\n .adw-tab.needs-attention::after {\n content: '';\n position: absolute;\n bottom: 2px;\n left: 50%;\n width: 12px;\n height: 2px;\n transform: translateX(-50%);\n border-radius: 1px;\n background-color: var(--accent-bg-color);\n }\n\n // --- Close affordance (CSS-drawn \"×\"; `window-close` ships, see adw-tab-view.ts) ---\n // Presence is decided in JS by `tabCloseVisible` — `(hovering && fullyVisible)\n // || selected || dragging`, and never on a pinned tab (adw-tab.c:124, :645-650)\n // — which is why the `[hidden]` rule below is load-bearing rather than cosmetic.\n .adw-tab-close {\n box-sizing: border-box;\n flex-shrink: 0;\n position: relative;\n width: 18px;\n height: 18px;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 9999px;\n background-color: transparent;\n color: inherit;\n cursor: pointer;\n opacity: 0.7;\n transition:\n background-color 150ms ease-in-out,\n opacity 150ms ease-in-out;\n\n &[hidden] {\n display: none;\n }\n\n &:hover {\n opacity: 1;\n background-color: var(--button-hover-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 9px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n }\n\n // Adw.TabBar `expand-tabs` — tabs stretch to fill the bar evenly.\n &[expand-tabs] .adw-tab {\n flex: 1 1 0;\n max-width: none;\n }\n\n // Web-specific escape hatch: static tab sets (e.g. documentation command\n // tabs) render no close affordance.\n &[no-close] .adw-tab-close {\n display: none;\n }\n\n // Single-tab bars draw no tab background (libadwaita keeps a lone tab\n // non-interactive-looking).\n .adw-tab-bar.single-tab .adw-tab {\n &,\n &:hover,\n &:active {\n background: none;\n }\n }\n\n // --- Pages (the AdwTabView content area) ---\n .adw-tab-view-pages {\n flex: 1 1 auto;\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n }\n\n .adw-tab-page {\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n overflow: auto;\n\n &[hidden] {\n display: none;\n }\n\n &.active-page {\n display: block;\n }\n }\n}\n","// _view_switcher.scss — adw-view-switcher styling: an adaptive, tab-style\n// switcher (single `viewswitcher` node) above a content area showing one page\n// at a time. Buttons are always icon + label, laid out side by side (`.wide`)\n// or stacked (`.narrow`), matching libadwaita's policy style classes.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_view-switcher.scss (AdwViewSwitcher)\n// Reference: refs/adwaita-web/adwaita-web/scss/_viewswitcher.scss\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-switcher {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n\n // The segmented button bar — the single `viewswitcher` node in libadwaita.\n // Homogeneous tabs (equal width via flex:1) with a small gutter between them.\n .adw-view-switcher-bar {\n display: flex;\n align-items: stretch;\n gap: 3px; // libadwaita's `border-spacing: 3px`\n min-height: 34px;\n }\n\n // Each tab is a flat, transparent toggle that lights up with a subtle\n // neutral fill when hovered and a slightly stronger one while selected.\n .adw-view-switcher-button {\n box-sizing: border-box;\n display: inline-flex;\n flex: 1 1 0; // homogeneous — every tab gets equal width\n // `min-width: auto` is the flex-item default, and it floors every tab at\n // its own min-content width, so a long title made ITS tab wider than the\n // others and homogeneity silently stopped holding at exactly the widths\n // where it matters. GTK's homogeneous box has no such floor\n // (adw-view-switcher.c:475) and the labels ellipsize instead\n // (adw-view-switcher-button.ui:42), which is what the 0 restores.\n min-width: 0;\n align-items: center;\n justify-content: center;\n margin: 0;\n padding: 2px 12px;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1.2;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n // A page with neither title nor icon has NO button at all\n // (adw-view-switcher.c:178), spelled here as the `hidden` attribute.\n // Re-assert it as an AUTHOR rule: the UA `[hidden] { display: none }`\n // loses to this block's own author `display: inline-flex` (cascade ORIGIN\n // beats specificity), so without this a hidden button stays on screen.\n &[hidden] {\n display: none;\n }\n\n .adw-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n .adw-view-switcher-label {\n // Same min-content floor as the button, one level down: without it the\n // `overflow: hidden` box never shrinks, so the ellipsis never appears\n // and the label pushes its tab wide instead.\n min-width: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // AdwIndicatorBin's badge — the unread count, or a bare dot when only\n // `needs-attention` is set.\n // Reference: refs/libadwaita/src/adw-indicator-bin.c\n .adw-view-switcher-indicator {\n display: inline-flex;\n box-sizing: border-box;\n align-items: center;\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 8px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 1;\n\n &[hidden] {\n display: none;\n }\n\n &.needs-attention {\n min-width: 6px;\n width: 6px;\n height: 6px;\n padding: 0;\n border-radius: 3px;\n }\n }\n\n // AdwViewSwitcherButton is a `.flat` GtkToggleButton\n // (adw-view-switcher-button.ui:5-7), so its five states are\n // `%button_basic_flat`'s currentColor alpha ladder, NOT the filled-button\n // tokens: hover 7% / pressed 16%, and checked 10% / 13% / 19%\n // (_buttons.scss:250-269 over _colors.scss:268-272). The same ladder the\n // tab bar and the sidebar rows already spell out.\n //\n // It used to spend the FILLED-button tokens here: `--button-active-color`\n // (.19 light / .22 dark) for the selected tab AND for its hover, and\n // `--button-hover-color` (.13 / .15) for an unselected hover. Two defects\n // in one rule. The selected tab sat at the shade upstream keeps for HELD\n // DOWN, so it read as permanently pressed; and pinning its hover to that\n // same value left the selected tab answering the pointer with nothing.\n // Those tokens are also a FIXED rgba, so unlike the ladder they do not\n // follow the foreground of whatever bar the switcher was dropped into.\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The selected view: a neutral fill over the whole tab. libadwaita leaves\n // the foreground alone here, so no accent recolouring of icon or label.\n &.active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n }\n\n // Wide policy — icon and label side by side.\n &.wide .adw-view-switcher-button {\n flex-direction: row;\n gap: var(--spacing-xs);\n }\n\n // Narrow policy — icon stacked above a smaller label, the compact layout\n // libadwaita drops to in a header bar at narrow window widths.\n &.narrow {\n .adw-view-switcher-bar {\n min-height: 6px;\n }\n\n .adw-view-switcher-button {\n flex-direction: column;\n gap: 1px;\n // The narrow box carries NO horizontal padding upstream: only\n // `padding-top: 4px`, and the 3px per side plus the 2px below sit on\n // the LABEL (_view-switcher.scss:15-24). Aggregated onto the button\n // here because this port has no separate box node between button and\n // label, which is the same geometry for every label at least as wide\n // as the 16px icon. Overriding only the vertical halves left the wide\n // policy's `2px 12px` standing, so a narrow tab spent 24px on side\n // padding where libadwaita spends 6px.\n padding: 4px 3px 2px;\n font-size: 0.75rem;\n\n .adw-view-switcher-label {\n min-height: 18px;\n line-height: 18px;\n }\n }\n }\n\n // The paired content area showing the active page: the Adw.ViewStack half of\n // this composite, and it draws NOTHING. libadwaita's recommended arrangement\n // is an AdwToolbarView whose top bar holds the switcher and whose `content`\n // is the bare AdwViewStack (adw-view-switcher.c:41-73); no rule in\n // `_view-switcher.scss`, `_toolbars.scss` or `_views.scss` frames that stack,\n // and the standalone `adw-view-stack` element here says the same in its own\n // words.\n //\n // It used to be a card: a 1px separator outline, a 12px radius, a 9px gap\n // under the row and 12px of padding inside. On a page that gives the switcher\n // its full width, that outline runs down the container's own left and right\n // edges with its corners curling away from them, which reads as a broken\n // frame rather than as a view. libadwaita has no line between the row and the\n // content at all: a FLAT top bar (the default, adw-toolbar-view.c:731) has no\n // background and no shade, and the only shading that ever appears is the\n // scroller's undershoot, which `_scrolling.scss` owns per scroller for the\n // reason `_toolbar_view.scss` records.\n //\n // `display: flex` is load-bearing, not decoration: this box is the stack, and\n // `adw-view-stack` is a flex COLUMN for the same reason. Without it the box\n // stays block-level, its child's `flex: 1 1 auto` below has no flex container\n // to answer and is silently inert, and the visible page keeps stopping at its\n // own text in a pane many times its height.\n .adw-view-switcher-content {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // Mirrors `.adw-view-stack-child`: the visible page is handed the whole\n // content area, which is what lets a status page centre itself in it the way\n // AdwViewStack allocates to its visible child.\n .adw-view-switcher-page {\n display: none;\n\n &.active-view {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n}\n","// _inline_view_switcher.scss — adw-inline-view-switcher styling (a compact view\n// switcher: a toggle-group-style bar of one toggle per page over a single\n// stacked content area, with the active toggle drawn as the raised Adwaita\n// active-toggle chip). The bar's per-display-mode sizing (labels / icons / both)\n// mirrors libadwaita's `inline-view-switcher > toggle-group.{labels,icons,both}`.\n// Reference: refs/libadwaita/src/adw-inline-view-switcher.c (AdwInlineViewSwitcher)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toggle-group.scss (inline-view-switcher > toggle-group)\n// Reference: refs/adwaita-web/adwaita-web/scss/_viewswitcher.scss\n// Copyright (c) 2023 Maximiliano Sandoval / 2024 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// The active toggle uses a white-on-fg \"raised\" chip — the same tokens the\n// toggle-group uses (defined there; _theme.scss overrides them for dark).\n\nadw-inline-view-switcher {\n // libadwaita's ---group-padding: a small inset so the active chip floats\n // inside the group's pill, leaving a hairline of group background around it.\n --group-padding: 3px;\n\n display: flex;\n flex-direction: column;\n align-items: center;\n\n // The switcher bar — a toggle-group pill, sized to its content.\n .adw-inline-view-switcher-group {\n display: inline-flex;\n box-sizing: border-box;\n align-items: stretch;\n gap: var(--group-padding);\n padding: var(--group-padding);\n border-radius: var(--button-radius);\n background-color: var(--button-bg-color);\n }\n\n // Each toggle is a button-shaped chip with the group's inner radius.\n .adw-inline-view-switcher-toggle {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n min-width: 34px;\n min-height: 28px;\n margin: 0;\n padding: 4px 11px;\n border: none;\n border-radius: calc(var(--button-radius) - var(--group-padding));\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n font-weight: 700;\n line-height: 1;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease,\n box-shadow 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n // The active toggle — a raised white chip, the way libadwaita draws it.\n &.active {\n background-color: var(--active-toggle-bg-color);\n color: var(--active-toggle-fg-color);\n box-shadow:\n 0 1px 3px 1px rgba(0, 0, 6, 0.07),\n 0 2px 6px 2px rgba(0, 0, 6, 0.03);\n\n &:hover {\n background-color: var(--active-toggle-bg-color);\n }\n }\n }\n\n // The switcher's symbolic icon — a currentColor mask, sized like a toolbar\n // icon (matches the .adw-icon base used across @gjsify/adwaita-web).\n .adw-inline-view-switcher-icon {\n display: inline-block;\n width: 16px;\n height: 16px;\n flex: none;\n background-color: currentColor;\n mask-size: contain;\n mask-repeat: no-repeat;\n mask-position: center;\n -webkit-mask-size: contain;\n -webkit-mask-repeat: no-repeat;\n -webkit-mask-position: center;\n }\n\n .adw-inline-view-switcher-label {\n white-space: nowrap;\n }\n\n // AdwIndicatorBin's badge — the unread count, or a bare dot when only\n // `needs-attention` is set.\n // Reference: refs/libadwaita/src/adw-indicator-bin.c\n .adw-inline-view-switcher-indicator {\n display: inline-flex;\n box-sizing: border-box;\n align-items: center;\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 8px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 1;\n\n // Author rule, not the UA one: the `display: inline-flex` above is also\n // an author rule and would otherwise keep an empty badge on screen\n // (cascade ORIGIN beats specificity — the same trap the bar hit).\n &[hidden] {\n display: none;\n }\n\n &.needs-attention {\n min-width: 6px;\n width: 6px;\n height: 6px;\n padding: 0;\n border-radius: 3px;\n }\n }\n\n // The stacked content area below the bar — exactly one page is visible.\n .adw-inline-view-switcher-pages {\n width: 100%;\n }\n\n .adw-inline-view-switcher-page {\n &:not(.active-view) {\n display: none;\n }\n }\n\n // Per-display-mode sizing, mirroring libadwaita's\n // inline-view-switcher > toggle-group.{icons,labels,both}.\n .adw-inline-view-switcher-group.icons .adw-inline-view-switcher-toggle {\n min-width: 34px;\n padding-left: 0;\n padding-right: 0;\n }\n\n .adw-inline-view-switcher-group.labels .adw-inline-view-switcher-toggle {\n min-width: calc(18px + var(--group-padding) * 2);\n }\n\n // Round — group + toggles become pill-shaped.\n &.round {\n .adw-inline-view-switcher-group {\n border-radius: 17px;\n }\n\n .adw-inline-view-switcher-toggle {\n border-radius: calc(17px - var(--group-padding));\n padding-left: calc(15px - var(--group-padding));\n padding-right: calc(15px - var(--group-padding));\n }\n }\n\n // Flat — no group background; the active toggle uses a subtle fill instead\n // of the raised white chip.\n &.flat {\n --group-padding: 0px;\n\n .adw-inline-view-switcher-group {\n padding: 0;\n background: none;\n }\n\n .adw-inline-view-switcher-toggle {\n border-radius: var(--button-radius);\n\n &.active {\n background-color: var(--button-active-color);\n color: inherit;\n box-shadow: none;\n\n &:hover {\n background-color: var(--button-active-color);\n }\n }\n }\n\n &.round .adw-inline-view-switcher-toggle {\n border-radius: 17px;\n }\n }\n}\n","// _view_stack.scss — adw-view-stack styling: a standalone named-page content\n// container that shows exactly one page at a time (the web counterpart of\n// Adw.ViewStack, decoupled from any switcher). It carries no chrome of its own —\n// a paired adw-view-switcher-bar (or a header-bar switcher) drives selection.\n// Reference: refs/libadwaita/src/adw-view-stack.c (AdwViewStack)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-stack {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n // vexpand-equivalent — fill the space a switcher shell allots to content.\n flex: 1 1 auto;\n min-height: 0;\n\n // Exactly one child is shown; the rest are laid out of flow. `hidden` is set\n // in JS too, but the class keeps the visible page a flex child that grows.\n .adw-view-stack-child {\n display: none;\n\n &.active-view {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n}\n","// _view_switcher_bar.scss — adw-view-switcher-bar styling: the narrow BOTTOM\n// bar of homogeneous icon-over-label buttons bound to an adw-view-stack (the web\n// counterpart of Adw.ViewSwitcherBar). It sits at the window bottom with a top\n// hairline over a headerbar-toned surface, mirroring libadwaita's `.narrow`\n// view-switcher inside an actionbar. The active button's label is accent-tinted.\n// Reference: refs/libadwaita/src/adw-view-switcher-bar.c (AdwViewSwitcherBar)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_view-switcher.scss (.narrow policy)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_toolbars.scss (actionbar top border)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-switcher-bar {\n display: block;\n\n // `revealed` drives visibility by toggling the `hidden` attribute\n // (_applyRevealed → this.hidden). Re-assert display:none for [hidden] as an\n // AUTHOR rule: the UA `[hidden] { display: none }` loses to this block's own\n // author `display: block` (cascade ORIGIN beats specificity), so without this\n // an unrevealed bar would stay visible. Author + higher specificity → wins.\n &[hidden] {\n display: none;\n }\n\n box-sizing: border-box;\n // The bottom bar over a headerbar-toned surface with a top hairline (the\n // libadwaita `actionbar` inset top border), NOT a bottom border.\n background-color: var(--headerbar-bg-color);\n border-top: 1px solid var(--separator-color);\n padding: 7px 0; // libadwaita `viewswitcherbar > box` vertical padding\n\n // The homogeneous button row — every button gets equal width.\n .adw-view-switcher-bar-box {\n display: flex;\n align-items: stretch;\n // The `.narrow` view-switcher drops to a 6px min-height (icon-over-label).\n min-height: 6px;\n }\n\n // Each button — icon stacked above a small label, a flat transparent toggle\n // that fills on hover/active and marks the selected page with an accent\n // label (the neutral fill stays the same across states, like libadwaita).\n .adw-view-switcher-bar-button {\n box-sizing: border-box;\n display: inline-flex;\n flex: 1 1 0; // homogeneous — equal width\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 1px;\n margin: 0;\n padding: 4px 3px 2px;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: var(--window-fg-color);\n font-family: var(--font-family);\n font-size: 0.75rem;\n font-weight: 700;\n line-height: 1.2;\n cursor: pointer;\n transition:\n color 0.2s ease,\n background-color 0.2s ease;\n user-select: none;\n -webkit-user-select: none;\n\n // Same cascade trap as the bar itself: a page with neither title nor\n // icon has no button (adw-view-switcher.c:178), and the UA\n // `[hidden] { display: none }` loses to this block's author\n // `display: inline-flex` unless it is re-asserted here.\n &[hidden] {\n display: none;\n }\n\n .adw-view-switcher-bar-icon {\n width: 16px;\n height: 16px;\n flex: none;\n }\n\n .adw-view-switcher-bar-label {\n min-height: 18px;\n line-height: 18px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // AdwIndicatorBin's badge — see refs/libadwaita/src/adw-indicator-bin.c.\n .adw-view-switcher-bar-indicator {\n display: inline-flex;\n box-sizing: border-box;\n align-items: center;\n justify-content: center;\n min-width: 16px;\n height: 16px;\n padding: 0 4px;\n border-radius: 8px;\n background-color: var(--accent-bg-color);\n color: var(--accent-fg-color);\n font-size: 0.625rem;\n font-weight: 700;\n line-height: 1;\n\n &[hidden] {\n display: none;\n }\n\n &.needs-attention {\n min-width: 6px;\n width: 6px;\n height: 6px;\n padding: 0;\n border-radius: 3px;\n }\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // The selected page — its label turns accent-coloured. (The icon stays\n // theme-fg, matching the NS twin's documented fidelity note.)\n &.active {\n color: var(--accent-color);\n\n .adw-view-switcher-bar-label {\n color: var(--accent-color);\n }\n }\n }\n}\n","// _tab_button.scss — <adw-tab-button>.\n//\n// libadwaita's whole `tabbutton` block is three rules (_buttons.scss:647-663): the count\n// is `font-weight: 800` at `font-size: 10.5px`, dropping to `8px` under `.small`, and the\n// indicator sits a pixel back from the leading edge (`translate(-1px, 1px)` in LTR,\n// mirrored in RTL) so it does not touch the plate's stroke. The button itself is a\n// `.image-button` — `min-width: 24px` and 5px of padding either side (_buttons.scss:\n// 66-70) — which is where the counter's 24px outer box comes from.\n//\n// THE PLATE IS CSS, and that is what the two libadwaita glyphs are: `adw-tab-counter.svg`\n// is a 14×14 `rx≈2.94` rect with `stroke-width: 2` and NO fill, and `adw-tab-overflow.svg`\n// is that same rect plus one decorative mark. Both ship in `refs/libadwaita/src/icons/`\n// rather than in an icon theme, so neither is a `@gjsify/adwaita-icons` export and neither\n// could be compiled into the stylesheet — a border and a border-radius is the whole of\n// the counter glyph, and the overflow mark is an ellipsis, which is the shape libadwaita\n// puts between the two digits of a count it is not going to draw.\n//\n// The indicator is `AdwIndicatorBin`'s, whose own rule is in `_view-switcher.scss:83-104`:\n// a 6px dot in `color-mix(currentColor 40%, transparent)` with a 2px margin, turning to\n// `--accent-color` under `.needs-attention`.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_buttons.scss:66-70, 647-663\n// Reference: refs/libadwaita/src/stylesheet/widgets/_view-switcher.scss:83-104\n// (`indicatorbin > indicator`, and `.needs-attention`)\n// Reference: refs/libadwaita/src/icons/adw-tab-counter.svg, adw-tab-overflow.svg\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components — the `GtkImage` under the\n// `GtkLabel` becomes the plate span, and the icon itself is drawn.\n\nadw-tab-button {\n // The `.image-button` numbers, over the `.adw-button` defaults it inherits from the\n // shared button surface (34px and 14px of padding otherwise).\n .adw-button {\n min-width: 24px;\n min-height: 24px;\n padding: 0 5px;\n }\n\n // The `AdwIndicatorBin`: the glyph with the count over it, and the dot beside both.\n .adw-tab-button-indicatorbin {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n }\n\n // The glyph: adw-tab-counter.svg's rounded rectangle, 16×16, a 2px stroke, no fill.\n .adw-tab-button-plate {\n width: 16px;\n height: 16px;\n box-sizing: border-box;\n border: 2px solid currentColor;\n border-radius: 3px;\n }\n\n .adw-tab-button-label {\n // \"We're intentionally using pixels here, as this label is a part of the icon\"\n // (_buttons.scss:650) — which is why these are px and not the em-derived sizes the\n // rest of the stylesheet uses.\n position: absolute;\n font-weight: 800;\n font-size: 10.5px;\n line-height: 16px;\n text-align: center;\n width: 16px;\n\n &.small {\n font-size: 8px;\n }\n }\n\n .adw-tab-button-indicator {\n position: absolute;\n top: 0;\n inset-inline-start: 0;\n min-width: 6px;\n min-height: 6px;\n border-radius: 100px;\n margin: 2px;\n background: color-mix(in srgb, currentColor 40%, transparent);\n\n // `&.needs-attention > indicator { background: var(--accent-color) }`\n // (_view-switcher.scss:100-102).\n &.needs-attention {\n background: var(--accent-color);\n }\n }\n\n // The overflow mark, for a count of a hundred pages or more — the label is hidden\n // there, exactly as `update_icon` hides it.\n .adw-tab-button-indicatorbin.overflow .adw-tab-button-plate::after {\n content: '\\22ef';\n font-size: 8px;\n line-height: 12px;\n display: block;\n text-align: center;\n }\n}\n","// _tab_overview.scss — <adw-tab-overview>: the grid of tab thumbnails that covers an\n// <adw-tab-view>. Closed, the element is just the view; open, a toolbar-view surface\n// sits on top with a header bar, a search strip, the two grids and the empty states.\n//\n// The rules are libadwaita's own, ported node for node:\n// · `tabthumbnail { border-radius: $card_radius + 4px; > box { margin: 6px } }`\n// · the `.needs-attention` gizmo: 12px accent dot, `border-radius: 8px`, `margin: 3px`,\n// offset `translate(8px, -8px)` from the leading top corner\n// · the `.card > picture` outline (`$window_outline_color`, offset -1px, card radius)\n// · a PINNED thumbnail paints the card with `--thumbnail-bg-color`/`-fg-color`\n// · the close/indicator buttons: no plate at rest, a 24px `--thumbnail-bg-color` disc\n// behind the 24px symbolic, tinted further toward `currentColor` on hover and active\n// · `taboverview > .overview`: the overview colours, and `.new-tab-button { margin: 18px }`\n// Reference: refs/libadwaita/src/stylesheet/widgets/_tab-view.scss:187-300\n// Reference: refs/libadwaita/src/adw-tab-overview.ui (the node tree this mirrors)\n// Copyright (c) 2021-2022 Purism SPC / GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components. `adw-tab-unpin-symbolic`\n// and `adw-tab-new-symbolic` are libadwaita-BUNDLED glyphs with no mask class, so the\n// unpin mark is drawn here and the new-tab button uses the theme's `list-add`.\n\nadw-tab-overview {\n display: block;\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n\nadw-tab-overview > .adw-tab-overview-child {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n box-sizing: border-box;\n}\n\nadw-tab-overview > .adw-tab-overview-child.background {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n}\n\nadw-tab-overview > .adw-tab-overview-toolbar[hidden] {\n display: none;\n}\n\nadw-tab-overview > .adw-tab-overview-toolbar {\n position: absolute;\n inset: 0;\n z-index: 2;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n // `taboverview > .overview`\n color: var(--overview-fg-color);\n background-color: var(--overview-bg-color);\n animation: adw-tab-overview-in 200ms cubic-bezier(0, 0, 0.2, 1);\n}\n\n@keyframes adw-tab-overview-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\nadw-tab-overview .overview-header-bar {\n flex-shrink: 0;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n}\n\nadw-tab-overview .overview-header-bar[hidden] {\n display: none;\n}\n\nadw-tab-overview .overview-title-buttons {\n display: flex;\n align-items: center;\n gap: var(--spacing-xs);\n min-height: 24px;\n}\n\nadw-tab-overview .overview-title-buttons.start {\n margin-inline-end: auto;\n}\n\nadw-tab-overview .overview-title-buttons.end {\n margin-inline-start: auto;\n}\n\nadw-tab-overview .overview-title-buttons[hidden] {\n display: none;\n}\n\nadw-tab-overview .overview-title {\n flex: 1 1 auto;\n min-width: 0;\n font-weight: bold;\n text-align: center;\n}\n\nadw-tab-overview .search-button,\nadw-tab-overview .secondary-menu-button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 24px;\n min-height: 24px;\n padding: 0;\n}\n\nadw-tab-overview .search-button[hidden],\nadw-tab-overview .secondary-menu-button[hidden] {\n display: none;\n}\n\n// The GtkSearchBar's revealer (`searchbar > revealer > box`, _toolbars.scss:113-185):\n// seven pixels of vertical padding around the entry.\nadw-tab-overview .overview-search-bar {\n flex-shrink: 0;\n padding: 7px 0;\n background-color: var(--headerbar-bg-color);\n color: var(--headerbar-fg-color);\n box-shadow: inset 0 -1px var(--headerbar-shade-color);\n}\n\nadw-tab-overview .overview-search-bar[hidden] {\n display: none;\n}\n\nadw-tab-overview .overview-search-clamp {\n box-sizing: border-box;\n width: 100%;\n max-width: 400px;\n margin-inline: auto;\n padding-inline: var(--spacing-m);\n}\n\nadw-tab-overview .overview-search-entry {\n box-sizing: border-box;\n width: 100%;\n font: inherit;\n color: inherit;\n}\n\nadw-tab-overview .adw-tab-overview-content {\n position: relative;\n display: flex;\n flex: 1 1 auto;\n min-height: 0;\n box-sizing: border-box;\n}\n\nadw-tab-overview .adw-tab-overview-scroll {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-l);\n flex: 1 1 auto;\n min-height: 0;\n padding: var(--spacing-l);\n box-sizing: border-box;\n overflow-y: auto;\n scrollbar-width: thin;\n}\n\nadw-tab-overview .adw-tab-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));\n gap: var(--spacing-l);\n align-content: start;\n}\n\nadw-tab-overview .adw-tab-grid[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-grid:focus-visible {\n outline: none;\n}\n\nadw-tab-overview .overview-empty-state,\nadw-tab-overview .overview-search-empty-state {\n position: absolute;\n inset: 0;\n background-color: var(--overview-bg-color);\n color: var(--overview-fg-color);\n}\n\nadw-tab-overview .overview-empty-state[hidden],\nadw-tab-overview .overview-search-empty-state[hidden] {\n display: none;\n}\n\nadw-tab-overview .new-tab-button {\n position: absolute;\n inset-inline: 0;\n bottom: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--spacing-xs);\n // `.new-tab-button { margin: 18px }`\n margin: 18px;\n padding: 6px 18px;\n box-sizing: border-box;\n}\n\nadw-tab-overview .new-tab-button[hidden] {\n display: none;\n}\n\nadw-tab-overview .new-tab-button-icon {\n width: 16px;\n height: 16px;\n flex: none;\n}\n\n// --- The thumbnail (adw-tab-thumbnail.ui) ---------------------------------\n\nadw-tab-overview .adw-tab-thumbnail {\n // `tabthumbnail { border-radius: $card_radius + 4px }`\n border-radius: calc(var(--card-radius, 12px) + 4px);\n}\n\nadw-tab-overview .adw-tab-thumbnail > .contents {\n // `> box { margin: 6px }` — the 6px gap a GtkBox's vertical spacing also produces.\n display: flex;\n flex-direction: column;\n gap: 6px;\n margin: 6px;\n}\n\nadw-tab-overview .adw-tab-thumbnail:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n}\n\nadw-tab-overview .adw-tab-thumbnail .thumbnail {\n position: relative;\n box-sizing: border-box;\n}\n\nadw-tab-overview .adw-tab-thumbnail .card {\n position: relative;\n display: flex;\n aspect-ratio: 16 / 10;\n box-sizing: border-box;\n overflow: hidden;\n border-radius: var(--card-radius, 12px);\n background-color: var(--thumbnail-bg-color);\n color: var(--thumbnail-fg-color);\n transition: box-shadow 200ms cubic-bezier(0, 0, 0.2, 1);\n}\n\nadw-tab-overview .adw-tab-thumbnail:not(.selected) .card {\n box-shadow: 0 1px 2px rgb(0 0 6 / 8%);\n}\n\nadw-tab-overview .adw-tab-thumbnail.selected .card {\n box-shadow: 0 0 0 2px var(--accent-color);\n}\n\n// `.card > picture { outline: 1px solid $window_outline_color; outline-offset: -1px }`\nadw-tab-overview .adw-tab-thumbnail .picture {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n padding: var(--spacing-m);\n outline: 1px solid var(--window-outline-color, rgb(0 0 6 / 50%));\n outline-offset: -1px;\n border-radius: var(--card-radius, 12px);\n}\n\n// The stand-in for `GtkPicture`'s `GdkPaintable`: GTK paints the page widget into a\n// texture (`adw_tab_page_get_paintable`), which no browser can do. The title is drawn\n// where the portrait was, in the thumbnail's own dimmed colour.\nadw-tab-overview .adw-tab-thumbnail .picture-portrait {\n font-weight: 800;\n font-size: 1.05em;\n line-height: 1.2;\n text-align: center;\n opacity: 0.55;\n overflow-wrap: anywhere;\n}\n\n// `&.pinned .card { background-color: var(--thumbnail-bg-color); color: … }`\nadw-tab-overview .adw-tab-thumbnail .card {\n background-color: transparent;\n color: inherit;\n}\n\nadw-tab-overview .adw-tab-thumbnail .needs-attention {\n position: absolute;\n inset-inline-end: 0;\n top: 0;\n // `&:dir(ltr) { transform: translate(8px, -8px) }`\n transform: translate(calc(var(--spacing-xs) * -1), calc(var(--spacing-xs) * -1));\n pointer-events: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .needs-attention[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .needs-attention > .gizmo {\n display: block;\n background-color: var(--accent-color);\n min-width: 12px;\n min-height: 12px;\n border-radius: 8px;\n margin: 3px;\n box-shadow: 0 1px 2px color-mix(in srgb, var(--accent-color) 40%, transparent);\n}\n\nadw-tab-overview .adw-tab-thumbnail .icon-title-box {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n min-width: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-icon {\n flex: none;\n width: 16px;\n height: 16px;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-icon[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-spinner {\n flex: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-label {\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n// `> image { margin: 6px; min-width/min-height: 24px; border-radius: 9999px;\n// background-color: color-mix(in srgb, var(--thumbnail-bg-color) 75%, transparent) }`\nadw-tab-overview .adw-tab-thumbnail .tab-close-button,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator {\n position: absolute;\n top: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n border-radius: 99px;\n background: none;\n box-shadow: none;\n color: inherit;\n cursor: pointer;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button {\n inset-inline-end: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-indicator {\n inset-inline-start: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button[hidden],\nadw-tab-overview .adw-tab-thumbnail .tab-indicator[hidden],\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon[hidden] {\n display: none;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-icon,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator-icon {\n width: 24px;\n height: 24px;\n margin: 6px;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--thumbnail-bg-color, currentColor) 75%, transparent);\n transition: background-color 150ms ease-in-out;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button:hover .tab-close-icon,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator:hover .tab-indicator-icon {\n background-color: color-mix(\n in srgb,\n var(--thumbnail-bg-color, currentColor) calc(0.9 * 75%),\n currentColor calc(0.1 * 75%)\n );\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-button:active .tab-close-icon,\nadw-tab-overview .adw-tab-thumbnail .tab-indicator:active .tab-indicator-icon {\n background-color: color-mix(\n in srgb,\n var(--thumbnail-bg-color, currentColor) calc(0.8 * 75%),\n currentColor calc(0.2 * 75%)\n );\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-close-icon[hidden],\nadw-tab-overview .adw-tab-thumbnail .tab-indicator-icon[hidden] {\n display: none;\n}\n\n// `adw-tab-unpin-symbolic`: a libadwaita-bundled glyph with no mask class. The pin is a\n// filled wedge with a stem, drawn here so the thumbnail says what C's says.\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon {\n position: absolute;\n top: 0;\n inset-inline-end: 0;\n box-sizing: border-box;\n width: 36px;\n height: 36px;\n margin: 0;\n padding: 0;\n border: none;\n background: none;\n color: inherit;\n cursor: pointer;\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon::before {\n content: \"\";\n display: block;\n width: 24px;\n height: 24px;\n margin: 6px;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--thumbnail-bg-color, currentColor) 75%, transparent);\n}\n\nadw-tab-overview .adw-tab-thumbnail .tab-unpin-icon::after {\n content: \"\";\n position: absolute;\n top: 14px;\n inset-inline-end: 15px;\n width: 10px;\n height: 8px;\n background-color: currentColor;\n clip-path: polygon(50% 0, 100% 100%, 0 100%);\n}\n\n// `inverted` puts the close/unpin button at the START and the indicator at the END\n// (adw-tab-overview.c:1626-1634).\nadw-tab-overview .adw-tab-thumbnail.inverted .tab-close-button,\nadw-tab-overview .adw-tab-thumbnail.inverted .tab-unpin-icon {\n inset-inline-end: auto;\n inset-inline-start: 0;\n}\n\nadw-tab-overview .adw-tab-thumbnail.inverted .tab-indicator {\n inset-inline-start: auto;\n inset-inline-end: 0;\n}\n\n@media (prefers-contrast: more) {\n adw-tab-overview .adw-tab-thumbnail .picture {\n outline-color: var(--window-outline-color-hc, rgb(0 0 6 / 75%));\n }\n\n adw-tab-overview .adw-tab-thumbnail .card {\n box-shadow: 0 0 0 1px rgb(0 0 6 / 50%);\n }\n\n adw-tab-overview .adw-tab-thumbnail .tab-close-icon,\n adw-tab-overview .adw-tab-thumbnail .tab-indicator-icon,\n adw-tab-overview .adw-tab-thumbnail .tab-unpin-icon::before {\n box-shadow: 0 0 0 1px currentColor;\n }\n}","// _view_switcher_sidebar.scss — <adw-view-switcher-sidebar>: an <adw-sidebar> driven\n// from an <adw-view-stack>'s page list. libadwaita styles exactly ONE thing of its own —\n// the row indicator, and only the number/dot shape inside it — because the sidebar look\n// comes from `_sidebars.scss` and this element drives that widget rather than\n// reimplementing it.\n//\n// Ported from `view-switcher-sidebar .indicator` (adw-view-switcher-sidebar.c:133-181):\n// · `background: color-mix(in srgb, currentColor 40%, transparent)`, `border-radius: 999px`\n// · `min-width/min-height: 1.6em`, `font-weight: bold`, `font-size: smaller`\n// · `.dot` shrinks it to 8×8 — the unread mark with no count\n// · `> label` is white with 6px of padding each side\n// · `.needs-attention` swaps in `--accent-bg-color`/`--accent-fg-color`\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss:250-277\n// Reference: refs/libadwaita/src/adw-view-switcher-sidebar.c:104-112, :133-181, :225-249\n// Copyright (c) 2025 GNOME Foundation Inc. (libadwaita). LGPLv2.1-or-later.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-view-switcher-sidebar {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n min-height: 0;\n color: inherit;\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-box {\n position: relative;\n display: flex;\n flex: 1 1 auto;\n min-height: 0;\n}\n\nadw-view-switcher-sidebar > adw-sidebar {\n flex: 1 1 auto;\n min-height: 0;\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-placeholder {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n background-color: var(--sidebar-bg-color, var(--window-bg-color));\n color: var(--sidebar-fg-color, var(--window-fg-color));\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-placeholder[hidden] {\n display: none;\n}\n\n// `&:not(.page).empty statuspage { @extend .compact }` — the empty state is compact in\n// sidebar mode and a full page in `page` mode, where it is one of several boxed pages.\nadw-view-switcher-sidebar.page > .view-switcher-sidebar-placeholder {\n position: static;\n margin: var(--spacing-m);\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-prefix,\nadw-view-switcher-sidebar > .view-switcher-sidebar-suffix {\n flex-shrink: 0;\n}\n\nadw-view-switcher-sidebar > .view-switcher-sidebar-prefix:empty,\nadw-view-switcher-sidebar > .view-switcher-sidebar-suffix:empty,\nadw-view-switcher-sidebar > .view-switcher-sidebar-placeholder:empty {\n display: none;\n}\n\n// --- The row indicator ----------------------------------------------------\n\nadw-view-switcher-sidebar .indicator {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n box-sizing: border-box;\n min-width: 1.6em;\n min-height: 1.6em;\n margin-inline-start: auto;\n border-radius: 999px;\n background: color-mix(in srgb, currentColor 40%, transparent);\n font-weight: bold;\n font-size: smaller;\n line-height: 1;\n}\n\nadw-view-switcher-sidebar .indicator[hidden] {\n display: none;\n}\n\nadw-view-switcher-sidebar .indicator.dot {\n min-width: 8px;\n min-height: 8px;\n}\n\nadw-view-switcher-sidebar .indicator > label,\nadw-view-switcher-sidebar .indicator > .numeric {\n color: white;\n padding-left: 6px;\n padding-right: 6px;\n}\n\nadw-view-switcher-sidebar .indicator.needs-attention {\n background: var(--accent-bg-color);\n}\n\nadw-view-switcher-sidebar .indicator.needs-attention > label,\nadw-view-switcher-sidebar .indicator.needs-attention > .numeric {\n color: var(--accent-fg-color);\n}","// _navigation_view.scss — adw-navigation-view styling (a page-based navigation\n// container; one page visible at a time, controlled with push/pop). The visible\n// page fills the view on the window background; an automatic back button is\n// drawn flat at the start of the visible page's header bar.\n// Reference: refs/libadwaita/src/adw-navigation-view.c (css node \"navigation-view\")\n// Reference: refs/adwaita-web/adwaita-web/docs/widgets/navigationview.md\n// Copyright (c) 2022-2023 Purism SPC / GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-navigation-view {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n position: relative;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n // The page stack — fills the view when it is given a height, and MEASURES the\n // visible page when it is not. A flex column rather than a positioning\n // context: the page is an in-flow item, so its content reaches the view.\n .adw-navigation-view-pages {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n position: relative;\n box-sizing: border-box;\n min-height: 0;\n overflow: hidden;\n }\n\n // A single navigation page — the visible one fills the view, the rest are\n // `display: none`.\n //\n // IN FLOW, not absolute. It was `position: absolute; inset: 0` under a comment\n // saying it had to be \"so a transition can overlap two pages\" — but two pages\n // never overlap here: `adw-navigation-view.ts` marks every page but the\n // visible one `[hidden]`, which is `display: none` below, and the push\n // animation runs on `.visible-page` alone. So the absolute positioning bought\n // an overlap that does not happen, and what it cost was the HEIGHT: an\n // absolutely-positioned child contributes nothing to its parent, so the page\n // stack measured 0, the view above it measured 0, and the page — `inset: 0` of\n // a zero-height parent — measured 0 in turn. A closed circle.\n //\n // Inside a window that never showed, because a definite height arrived from\n // outside. `<adw-about-dialog>` is the case where none does: its sheet is\n // `position: fixed` with a width and no height, exactly as\n // `adw-about-dialog.ui` declares it (`content-width` 360, no content-height —\n // libadwaita takes the height from the content). The whole dialog rendered\n // invisible, with a header bar inside it genuinely measuring 47px.\n //\n // `flex: 1 1 auto` keeps the fill: given a height the page still grows into\n // it; without one it reports its content.\n .adw-navigation-page {\n box-sizing: border-box;\n position: relative;\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n overflow: auto;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n &[hidden] {\n display: none;\n }\n\n &.visible-page {\n display: flex;\n }\n\n // Let a page whose direct child fills (a toolbar-view / status-page)\n // stretch to the full height.\n > * {\n flex: 1 1 auto;\n min-height: 0;\n }\n }\n\n // The injected automatic back button — flat, sits at the start of the visible\n // page's header bar (mirrors AdwHeaderBar's grown-in back button).\n .adw-navigation-back-button {\n flex-shrink: 0;\n }\n\n // Slide transition for the visible page when transitions are animated. The\n // entering page fades up from a slight horizontal offset (LTR push), matching\n // libadwaita's spring-driven slide closely enough for the web target.\n &.animated .adw-navigation-page.visible-page {\n animation: adw-navigation-page-in 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n }\n}\n\n@keyframes adw-navigation-page-in {\n from {\n opacity: 0;\n transform: translateX(12px);\n }\n\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n","// _bottom_sheet.scss — adw-bottom-sheet styling (a content area with a sheet\n// that slides up from the bottom edge over the content, with an overlaid drag\n// handle). Mirrors libadwaita's AdwBottomSheet CSS node tree: a persistent\n// content layer, a dimming layer that fades in over it while open (modal), and\n// the sheet itself anchored to the bottom edge with rounded top corners + the\n// pill-shaped drag handle.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_bottom-sheet.scss\n// (dimming / sheet box-shadow / drag-handle pill / dialog top radius)\n// Reference: refs/libadwaita/src/adw-bottom-sheet.c (open / modal / can-close)\n// Copyright (c) 2023-2024 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-bottom-sheet {\n display: block;\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n\n // --- Persistent content layer ---\n // A grid rather than a block, as GTK's content bin allocates its child the whole area and\n // lets the child's `halign` / `valign` place it (`_widget.scss`); a block container\n // resolves a vertical auto margin to zero.\n .adw-bottom-sheet-content {\n display: grid;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n }\n\n // --- Dimming layer (modal scrim over the content) ---\n // libadwaita: > dimming { background: shade-color × 2 }. Non-interactive +\n // transparent when the sheet is closed.\n .adw-bottom-sheet-dimming {\n position: absolute;\n inset: 0;\n box-sizing: border-box;\n background-color: rgba(0, 0, 6, 0.32);\n opacity: 0;\n visibility: hidden;\n pointer-events: none;\n transition:\n opacity 200ms ease,\n visibility 0s linear 200ms;\n\n &.visible {\n opacity: 1;\n visibility: visible;\n pointer-events: auto;\n transition:\n opacity 200ms ease,\n visibility 0s;\n }\n }\n\n // --- The slide-up sheet ---\n // Anchored to the bottom edge, full-width, rounded top corners (dialog\n // radius), slid off-screen when closed. The spring-driven AdwBottomSheet uses\n // a translate; the web port uses an eased transform for the same effect.\n .adw-bottom-sheet-sheet {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n box-sizing: border-box;\n max-height: 100%;\n overflow: auto;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n border-top-left-radius: var(--window-radius);\n border-top-right-radius: var(--window-radius);\n box-shadow:\n 0 0 14px 2px rgba(0, 0, 6, 0.03),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 0 1px rgba(0, 0, 0, 0.05);\n transform: translateY(100%);\n transition:\n transform 250ms ease,\n box-shadow 250ms ease;\n will-change: transform;\n }\n\n // --- Drag handle (overlaid pill at the top of the sheet) ---\n // libadwaita: > drag-handle { min-width 54px; min-height 6px; margin 15px;\n // border-radius 99px; background currentColor @ 25% }.\n // It is built with can_focus = FALSE and can_target = FALSE\n // (adw-bottom-sheet.c:1197-1198) — a decorative pill, not a button;\n // `pointer-events: none` is can_target in CSS. The `cursor: pointer` + focus\n // ring that used to sit here belonged to a close button this widget never had.\n .adw-bottom-sheet-drag-handle {\n flex-shrink: 0;\n box-sizing: border-box;\n width: 54px;\n min-height: 6px;\n height: 6px;\n margin: 15px auto;\n border-radius: 99px;\n background-color: color-mix(in srgb, currentColor 25%, transparent);\n pointer-events: none;\n }\n\n .adw-bottom-sheet-sheet-body {\n box-sizing: border-box;\n }\n\n // --- Bottom bar (the collapsed form the sheet morphs out of) ---\n // libadwaita: > sheet > stack > button — a flat, radius-less button filling the bar,\n // with the sheet's top radius carried over, and `.inert` stripping only the feedback.\n // It is a real button because upstream's bin is one (adw-bottom-sheet.c:1203).\n .adw-bottom-sheet-bottom-bar {\n display: block;\n box-sizing: border-box;\n width: 100%;\n min-width: 0;\n min-height: 0;\n padding: 0;\n border: none;\n border-radius: 0;\n font: inherit;\n font-weight: inherit;\n color: inherit;\n background: none;\n box-shadow: none;\n cursor: pointer;\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 5%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n }\n\n // can-open off. The button stays enabled and focusable — only the feedback goes,\n // because upstream refuses the click in the handler, not in the widget\n // (adw-bottom-sheet.c:2033-2036).\n &.inert {\n cursor: default;\n\n &:hover,\n &:active {\n background: none;\n }\n }\n }\n\n // --- Open state ---\n &.open .adw-bottom-sheet-sheet {\n transform: translateY(0);\n }\n\n // --- Bottom-bar state ---\n // The sheet bin sits at rest with only the bar exposed. This transform is the port's\n // `gtk_widget_set_child_visible` for the bin, so it is what `reveal-bottom-bar` takes\n // away: no class here, and the bin slides off screen with the bar still inside it.\n &.showing-bottom-bar .adw-bottom-sheet-sheet {\n transform: translateY(0);\n box-shadow:\n 0 0 0 1px rgba(0, 0, 6, 0.06),\n 0 2px 8px 2px rgba(0, 0, 6, 0.06),\n 0 3px 20px 10px rgba(0, 0, 6, 0.05);\n }\n\n // A non-modal sheet must not block the content beneath it.\n &:not(.modal) .adw-bottom-sheet-dimming {\n display: none;\n }\n}\n","// _sidebar.scss — adw-sidebar styling (a selectable navigation sidebar built\n// from titled sections of icon + title + subtitle items). In sidebar mode it\n// renders as the flat AdwSidebar navigation list (`.navigation-sidebar`); in\n// page mode it renders as boxed lists with a trailing chevron on each row (the\n// AdwPreferencesPage look the native widget switches to when collapsed).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_sidebars.scss (.navigation-sidebar, sidebar)\n// Reference: refs/libadwaita/src/adw-sidebar.c (row/header/section structure)\n// Copyright (c) 2025 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-sidebar {\n display: block;\n box-sizing: border-box;\n overflow-y: auto;\n background-color: var(--sidebar-bg-color, var(--window-bg-color));\n color: var(--sidebar-fg-color, var(--window-fg-color));\n\n .adw-sidebar-list {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n // libadwaita's menu margins around the navigation list.\n padding: var(--spacing-xs) 0;\n }\n\n .adw-sidebar-section {\n display: flex;\n flex-direction: column;\n }\n\n // --- Section headers (heading or separator) ---\n .adw-sidebar-section-header {\n &[hidden] {\n display: none;\n }\n\n // Untitled section → a horizontal separator before its rows (the way the\n // AdwSidebar header stack shows its \"separator\" child).\n &.separator {\n height: 1px;\n margin: var(--spacing-xs) var(--spacing-s);\n background-color: var(--separator-color, var(--card-shade-color));\n }\n\n &.has-title {\n padding: var(--spacing-s) calc(var(--spacing-s) + 6px) var(--spacing-xs);\n\n // The first header sits flush with the top (mirrors `.header.first`).\n &.first {\n padding-top: 0;\n }\n }\n }\n\n .adw-sidebar-section-heading {\n font-size: var(--font-size-small);\n font-weight: 700;\n opacity: var(--dim-opacity);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n // --- A single item row ---\n //\n // NO `width: 100%`. The list is a column flex container, so a row already\n // stretches to it — and stretching SUBTRACTS the row's own margins, which is\n // what puts the same 6px of air on both sides. `width: 100%` resolves against\n // the containing block INSTEAD, which does not know about the margins, so\n // every row came out 12px too wide: inset 6px on the left, hanging 6px past\n // the right edge with its rounded corners cut off by the pane. Visible on any\n // selected or hovered row, because only a filled row shows where it ends.\n .adw-sidebar-item {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--spacing-m);\n min-height: 36px;\n // The native row has a context menu, so padding lives on the inner box and\n // the row itself carries the menu margin + radius.\n margin: 0 var(--spacing-xs) 2px;\n padding: 3px 14px;\n border: none;\n border-radius: var(--button-radius, 6px);\n background-color: transparent;\n color: inherit;\n font-family: var(--font-family);\n font-size: var(--font-size-base);\n text-align: start;\n cursor: pointer;\n user-select: none;\n -webkit-user-select: none;\n transition:\n background-color 150ms ease-in-out,\n color 150ms ease-in-out;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color, var(--button-hover-color));\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: -2px;\n }\n\n // Selected row — a neutral filled highlight; libadwaita's AdwSidebar\n // selection is a subtle fill with the normal foreground, not accent.\n &.selected {\n background-color: var(--button-active-color);\n color: var(--window-fg-color);\n\n &:hover,\n &:active {\n background-color: var(--button-active-color);\n }\n }\n }\n\n .adw-sidebar-item-icon {\n flex-shrink: 0;\n\n &[hidden] {\n display: none;\n }\n }\n\n .adw-sidebar-item-text {\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n .adw-sidebar-item-title {\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n &[hidden] {\n display: none;\n }\n }\n\n .adw-sidebar-item-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n &[hidden] {\n display: none;\n }\n }\n\n // The trailing chevron is only drawn in page (boxed-list) mode.\n .adw-sidebar-item-arrow {\n flex-shrink: 0;\n opacity: var(--dim-opacity);\n display: none;\n }\n\n // --- Page mode (boxed lists) ---\n // Sections become bordered, rounded cards (the AdwPreferencesGroup look) and\n // each row gains its trailing chevron; selection no longer fills the row with\n // the accent color, matching how the native widget drops the list selection\n // in page mode.\n &.page {\n .adw-sidebar-list {\n padding: var(--spacing-m);\n gap: var(--spacing-xs);\n }\n\n .adw-sidebar-section {\n border: 1px solid var(--card-shade-color);\n border-radius: var(--card-radius, 12px);\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n overflow: hidden;\n }\n\n .adw-sidebar-section-header.has-title {\n padding: var(--spacing-m) var(--spacing-xs) var(--spacing-xs);\n\n &.first {\n padding-top: var(--spacing-m);\n }\n }\n\n .adw-sidebar-item {\n margin: 0;\n padding: var(--spacing-s) var(--spacing-m);\n border-radius: 0;\n border-bottom: 1px solid var(--card-shade-color);\n\n &:last-child {\n border-bottom: none;\n }\n\n &.selected {\n background-color: transparent;\n color: var(--card-fg-color);\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n }\n }\n\n .adw-sidebar-item-arrow {\n display: inline-block;\n }\n }\n}\n\n// `.navigation-sidebar` — the documented class a consumer puts on its OWN list\n// to get the sidebar look without `<adw-sidebar>`: transparent background,\n// rounded and padded items, and a NEUTRAL selection instead of an accent one\n// (style-classes.md \"Sidebars\", `_sidebars.scss:113-205`).\n//\n// `<adw-sidebar>` renders the same look from its own structure classes above; it\n// is not rewritten in terms of this class, because its rows carry an icon,\n// title, subtitle and arrow that a bare list does not have. What IS shared is\n// the metric: `$menu_margin` (6px) around the list and on each row, and\n// `$button_radius` corners.\n.navigation-sidebar {\n &,\n &.view,\n &.view:disabled {\n background-color: transparent;\n color: inherit;\n }\n\n &.background {\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n }\n\n padding-top: var(--spacing-xs);\n // 6px minus the last row's own 2px margin, upstream's `$menu_margin - 2px`.\n padding-bottom: 4px;\n\n > * {\n margin: 0 var(--spacing-xs) 2px;\n padding: 3px 14px;\n border-radius: var(--button-radius);\n }\n\n > .activatable {\n &:hover {\n background-color: color-mix(in srgb, currentColor 7%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n }\n }\n\n > [aria-selected='true'],\n > .selected {\n background-color: color-mix(in srgb, currentColor 10%, transparent);\n\n &:hover {\n background-color: color-mix(in srgb, currentColor 13%, transparent);\n }\n\n &:active {\n background-color: color-mix(in srgb, currentColor 19%, transparent);\n }\n }\n}\n","// _gtk_about_dialog.scss — <gtk-about-dialog> styling: the GTK about window's own\n// layout, which is NOT libadwaita's `<adw-about-dialog>` (a navigation view of\n// preference rows) but a bold name over a 128px logo and a four-page stack, with a\n// stack switcher where the headerbar's title widget goes.\n//\n// The DIALOG itself (scrim, sheet, header, close button) is not restated here: it is\n// `<adw-dialog>`'s chrome, which this element inherits, so the rules below only cover\n// the parts `gtkaboutdialog.ui` declares and nothing styles upstream either.\n//\n// Reference: refs/gtk/gtk/ui/gtkaboutdialog.ui (the tree: 12px inner spacing, 5px\n// outer margins, 8px page spacing, the 400x100 stack, the framed scrolled pages)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:46-56\n// (`window.aboutdialog:not(.ssd-frame)`: a FLAT titlebar, and `image.large-icons`\n// at 128px — which is `icon-size: 2`, GTK's DIALOG size)\n// Reference: refs/gtk/gtk/gtkaboutdialog.c:1066-1082 (the bold name label, the\n// centre justification, the version label's own markup)\n// Copyright (c) 2008-2024 Red Hat, Inc. / The GTK authors. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-about-dialog {\n // The `.ui` spacing, verbatim: the outer box is 5px all round with 2px between the\n // two children (the head), and the head is 5px all round with 12px between the logo,\n // the name and the stack.\n .adw-gtk-about-dialog-box {\n display: flex;\n flex-direction: column;\n gap: 2px;\n padding: 5px;\n min-width: 320px;\n min-height: 220px;\n }\n\n .adw-gtk-about-dialog-head {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n padding: 5px;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // `image.large-icons` → 128px. The slot exists so the logo can be absent entirely\n // without the name moving up a line: `GtkImage` is a template child and is always\n // there in GTK, so the space above the name is always reserved.\n .adw-gtk-about-dialog-logo-slot {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 128px;\n }\n\n .adw-gtk-about-dialog-logo {\n width: 128px;\n height: 128px;\n // `icon-dropshadow` on the `.ui`'s logo image.\n filter: drop-shadow(0 1px 2px rgba(0, 0, 6, 0.25));\n }\n\n // `<span weight=\"bold\">` from `update_name_version`, centred like every label in the\n // box (`justify: 2`).\n .adw-gtk-about-dialog-name {\n font-weight: bold;\n font-size: 1.1em;\n text-align: center;\n user-select: text;\n }\n\n // `GtkStack` with `width-request: 400`, `height-request: 100`, and the crossfade\n // transition (16) at 600ms.\n .adw-gtk-about-dialog-stack {\n position: relative;\n display: flex;\n width: 100%;\n min-width: 300px;\n min-height: 100px;\n flex: 1 1 auto;\n }\n\n .adw-gtk-about-dialog-page {\n display: flex;\n flex-direction: column;\n gap: 8px;\n flex: 1 1 auto;\n justify-content: center;\n text-align: center;\n padding: 6px 12px;\n // The crossfade between pages: 600ms is the `.ui`'s `transition-duration`.\n animation: adw-gtk-about-dialog-page-in 600ms ease;\n }\n\n .adw-gtk-about-dialog-version,\n .adw-gtk-about-dialog-comments,\n .adw-gtk-about-dialog-copyright {\n // `wrap: 1` with `max-width-chars: 60` on the comments and copyright labels.\n max-width: 60ch;\n margin: 0 auto;\n }\n\n .adw-gtk-about-dialog-website,\n .adw-gtk-about-dialog-license,\n .adw-gtk-about-dialog-license-link {\n max-width: 60ch;\n margin: 0 auto;\n }\n\n // `GtkStackSwitcher` in the titlebar: a row of flat buttons, the visible page's\n // checked. No title text beside them, because the `.ui` declares none.\n .adw-gtk-about-dialog-switcher {\n display: flex;\n align-items: center;\n gap: 2px;\n }\n\n .adw-gtk-about-dialog-switcher-item {\n padding: 6px 12px;\n border-radius: 999px;\n font-weight: 500;\n color: var(--window-fg-color);\n background-color: transparent;\n border: none;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:checked,\n &.checked {\n background-color: var(--button-active-color);\n }\n }\n\n // The three framed pages: a scrolled window with `has-frame` around a `.view`\n // viewport, and the credits grid inside it.\n .adw-gtk-about-dialog-scrolled {\n flex: 1 1 auto;\n min-height: 0;\n overflow: auto;\n border: 1px solid var(--border-color);\n border-radius: 9px;\n background-color: var(--view-bg-color);\n }\n\n .adw-gtk-about-dialog-text {\n margin: 5px;\n // `GTK_WRAP_NONE` unless `wrap-license` asked for `GTK_WRAP_WORD`.\n white-space: pre;\n font-size: 0.9em;\n }\n\n .adw-gtk-about-dialog-text-view.wrap .adw-gtk-about-dialog-text {\n white-space: pre-wrap;\n }\n\n // `add_credits_section`: a two-column grid, headings right-aligned in column 0 and\n // people left-aligned in column 1, with 2px between rows and 8px between columns.\n .adw-gtk-about-dialog-credits-grid {\n display: grid;\n grid-template-columns: max-content 1fr;\n gap: 2px 8px;\n padding: 5px;\n align-items: center;\n }\n\n .adw-gtk-about-dialog-credits-heading {\n text-align: right;\n font-size: 0.9em;\n font-weight: 500;\n }\n\n .adw-gtk-about-dialog-credits-person {\n text-align: left;\n font-size: 0.9em;\n user-select: text;\n }\n}\n\n@keyframes adw-gtk-about-dialog-page-in {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}","// _emoji_chooser.scss — <gtk-emoji-chooser> styling, mirroring libadwaita's\n// `_emoji-chooser.scss` node for node.\n//\n// The upstream partial is short because GTK does the work: `popover.emoji-picker > contents`\n// gets no padding, the two boxes get theirs, and the section buttons are circular flat\n// image buttons. What it does NOT style is the list itself — GTK's `.view` scrolled\n// window and `GtkFlowBox` do that — so the flow box, the headings and the empty page are\n// spelled out here from the `.ui` instead (6px margins and spacing, a heading label per\n// section, and the `edit-find` glyph at 72px over \"No Results Found\").\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_emoji-chooser.scss:1-57\n// (`popover.emoji-picker > contents`, `.emoji-searchbar`, `.emoji-toolbar`,\n// `button.emoji-section.image-button` as a 32px circular flat button,\n// `popover.emoji-picker emoji` at `font-size: x-large` with 6px padding and\n// `$button_radius` corners, hover/active fills and a high-contrast outline,\n// `scrolledwindow.view` with undershoot shading)\n// Reference: refs/gtk/gtk/ui/gtkemojichooser.ui (6px margins and spacing, the headings,\n// the empty page's 72px glyph, `max-content-height: 320`)\n// Copyright (c) 2021-2024 The GTK authors. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\ngtk-emoji-chooser {\n // `popover.emoji-picker > contents { padding: 0 }` — the surface carries no padding\n // of its own; the searchbar and the toolbar bring theirs.\n padding: 0;\n\n .emoji-picker-root {\n display: flex;\n flex-direction: column;\n min-width: 260px;\n }\n\n .emoji-searchbar {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px;\n }\n\n .emoji-search-icon {\n flex: 0 0 auto;\n }\n\n .emoji-search-entry {\n flex: 1 1 auto;\n min-width: 0;\n padding: 6px 8px;\n font: inherit;\n color: inherit;\n background-color: var(--entry-bg-color);\n border: 1px solid var(--entry-border-color);\n border-radius: 9px;\n\n &:focus {\n outline: none;\n border-color: var(--accent-color);\n }\n }\n\n .emoji-stack {\n display: flex;\n flex-direction: column;\n min-height: 0;\n }\n\n // `scrolledwindow.view` (`max-content-height: 320`) with the undershoot shading the\n // upstream rule draws at the two ends the scroll position is not at.\n .emoji-list {\n display: flex;\n flex-direction: column;\n gap: 6px;\n max-height: 320px;\n overflow-y: auto;\n padding: 6px;\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n }\n\n .emoji-heading {\n font-weight: 500;\n text-align: start;\n padding: 2px 0;\n }\n\n // `GtkFlowBox` with `homogeneous: 1`: every emoji the same width, wrapping by row.\n .emoji-flowbox {\n display: flex;\n flex-wrap: wrap;\n gap: 2px;\n }\n\n // `popover.emoji-picker emoji` — `font-size: x-large`, 6px padding, the button radius.\n .emoji {\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: 32px;\n min-height: 32px;\n padding: 6px;\n font-size: 1.5em;\n line-height: 1;\n border-radius: var(--button-radius);\n border: none;\n background-color: transparent;\n color: inherit;\n\n &:focus,\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n @media (prefers-contrast: more) {\n &:focus,\n &:hover,\n &:active {\n box-shadow: inset 0 0 0 1px var(--border-color);\n }\n }\n }\n\n .emoji-recent-box {\n margin-bottom: 2px;\n }\n\n // The `empty` stack page: `dim-label` throughout, the glyph at 72px.\n .emoji-empty {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n padding: 18px 12px;\n color: var(--dim-label-color, var(--window-fg-color));\n opacity: 0.6;\n }\n\n .emoji-empty-icon {\n width: 72px;\n height: 72px;\n }\n\n .emoji-empty-title {\n font-weight: bold;\n font-size: 1.4em;\n }\n\n .emoji-empty-hint {\n font-size: 0.95em;\n }\n\n // `emoji-toolbar`: 3px of padding, because the flow box children already carry 3px.\n .emoji-toolbar {\n display: flex;\n align-items: center;\n padding: 3px;\n border-top: 1px solid var(--separator-color);\n }\n\n // `button.emoji-section.image-button` — circular, flat, 32x32, unchecked by default and\n // checked for the section the list is scrolled into.\n .emoji-section {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n padding: 0;\n border: none;\n border-radius: 999px;\n background-color: transparent;\n color: inherit;\n\n &:hover:not(:disabled) {\n background-color: var(--button-hover-color);\n }\n\n &:checked,\n &.checked {\n background-color: var(--button-active-color);\n }\n\n &:disabled {\n opacity: 0.4;\n }\n }\n\n .emoji-section-icon {\n width: 16px;\n height: 16px;\n }\n\n // `show_variations` (:508-548): a `view`-backed box beside the emoji holding the six\n // variants, so the second click on an emoji with skin tones lands somewhere.\n .emoji-variations {\n position: absolute;\n z-index: 1;\n padding: 6px;\n border-radius: var(--button-radius);\n background-color: var(--popover-bg-color);\n color: var(--popover-fg-color);\n box-shadow:\n 0 1px 4px rgba(0, 0, 6, 0.2),\n 0 2px 8px rgba(0, 0, 6, 0.12);\n }\n\n .emoji-variations-row {\n display: flex;\n gap: 2px;\n }\n}","// _print_dialogs.scss — the two Unix print dialogs: <gtk-page-setup-unix-dialog> and\n// <gtk-print-unix-dialog>.\n//\n// Neither has a stylesheet of its own upstream: libadwaita restyles exactly three things\n// under `window.print` and one under `window.pagesetup`, and everything else is GTK\n// defaults — the `.dialog-action-area` spacing, the notebook, the grid, the frame. What is\n// below is therefore the `.ui` layout in CSS (the grid the page-setup dialog is, the\n// notebook the print dialog is) plus the four libadwaita rules that DO apply.\n//\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:6-13\n// (`.dialog-action-area { margin: 6px; border-spacing: 6px }`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:15-34\n// (`window.print:not(.ssd-frame)`: `drawing` colour and no background or padding,\n// `paper` WHITE with `background-clip: padding-box` and a 1px `$border_color` border,\n// a FLAT titlebar and a `.view` `.dialog-action-box`)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss:38-42\n// (`window.pagesetup:not(.ssd-frame)`: a FLAT titlebar)\n// Reference: refs/gtk/gtk/print/ui/gtkpagesetupunixdialog.ui (6px row / 12px column\n// spacing, 5px margins)\n// Reference: refs/gtk/gtk/print/ui/gtkprintunixdialog.ui (18px page margins and spacing,\n// 12px inside a group, the bold group headings, the framed printer list)\n// Copyright (c) 2006-2024 Red Hat, Inc. / The GTK authors. LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n// ---------------------------------------------------------------------------\n// GtkPageSetupUnixDialog — one grid, four rows.\n// ---------------------------------------------------------------------------\n\ngtk-page-setup-unix-dialog {\n .adw-page-setup-grid {\n display: grid;\n // The `.ui`'s own spacing: 6px between rows, 12px between columns, 5px of margin.\n grid-template-columns: max-content 1fr 1fr;\n gap: 6px 12px;\n padding: 5px;\n align-items: center;\n }\n\n .adw-page-setup-label {\n // `halign: 1`, `valign: 3` — right-aligned against its control, centred on it.\n text-align: end;\n align-self: center;\n }\n\n // `printer_combo` and `paper_size_combo` are `column-span 3` on a 4-column grid, so\n // they fill the three remaining tracks.\n .adw-page-setup-printer,\n .adw-page-setup-paper {\n grid-column: 2 / span 3;\n }\n\n // `paper_size_label` is the row that REPORTS the choice, and it sits under the combo.\n .adw-page-setup-size-label {\n grid-column: 2 / span 3;\n padding: 2px 0;\n font-weight: 500;\n }\n\n .adw-page-setup-orientation {\n grid-column: auto;\n }\n\n // The `.dialog-action-area`: margin 6px, border-spacing 6px, and the Apply button is\n // the dialog's default response.\n .adw-page-setup-actions {\n display: flex;\n gap: 6px;\n margin: 6px;\n padding: 0;\n }\n\n .adw-page-setup-apply {\n margin-left: auto;\n }\n}\n\n// ---------------------------------------------------------------------------\n// GtkPrintUnixDialog — a notebook over a frame, with the action area below.\n// ---------------------------------------------------------------------------\n\ngtk-print-unix-dialog {\n .adw-print-root {\n display: flex;\n flex-direction: column;\n min-width: 480px;\n }\n\n // The notebook's tab row, drawn as a switcher: a flat button per page.\n .adw-print-switcher {\n display: flex;\n gap: 2px;\n padding: 4px 4px 0;\n }\n\n .adw-print-switcher-item {\n padding: 6px 12px;\n border: none;\n border-radius: 999px;\n background-color: transparent;\n color: inherit;\n font-weight: 500;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:checked,\n &.checked {\n background-color: var(--button-active-color);\n }\n }\n\n .adw-print-panel {\n flex: 1 1 auto;\n min-height: 0;\n padding: 12px;\n overflow: auto;\n // `window.print`'s `.dialog-action-box` is a `.view`, and so is the page the notebook\n // shows around its controls.\n background-color: var(--view-bg-color);\n color: var(--view-fg-color);\n }\n\n // General and Page Setup put two groups side by side; the rest are one column.\n .adw-print-columns {\n display: flex;\n gap: 18px;\n align-items: flex-start;\n }\n\n .adw-print-column {\n display: flex;\n flex-direction: column;\n gap: 18px;\n flex: 1 1 auto;\n min-width: 0;\n }\n\n // One `frame_templateN`: a bold heading over a grid.\n .adw-print-group {\n display: flex;\n flex-direction: column;\n gap: 6px;\n }\n\n .adw-print-group-title {\n font-weight: bold;\n }\n\n .adw-print-group-body {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding-left: 12px;\n }\n\n .adw-print-grid-row {\n display: flex;\n gap: 12px;\n align-items: center;\n }\n\n .adw-print-label {\n text-align: end;\n }\n\n // The printer list: a framed, scrolled column of rows, each an icon and two lines.\n .adw-print-printer-list {\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 220px;\n max-height: 220px;\n overflow: auto;\n }\n\n .adw-print-printer-row {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 6px;\n border: none;\n border-radius: var(--button-radius);\n background-color: transparent;\n color: inherit;\n text-align: start;\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &.checked {\n background-color: var(--button-active-color);\n }\n }\n\n .adw-print-printer-text {\n display: flex;\n flex-direction: column;\n min-width: 0;\n }\n\n .adw-print-printer-name {\n font-weight: bold;\n }\n\n .adw-print-printer-location {\n font-size: 0.9em;\n opacity: 0.7;\n }\n\n // `scrolledwindow` with `has-frame` around the printer list.\n .adw-print-frame {\n border: 1px solid var(--border-color);\n border-radius: 9px;\n background-color: var(--view-bg-color);\n padding: 6px;\n }\n\n // The collate / reverse page-order preview: four 32x40 thumbnails in two columns.\n .adw-print-collate-preview {\n display: grid;\n grid-template-columns: repeat(2, 32px);\n gap: 4px;\n\n &[data-second-column='false'] > :nth-child(n + 3) {\n display: none;\n }\n }\n\n // `page_layout_preview`: the `drawing` node — no background, no padding, the\n // foreground colour only — with the `paper` inside it.\n .adw-print-sheet-preview {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 6px;\n padding: 0;\n background: none;\n border: none;\n color: var(--window-fg-color);\n }\n\n .adw-print-paper {\n // `paper { background-color: white; color: RGB(0 0 6 / 80%);\n // background-clip: padding-box; border: 1px solid $border_color }` — white paper in\n // a dark dialog is the point of the preview.\n width: 110px;\n max-width: 100%;\n display: flex;\n background-color: white;\n color: rgba(0, 0, 6, 0.8);\n background-clip: padding-box;\n border: 1px solid var(--border-color);\n }\n\n .adw-print-number-up {\n display: grid;\n grid-template-columns: repeat(var(--adw-print-number-up-columns, 1), 1fr);\n grid-template-rows: repeat(var(--adw-print-number-up-rows, 1), 1fr);\n width: 100%;\n height: 100%;\n\n > span {\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 10px;\n }\n }\n\n .adw-print-sheet-caption {\n font-size: 0.85em;\n opacity: 0.8;\n }\n\n // The four option pages: the empty grids the backend's option widgets go into.\n .adw-print-options-grid {\n display: grid;\n grid-template-columns: max-content 1fr;\n gap: 6px 12px;\n padding: 12px;\n\n &[data-empty='true'] {\n // Nothing to show, and saying so beats an empty frame: the reader has to be able to\n // tell \"this page has no options\" from \"this page failed to render\".\n min-height: 64px;\n opacity: 0.6;\n font-style: italic;\n }\n }\n\n // `conflicts_widget` — an action bar, hidden until `mark_conflicts` raises it.\n .adw-print-conflicts {\n display: flex;\n align-items: center;\n gap: 6px;\n margin: 0 12px;\n padding: 6px 12px;\n border-radius: 9px;\n background-color: var(--warning-bg-color);\n color: var(--warning-color);\n }\n\n // `.dialog-action-area`: Preview / Cancel / Print, with Print as the default.\n .adw-print-actions {\n display: flex;\n gap: 6px;\n margin: 6px;\n padding: 0;\n }\n\n .adw-print-print {\n margin-left: auto;\n }\n\n // The pseudo-disabled rows the C reaches with `gtk_widget_set_sensitive (…, FALSE)`:\n // a GTK-insensitive widget is still focusable-ish and still legible, so it dims rather\n // than disappearing.\n .insensitive {\n opacity: 0.45;\n }\n\n input:disabled,\n gtk-drop-down[disabled] {\n opacity: 0.45;\n }\n}","// _about_dialog.scss — adw-about-dialog styling (a modal AdwDialog floating\n// sheet hosting the About navigation view: a full-cover scrim + a centred,\n// rounded, scrollable sheet box). Mirrors libadwaita's AdwDialog floating-sheet\n// node tree (dimming + rounded sheet with the outline + layered shadow) and the\n// AdwAboutDialog main page layout (large icon, title-1 name, dimmed developer\n// line, the version pill, then the navigation rows).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss\n// (floating-sheet > dimming / > sheet radius + box-shadow + outline)\n// Reference: refs/libadwaita/src/adw-about-dialog.ui (page tree, content-width 360)\n// Reference: refs/adwaita-web/adwaita-web/scss/_about_dialog.scss (web layout)\n// Copyright (c) 2022-2024 GNOME Foundation Inc. / Purism SPC (libadwaita). LGPLv2.1+.\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-about-dialog {\n // The host is inert until presented; `.open` reveals the scrim + sheet.\n display: none;\n\n &.open {\n display: block;\n }\n\n // --- Full-cover modal scrim ---\n // libadwaita: floating-sheet > dimming { background shade-color × 2 }.\n .adw-about-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1000;\n background-color: rgba(0, 0, 6, 0.32);\n animation: adw-about-dialog-scrim-in 200ms ease;\n }\n\n // --- Centred floating sheet ---\n // libadwaita: floating-sheet > sheet { dialog radius; layered shadow; 1px\n // outline -1px offset }. content-width 360 → a comfortable ~360px sheet.\n .adw-about-dialog-sheet {\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1001;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n width: 360px;\n max-width: calc(100vw - 48px);\n max-height: calc(100vh - 48px);\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 14px 2px rgba(0, 0, 6, 0.03),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 0 1px rgba(0, 0, 0, 0.05);\n animation: adw-about-dialog-sheet-in 200ms cubic-bezier(0, 0, 0.2, 1);\n\n &:focus {\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n }\n }\n\n // The navigation view fills the sheet; each page is a column.\n adw-navigation-view,\n .adw-navigation-view-pages,\n .adw-navigation-page {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // --- Toolbar view (flat header bar over the window background + scroller) ---\n .adw-about-dialog-toolbar-view {\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n min-height: 0;\n }\n\n // The dialog header bar is flat: transparent over the window background, no\n // bottom separator (libadwaita: window.about headerbar.titlebar { flat }).\n adw-header-bar {\n background-color: transparent;\n box-shadow: none;\n min-height: 47px;\n }\n\n // The close button — a flat circular button drawing a \"×\" glyph: the generated\n // `.adw-icon--<name>` mask classes come from the ICONS map in scripts/build-scss.mjs,\n // which has no window-close entry (the SVG itself does exist in @gjsify/adwaita-icons).\n .adw-about-dialog-close {\n width: 34px;\n height: 34px;\n padding: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 18px;\n line-height: 1;\n\n &::before {\n content: '\\00d7'; // ×\n }\n }\n\n // --- Scrolling content area ---\n .adw-about-dialog-scroll {\n flex: 1 1 auto;\n min-height: 0;\n overflow-y: auto;\n overflow-x: hidden;\n }\n\n .adw-about-dialog-clamp {\n width: 100%;\n max-width: 360px;\n margin-inline: auto;\n box-sizing: border-box;\n }\n\n .adw-about-dialog-page-body {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: 0 var(--spacing-m) var(--spacing-l);\n }\n\n // --- Main page header title: hidden until the content scrolls ---\n // Mirrors AdwAboutDialog's update_headerbar_cb (show title once scrolled > 0).\n .main-page {\n adw-header-bar .adw-header-bar-title {\n opacity: 0;\n transition: opacity 150ms ease;\n }\n\n &.scrolled adw-header-bar .adw-header-bar-title {\n opacity: 1;\n }\n }\n\n // --- App icon (the large recessed glyph) ---\n .adw-about-dialog-icon {\n align-self: center;\n width: 96px;\n height: 96px;\n margin-top: var(--spacing-s);\n margin-bottom: var(--spacing-m);\n // Mask-driven .adw-icon skin scaled up to the about-dialog app-icon size.\n -webkit-mask-size: contain;\n mask-size: contain;\n background-color: currentColor;\n }\n\n // --- App name (title-1) ---\n .adw-about-dialog-name {\n align-self: center;\n text-align: center;\n font-size: 18pt;\n font-weight: 800;\n line-height: 1.2;\n margin-bottom: var(--spacing-xs);\n }\n\n // --- Developer / vendor line ---\n .adw-about-dialog-developer {\n align-self: center;\n text-align: center;\n font-size: var(--font-size-base);\n opacity: var(--dim-opacity);\n margin-bottom: var(--spacing-m);\n }\n\n // --- Version pill ---\n // libadwaita: .app-version { small accent chip }.\n .adw-about-dialog-version {\n align-self: center;\n padding: 2px 12px;\n margin-bottom: var(--spacing-l);\n border-radius: 99px;\n font-size: var(--font-size-small);\n line-height: 1.4;\n background-color: color-mix(in srgb, var(--accent-bg-color) 14%, transparent);\n color: var(--accent-color);\n }\n\n // --- Row groups (Details / Credits / Legal navigation, link rows) ---\n .adw-about-dialog-rows {\n width: 100%;\n margin-top: var(--spacing-m);\n\n & + .adw-about-dialog-rows {\n margin-top: var(--spacing-l);\n }\n }\n\n // The trailing chevron / link affordance on a navigation or link row.\n .adw-about-dialog-chevron {\n width: 16px;\n height: 16px;\n opacity: var(--dim-opacity);\n }\n\n // --- Subpage content (Details / Credits / Legal) ---\n .adw-about-dialog-comments {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-base);\n line-height: 1.5;\n text-align: start;\n white-space: pre-wrap;\n }\n\n .adw-about-dialog-copyright {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n text-align: center;\n }\n\n .adw-about-dialog-license {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n text-align: center;\n\n a {\n color: var(--accent-color);\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n }\n }\n}\n\n@keyframes adw-about-dialog-scrim-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes adw-about-dialog-sheet-in {\n from {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.95);\n }\n to {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n","// _alert_dialog.scss — adw-alert-dialog: a modal scrim + centred dialog box with\n// a bold heading, body text and a row/column of response buttons.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss (floating-sheet,\n// AdwDialog sheet shadow + radius)\n// Reference: refs/adwaita-web/adwaita-web/scss/_dialog.scss (alert layout)\n// Reference: refs/libadwaita/src/adw-alert-dialog.c (response button layout)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// Host: lay the scrim + box out as a full-cover overlay only while open.\nadw-alert-dialog {\n display: none;\n\n &.open {\n display: block;\n }\n}\n\n// The scrim — a fixed full-cover dimming layer behind the dialog box.\n.adw-alert-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1050;\n background-color: rgba(0, 0, 6, 0.32);\n // Centre the dialog box (the box is the scrim's flex child).\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-l);\n // Mirror the AdwDialog present transition (a quick fade + scale).\n animation: adw-alert-dialog-fade-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n}\n\n// The dialog box — the AdwDialog \"sheet\": rounded window-colored surface with a\n// soft shadow + hairline outline, centred above the scrim.\n.adw-alert-dialog-box {\n position: fixed;\n top: 50%;\n left: 50%;\n z-index: 1051;\n transform: translate(-50%, -50%);\n\n display: flex;\n flex-direction: column;\n\n box-sizing: border-box;\n width: 100%;\n max-width: 300px;\n max-height: calc(100vh - 2 * var(--spacing-xl));\n overflow: hidden;\n\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 14px 2px rgba(0, 0, 6, 0.03),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 0 1px rgba(0, 0, 0, 0.05);\n\n font-family: var(--font-family);\n\n animation: adw-alert-dialog-pop-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n}\n\n// Wider layout when responses are laid out horizontally (prefer-wide-layout).\n.adw-alert-dialog-box:has(.adw-alert-dialog-responses.horizontal) {\n max-width: 360px;\n}\n\n// The scrollable message area: heading + body + optional extra child.\n.adw-alert-dialog-message {\n display: flex;\n flex-direction: column;\n padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-l);\n overflow-y: auto;\n}\n\n.adw-alert-dialog-heading {\n margin: 0;\n // Matches the GTK .title-2 typography style (bold heading).\n font-size: 15pt;\n font-weight: 800;\n line-height: 1.3;\n text-align: center;\n}\n\n.adw-alert-dialog-body {\n margin: var(--spacing-s) 0 0;\n font-size: var(--font-size-base);\n line-height: 1.4;\n text-align: center;\n}\n\n// Extra child slot, displayed below the body.\n.adw-alert-dialog-child {\n margin-top: var(--spacing-m);\n\n &:empty {\n display: none;\n }\n}\n\n// Response button area. Vertical (stacked) by default; horizontal when the\n// dialog opts into the wide layout.\n.adw-alert-dialog-responses {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-s);\n padding: var(--spacing-m) var(--spacing-l) var(--spacing-l);\n\n &.horizontal {\n flex-direction: row;\n justify-content: stretch;\n\n .adw-alert-dialog-response {\n flex: 1 1 0;\n }\n }\n}\n\n// The response buttons — full-width pills within the stacked layout. They reuse\n// the .adw-button skin (incl. .suggested-action / .destructive-action), so only\n// the full width needs adding here. The default response is NOT accent-tinted —\n// libadwaita only colours suggested/destructive responses; the default one is\n// just the Enter-activated button and keeps the neutral button style.\n.adw-alert-dialog-response.adw-button {\n width: 100%;\n justify-content: center;\n}\n\n@keyframes adw-alert-dialog-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes adw-alert-dialog-pop-in {\n from {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.95);\n }\n to {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n","// _preferences_dialog.scss — adw-preferences-dialog styling (scrim + dialog box).\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss (floating-sheet\n// scrim/dimming + sheet radius + box-shadow + outline)\n// Reference: refs/libadwaita/src/adw-preferences-dialog.ui (flat header + title)\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\nadw-preferences-dialog {\n // Hidden until presented (the `open` class is toggled by the component). The\n // element itself contributes nothing to layout while closed.\n display: none;\n\n &.open {\n display: block;\n }\n\n // Full-cover scrim — a fixed dimming layer behind the dialog box. Adwaita\n // dims with `--shade-color` at double alpha (see _dialogs.scss `floating-sheet\n // > dimming`); --shade-color isn't in the adwaita-web token subset, so use the\n // equivalent neutral wash.\n .adw-preferences-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1000;\n background-color: rgba(0, 0, 6, 0.32);\n }\n\n // The centred floating dialog box. Mirrors `floating-sheet > sheet`: the\n // dialog radius (= --window-radius in Adwaita), the layered drop shadow and a\n // 1px window outline.\n .adw-preferences-dialog-box {\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n z-index: 1001;\n display: flex;\n flex-direction: column;\n width: min(var(--adw-dialog-content-width, 640px), calc(100vw - 48px));\n max-height: calc(100vh - 48px);\n overflow: hidden;\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 0 1px rgba(0, 0, 0, 0.05),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 14px 2px rgba(0, 0, 6, 0.03);\n }\n\n // Flat header bar — transparent over the window background (Adw's preferences\n // dialog header uses a flat AdwHeaderBar), title centred against the trailing\n // close button.\n .adw-preferences-dialog-header {\n display: flex;\n align-items: center;\n min-height: 47px;\n padding: 0 6px;\n flex-shrink: 0;\n }\n\n // Equal-width sides keep the title optically centred (strict centering).\n .adw-preferences-dialog-header-side {\n display: flex;\n align-items: center;\n flex: 1 1 0;\n min-width: 0;\n }\n\n .adw-preferences-dialog-header-side--end {\n justify-content: flex-end;\n }\n\n .adw-preferences-dialog-title {\n flex: 0 0 auto;\n font-weight: bold;\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 0 6px;\n }\n\n // Round flat close button drawing a CSS \"×\" glyph — same approach as\n // <adw-tab-view>, and for the sizing reason recorded there. `windowCloseSymbolic`\n // does ship, and is compiled.\n .adw-preferences-dialog-close {\n appearance: none;\n border: none;\n margin: 0;\n width: 28px;\n height: 28px;\n padding: 0;\n border-radius: 50%;\n background-color: transparent;\n color: var(--window-fg-color);\n cursor: pointer;\n position: relative;\n transition: background-color 0.1s ease;\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 12px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &.locked {\n opacity: var(--dim-opacity);\n cursor: default;\n }\n }\n\n // Scrolled body holding the stacked pages. Adwaita preferences pages sit on\n // the window background (the boxed-list groups carry their own card surface).\n .adw-preferences-dialog-body {\n flex: 1 1 auto;\n min-height: 0;\n overflow-y: auto;\n }\n\n // Clamped column of preferences groups — Adw.PreferencesPage clamps content to\n // a comfortable reading width and stacks groups with generous spacing.\n .adw-preferences-dialog-pages {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-xl);\n max-width: 600px;\n margin: 0 auto;\n padding: var(--spacing-xl) var(--spacing-m);\n\n // The dialog keeps the <adw-preferences-page> ELEMENTS rather than hoisting\n // their children out — the page's title / name / icon-name are what a\n // search-result subtitle and a view switcher read. The page therefore has\n // to be layout-transparent so its groups stay flex items of this column;\n // a custom element's default `display: inline` would collapse it.\n > adw-preferences-page {\n display: contents;\n\n // `display: contents` above beats the UA `[hidden] { display: none }`, so\n // a page hidden through the DOM `hidden` property would keep rendering\n // its groups while the search (which reads the same flag) had already\n // dropped it from the corpus.\n &[hidden] {\n display: none;\n }\n }\n }\n}\n","// _dialog.scss — adw-dialog: a generic adaptive dialog. A full-cover scrim with\n// a floating window-coloured \"sheet\" centred on wide viewports, re-anchored as a\n// bottom sheet (full-width, rounded top corners) on narrow ones. Mirrors the\n// AdwDialog floating-sheet + bottom-sheet presentations.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_dialogs.scss (floating sheet)\n// Reference: refs/libadwaita/src/stylesheet/widgets/_bottom-sheet.scss (bottom radius)\n// Copyright (c) 2023-2024 GNOME Foundation Inc. (libadwaita). LGPLv2.1+.\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// Bottom-sheet layout — shared by the explicit mode and the auto/narrow query.\n@mixin adw-dialog-bottom-sheet {\n .adw-dialog-scrim {\n align-items: flex-end;\n justify-content: stretch;\n padding: 0;\n }\n\n .adw-dialog-box {\n width: 100%;\n max-width: none;\n // Rounded only along the top edge — it hugs the bottom viewport edge.\n border-top-left-radius: var(--window-radius);\n border-top-right-radius: var(--window-radius);\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n animation: adw-dialog-slide-up 0.25s cubic-bezier(0, 0, 0.2, 1);\n }\n}\n\n// Host: contributes nothing to layout while closed; the `open` class reveals it.\nadw-dialog {\n display: none;\n\n &.open {\n display: block;\n }\n\n // The full-cover scrim — a flex container centring the box; a dimming wash\n // behind it. Clicking the scrim (outside the box) attempts to dismiss.\n .adw-dialog-scrim {\n position: fixed;\n inset: 0;\n z-index: 1050;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--spacing-l);\n background-color: var(--dialog-scrim-color, rgba(0, 0, 6, 0.32));\n animation: adw-dialog-fade-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n }\n\n // The dialog box (\"sheet\"): a rounded window-coloured surface with a soft\n // layered shadow + hairline outline. Sized by the content-width/height props.\n .adw-dialog-box {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n width: min(var(--adw-dialog-content-width, 360px), calc(100vw - 2 * var(--spacing-l)));\n max-height: min(var(--adw-dialog-content-height, 100vh), calc(100vh - 2 * var(--spacing-l)));\n overflow: hidden;\n\n background-color: var(--window-bg-color);\n color: var(--window-fg-color);\n border-radius: var(--window-radius);\n outline: 1px solid var(--separator-color);\n outline-offset: -1px;\n box-shadow:\n 0 0 0 1px rgba(0, 0, 0, 0.05),\n 0 0 5px 2px rgba(0, 0, 6, 0.1),\n 0 0 14px 2px rgba(0, 0, 6, 0.03);\n\n font-family: var(--font-family);\n animation: adw-dialog-pop-in 0.2s cubic-bezier(0, 0, 0.2, 1);\n\n &:focus {\n outline: 1px solid var(--separator-color);\n }\n }\n\n // Flat header bar — transparent over the window background, title strictly\n // centred against the trailing close button (the AdwHeaderBar idiom).\n .adw-dialog-header {\n display: flex;\n align-items: center;\n min-height: 47px;\n padding: 0 6px;\n flex-shrink: 0;\n }\n\n .adw-dialog-header-side {\n display: flex;\n align-items: center;\n flex: 1 1 0;\n min-width: 0;\n }\n\n .adw-dialog-header-side--end {\n justify-content: flex-end;\n }\n\n .adw-dialog-title {\n flex: 0 0 auto;\n font-weight: bold;\n font-size: var(--font-size-base);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n padding: 0 6px;\n }\n\n // Round flat close button drawing a CSS \"×\" glyph: `windowCloseSymbolic` exists in\n // @gjsify/adwaita-icons, but the generated `.adw-icon--<name>` mask classes come from\n // the ICONS map in scripts/build-scss.mjs, which has no window-close entry.\n .adw-dialog-close {\n appearance: none;\n border: none;\n margin: 0;\n width: 28px;\n height: 28px;\n padding: 0;\n border-radius: 50%;\n background-color: transparent;\n color: var(--window-fg-color);\n cursor: pointer;\n position: relative;\n flex: none;\n transition: background-color 0.1s ease;\n\n &::before,\n &::after {\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: 12px;\n height: 1.5px;\n background-color: currentColor;\n border-radius: 1px;\n }\n\n &::before {\n transform: translate(-50%, -50%) rotate(45deg);\n }\n\n &::after {\n transform: translate(-50%, -50%) rotate(-45deg);\n }\n\n &:hover {\n background-color: var(--button-hover-color);\n }\n\n &:active {\n background-color: var(--button-active-color);\n }\n\n &:focus-visible {\n outline: 2px solid var(--accent-color);\n outline-offset: 1px;\n }\n\n &.locked {\n opacity: var(--dim-opacity);\n cursor: default;\n }\n }\n\n // Content area — the author's markup; scrolls when it exceeds the box height.\n .adw-dialog-content {\n flex: 1 1 auto;\n min-height: 0;\n overflow-y: auto;\n padding: var(--spacing-m) var(--spacing-l) var(--spacing-l);\n }\n\n // A header-less dialog pads the content on all sides.\n .adw-dialog-header[hidden] + .adw-dialog-content {\n padding-top: var(--spacing-l);\n }\n\n // --- Explicit bottom-sheet presentation ---\n &[data-presentation='bottom-sheet'] {\n @include adw-dialog-bottom-sheet;\n }\n}\n\n// --- Adaptive (auto) presentation: bottom sheet on narrow viewports ---\n@media (max-width: 550px) {\n adw-dialog[data-presentation='auto'] {\n @include adw-dialog-bottom-sheet;\n }\n}\n\n@keyframes adw-dialog-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes adw-dialog-pop-in {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes adw-dialog-slide-up {\n from {\n transform: translateY(100%);\n }\n to {\n transform: translateY(0);\n }\n}\n","// _shortcuts_dialog.scss — the shortcuts dialog: sections of shortcut rows, and the\n// rows themselves.\n// Reference: refs/libadwaita/src/stylesheet/widgets/_shortcuts-dialog.scss (16-27 the\n// `.shortcut-row` padding and the `.title-box` subtitle; 1-14 the spacing between the\n// groups inside the dialog's page)\n// Copyright (c) 2025 GNOME Foundation Inc. (libadwaita). LGPLv2.1+\n// Modifications: Implemented for @gjsify/adwaita-web Web Components.\n\n// The class list libadwaita gives the dialog itself is `dialog.shortcuts`, and the\n// stylesheet reaches through it into a preferences page. Here the sections are the\n// dialog's children in the base's own content area, so the element is the same hook\n// in one selector — and the CONTENT AREA is the box the stylesheet spaces out\n// (`border-spacing: 18px` there, which is a `GtkBox` doing what a gap does).\nadw-shortcuts-dialog .adw-dialog-content {\n display: flex;\n flex-direction: column;\n gap: 18px;\n}\n\nadw-shortcuts-dialog adw-shortcuts-section {\n flex: 0 0 auto;\n}\n\nadw-shortcuts-section {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n\n.adw-shortcuts-section-title {\n font-weight: 700;\n\n &[hidden] {\n display: none;\n }\n}\n\n.adw-shortcuts-section-body {\n display: flex;\n flex-direction: column;\n // The boxed-list surface the sections read as — a card with a hairline, exactly the\n // one `adw-preferences-group` draws and the one `_shortcuts-dialog.scss` inherits.\n border: 1px solid var(--card-shade-color);\n border-radius: var(--card-radius);\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n overflow: hidden;\n}\n\nadw-shortcuts-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--spacing-m);\n // `.shortcut-row { padding: 9px 12px; min-height: 36px }` (_shortcuts-dialog.scss:16-19)\n padding: 9px 12px;\n min-height: 36px;\n\n &[hidden] {\n display: none;\n }\n\n &:not(:first-child) {\n border-top: 1px solid var(--card-shade-color);\n }\n\n + adw-shortcuts-item {\n border-top: 1px solid var(--card-shade-color);\n }\n}\n\n// `.title-box { border-spacing: 3px }` with the subtitle under the title: the source\n// is a vertical box, so the title and the subtitle stack and the subtitle is dimmed\n// and caption-sized (`@extend .caption; @extend .dimmed`).\n.adw-shortcuts-item-title,\n.adw-shortcuts-item-subtitle {\n flex: 0 1 auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.adw-shortcuts-item-subtitle {\n font-size: var(--font-size-small);\n opacity: var(--dim-opacity);\n margin-top: 3px;\n\n &[hidden] {\n display: none;\n }\n}\n\n.adw-shortcuts-item-label {\n flex: 0 0 auto;\n\n &[hidden] {\n display: none;\n }\n}\n","// _widget.scss — the GtkWidget layout properties an element carries as attributes.\n//\n// Every GTK widget inherits `halign`, `valign`, `hexpand` and `vexpand` from GtkWidget, and a\n// projected `.blp` hands them to `buildSharedTree` as attributes (`halign=\"center\"`). Until\n// this partial nothing read them, so the gallery's bottom sheet stretched the button its\n// Blueprint centres. The margins are not here: an attribute cannot carry a length into CSS\n// portably, so `shared-tree-builder.ts` writes them as inline style — and so are\n// `width-request` / `height-request`, as the `min-width` / `min-height` they are.\n//\n// ALIGNMENT IS AN AUTO MARGIN, because that is the one CSS placement that means the same on\n// both axes of a flex container and of a grid: GTK allocates a non-FILL child its natural\n// size and places it inside the space its parent gave it, and an auto margin shrinks a flex\n// or grid item to its content and puts the leftover on the named side. It does NOT place a\n// child of a BLOCK container on the vertical axis, where CSS resolves an auto block margin to\n// zero — so a GTK bin that lays its child out by alignment is a grid or a flex box here\n// (`.adw-bottom-sheet-content`, `gtk-box`). And it takes the side it pushes from: a centred\n// child cannot also keep a `margin-start`, where GTK would centre it inside the remaining\n// space.\n//\n// EXPAND IS FLEX-GROW ALONG THE BOX'S OWN AXIS, which is why it lives with the box rules\n// below and not on the attribute alone: `vexpand` in a horizontal box asks for the cross\n// axis, which `align-items: stretch` already fills, and a `flex-grow` there would widen the\n// child instead.\n//\n// Reference: refs/gtk/gtk/gtkwidget.c (halign, valign, hexpand, vexpand)\n// Reference: refs/gtk/gtk/gtkboxlayout.c (spare space shared among expanding children)\n// Copyright (c) The GTK Team. LGPLv2.1+.\n\n[halign='start'] {\n margin-inline-end: auto;\n}\n\n[halign='end'] {\n margin-inline-start: auto;\n}\n\n[halign='center'] {\n margin-inline: auto;\n}\n\n[valign='start'] {\n margin-block-end: auto;\n}\n\n[valign='end'] {\n margin-block-start: auto;\n}\n\n[valign='center'] {\n margin-block: auto;\n}\n\ngtk-box:not([orientation='vertical']) > [hexpand]:not([hexpand='false']),\ngtk-box[orientation='vertical'] > [vexpand]:not([vexpand='false']) {\n flex-grow: 1;\n}\n\n// An AUTHORED `hexpand: false` is the one case where absence is not enough: a widget that\n// grows by default (`<gtk-scrolled-window>` is `flex: 1 1 0%`, the allocation of a window in a\n// column) must stop, and GTK then gives it its NATURAL size rather than nothing — hence the\n// `auto` basis, not just a zero grow. `width-request` (an inline `min-width`) is the floor.\ngtk-box:not([orientation='vertical']) > [hexpand='false'],\ngtk-box[orientation='vertical'] > [vexpand='false'] {\n flex-grow: 0;\n flex-basis: auto;\n}\n","// adwaita-skin.scss — Main entry point for @gjsify/adwaita-web.\n// Mirrors refs/adwaita-web/adwaita-web/scss/adwaita-skin.scss organization.\n// Reference: refs/adwaita-web/adwaita-web/scss/adwaita-skin.scss\n// Reference: refs/libadwaita/src/stylesheet/widgets/\n// Copyright (c) 2025 csm (adwaita-web). MIT License.\n// Copyright (c) GNOME contributors (libadwaita). LGPLv2.1+.\n// Modifications: Adapted for @gjsify/adwaita-web Web Components.\n\n@use 'icons.generated';\n@use 'variables';\n@use 'theme';\n@use 'root';\n// Style-isolation boundary — emitted before the components so their own rules\n// override this typographic/box-model floor (see _reset.scss).\n@use 'reset';\n// The ONE symbolic-icon box, behind <gtk-image>. Emitted before every widget that\n// draws one, so a context that sizes its own icons (the about dialog's 96px, the\n// split button's 14px arrows, the view switcher's 16px) still wins on ordinary\n// specificity.\n@use 'icon';\n// libadwaita's typography + semantic-colour UTILITY CLASSES (`.dimmed`,\n// `.numeric`, `.monospace`, `.title-1`…), and <gtk-label>, the element they are\n// written for — see _labels.scss. Emitted BEFORE every widget so a widget's\n// own rule wins on ordinary specificity, and because two partials @extend from\n// it (`_progress_bar.scss`'s text node, `_data_grid.scss`'s cells) exactly as\n// libadwaita's own `_progress-bar.scss` does.\n@use 'labels';\n// <gtk-box>. Before every widget, which may place its own children in one.\n@use 'box';\n// The five Gtk layout containers after it, and they are here for ONE reason each: nothing\n// downstream of `box` needs to place children in one, and the frame's 1px border is the\n// only rule libadwaita writes for any of the five (`_misc.scss:4-15`) — so they belong with\n// the primitive they build on rather than in the widget run below.\n@use 'frame';\n@use 'aspect_frame';\n@use 'center_box';\n@use 'grid';\n@use 'fixed';\n// The REST of libadwaita's documented style-class surface — the widget-\n// independent half: the surfaces (`.background`, `.view`, `.frame`), `.card` and\n// the two boxed lists, `.toolbar`, `.spacer`, `.osd`, `.linked`, the app-icon\n// shadows and the undershoot indicators. Emitted here for the same two reasons\n// as `_labels.scss`: a widget's own rule then wins on ordinary specificity, and\n// `_card.scss` / `_preferences.scss` @extend `%card` from it.\n// `scripts/check-adwaita-style-classes.mjs` holds the ledger of the whole\n// documented surface and fails on a class with no rule behind it.\n@use 'style_classes';\n@use 'window';\n@use 'application_window';\n// <adw-header-bar>, <gtk-header-bar> AND <gtk-window-controls>, in ONE partial because\n// upstream's `_header-bar.scss` styles `headerbar`, `windowcontrols` and `windowtitle`\n// together — and because a bar's frame buttons ARE its window controls.\n@use 'headerbar';\n@use 'action_bar';\n@use 'window_title';\n@use 'button';\n// The four button-derived nodes below, in the order of `src/elements/`: each one\n// renders a `.adw-button` of its own, so each rule comes AFTER `button` rather than\n// before it — `button.link`'s transparent background is the whole point of a link and\n// `.adw-button`'s resting fill must not win it on source order.\n@use 'link';\n@use 'scale_button';\n@use 'color_button';\n@use 'font_button';\n@use 'button_content';\n// The ONE popover surface. Emitted BEFORE the widgets that host one, so a\n// consumer's (or a widget's) own higher-specificity rule still wins over it.\n@use 'popover';\n// <gtk-popover-menu>, <gtk-popover-menu-bar> and <gtk-popover-bin>. All three AFTER\n// `popover`, because every surface they own is `<gtk-popover>`'s and none of them restates\n// it — they add the menubar's item rules and the bin's `.has-open-popup`, and libadwaita\n// puts both in the same file as `popover.menu` for the same reason.\n@use 'popover_menu_bar';\n@use 'popover_bin';\n@use 'split_button';\n@use 'menu_button';\n@use 'drop_down';\n@use 'toggle_group';\n// The ONE toggle, behind <gtk-switch>. Emitted before `switch_row` and\n// `expander_row`, the two widgets that host one — and which each carried their\n// own copy of it until it was lifted out of `adw-switch-row {}`.\n@use 'switch';\n@use 'entry';\n@use 'search_entry';\n@use 'password_entry';\n@use 'separator';\n// `<gtk-text>`, `<gtk-text-view>` and `<gtk-editable-label>` — the widgets whose content is\n// text, and the two libadwaita blocks that paint a `text` node.\n@use 'text';\n// `<gtk-search-bar>`, which reads the header-bar tokens rather than the header bar's rules.\n@use 'search_bar';\n// <gtk-drawing-area>, the one widget of the gtk/drawing page that carries a rule of its\n// own. No dependency on anything above it — it styles one canvas — so the order here is\n// placement, not precedence.\n@use 'drawing';\n// The `dnd` node, which libadwaita styles once for the whole widget\n// (`_common.scss:30-32`) and which is otherwise geometry: a drag icon has no parent to lay\n// out in, because it is a GtkRoot with its own surface. No dependency on anything above it.\n@use 'drag_icon';\n// The layout CONTAINERS GTK owns and libadwaita only styles. `_paned` draws the divider as\n// an inset box-shadow on the `separator` node a `GtkPanedHandle` carries, which is a\n// different rule from `<gtk-separator>`'s own fill — so it needs its own partial rather\n// than a class the separator's rule would fight over.\n@use 'overlay';\n@use 'revealer';\n@use 'paned';\n@use 'expander';\n// The two form-control primitives, in ONE partial because upstream merges them\n// (there is no `_radio.scss` in libadwaita) — see _checks.scss.\n@use 'checks';\n@use 'spin_button';\n@use 'scale';\n@use 'progress_bar';\n// <gtk-level-bar>, next to the progress bar it is easy to confuse with. It has no\n// dependency on anything above it, so the order here is readability, not precedence.\n@use 'level_bar';\n// The three views, in dependency order: `list_view` declares the selectable-row mixin\n// and the rubber band that the other two include.\n@use 'list_view';\n@use 'grid_view';\n@use 'column_view';\n@use 'tree_expander';\n// The media group, in dependency order and nothing else: `picture` fits a replaced\n// element, `inscription` is text measured in characters and lines, `video` lays an\n// overlay out and hosts a `media_controls` inside its revealer, so `media_controls`\n// comes after `video` only in the sense that `video` NAMES it — neither partial reads\n// the other, and the order here is readability, not precedence.\n@use 'picture';\n@use 'inscription';\n@use 'video';\n@use 'media_controls';\n// The two child-holding containers. `list_box` comes first only because it reads like\n// `list_view`; nothing here is a `@use` of the other, and `flow_box` includes the selectable\n// mixin from `list_view` above for the cell's four state colours.\n@use 'list_box';\n@use 'flow_box';\n@use 'calendar';\n@use 'preferences';\n@use 'preferences_row';\n@use 'card';\n@use 'data_grid';\n@use 'bin';\n@use 'clamp';\n// <gtk-stack> AND <gtk-stack-switcher> AND <gtk-stack-sidebar>, in ONE partial: upstream\n// styles the switcher's buttons out of `_buttons.scss` and the sidebar's rows out of\n// `_sidebars.scss`, so a stack and the two things that switch over it share styles.\n@use 'stack';\n@use 'clamp_scrollable';\n// <adw-spinner> AND <gtk-spinner>, in ONE partial because upstream's\n// `_spinner.scss` styles `spinner` and `image.spinner` in the same file.\n@use 'spinner';\n// <adw-shortcut-label>'s keycaps. After `labels`, because a separator inside it\n// is an ordinary `.dimmed`.\n@use 'shortcut_label';\n@use 'avatar';\n@use 'banner';\n@use 'status_page';\n@use 'row';\n@use 'action_row';\n@use 'entry_row';\n@use 'switch_row';\n@use 'combo_row';\n@use 'spin_row';\n@use 'button_row';\n@use 'expander_row';\n@use 'password_entry_row';\n@use 'toast';\n@use 'toolbar_view';\n// The scrolling trio, beside `_scrolling.scss`'s edge indicators: the scrollbar first,\n// because the scrolled window's grid places it, and the viewport before the window, because\n// the window's grid has a cell for it.\n@use 'scrollbar';\n@use 'viewport';\n@use 'scrolled_window';\n@use 'window_handle';\n@use 'scrolling';\n@use 'wrap_box';\n@use 'panes';\n@use 'overlay_split_view';\n@use 'navigation_split_view';\n@use 'carousel';\n// <adw-tab-bar> BEFORE <adw-tab-view>, and only because upstream writes both in ONE file:\n// `tabbar`, `tabbox` and `tab` (_tab-view.scss:1-95). The chip rules here and the merged\n// bar's are the same declarations against the same class names, so whichever partial is\n// emitted second would win on source order for a document that nests one bar in the other.\n@use 'tab_bar';\n@use 'tab_view';\n@use 'view_switcher';\n@use 'inline_view_switcher';\n@use 'view_stack';\n@use 'view_switcher_bar';\n@use 'tab_button';\n@use 'tab_overview';\n@use 'view_switcher_sidebar';\n@use 'navigation_view';\n@use 'bottom_sheet';\n@use 'sidebar';\n// GTK's own dialogs: the about window's layout, the emoji chooser's nodes, and the two\n// Unix print dialogs. After `popover` and `entry`, which the emoji chooser hosts.\n@use 'gtk_about_dialog';\n@use 'emoji_chooser';\n@use 'print_dialogs';\n@use 'about_dialog';\n@use 'alert_dialog';\n@use 'preferences_dialog';\n@use 'dialog';\n// After 'dialog': the shortcuts dialog IS an <adw-dialog> and adds sections and rows\n// inside its content area, so its own rules have to come after the chrome they sit in.\n@use 'shortcuts_dialog';\n// Last among the widgets: an authored `halign` / `valign` is placement the author asked\n// for, and an element rule that sets a margin must not win it back on source order.\n@use 'widget';\n\n// Ensure the `hidden` attribute always wins: components that toggle visibility\n// via `element.hidden = true` set the HTML attribute, but a custom `display`\n// from a layout class (e.g. `.adw-switch { display: inline-flex }`) has equal\n// specificity and would otherwise override the UA `[hidden] { display: none }`,\n// leaving the element laid out (and stealing width from its siblings).\n[hidden] {\n display: none !important;\n}\n"]}