diff --git a/README.md b/README.md
index cf986673..3a295d7c 100644
--- a/README.md
+++ b/README.md
@@ -28,6 +28,18 @@ npm test -- test/profile-view.accessibility.test.ts
 Accessibility markup baseline checklist:
 [docs/accessibility-baseline-checklist.md](docs/accessibility-baseline-checklist.md)
 
+Manual accessibility smoke test:
+[docs/accessibility-smoke-test.md](docs/accessibility-smoke-test.md)
+
+Accessibility workflow:
+
+- Run the focused accessibility test after markup or interaction changes.
+- Manually verify keyboard-only use: tab order, reachable controls, visible focus, dialog open/close, and return of focus after dialogs close.
+- Manually verify screen-reader output with VoiceOver on macOS for headings, landmarks, button names, dialog announcements, and inline error/status messages.
+- Check zoom and reflow at 200% and 400% to confirm content remains readable and usable without horizontal scrolling for core flows.
+- If a change affects dynamic UI feedback, confirm success, saving, and error states are announced appropriately.
+- Browser-level accessibility audits such as Lighthouse or Playwright/Cypress + axe are not yet wired into repo scripts, so treat the manual checks above as required review work for accessibility-sensitive changes.
+
 Refactor test plan (temporary skips and revisit checklist):
 [docs/refactor-test-plan.md](docs/refactor-test-plan.md)
 
@@ -61,3 +73,41 @@ npm run build
 
 The build is done by `tsc`, webpack is only used as dev server and not for production build.
 
+## Generative AI usage
+The SolidOS team is using GitHub Copilot integrated in Visual Studio Code. 
+We have added comments in the code to make it explicit which parts are 100% written by AI. 
+
+### Prompt usage hitory:
+* Model GPT-5.3-Codex:  write me a reusable function to open a dialog with a form and return the form values on submit. The function should also support validation and display error messages in the dialog. It should reuse the OpenModal function for consistency. 
+
+* Model GPT-5.3-Codex: the description needs to only show 2 lines and then more button please generate code for this. 
+
+* Model GPT-5.3-Codex: write me a function to convert a date to Month, Year 
+
+* Model GPT-5.3-Codex: The QRCode has a label "link to profile" but it should be a VCARD with name, and link to profile. So when you scan it it goes into your contacts. That's the current way works, IIRC.
+
+* GPT-5.3-Codex Model: 1. are you able to create a little trash can icon at the end of each entry so for each phone, email and address line. 2. are you able to add all the country flags and prefix next to the phone numbers? 3. can you write functions to sanitize the input values for emails, phones, and addresses? 
+
+* GPT-5.3-Codex Model:  can you have applyAddressFieldChange update the row status based on whether any fields have content 
+
+* GPT-5.3-Codex Model: do you see anything I can do differently in the mutation code so that it's not so verbose and possible reusable accross sections
+
+* GPT-5.3-Codex Model: can you implement on SocialEditDialog add the bentoIcon as the first item 
+on the row, you should be able to drag this button around and it should allow you to change the order of the rows and that should change the order in the mutations that happen for this data. 
+
+* GPT-5.3-Codex Model: Write a function handleCameraClick that uses the cameraCaptureControl to
+capture an image and update the profile photo in the heading section.
+
+* GPT-5.3-Codex Model: In header selectors select phone and email work type if it exists otherwise pick any. 
+
+* GPT-5.3-Codex Model: can you make this a month drop down for the start year 
+
+* GPT-5.3-Codex Model: write me a function to determine PastRole, CurrentRole, or FutureRole based on resume role date data. The function should return a NamedNode with the correct solid namespace and role type local name. The function should use the roleType field if it is set to one of those three values, otherwise it should infer the role type based on the start and end dates and isCurrentRole field. 
+
+* GPT-5.4 Model: can you add types to rdfMutationHelpers.ts and consolidate mutation logic where appropriate. 
+
+* GPT-5.4 Model: can you refactor texts so it's cleaner and easier to update 
+
+* GPT-5.4 Model: add keyboard interaction coverage for the shared dialog so we verify initial focus placement and focus restoration when the dialog is cancelled
+
+* GPT-5.4 Model: Use inputMode to toggle interactive cursors
\ No newline at end of file
diff --git a/TASKS.md b/TASKS.md
new file mode 100644
index 00000000..f7c36e86
--- /dev/null
+++ b/TASKS.md
@@ -0,0 +1,22 @@
+# Profile Pane Task List
+
+## Working Notes
+- Mobile changes must be implemented in `layout='mobile'`, container queries, and only the necessary media-query fallbacks. `layout='mobile'` and container behavior are the source of truth.
+- Prefer `rem` units and mashlib variables from `light.css` where possible.
+- For color styling, use general variables for grays and whites where available. `lavender` and primary color variables are fine as-is.
+- Remove utility classes other than `sr-only` and `hidden`. Move styles into specific semantic classes; create specific classes when needed.
+- Where possible, make like things share the same class and styling so the same UI is styled once instead of through one-off selectors.
+
+## Current Tasks
+- [x] In resume, when tabbing to the company name, highlight the chevron icon v differently. it's like a blue border can you do the purple that happens on the other v for select maybe check all combox maybe they are all not correct only select is... it should be like organization drop down tab for v
+- [ ] fix drag and drop in solid-ui.  look at socialPane in solid-panes at the bullseye icon for adding friends you can see there what function is called in solid-ui that needs fixing.  The other place we need to look is the folder-pane plus icon at the bottom of the page you should be able to drag a file onto that and it will upload the file not open a new tab. Double check this but i think it uses the same solid-ui function as the socialPane bullseye in solid-panes. both of these need to work + on folder pane needs to upload a file and the bullseye needs to add a friend.
+- [x] What do you think about teh edit dialog css file is it too big, should we split this up into different css files per section that it is styling. Investigate let me know your thoughts and we will proceed from there.
+- [ ] I need to test how the ordered list are working in social section and the languages with the new changes in rdflib please let me know i need to do this when you get to it.
+- [ ] on skills the combobox drop down goes over the dialog footer so that all the values can be seen, can you do htat for all the comboboxes the other seem to go underneath the footer. you'll need to look through all the edit dialog and find the ones that have combobox.  i can think of resume, social, languages, please double check the others just to be sure. maybe do them one by one and i can check each time adn 
+we can then commit them separately.
+
+## Notes
+- Add new items here as they come up.
+- Work through tasks one by one.
+- After each task, stop and let the user review it before running `npm run prepush` or making a commit.
+- Once the user approves a task, run `npm run prepush`, fix any resulting errors, then commit only the files for that task.
diff --git a/dev/context.ts b/dev/context.ts
index 51233ed3..6bb9f1d7 100644
--- a/dev/context.ts
+++ b/dev/context.ts
@@ -1,6 +1,14 @@
 import { longChatPane } from 'chat-pane'
 //import * as contact from 'contacts-pane' //uncomment for profileEditor
-import { DataBrowserContext, PaneRegistry } from 'pane-registry'
+import {
+  DataBrowserContext,
+  InputMode,
+  LayoutMode,
+  LayoutPreference,
+  PaneRegistry,
+  RenderEnvironment,
+  ThemeMode,
+} from 'pane-registry'
 import { solidLogicSingleton, store } from 'solid-logic'
 import { LiveStore } from 'rdflib'
 
@@ -11,6 +19,79 @@ if (store.fetcher) {
   (store.fetcher as any).withCredentials = false;
 }
 
+const MOBILE_BREAKPOINT = 768
+
+function getViewport() {
+  return {
+    width: window.innerWidth,
+    height: window.innerHeight,
+  }
+}
+
+function getInputMode(): InputMode {
+  return window.matchMedia('(pointer: coarse)').matches ? 'touch' : 'pointer'
+}
+
+function resolveLayout(
+  layoutPreference: LayoutPreference,
+  viewport = getViewport()
+): LayoutMode {
+  if (layoutPreference === 'auto') {
+    return viewport.width <= MOBILE_BREAKPOINT ? 'mobile' : 'desktop'
+  }
+
+  return layoutPreference
+}
+
+function getInitialTheme(): ThemeMode {
+  return window.matchMedia('(prefers-color-scheme: dark)').matches
+    ? 'dark'
+    : 'light'
+}
+
+export const environment: RenderEnvironment = {
+  layoutPreference: 'auto',
+  viewport: getViewport(),
+  inputMode: getInputMode(),
+  theme: getInitialTheme(),
+  layout: 'desktop',
+}
+
+environment.layout = resolveLayout(environment.layoutPreference, environment.viewport)
+
+export function updateEnvironment(
+  patch: Partial<Pick<RenderEnvironment, 'layoutPreference' | 'theme' | 'inputMode' | 'viewport'>> = {}
+): RenderEnvironment {
+  if (patch.layoutPreference) {
+    environment.layoutPreference = patch.layoutPreference
+  }
+
+  if (patch.theme) {
+    environment.theme = patch.theme
+  }
+
+  if (patch.inputMode) {
+    environment.inputMode = patch.inputMode
+  }
+
+  if (patch.viewport) {
+    environment.viewport = patch.viewport
+  }
+
+  environment.layout = resolveLayout(
+    environment.layoutPreference,
+    environment.viewport
+  )
+
+  return environment
+}
+
+export function syncEnvironmentToWindow(): RenderEnvironment {
+  return updateEnvironment({
+    viewport: getViewport(),
+  })
+}
+
 export const context: DataBrowserContext = {
   session: {
     store: store as LiveStore,
@@ -24,6 +105,7 @@ export const context: DataBrowserContext = {
   },
   dom: document,
   getOutliner: () => null,
+  environment,
 }
 
 export const fetcher = store.fetcher
diff --git a/dev/dev-global-dark.css b/dev/dev-global-dark.css
new file mode 100644
index 00000000..d55d6af1
--- /dev/null
+++ b/dev/dev-global-dark.css
@@ -0,0 +1,268 @@
+/* ---ONLY FOR LOCAL DEV--- */
+/* ---dark theme tokens, modeled on mashlib--- */
+
+/* BEGIN dev dark theme overrides: active when the dev toolbar sets html[data-theme='dark'] */
+html[data-theme="dark"] {
+  /* Background and Text */
+  --color-background: #1e1e1e;
+  --color-text: #e0e0e0;
+  --color-text-ui: var(--gray-800, #1E2939);
+  --color-text-control: var(--gray-100, #F3F4F6);
+  --color-text-primary: var(--gray-300, #D1D5DC);
+  --color-text-secondary: var(--gray-400, #99A1AF);
+  --color-text-subheading: var(--gray-100, #F3F4F6);
+  --color-text-overlay: var(--gray-100, #F3F4F6);
+  --color-text-accent-subtle: var(--gray-100, #F3F4F6);
+  --color-text-strong: var(--gray-100, #F3F4F6);
+  --color-text-strong-secondary: var(--gray-200, #E5E7EB);
+  --color-text-detail: var(--gray-300, #D1D5DC);
+  --color-text-empty-state: var(--gray-200, #E5E7EB); 
+  --color-icon-muted: var(--gray-400, #99A1AF);
+  --color-text-light: #555;
+  --color-text-link: #66b3ff;
+  --color-text-link-visited: #66b3ff;
+  --color-text-link-hover: #66b3ff;
+  --color-text-link-active: #aaa;
+  --color-text-answer: #66b3ff;
+  --color-text-muted: #bbb;
+  --color-text-dark-gray: #d4d4d4;
+  --color-text-blue: #7cb9ff;
+  --color-text-brown: #c4a660;
+  
+  /* Header */
+  --color-header-row-bg: var(--grey-purple-900, #332746);
+  --color-header-text: var(--white, #fff);
+  --color-header-menu-separator-line: var(--slate-200, #E2E8F0);
+  --color-header-menu-item-hover: var(--lavender-300, #e6dcff);
+  --color-header-menu-item-selected: var(--lavender-400, #cbb9ff);
+  --color-header-menu-loggedin-bg: var(--grey-purple-700, #5e546d);
+  --color-header-button-text: var(--slate-900, #0F172B);
+  --color-header-button-detail-text: var(--gray-400, #99A1AF);
+  --color-header-shadow: 2px 6px 10px 0 rgba(0, 0, 0, 0.4), 2px 8px 24px 0 rgba(0, 0, 0, 0.19);
+  
+  /* Borders */
+  --color-border: #444;
+  --color-border-lighter: var(--gray-700, #364153);
+  --color-border-subtle: var(--gray-700, #364153);
+  --color-border-dark: #555;
+  --color-border-darker: var(--gray-800, #1E2939);
+  --color-border-light: #666;
+  --color-border-pale: #555;
+  --color-border-accent: #9999dd;
+  --color-border-button: var(--gray-700, #364153);
+  --color-border-button-hover: var(--gray-600, #4A5565);
+
+  /* Button colors */
+  --color-surface-action: var(--color-primary, #B388FF);
+  --color-surface-action-hover: #c39cff;
+  --color-surface-accent-subtle: var(--grey-purple-900, #332746);
+  --color-surface-accent-subtle-hover: var(--grey-purple-700, #5e546d);
+  --color-surface-overlay: var(--gray-800, #1E2939);
+  --color-surface-overlay-header: var(--gray-900, #101828);
+  --color-surface-tertiary: var(--gray-800, #1E2939);
+  --color-surface-tertiary-hover: var(--gray-900, #101828);
+  --color-surface-chip: var(--color-card-bg, #2a2a2a);
+  --color-surface-framed-content: var(--color-card-bg, #2a2a2a);
+  --color-surface-placeholder: var(--gray-700, #364153);
+  --color-surface-subtle: rgba(255, 255, 255, 0.08);
+  --color-text-on-action: var(--gray-900, #101828);
+  --color-border-muted: var(--color-border-light, #666);
+  --color-border-action: var(--color-primary, #B388FF);
+  --color-focus-ring: var(--color-primary, #B388FF);
+  --color-focus-gap: var(--gray-900, #101828);
+  --dialog-cancel-button-background: transparent;
+  --dialog-cancel-button-text: var(--gray-100, #F3F4F6);
+  --dialog-cancel-button-border: var(--color-border-light, #666);
+  --dialog-cancel-button-hover-background: var(--color-primary, #B388FF);
+  --dialog-cancel-button-hover-text: var(--color-text-on-action, #1e1e1e);
+  --dialog-cancel-button-hover-border: var(--color-primary, #B388FF);
+  --dialog-error-background: rgba(176, 0, 32, 0.18);
+  --dialog-error-border: rgba(255, 118, 154, 0.5);
+  --dialog-error-text: #ffbbcd;
+  
+  
+  /* Status Colors */
+  --color-selected-bg: #4a6e3a;
+  --color-warning: #ff6b6b;
+  --color-success-bg: #2a5f2a;
+  --color-success-border: #4db84d;
+  --color-failure-bg: #3a3a3a;
+  --color-failure-border: #ff6b6b;
+  
+  /* Info and Alert Colors */
+  --color-info-bg: #2a2a5a;
+  --color-info-border: #6699ff;
+  --color-alert-bg: #5a5a2a;
+  --color-alert-border: #ccaa00;
+  --color-fetch-bg: #2a5a2a;
+  --color-request-bg: #6b6b00;
+  --color-error-bg: #3a3a3a;
+  --color-error-notice-bg: #5a3a3a;
+  --color-unparseable-bg: #6b5a00;
+  
+  /* Component Colors */
+  --color-container-border: #555;
+  --color-iframe-bg: #2a2a2a;
+  --color-main-block-bg: #252525;
+  --color-nav-block-bg: #2a2a2a;
+  --color-nav-block-border: #555;
+  --color-category-bg: #1f2b1f;
+  --color-category-border: #555;
+  --color-category-class-bg: #2a5f2a;
+  --color-category-class-border: #4db84d;
+  --color-pubs-pane-bg: #3a3a2a;
+  --color-pubs-pane-border: #555;
+  --color-cv-pane-bg: #1f4a5a;
+  
+  /* Data Content Pane */
+  --color-data-pane-border-top: #888;
+  --color-data-pane-border-side: #555;
+  --color-table-header-bg: #2a3a5a;
+  --color-table-result-bg: #252525;
+  --color-table-border-dark: #555;
+  
+  /* Notification Colors */
+  --color-log-normal: #e0e0e0;
+  --color-log-info: #e0e0e0;
+  --color-log-warn: #e0e0e0;
+  --color-log-warn-bg: #5a5a2a;
+  --color-log-error: #e0e0e0;
+  --color-log-error-bg: #5a3a3a;
+  --color-log-message: #66bb66;
+  --color-log-debug: #e0e0e0;
+  --color-log-debug-bg: #2a3a5a;
+  
+  /* Suggestion List */
+  --color-suggestion-bg: #2a2a2a;
+  --color-suggestion-border: #4db8ff;
+  --color-suggestion-link: #4db8ff;
+  --color-suggestion-selected-bg: #4db8ff;
+  --color-suggestion-selected-text: #1e1e1e;
+  
+  /* Photo Pane */
+  --color-photo-border: #555;
+  --color-photo-tag-highlight: #2a4a7a;
+  --color-photo-tag-highlight-border: #5a6b4a;
+  --color-photo-thumb-border: #444;
+  
+  /* Menu and Tab Colors */
+  --color-menu-bg: #2a2a2a;
+  --color-menu-item-text: #c4b4d4;
+  --color-menu-item-active: #4a5a7a;
+  --color-view-tab-bg: #252525;
+  --color-view-window-bg: #3a3a3a;
+  --color-query-select-bg: #3a3a3a;
+  --color-tab-inactive-bg: #2a2a2a;
+  --color-tab-inactive-border: #444;
+  --color-tab-inactive-border-light: #555;
+  --color-tab-inactive-text: #6b7baa;
+  --color-tab-active-bg: #3a3a3a;
+  --color-tab-active-border: #444;
+  --color-tab-active-border-light: #555;
+  --color-tab-active-text: #66b3ff;
+  
+  /* Special Highlights */
+  --color-source-highlight: #6b6b00;
+  --color-hover-visibility: visible;
+  --color-hidden-visibility: hidden;
+  --color-mild-notice-bg: #3a3a2a;
+  --color-bottom-border-highlight: rgb(60%,80%,100%);
+  --color-col-close: #555;
+  --color-sort-arrow: #555;
+  
+  /* Typography */
+  --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  --font-family-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+  --font-size-base: 100%;
+  --font-size-strong: 120%;
+  --font-weight-normal: normal;
+  --font-weight-bold: bold;
+  --line-height-base: 1.5;
+  --line-height-tight: 1.4;
+  --line-height-loose: 1.6;
+  --letter-spacing-wide: 0.025em;
+  --font-size-sm: 0.875rem;
+  --font-size-lg: 1.125rem;
+  --font-size-xl: 1.25rem;
+  
+  /* Spacing and Sizing */
+  --spacing-tiny: 0.05em;
+  --spacing-small: 0.1em;
+  --spacing-xxxs: 0.2em;
+  --spacing-xxs: 0.3em;
+  --spacing-xs: 0.5rem;
+  --spacing-sm: 0.75em;
+  --spacing-btn: 0.7em;
+  --spacing-base: 0.5em;
+  --spacing-md: 1em;
+  --spacing-lg: 1.5em;
+  --spacing-xl: 2em;
+  --spacing-2xl: 3em;
+  --border-width-xthin: 0.05em;
+  --border-width-sm: 0.1em;
+  --border-width-thin: 1px;
+  --border-width-medium: 2px;
+  --border-width-bold: 5px;
+  --border-radius-xs: 0.1em;
+  --border-radius-sm: 0.2em;
+  --border-radius-base: 0.5em;
+  --border-radius-lg: 0.75em;
+  --border-radius-full: 1em;
+  
+  /* Primary/Accent Colors */
+  --color-primary: #B388FF;
+  --color-secondary: #4FC3F7;
+  --color-accent: #FFE082;
+  --color-error: #FF5252;
+  --color-success: #69F0AE;
+  --color-primary-alpha: rgba(124, 77, 255, 0.35);
+  --color-primary-alpha-light: rgba(124, 77, 255, 0.15);
+  
+  /* Card/Section Backgrounds */
+  --color-card-bg: #2a2a2a;
+  --color-section-bg: #1a1a1a;
+  --color-zebra-stripe: rgba(255, 255, 255, 0.03);
+  --color-hover-bg: rgba(255, 255, 255, 0.08);
+  
+  /* Shadows */
+  --box-shadow: 0 2px 8px rgba(0,0,0,0.3);
+  --box-shadow-sm: 0 1px 4px rgba(0,0,0,0.2);
+  --box-shadow-active: 0 1px 2px rgba(124, 77, 255, 0.3);
+  --box-shadow-focus: 0 0 0 5px rgba(124, 77, 255, 0.35);
+  --box-shadow-focus-accessible: 0 0 0 var(--focus-ring-width) var(--color-background), 0 0 0 calc(var(--focus-ring-width) + var(--focus-indicator-width)) var(--color-primary-alpha);
+  --box-shadow-hover: 0 2px 4px rgba(124, 77, 255, 0.3);
+  --box-shadow-modal: 0 2px 10px rgba(0, 0, 0, 0.5);
+  --box-shadow-overlay: 0 4px 24px rgba(0, 0, 0, 0.4);
+  --box-shadow-popup: 0 0.5em 0.9em rgba(0, 0, 0, 0.4);
+  
+  /* Accessibility */
+  --min-touch-target: 44px;
+  --focus-ring-width: 2px;
+  --focus-indicator-width: 3px;
+  --animation-duration: 0.2s;
+  --animation-duration-slow: 0.3s;
+  --min-font-size: 14px;
+  --min-line-height: 1.4;
+  --high-contrast-ratio: 7:1;
+  
+  /* Overlay and Modal */
+  --overlay-bg: rgba(0, 0, 0, 0.7);
+  --overlay-bg-muted: rgba(0, 0, 0, 0.5);
+  --z-index-modal: 9999;
+  --z-index-skip-links: 1000;
+  
+  /* Opacity */
+  --opacity-disabled: 0.6;
+  --opacity-input-disabled: 0.75;
+  
+  /* Layout Values */
+  --max-width-readable: 65ch;
+  --max-width-readable-wide: 70ch;
+  --grid-min-column: 30em;
+  
+  /* Outline Offsets */
+  --outline-offset-sm: 2px;
+  
+  /* Success Alpha */
+  --color-success-alpha: rgba(105, 240, 174, 0.15);
+}
diff --git a/dev/dev-global.css b/dev/dev-global.css
index 03caac5a..a7dc75e2 100644
--- a/dev/dev-global.css
+++ b/dev/dev-global.css
@@ -1,12 +1,17 @@
 /* ---ONLY FOR LOCAL DEV--- */
 /* ---final version is in mashlib--- */
 
+/* BEGIN dev theme bridge: import dark-token overrides used by the theme selector */
+@import url('./dev-global-dark.css');
+/* END dev theme bridge */
+
 /* Global CSS: base styles, variables, and resets */
 /* Accessible color palette */
 
 :root {
    /* New Design: Colors (possibly change to primary secondary etc for now add here  */
   /* Adding used for comment so we can decide later */
+  --profile-interactive-cursor: pointer;
   --blue-900: #083575;
   --gray-50: #F9FAFB; /* Used for: background of dialog buttons */
   --gray-100: #F3F4F6;
@@ -59,13 +64,20 @@
   --color-background-row-default: white;
   --color-background-row-alternate: #f0f0f0;
   --color-text: #1A1A1A;
+  --color-text-ui: var(--gray-100, #F3F4F6);
   --color-text-primary: var(--gray-700, #364153); /* new design */
+  --color-text-ui: var(--slate-700, #314158);
   --color-text-secondary-old: #666;
   --color-text-secondary: var(--gray-600, #4A5565);
   --color-text-heading: var(--black, #000000); /* New design uses pure black for headings */
   --color-text-subheading: var(--gray-900, #101828); /* new design */
+  --color-text-overlay: var(--gray-800, #1E2939);
+  --color-text-accent-subtle: var(--color-text-control, var(--slate-700, #314158));
   --color-text-strong: var(--slate-900, #0F172B); /* new design */
   --color-text-strong-secondary: var(--slate-800, #1D293D); /* new design */
+  --color-text-detail: var(--slate-500, #62748E);
+  --color-text-empty-state: var(--gray-400, #99A1AF);
+  --color-icon-muted: var(--slate-400, #90A1B9);
   --color-text-light: #aaa;
   --color-text-link: #3B5998;
   --color-text-link-visited: #3B5998;
@@ -80,11 +92,44 @@
   /* Borders */
   --color-border: var(--gray-200, #E5E7EB); /* used to be #ccc */
   --color-border-lighter: var(--slate-200, #E2E8F0);
+  --color-border-subtle: var(--gray-100, #F3F4F6);
+  --color-border-button: var(--gray-300, #D1D5DC);
+  --color-border-button-hover: var(--gray-400, #99A1AF);
   --color-border-dark: #777;
-  --color-border-darker: #444;
+  --color-border-darker: var(--gray-600, #4A5565); /* old #444 */
   --color-border-light: #aaa;
   --color-border-pale: #eee;
   --color-border-accent: #88c;
+
+  /* BEGIN semantic button tokens: shared action, tertiary, and focus colors for local dev theming */
+  --color-surface-action: var(--color-primary, #7C4DFF);
+  --color-surface-action-hover: #6d3cf2;
+  --color-surface-accent-subtle: var(--lavender-300, #e6dcff);
+  --color-surface-accent-subtle-hover: var(--lavender-200, #E4DBFE);
+  --color-surface-overlay: var(--white, #FFF);
+  --color-surface-overlay-header: var(--slate-50, #F8FAFC);
+  --color-surface-tertiary: var(--gray-50, #F9FAFB);
+  --color-surface-tertiary-hover: var(--gray-100, #F3F4F6);
+  --color-surface-chip: var(--gray-100, #F3F4F6);
+  --color-surface-framed-content: var(--color-surface-tertiary-hover, var(--gray-100, #F3F4F6));
+  --color-surface-placeholder: var(--gray-200, #E5E7EB);
+  --color-surface-subtle: rgba(15, 23, 43, 0.04);
+  --color-text-on-action: var(--white, #FFF);
+  --color-border-muted: var(--gray-300, #D1D5DC);
+  --color-border-action: var(--color-primary, #7C4DFF);
+  --color-focus-ring: var(--color-primary, #7C4DFF);
+  --color-focus-gap: var(--white, #FFF);
+  --dialog-cancel-button-background: transparent;
+  --dialog-cancel-button-text: var(--gray-800, #1E2939);
+  --dialog-cancel-button-border: var(--gray-300, #D1D5DC);
+  --dialog-cancel-button-hover-background: var(--blue-900, #083575);
+  --dialog-cancel-button-hover-text: var(--white, #FFF);
+  --dialog-cancel-button-hover-border: var(--blue-900, #083575);
+  --dialog-error-background: var(--pink-500, #ffdde6);
+  --dialog-error-border: var(--pink-700, #ff98b3);
+  --dialog-error-text: var(--red-600, #B00020);
+  --color-header-menu-item-hover: var(--lavender-300, #e6dcff);
+  /* END semantic button tokens */
   
   /* Status Colors */
   --color-selected-bg: #8F3;
@@ -195,6 +240,7 @@
   --line-height-loose: 1.6;
   --letter-spacing-wide: 0.025em;
   --font-size-xxs: 0.75rem; /* 12px */
+  --font-size-2xs: 0.6875rem; /* 11px */
   --font-size-xs: 0.813rem; /* 13px */
   --font-size-sm: 0.875rem; /* 14px */
   --font-size-md: 1rem;     /* 16px */
@@ -202,6 +248,12 @@
   --font-size-xl-old: 1.25rem; /* 20px */
   --font-size-xl: 1.375rem;     /* 22px */
   --font-size-xxl: 1.75rem;    /* 28px */
+  --profile-mobile-header-image-size: 4.375rem; /* 70px */
+  --profile-mobile-header-name-size: var(--font-size-xl, 1.375rem);
+  --profile-mobile-header-job-title-size: var(--font-size-md, 1rem);
+  --profile-mobile-header-detail-size: var(--font-size-xxs, 0.75rem);
+  --profile-mobile-header-pronouns-size: var(--font-size-2xs, 0.6875rem);
+  --profile-mobile-section-heading-size: var(--font-size-lg, 1.125rem);
 
   /* Spacing and Sizing */
   --spacing-tiny: 0.05em;
@@ -272,6 +324,7 @@
   --box-shadow-sm: 0 1px 4px rgba(124,77,255,0.12);
   --box-shadow-active: 0 1px 2px rgba(124, 77, 255, 0.2);
   --box-shadow-focus: 0 0 0 5px rgba(124, 77, 255, 0.25);
+  --box-shadow-focus-accessible: 0 0 0 var(--focus-ring-width) var(--color-background), 0 0 0 calc(var(--focus-ring-width) + var(--focus-indicator-width)) var(--color-primary-alpha);
   --box-shadow-hover: 0 2px 4px rgba(124, 77, 255, 0.2);
   --box-shadow-modal: 0 2px 10px rgba(0, 0, 0, 0.3);
   --box-shadow-overlay: 0 4px 24px rgba(0, 0, 0, 0.2);
@@ -309,6 +362,63 @@
   --color-success-alpha: rgba(0, 200, 83, 0.1);
 }
 
+:root[data-input-mode='touch'] {
+  --profile-interactive-cursor: auto;
+}
+
+:root[data-input-mode='pointer'] {
+  --profile-interactive-cursor: pointer;
+}
+
+/* BEGIN dev environment toolbar: styles for theme/layout/input preview controls */
+#loginBanner {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.75rem 1rem;
+  align-items: center;
+}
+
+.dev-toolbar {
+  display: inline-flex;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+  align-items: end;
+}
+
+.dev-toolbar__control {
+  display: inline-flex;
+  flex-direction: column;
+  gap: 0.25rem;
+  font-size: 0.875rem;
+  color: inherit;
+}
+
+.dev-toolbar__label {
+  font-weight: 600;
+}
+
+.dev-toolbar__select {
+  min-height: 2.25rem;
+  min-width: 7rem;
+  padding: 0.4rem 0.75rem;
+  border: 1px solid var(--color-border, #d1d5db);
+  border-radius: 999px;
+  background: rgba(255, 255, 255, 0.92);
+  color: var(--color-text, #1a1a1a);
+}
+
+html[data-theme='dark'] .dev-toolbar__select {
+  background: rgba(17, 24, 39, 0.92);
+  color: #f9fafb;
+  border-color: rgba(255, 255, 255, 0.24);
+}
+
+html[data-theme='dark'] h1,
+html[data-theme='dark'] #webId {
+  color: #f9fafb;
+}
+/* END dev environment toolbar */
+
 
 /* Improve text rendering */
 html, body {
@@ -476,7 +586,7 @@ nav ul {
 [role="link"]:focus,
 button:focus,
 a:focus {
-  outline: 2px solid var(--color-primary);
+  /* outline: 2px solid var(--color-primary); */
   outline-offset: 2px;
   box-shadow: 0 0 0 1px var(--color-background);
 } 
@@ -549,7 +659,7 @@ label:focus-visible {
 
 /* Enhanced button accessibility */
 button, [role="button"] {
-  cursor: pointer;
+  cursor: var(--profile-interactive-cursor, pointer);
   border: none;
   border-radius: var(--border-radius-base);
   padding: var(--spacing-sm) var(--spacing-md);
diff --git a/dev/dev-utilities.css b/dev/dev-utilities.css
index 8a58b761..3a252414 100644
--- a/dev/dev-utilities.css
+++ b/dev/dev-utilities.css
@@ -439,7 +439,7 @@
   background: var(--color-primary);
   color: var(--color-background);
   font-weight: var(--font-weight-bold);
-  cursor: pointer;
+  cursor: var(--profile-interactive-cursor, pointer);
   transition: all var(--animation-duration) ease;
   text-decoration: none;
   display: inline-flex;
@@ -478,7 +478,7 @@
   background: var(--color-secondary);
   color: var(--color-background);
   font-weight: var(--font-weight-bold);
-  cursor: pointer;
+  cursor: var(--profile-interactive-cursor, pointer);
   transition: all var(--animation-duration) ease;
   text-decoration: none;
   display: inline-flex;
@@ -503,7 +503,7 @@
   background: var(--white, #FFF);
   border-radius: var(--border-radius-base); /* 5px */
   font-weight: var(--font-weight-bold);
-  cursor: pointer;
+  cursor: var(--profile-interactive-cursor, pointer);
   transition: all var(--animation-duration) ease;
   text-decoration: none;
   display: inline-flex;
@@ -543,7 +543,7 @@
   background: transparent;
   color: var(--color-primary);
   font-weight: var(--font-weight-bold);
-  cursor: pointer;
+  cursor: var(--profile-interactive-cursor, pointer);
   transition: all var(--animation-duration) ease;
   text-decoration: none;
   display: inline-flex;
@@ -565,7 +565,7 @@
 .btn-transparent {
   background-color: transparent;
   border: none;
-  cursor: pointer;
+  cursor: var(--profile-interactive-cursor, pointer);
 }
 
 .btn-transparent:hover {
@@ -587,16 +587,16 @@
 
 .input {
   border-radius: var(--border-radius-base, 0.3125rem);
-  border: 1px solid var(--gray-400, #99A1AF);
+  border: 1px solid var(--color-border-button-hover, var(--gray-400, #99A1AF));
   background: var(--white, #FFF);
-  color: var(--gray-900, #101828);
+  color: var(--color-text-subheading, var(--gray-900, #101828));
   font-size: var(--font-size-sm, 0.875rem);
   font-weight: var(--font-weight-medium, 500);
   padding: var(--spacing-2xs, 0.625rem);
 }
 
 .label {
-  color: var(--gray-600, #4A5565);
+  color: var(--color-text-secondary, #4A5565);
   font-size: var(--font-size-sm, 0.875rem);
   font-weight: var(--font-weight-regular, 400);
 }
diff --git a/dev/index.ts b/dev/index.ts
index 4dd967bf..014681f9 100644
--- a/dev/index.ts
+++ b/dev/index.ts
@@ -1,17 +1,27 @@
 import { sym } from 'rdflib'
+import {
+  log,
+  warn,
+} from '../src/utils/debug'
 //import { default as pane } from '../src/editProfilePane/EditProfileView' //uncomment for profile editor
 import { default as pane } from '../src'
-// import { default as pane } from '../src/friendsPane/index'
 // @ts-ignore side-effect CSS import for dev webpack bundle
 import './dev-global.css' // Import after src to override component styles
 // @ts-ignore side-effect CSS import for dev webpack bundle
 import './dev-utilities.css'
-import { context, fetcher } from './context'
+import {
+  context,
+  environment,
+  fetcher,
+  syncEnvironmentToWindow,
+  updateEnvironment,
+} from './context'
 import { authn, authSession } from 'solid-logic'
 import * as UI from 'solid-ui'
 
 const loginBanner = document.getElementById('loginBanner')
 const webId = document.getElementById('webId')
+let renderedApp: HTMLElement | null = null
 
 if (loginBanner) {
   loginBanner.appendChild(UI.login.loginStatusBox(document, null, {}))
@@ -26,9 +36,140 @@ const webIdToShow = 'https://sharontest.solidcommunity.net/profile/card#me'
 
 const urlParams = new URLSearchParams(window.location.search)
 const webIdParam = urlParams.get('webid')
-// const webIdToShow = webIdParam || defaultWebIdToShow
+const resolvedWebId = webIdParam || webIdToShow
 
-console.info('[profile-pane/dev] target webid', { webIdToShow })
+log('[profile-pane/dev] target webid', { webIdToShow: resolvedWebId })
+
+function createSelectControl<T extends string>(
+  id: string,
+  labelText: string,
+  options: Array<{ label: string, value: T }>,
+  value: T,
+  onChange: (nextValue: T) => void,
+): HTMLLabelElement {
+  const label = document.createElement('label')
+  label.className = 'dev-toolbar__control'
+  label.setAttribute('for', id)
+
+  const text = document.createElement('span')
+  text.className = 'dev-toolbar__label'
+  text.textContent = labelText
+
+  const select = document.createElement('select')
+  select.id = id
+  select.className = 'dev-toolbar__select'
+
+  options.forEach((option) => {
+    const optionElement = document.createElement('option')
+    optionElement.value = option.value
+    optionElement.textContent = option.label
+    optionElement.selected = option.value === value
+    select.appendChild(optionElement)
+  })
+
+  select.addEventListener('change', () => {
+    onChange(select.value as T)
+  })
+
+  label.append(text, select)
+  return label
+}
+
+function applyEnvironmentAttributes() {
+  const root = document.documentElement
+
+  root.dataset.layout = environment.layout
+  root.dataset.inputMode = environment.inputMode
+
+  if (environment.theme === 'dark') {
+    root.dataset.theme = 'dark'
+  } else {
+    delete root.dataset.theme
+  }
+}
+
+function renderApp() {
+  applyEnvironmentAttributes()
+
+  const app = pane.render(sym(resolvedWebId), context)
+  const appRoot = document.getElementById('app')
+
+  if (renderedApp) {
+    renderedApp.replaceWith(app)
+    renderedApp = app
+    return
+  }
+
+  if (appRoot) {
+    appRoot.replaceWith(app)
+    renderedApp = app
+  }
+}
+
+function rerenderWithEnvironment() {
+  renderApp()
+}
+
+function mountDevToolbar() {
+  if (!loginBanner) {
+    return
+  }
+
+  const toolbar = document.createElement('div')
+  toolbar.className = 'dev-toolbar'
+
+  toolbar.append(
+    createSelectControl(
+      'dev-theme-select',
+      'Theme',
+      [
+        { label: 'Light', value: 'light' },
+        { label: 'Dark', value: 'dark' },
+      ],
+      environment.theme,
+      (theme) => {
+        updateEnvironment({ theme })
+        rerenderWithEnvironment()
+      }
+    ),
+    createSelectControl(
+      'dev-layout-select',
+      'Layout',
+      [
+        { label: 'Auto', value: 'auto' },
+        { label: 'Desktop', value: 'desktop' },
+        { label: 'Mobile', value: 'mobile' },
+      ],
+      environment.layoutPreference,
+      (layoutPreference) => {
+        updateEnvironment({ layoutPreference })
+        rerenderWithEnvironment()
+      }
+    ),
+    createSelectControl(
+      'dev-input-select',
+      'Input',
+      [
+        { label: 'Pointer', value: 'pointer' },
+        { label: 'Touch', value: 'touch' },
+      ],
+      environment.inputMode,
+      (inputMode) => {
+        updateEnvironment({ inputMode })
+        rerenderWithEnvironment()
+      }
+    )
+  )
+
+  loginBanner.appendChild(toolbar)
+}
+
+function bindEnvironmentListeners() {
+  window.addEventListener('resize', () => {
+    syncEnvironmentToWindow()
+    rerenderWithEnvironment()
+  })
+}
 
 
 async function finishLogin() {
@@ -44,16 +185,15 @@ async function finishLogin() {
   }
 
   try {
-    await fetcher.load(webIdToShow)
+    await fetcher.load(resolvedWebId)
   } catch (error) {
-    console.warn('Initial profile load failed, rendering anyway:', error)
+    warn('Initial profile load failed, rendering anyway:', error)
   } finally {
-    const app = pane.render(sym(webIdToShow), context)
-    const appRoot = document.getElementById('app')
-    if (appRoot) {
-      appRoot.replaceWith(app)
-    }
+    syncEnvironmentToWindow()
+    renderApp()
   }
 }
 
+mountDevToolbar()
+bindEnvironmentListeners()
 finishLogin()
\ No newline at end of file
diff --git a/docs/accessibility-baseline-checklist.md b/docs/accessibility-baseline-checklist.md
index d9fd9f2f..b9aeb094 100644
--- a/docs/accessibility-baseline-checklist.md
+++ b/docs/accessibility-baseline-checklist.md
@@ -41,6 +41,20 @@ This checklist captures the baseline rules we enforce in profile section markup
 
 - Run the focused accessibility test after markup changes:
   - `npm test -- test/profile-view.accessibility.test.ts`
+- Run the short manual accessibility smoke test for accessibility-sensitive changes:
+  - see `docs/accessibility-smoke-test.md`
+- For interaction changes, manually test keyboard-only behavior:
+  - tab order reaches all controls
+  - visible focus remains clear
+  - dialogs can be opened, operated, and closed from the keyboard
+  - focus returns to a sensible element after closing a dialog
+- Manually test with VoiceOver on macOS for:
+  - landmark and heading navigation
+  - button and link names
+  - dialog title and description announcement
+  - inline error, alert, and saving/status message announcement
+- Check reflow at 200% and 400% zoom for the main profile flows.
+- Until browser-level accessibility audits are automated in this repo, do not treat the axe test as sufficient by itself for accessibility-sensitive changes.
 - If violations appear, fix semantic/ARIA issues before adding test exceptions.
 - Keep fixes in source markup, not in test-only workarounds.
 
diff --git a/docs/accessibility-smoke-test.md b/docs/accessibility-smoke-test.md
new file mode 100644
index 00000000..1b86dd3d
--- /dev/null
+++ b/docs/accessibility-smoke-test.md
@@ -0,0 +1,33 @@
+# Accessibility Smoke Test
+
+Use this short manual smoke test for accessibility-sensitive changes to the profile pane.
+
+## Keyboard-only navigation
+
+- Move through the pane with `Tab` and `Shift+Tab` only.
+- Confirm every interactive control is reachable.
+- Confirm dialogs open, operate, and close without requiring a mouse.
+- Confirm focus returns to a sensible trigger after a dialog closes.
+
+## Screen reader pass
+
+- Run a quick pass with VoiceOver on macOS.
+- Confirm headings and landmarks are announced in a sensible order.
+- Confirm buttons and links have clear names.
+- Confirm dialog title, description, and errors are announced.
+
+## Zoom and reflow
+
+- Check the main profile flows at 200% zoom.
+- Check the main profile flows at 400% zoom.
+- Confirm core content remains readable and usable without horizontal scrolling where reflow is expected.
+
+## Visible focus
+
+- Confirm the current keyboard focus target is always visually obvious.
+- Confirm focus is not hidden by overlays, sticky UI, or clipped containers.
+
+## Status and error announcements
+
+- Trigger at least one validation or save error and confirm it is announced.
+- If the change includes save or loading feedback, confirm status updates are announced.
\ No newline at end of file
diff --git a/eslint.config.mjs b/eslint.config.mjs
index e87d25df..428ded6b 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -1,4 +1,5 @@
 import tsParser from "@typescript-eslint/parser"
+import tsPlugin from "@typescript-eslint/eslint-plugin"
 import globals from "globals"
 
 export default [
@@ -50,6 +51,9 @@ export default [
     {
         files: ['src/**/*.ts'],
 
+        plugins: {
+            '@typescript-eslint': tsPlugin,
+        },
         languageOptions: {
         globals: {
             ...globals.browser,
@@ -65,9 +69,18 @@ export default [
         rules: {
             semi: ['error', 'never'],
             quotes: ['error', 'single'],
+            'no-console': ['error', { allow: ['warn', 'error'] }],
             // Disable ESLint rules that TypeScript handles better
             'no-unused-vars': 'off', // TypeScript handles this via noUnusedLocals
             'no-undef': 'off', // TypeScript handles undefined variables
+            '@typescript-eslint/no-unused-vars': ['error', {
+                vars: 'all',
+                varsIgnorePattern: '.*',
+                args: 'all',
+                argsIgnorePattern: '^_',
+                caughtErrors: 'all',
+                caughtErrorsIgnorePattern: '^_'
+            }],
         },
     }
 ]
diff --git a/package-lock.json b/package-lock.json
index 223b8a05..49deb6a3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,6 +9,7 @@
       "version": "3.2.1",
       "license": "MIT",
       "dependencies": {
+        "@solid-data-modules/contacts-rdflib": "^0.7.1",
         "lit-html": "^3.3.3",
         "pane-registry": "^3.1.1",
         "qrcode": "^1.5.4",
@@ -58,15 +59,11 @@
     },
     "node_modules/@adobe/css-tools": {
       "version": "4.4.4",
-      "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.4.tgz",
-      "integrity": "sha512-Elp+iwUx5rN5+Y8xLt5/GRoG20WGoDCQ/1Fb+1LiGtvwbDavuSk0jhD/eZdckHAuzcDzccnkv+rEjyWfRx18gg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@asamuzakjp/css-color": {
       "version": "5.1.11",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-5.1.11.tgz",
-      "integrity": "sha512-KVw6qIiCTUQhByfTd78h2yD1/00waTmm9uy/R7Ck/ctUyAPj+AEDLkQIdJW0T8+qGgj3j5bpNKK7Q3G+LedJWg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -82,8 +79,6 @@
     },
     "node_modules/@asamuzakjp/dom-selector": {
       "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-7.1.1.tgz",
-      "integrity": "sha512-67RZDnYRc8H/8MLDgQCDE//zoqVFwajkepHZgmXrbwybzXOEwOWGPYGmALYl9J2DOLfFPPs6kKCqmbzV895hTQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -99,8 +94,6 @@
     },
     "node_modules/@asamuzakjp/generational-cache": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/generational-cache/-/generational-cache-1.0.1.tgz",
-      "integrity": "sha512-wajfB8KqzMCN2KGNFdLkReeHncd0AslUSrvHVvvYWuU8ghncRJoA50kT3zP9MVL0+9g4/67H+cdvBskj9THPzg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -109,15 +102,11 @@
     },
     "node_modules/@asamuzakjp/nwsapi": {
       "version": "2.3.9",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/nwsapi/-/nwsapi-2.3.9.tgz",
-      "integrity": "sha512-n8GuYSrI9bF7FFZ/SjhwevlHc8xaVlb/7HmHelnc/PZXBD2ZR49NnN9sMMuDdEGPeeRQ5d0hqlSlEpgCX3Wl0Q==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@babel/cli": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/cli/-/cli-7.28.6.tgz",
-      "integrity": "sha512-6EUNcuBbNkj08Oj4gAZ+BUU8yLCgKzgVX4gaTh09Ya2C8ICM4P+G30g4m3akRxSYAp3A/gnWchrNst7px4/nUQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -146,8 +135,6 @@
     },
     "node_modules/@babel/code-frame": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz",
-      "integrity": "sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -161,8 +148,6 @@
     },
     "node_modules/@babel/compat-data": {
       "version": "7.29.3",
-      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.29.3.tgz",
-      "integrity": "sha512-LIVqM46zQWZhj17qA8wb4nW/ixr2y1Nw+r1etiAWgRM6U1IqP+LNhL1yg440jYZR72jCWcWbLWzIosH+uP1fqg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -171,8 +156,6 @@
     },
     "node_modules/@babel/core": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.0.tgz",
-      "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -202,8 +185,6 @@
     },
     "node_modules/@babel/generator": {
       "version": "7.29.1",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.29.1.tgz",
-      "integrity": "sha512-qsaF+9Qcm2Qv8SRIMMscAvG4O3lJ0F1GuMo5HR/Bp02LopNgnZBC/EkbevHFeGs4ls/oPz9v+Bsmzbkbe+0dUw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -219,8 +200,6 @@
     },
     "node_modules/@babel/helper-annotate-as-pure": {
       "version": "7.27.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz",
-      "integrity": "sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -232,8 +211,6 @@
     },
     "node_modules/@babel/helper-compilation-targets": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.28.6.tgz",
-      "integrity": "sha512-JYtls3hqi15fcx5GaSNL7SCTJ2MNmjrkHXg4FSpOA/grxK8KwyZ5bubHsCq8FXCkua6xhuaaBit+3b7+VZRfcA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -249,8 +226,6 @@
     },
     "node_modules/@babel/helper-create-class-features-plugin": {
       "version": "7.29.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.29.3.tgz",
-      "integrity": "sha512-RpLYy2sb51oNLjuu1iD3bwBqCBWUzjO0ocp+iaCP/lJtb2CPLcnC2Fftw+4sAzaMELGeWTgExSKADbdo0GFVzA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -271,8 +246,6 @@
     },
     "node_modules/@babel/helper-create-regexp-features-plugin": {
       "version": "7.28.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.28.5.tgz",
-      "integrity": "sha512-N1EhvLtHzOvj7QQOUCCS3NrPJP8c5W6ZXCHDn7Yialuy1iu4r5EmIYkXlKNqT99Ciw+W0mDqWoR6HWMZlFP3hw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -289,8 +262,6 @@
     },
     "node_modules/@babel/helper-define-polyfill-provider": {
       "version": "0.6.8",
-      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.6.8.tgz",
-      "integrity": "sha512-47UwBLPpQi1NoWzLuHNjRoHlYXMwIJoBf7MFou6viC/sIHWYygpvr0B6IAyh5sBdA2nr2LPIRww8lfaUVQINBA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -306,8 +277,6 @@
     },
     "node_modules/@babel/helper-globals": {
       "version": "7.28.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.28.0.tgz",
-      "integrity": "sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -316,8 +285,6 @@
     },
     "node_modules/@babel/helper-member-expression-to-functions": {
       "version": "7.28.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.28.5.tgz",
-      "integrity": "sha512-cwM7SBRZcPCLgl8a7cY0soT1SptSzAlMH39vwiRpOQkJlh53r5hdHwLSCZpQdVLT39sZt+CRpNwYG4Y2v77atg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -330,8 +297,6 @@
     },
     "node_modules/@babel/helper-module-imports": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.28.6.tgz",
-      "integrity": "sha512-l5XkZK7r7wa9LucGw9LwZyyCUscb4x37JWTPz7swwFE/0FMQAGpiWUZn8u9DzkSBWEcK25jmvubfpw2dnAMdbw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -344,8 +309,6 @@
     },
     "node_modules/@babel/helper-module-transforms": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.28.6.tgz",
-      "integrity": "sha512-67oXFAYr2cDLDVGLXTEABjdBJZ6drElUSI7WKp70NrpyISso3plG9SAGEF6y7zbha/wOzUByWWTJvEDVNIUGcA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -362,8 +325,6 @@
     },
     "node_modules/@babel/helper-optimise-call-expression": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.27.1.tgz",
-      "integrity": "sha512-URMGH08NzYFhubNSGJrpUEphGKQwMQYBySzat5cAByY1/YgIRkULnIy3tAMeszlL/so2HbeilYloUmSpd7GdVw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -375,8 +336,6 @@
     },
     "node_modules/@babel/helper-plugin-utils": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.28.6.tgz",
-      "integrity": "sha512-S9gzZ/bz83GRysI7gAD4wPT/AI3uCnY+9xn+Mx/KPs2JwHJIz1W8PZkg2cqyt3RNOBM8ejcXhV6y8Og7ly/Dug==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -385,8 +344,6 @@
     },
     "node_modules/@babel/helper-remap-async-to-generator": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.27.1.tgz",
-      "integrity": "sha512-7fiA521aVw8lSPeI4ZOD3vRFkoqkJcS+z4hFo82bFSH/2tNd6eJ5qCVMS5OzDmZh/kaHQeBaeyxK6wljcPtveA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -403,8 +360,6 @@
     },
     "node_modules/@babel/helper-replace-supers": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.28.6.tgz",
-      "integrity": "sha512-mq8e+laIk94/yFec3DxSjCRD2Z0TAjhVbEJY3UQrlwVo15Lmt7C2wAUbK4bjnTs4APkwsYLTahXRraQXhb1WCg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -421,8 +376,6 @@
     },
     "node_modules/@babel/helper-skip-transparent-expression-wrappers": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.27.1.tgz",
-      "integrity": "sha512-Tub4ZKEXqbPjXgWLl2+3JpQAYBJ8+ikpQ2Ocj/q/r0LwE3UhENh7EUabyHjz2kCEsrRY83ew2DQdHluuiDQFzg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -435,8 +388,6 @@
     },
     "node_modules/@babel/helper-string-parser": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
-      "integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -445,8 +396,6 @@
     },
     "node_modules/@babel/helper-validator-identifier": {
       "version": "7.28.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.28.5.tgz",
-      "integrity": "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -455,8 +404,6 @@
     },
     "node_modules/@babel/helper-validator-option": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz",
-      "integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -465,8 +412,6 @@
     },
     "node_modules/@babel/helper-wrap-function": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/helper-wrap-function/-/helper-wrap-function-7.28.6.tgz",
-      "integrity": "sha512-z+PwLziMNBeSQJonizz2AGnndLsP2DeGHIxDAn+wdHOGuo4Fo1x1HBPPXeE9TAOPHNNWQKCSlA2VZyYyyibDnQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -480,8 +425,6 @@
     },
     "node_modules/@babel/helpers": {
       "version": "7.29.2",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.29.2.tgz",
-      "integrity": "sha512-HoGuUs4sCZNezVEKdVcwqmZN8GoHirLUcLaYVNBK2J0DadGtdcqgr3BCbvH8+XUo4NGjNl3VOtSjEKNzqfFgKw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -494,8 +437,6 @@
     },
     "node_modules/@babel/parser": {
       "version": "7.29.3",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.3.tgz",
-      "integrity": "sha512-b3ctpQwp+PROvU/cttc4OYl4MzfJUWy6FZg+PMXfzmt/+39iHVF0sDfqay8TQM3JA2EUOyKcFZt75jWriQijsA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -510,8 +451,6 @@
     },
     "node_modules/@babel/plugin-bugfix-firefox-class-in-computed-class-key": {
       "version": "7.28.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-firefox-class-in-computed-class-key/-/plugin-bugfix-firefox-class-in-computed-class-key-7.28.5.tgz",
-      "integrity": "sha512-87GDMS3tsmMSi/3bWOte1UblL+YUTFMV8SZPZ2eSEL17s74Cw/l63rR6NmGVKMYW2GYi85nE+/d6Hw5N0bEk2Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -527,8 +466,6 @@
     },
     "node_modules/@babel/plugin-bugfix-safari-class-field-initializer-scope": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-class-field-initializer-scope/-/plugin-bugfix-safari-class-field-initializer-scope-7.27.1.tgz",
-      "integrity": "sha512-qNeq3bCKnGgLkEXUuFry6dPlGfCdQNZbn7yUAPCInwAJHMU7THJfrBSozkcWq5sNM6RcF3S8XyQL2A52KNR9IA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -543,8 +480,6 @@
     },
     "node_modules/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.27.1.tgz",
-      "integrity": "sha512-g4L7OYun04N1WyqMNjldFwlfPCLVkgB54A/YCXICZYBsvJJE3kByKv9c9+R/nAfmIfjl2rKYLNyMHboYbZaWaA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -559,8 +494,6 @@
     },
     "node_modules/@babel/plugin-bugfix-safari-rest-destructuring-rhs-array": {
       "version": "7.29.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-rest-destructuring-rhs-array/-/plugin-bugfix-safari-rest-destructuring-rhs-array-7.29.3.tgz",
-      "integrity": "sha512-SRS46DFR4HqzUzCVgi90/xMoL+zeBDBvWdKYXSEzh79kXswNFEglUpMKxR04//dPqwYXWUBJ3mpUd933ru9Kmg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -576,8 +509,6 @@
     },
     "node_modules/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.27.1.tgz",
-      "integrity": "sha512-oO02gcONcD5O1iTLi/6frMJBIwWEHceWGSGqrpCmEL8nogiS6J9PBlE48CaK20/Jx1LuRml9aDftLgdjXT8+Cw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -594,8 +525,6 @@
     },
     "node_modules/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.28.6.tgz",
-      "integrity": "sha512-a0aBScVTlNaiUe35UtfxAN7A/tehvvG4/ByO6+46VPKTRSlfnAFsgKy0FUh+qAkQrDTmhDkT+IBOKlOoMUxQ0g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -611,8 +540,6 @@
     },
     "node_modules/@babel/plugin-proposal-private-property-in-object": {
       "version": "7.21.0-placeholder-for-preset-env.2",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-private-property-in-object/-/plugin-proposal-private-property-in-object-7.21.0-placeholder-for-preset-env.2.tgz",
-      "integrity": "sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -624,8 +551,6 @@
     },
     "node_modules/@babel/plugin-syntax-async-generators": {
       "version": "7.8.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-async-generators/-/plugin-syntax-async-generators-7.8.4.tgz",
-      "integrity": "sha512-tycmZxkGfZaxhMRbXlPXuVFpdWlXpir2W4AMhSJgRKzk/eDlIXOhb2LHWoLpDF7TEHylV5zNhykX6KAgHJmTNw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -637,8 +562,6 @@
     },
     "node_modules/@babel/plugin-syntax-bigint": {
       "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-bigint/-/plugin-syntax-bigint-7.8.3.tgz",
-      "integrity": "sha512-wnTnFlG+YxQm3vDxpGE57Pj0srRU4sHE/mDkt1qv2YJJSeUAec2ma4WLUnUPeKjyrfntVwe/N6dCXpU+zL3Npg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -650,8 +573,6 @@
     },
     "node_modules/@babel/plugin-syntax-class-properties": {
       "version": "7.12.13",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.12.13.tgz",
-      "integrity": "sha512-fm4idjKla0YahUNgFNLCB0qySdsoPiZP3iQE3rky0mBUtMZ23yDJ9SJdg6dXTSDnulOVqiF3Hgr9nbXvXTQZYA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -663,8 +584,6 @@
     },
     "node_modules/@babel/plugin-syntax-class-static-block": {
       "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-class-static-block/-/plugin-syntax-class-static-block-7.14.5.tgz",
-      "integrity": "sha512-b+YyPmr6ldyNnM6sqYeMWE+bgJcJpO6yS4QD7ymxgH34GBPNDM/THBh8iunyvKIZztiwLH4CJZ0RxTk9emgpjw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -679,8 +598,6 @@
     },
     "node_modules/@babel/plugin-syntax-import-assertions": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.28.6.tgz",
-      "integrity": "sha512-pSJUpFHdx9z5nqTSirOCMtYVP2wFgoWhP0p3g8ONK/4IHhLIBd0B9NYqAvIUAhq+OkhO4VM1tENCt0cjlsNShw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -695,8 +612,6 @@
     },
     "node_modules/@babel/plugin-syntax-import-attributes": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.28.6.tgz",
-      "integrity": "sha512-jiLC0ma9XkQT3TKJ9uYvlakm66Pamywo+qwL+oL8HJOvc6TWdZXVfhqJr8CCzbSGUAbDOzlGHJC1U+vRfLQDvw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -711,8 +626,6 @@
     },
     "node_modules/@babel/plugin-syntax-import-meta": {
       "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-meta/-/plugin-syntax-import-meta-7.10.4.tgz",
-      "integrity": "sha512-Yqfm+XDx0+Prh3VSeEQCPU81yC+JWZ2pDPFSS4ZdpfZhp4MkFMaDC1UqseovEKwSUpnIL7+vK+Clp7bfh0iD7g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -724,8 +637,6 @@
     },
     "node_modules/@babel/plugin-syntax-json-strings": {
       "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.8.3.tgz",
-      "integrity": "sha512-lY6kdGpWHvjoe2vk4WrAapEuBR69EMxZl+RoGRhrFGNYVK8mOPAW8VfbT/ZgrFbXlDNiiaxQnAtgVCZ6jv30EA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -737,8 +648,6 @@
     },
     "node_modules/@babel/plugin-syntax-jsx": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.28.6.tgz",
-      "integrity": "sha512-wgEmr06G6sIpqr8YDwA2dSRTE3bJ+V0IfpzfSY3Lfgd7YWOaAdlykvJi13ZKBt8cZHfgH1IXN+CL656W3uUa4w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -753,8 +662,6 @@
     },
     "node_modules/@babel/plugin-syntax-logical-assignment-operators": {
       "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz",
-      "integrity": "sha512-d8waShlpFDinQ5MtvGU9xDAOzKH47+FFoney2baFIoMr952hKOLp1HR7VszoZvOsV/4+RRszNY7D17ba0te0ig==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -766,8 +673,6 @@
     },
     "node_modules/@babel/plugin-syntax-nullish-coalescing-operator": {
       "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-nullish-coalescing-operator/-/plugin-syntax-nullish-coalescing-operator-7.8.3.tgz",
-      "integrity": "sha512-aSff4zPII1u2QD7y+F8oDsz19ew4IGEJg9SVW+bqwpwtfFleiQDMdzA/R+UlWDzfnHFCxxleFT0PMIrR36XLNQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -779,8 +684,6 @@
     },
     "node_modules/@babel/plugin-syntax-numeric-separator": {
       "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.10.4.tgz",
-      "integrity": "sha512-9H6YdfkcK/uOnY/K7/aA2xpzaAgkQn37yzWUMRK7OaPOqOpGS1+n0H5hxT9AUw9EsSjPW8SVyMJwYRtWs3X3ug==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -792,8 +695,6 @@
     },
     "node_modules/@babel/plugin-syntax-object-rest-spread": {
       "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.8.3.tgz",
-      "integrity": "sha512-XoqMijGZb9y3y2XskN+P1wUGiVwWZ5JmoDRwx5+3GmEplNyVM2s2Dg8ILFQm8rWM48orGy5YpI5Bl8U1y7ydlA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -805,8 +706,6 @@
     },
     "node_modules/@babel/plugin-syntax-optional-catch-binding": {
       "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-optional-catch-binding/-/plugin-syntax-optional-catch-binding-7.8.3.tgz",
-      "integrity": "sha512-6VPD0Pc1lpTqw0aKoeRTMiB+kWhAoT24PA+ksWSBrFtl5SIRVpZlwN3NNPQjehA2E/91FV3RjLWoVTglWcSV3Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -818,8 +717,6 @@
     },
     "node_modules/@babel/plugin-syntax-optional-chaining": {
       "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-optional-chaining/-/plugin-syntax-optional-chaining-7.8.3.tgz",
-      "integrity": "sha512-KoK9ErH1MBlCPxV0VANkXW2/dw4vlbGDrFgz8bmUsBGYkFRcbRwMh6cIJubdPrkxRwuGdtCk0v/wPTKbQgBjkg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -831,8 +728,6 @@
     },
     "node_modules/@babel/plugin-syntax-private-property-in-object": {
       "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-private-property-in-object/-/plugin-syntax-private-property-in-object-7.14.5.tgz",
-      "integrity": "sha512-0wVnp9dxJ72ZUJDV27ZfbSj6iHLoytYZmh3rFcxNnvsJF3ktkzLDZPy/mA17HGsaQT3/DQsWYX1f1QGWkCoVUg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -847,8 +742,6 @@
     },
     "node_modules/@babel/plugin-syntax-top-level-await": {
       "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.14.5.tgz",
-      "integrity": "sha512-hx++upLv5U1rgYfwe1xBQUhRmU41NEvpUvrp8jkrSCdvGSnM5/qdRMtylJ6PG5OFkBaHkbTAKTnd3/YyESRHFw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -863,8 +756,6 @@
     },
     "node_modules/@babel/plugin-syntax-typescript": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.28.6.tgz",
-      "integrity": "sha512-+nDNmQye7nlnuuHDboPbGm00Vqg3oO8niRRL27/4LYHUsHYh0zJ1xWOz0uRwNFmM1Avzk8wZbc6rdiYhomzv/A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -879,8 +770,6 @@
     },
     "node_modules/@babel/plugin-syntax-unicode-sets-regex": {
       "version": "7.18.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-unicode-sets-regex/-/plugin-syntax-unicode-sets-regex-7.18.6.tgz",
-      "integrity": "sha512-727YkEAPwSIQTv5im8QHz3upqp92JTWhidIC81Tdx4VJYIte/VndKf1qKrfnnhPLiPghStWfvC/iFaMCQu7Nqg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -896,8 +785,6 @@
     },
     "node_modules/@babel/plugin-transform-arrow-functions": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.27.1.tgz",
-      "integrity": "sha512-8Z4TGic6xW70FKThA5HYEKKyBpOOsucTOD1DjU3fZxDg+K3zBJcXMFnt/4yQiZnf5+MiOMSXQ9PaEK/Ilh1DeA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -912,8 +799,6 @@
     },
     "node_modules/@babel/plugin-transform-async-generator-functions": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.29.0.tgz",
-      "integrity": "sha512-va0VdWro4zlBr2JsXC+ofCPB2iG12wPtVGTWFx2WLDOM3nYQZZIGP82qku2eW/JR83sD+k2k+CsNtyEbUqhU6w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -930,8 +815,6 @@
     },
     "node_modules/@babel/plugin-transform-async-to-generator": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.28.6.tgz",
-      "integrity": "sha512-ilTRcmbuXjsMmcZ3HASTe4caH5Tpo93PkTxF9oG2VZsSWsahydmcEHhix9Ik122RcTnZnUzPbmux4wh1swfv7g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -948,8 +831,6 @@
     },
     "node_modules/@babel/plugin-transform-block-scoped-functions": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.27.1.tgz",
-      "integrity": "sha512-cnqkuOtZLapWYZUYM5rVIdv1nXYuFVIltZ6ZJ7nIj585QsjKM5dhL2Fu/lICXZ1OyIAFc7Qy+bvDAtTXqGrlhg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -964,8 +845,6 @@
     },
     "node_modules/@babel/plugin-transform-block-scoping": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.28.6.tgz",
-      "integrity": "sha512-tt/7wOtBmwHPNMPu7ax4pdPz6shjFrmHDghvNC+FG9Qvj7D6mJcoRQIF5dy4njmxR941l6rgtvfSB2zX3VlUIw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -980,8 +859,6 @@
     },
     "node_modules/@babel/plugin-transform-class-properties": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.28.6.tgz",
-      "integrity": "sha512-dY2wS3I2G7D697VHndN91TJr8/AAfXQNt5ynCTI/MpxMsSzHp+52uNivYT5wCPax3whc47DR8Ba7cmlQMg24bw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -997,8 +874,6 @@
     },
     "node_modules/@babel/plugin-transform-class-static-block": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.28.6.tgz",
-      "integrity": "sha512-rfQ++ghVwTWTqQ7w8qyDxL1XGihjBss4CmTgGRCTAC9RIbhVpyp4fOeZtta0Lbf+dTNIVJer6ych2ibHwkZqsQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1014,8 +889,6 @@
     },
     "node_modules/@babel/plugin-transform-classes": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.28.6.tgz",
-      "integrity": "sha512-EF5KONAqC5zAqT783iMGuM2ZtmEBy+mJMOKl2BCvPZ2lVrwvXnB6o+OBWCS+CoeCCpVRF2sA2RBKUxvT8tQT5Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1035,8 +908,6 @@
     },
     "node_modules/@babel/plugin-transform-computed-properties": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.28.6.tgz",
-      "integrity": "sha512-bcc3k0ijhHbc2lEfpFHgx7eYw9KNXqOerKWfzbxEHUGKnS3sz9C4CNL9OiFN1297bDNfUiSO7DaLzbvHQQQ1BQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1052,8 +923,6 @@
     },
     "node_modules/@babel/plugin-transform-destructuring": {
       "version": "7.28.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.28.5.tgz",
-      "integrity": "sha512-Kl9Bc6D0zTUcFUvkNuQh4eGXPKKNDOJQXVyyM4ZAQPMveniJdxi8XMJwLo+xSoW3MIq81bD33lcUe9kZpl0MCw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1069,8 +938,6 @@
     },
     "node_modules/@babel/plugin-transform-dotall-regex": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.28.6.tgz",
-      "integrity": "sha512-SljjowuNKB7q5Oayv4FoPzeB74g3QgLt8IVJw9ADvWy3QnUb/01aw8I4AVv8wYnPvQz2GDDZ/g3GhcNyDBI4Bg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1086,8 +953,6 @@
     },
     "node_modules/@babel/plugin-transform-duplicate-keys": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.27.1.tgz",
-      "integrity": "sha512-MTyJk98sHvSs+cvZ4nOauwTTG1JeonDjSGvGGUNHreGQns+Mpt6WX/dVzWBHgg+dYZhkC4X+zTDfkTU+Vy9y7Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1102,8 +967,6 @@
     },
     "node_modules/@babel/plugin-transform-duplicate-named-capturing-groups-regex": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-named-capturing-groups-regex/-/plugin-transform-duplicate-named-capturing-groups-regex-7.29.0.tgz",
-      "integrity": "sha512-zBPcW2lFGxdiD8PUnPwJjag2J9otbcLQzvbiOzDxpYXyCuYX9agOwMPGn1prVH0a4qzhCKu24rlH4c1f7yA8rw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1119,8 +982,6 @@
     },
     "node_modules/@babel/plugin-transform-dynamic-import": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.27.1.tgz",
-      "integrity": "sha512-MHzkWQcEmjzzVW9j2q8LGjwGWpG2mjwaaB0BNQwst3FIjqsg8Ct/mIZlvSPJvfi9y2AC8mi/ktxbFVL9pZ1I4A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1135,8 +996,6 @@
     },
     "node_modules/@babel/plugin-transform-explicit-resource-management": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-explicit-resource-management/-/plugin-transform-explicit-resource-management-7.28.6.tgz",
-      "integrity": "sha512-Iao5Konzx2b6g7EPqTy40UZbcdXE126tTxVFr/nAIj+WItNxjKSYTEw3RC+A2/ZetmdJsgueL1KhaMCQHkLPIg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1152,8 +1011,6 @@
     },
     "node_modules/@babel/plugin-transform-exponentiation-operator": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.28.6.tgz",
-      "integrity": "sha512-WitabqiGjV/vJ0aPOLSFfNY1u9U3R7W36B03r5I2KoNix+a3sOhJ3pKFB3R5It9/UiK78NiO0KE9P21cMhlPkw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1168,8 +1025,6 @@
     },
     "node_modules/@babel/plugin-transform-export-namespace-from": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.27.1.tgz",
-      "integrity": "sha512-tQvHWSZ3/jH2xuq/vZDy0jNn+ZdXJeM8gHvX4lnJmsc3+50yPlWdZXIc5ay+umX+2/tJIqHqiEqcJvxlmIvRvQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1184,8 +1039,6 @@
     },
     "node_modules/@babel/plugin-transform-for-of": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.27.1.tgz",
-      "integrity": "sha512-BfbWFFEJFQzLCQ5N8VocnCtA8J1CLkNTe2Ms2wocj75dd6VpiqS5Z5quTYcUoo4Yq+DN0rtikODccuv7RU81sw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1201,8 +1054,6 @@
     },
     "node_modules/@babel/plugin-transform-function-name": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.27.1.tgz",
-      "integrity": "sha512-1bQeydJF9Nr1eBCMMbC+hdwmRlsv5XYOMu03YSWFwNs0HsAmtSxxF1fyuYPqemVldVyFmlCU7w8UE14LupUSZQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1219,8 +1070,6 @@
     },
     "node_modules/@babel/plugin-transform-json-strings": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.28.6.tgz",
-      "integrity": "sha512-Nr+hEN+0geQkzhbdgQVPoqr47lZbm+5fCUmO70722xJZd0Mvb59+33QLImGj6F+DkK3xgDi1YVysP8whD6FQAw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1235,8 +1084,6 @@
     },
     "node_modules/@babel/plugin-transform-literals": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.27.1.tgz",
-      "integrity": "sha512-0HCFSepIpLTkLcsi86GG3mTUzxV5jpmbv97hTETW3yzrAij8aqlD36toB1D0daVFJM8NK6GvKO0gslVQmm+zZA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1251,8 +1098,6 @@
     },
     "node_modules/@babel/plugin-transform-logical-assignment-operators": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.28.6.tgz",
-      "integrity": "sha512-+anKKair6gpi8VsM/95kmomGNMD0eLz1NQ8+Pfw5sAwWH9fGYXT50E55ZpV0pHUHWf6IUTWPM+f/7AAff+wr9A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1267,8 +1112,6 @@
     },
     "node_modules/@babel/plugin-transform-member-expression-literals": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.27.1.tgz",
-      "integrity": "sha512-hqoBX4dcZ1I33jCSWcXrP+1Ku7kdqXf1oeah7ooKOIiAdKQ+uqftgCFNOSzA5AMS2XIHEYeGFg4cKRCdpxzVOQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1283,8 +1126,6 @@
     },
     "node_modules/@babel/plugin-transform-modules-amd": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.27.1.tgz",
-      "integrity": "sha512-iCsytMg/N9/oFq6n+gFTvUYDZQOMK5kEdeYxmxt91fcJGycfxVP9CnrxoliM0oumFERba2i8ZtwRUCMhvP1LnA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1300,8 +1141,6 @@
     },
     "node_modules/@babel/plugin-transform-modules-commonjs": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.28.6.tgz",
-      "integrity": "sha512-jppVbf8IV9iWWwWTQIxJMAJCWBuuKx71475wHwYytrRGQ2CWiDvYlADQno3tcYpS/T2UUWFQp3nVtYfK/YBQrA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1317,8 +1156,6 @@
     },
     "node_modules/@babel/plugin-transform-modules-systemjs": {
       "version": "7.29.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.29.4.tgz",
-      "integrity": "sha512-N7QmZ0xRZfjHOfZeQLJjwgX2zS9pdGHSVl/cjSGlo4dXMqvurfxXDMKY4RqEKzPozV78VMcd0lxyG13mlbKc4w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1336,8 +1173,6 @@
     },
     "node_modules/@babel/plugin-transform-modules-umd": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.27.1.tgz",
-      "integrity": "sha512-iQBE/xC5BV1OxJbp6WG7jq9IWiD+xxlZhLrdwpPkTX3ydmXdvoCpyfJN7acaIBZaOqTfr76pgzqBJflNbeRK+w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1353,8 +1188,6 @@
     },
     "node_modules/@babel/plugin-transform-named-capturing-groups-regex": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.29.0.tgz",
-      "integrity": "sha512-1CZQA5KNAD6ZYQLPw7oi5ewtDNxH/2vuCh+6SmvgDfhumForvs8a1o9n0UrEoBD8HU4djO2yWngTQlXl1NDVEQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1370,8 +1203,6 @@
     },
     "node_modules/@babel/plugin-transform-new-target": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.27.1.tgz",
-      "integrity": "sha512-f6PiYeqXQ05lYq3TIfIDu/MtliKUbNwkGApPUvyo6+tc7uaR4cPjPe7DFPr15Uyycg2lZU6btZ575CuQoYh7MQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1386,8 +1217,6 @@
     },
     "node_modules/@babel/plugin-transform-nullish-coalescing-operator": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.28.6.tgz",
-      "integrity": "sha512-3wKbRgmzYbw24mDJXT7N+ADXw8BC/imU9yo9c9X9NKaLF1fW+e5H1U5QjMUBe4Qo4Ox/o++IyUkl1sVCLgevKg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1402,8 +1231,6 @@
     },
     "node_modules/@babel/plugin-transform-numeric-separator": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.28.6.tgz",
-      "integrity": "sha512-SJR8hPynj8outz+SlStQSwvziMN4+Bq99it4tMIf5/Caq+3iOc0JtKyse8puvyXkk3eFRIA5ID/XfunGgO5i6w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1418,8 +1245,6 @@
     },
     "node_modules/@babel/plugin-transform-object-rest-spread": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.28.6.tgz",
-      "integrity": "sha512-5rh+JR4JBC4pGkXLAcYdLHZjXudVxWMXbB6u6+E9lRL5TrGVbHt1TjxGbZ8CkmYw9zjkB7jutzOROArsqtncEA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1438,8 +1263,6 @@
     },
     "node_modules/@babel/plugin-transform-object-super": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.27.1.tgz",
-      "integrity": "sha512-SFy8S9plRPbIcxlJ8A6mT/CxFdJx/c04JEctz4jf8YZaVS2px34j7NXRrlGlHkN/M2gnpL37ZpGRGVFLd3l8Ng==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1455,8 +1278,6 @@
     },
     "node_modules/@babel/plugin-transform-optional-catch-binding": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.28.6.tgz",
-      "integrity": "sha512-R8ja/Pyrv0OGAvAXQhSTmWyPJPml+0TMqXlO5w+AsMEiwb2fg3WkOvob7UxFSL3OIttFSGSRFKQsOhJ/X6HQdQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1471,8 +1292,6 @@
     },
     "node_modules/@babel/plugin-transform-optional-chaining": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.28.6.tgz",
-      "integrity": "sha512-A4zobikRGJTsX9uqVFdafzGkqD30t26ck2LmOzAuLL8b2x6k3TIqRiT2xVvA9fNmFeTX484VpsdgmKNA0bS23w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1488,8 +1307,6 @@
     },
     "node_modules/@babel/plugin-transform-parameters": {
       "version": "7.27.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.27.7.tgz",
-      "integrity": "sha512-qBkYTYCb76RRxUM6CcZA5KRu8K4SM8ajzVeUgVdMVO9NN9uI/GaVmBg/WKJJGnNokV9SY8FxNOVWGXzqzUidBg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1504,8 +1321,6 @@
     },
     "node_modules/@babel/plugin-transform-private-methods": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.28.6.tgz",
-      "integrity": "sha512-piiuapX9CRv7+0st8lmuUlRSmX6mBcVeNQ1b4AYzJxfCMuBfB0vBXDiGSmm03pKJw1v6cZ8KSeM+oUnM6yAExg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1521,8 +1336,6 @@
     },
     "node_modules/@babel/plugin-transform-private-property-in-object": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.28.6.tgz",
-      "integrity": "sha512-b97jvNSOb5+ehyQmBpmhOCiUC5oVK4PMnpRvO7+ymFBoqYjeDHIU9jnrNUuwHOiL9RpGDoKBpSViarV+BU+eVA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1539,8 +1352,6 @@
     },
     "node_modules/@babel/plugin-transform-property-literals": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.27.1.tgz",
-      "integrity": "sha512-oThy3BCuCha8kDZ8ZkgOg2exvPYUlprMukKQXI1r1pJ47NCvxfkEy8vK+r/hT9nF0Aa4H1WUPZZjHTFtAhGfmQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1555,8 +1366,6 @@
     },
     "node_modules/@babel/plugin-transform-regenerator": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.29.0.tgz",
-      "integrity": "sha512-FijqlqMA7DmRdg/aINBSs04y8XNTYw/lr1gJ2WsmBnnaNw1iS43EPkJW+zK7z65auG3AWRFXWj+NcTQwYptUog==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1571,8 +1380,6 @@
     },
     "node_modules/@babel/plugin-transform-regexp-modifiers": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regexp-modifiers/-/plugin-transform-regexp-modifiers-7.28.6.tgz",
-      "integrity": "sha512-QGWAepm9qxpaIs7UM9FvUSnCGlb8Ua1RhyM4/veAxLwt3gMat/LSGrZixyuj4I6+Kn9iwvqCyPTtbdxanYoWYg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1588,8 +1395,6 @@
     },
     "node_modules/@babel/plugin-transform-reserved-words": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.27.1.tgz",
-      "integrity": "sha512-V2ABPHIJX4kC7HegLkYoDpfg9PVmuWy/i6vUM5eGK22bx4YVFD3M5F0QQnWQoDs6AGsUWTVOopBiMFQgHaSkVw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1604,8 +1409,6 @@
     },
     "node_modules/@babel/plugin-transform-shorthand-properties": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.27.1.tgz",
-      "integrity": "sha512-N/wH1vcn4oYawbJ13Y/FxcQrWk63jhfNa7jef0ih7PHSIHX2LB7GWE1rkPrOnka9kwMxb6hMl19p7lidA+EHmQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1620,8 +1423,6 @@
     },
     "node_modules/@babel/plugin-transform-spread": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.28.6.tgz",
-      "integrity": "sha512-9U4QObUC0FtJl05AsUcodau/RWDytrU6uKgkxu09mLR9HLDAtUMoPuuskm5huQsoktmsYpI+bGmq+iapDcriKA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1637,8 +1438,6 @@
     },
     "node_modules/@babel/plugin-transform-sticky-regex": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.27.1.tgz",
-      "integrity": "sha512-lhInBO5bi/Kowe2/aLdBAawijx+q1pQzicSgnkB6dUPc1+RC8QmJHKf2OjvU+NZWitguJHEaEmbV6VWEouT58g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1653,8 +1452,6 @@
     },
     "node_modules/@babel/plugin-transform-template-literals": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.27.1.tgz",
-      "integrity": "sha512-fBJKiV7F2DxZUkg5EtHKXQdbsbURW3DZKQUWphDum0uRP6eHGGa/He9mc0mypL680pb+e/lDIthRohlv8NCHkg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1669,8 +1466,6 @@
     },
     "node_modules/@babel/plugin-transform-typeof-symbol": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.27.1.tgz",
-      "integrity": "sha512-RiSILC+nRJM7FY5srIyc4/fGIwUhyDuuBSdWn4y6yT6gm652DpCHZjIipgn6B7MQ1ITOUnAKWixEUjQRIBIcLw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1685,8 +1480,6 @@
     },
     "node_modules/@babel/plugin-transform-typescript": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.28.6.tgz",
-      "integrity": "sha512-0YWL2RFxOqEm9Efk5PvreamxPME8OyY0wM5wh5lHjF+VtVhdneCWGzZeSqzOfiobVqQaNCd2z0tQvnI9DaPWPw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1705,8 +1498,6 @@
     },
     "node_modules/@babel/plugin-transform-unicode-escapes": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.27.1.tgz",
-      "integrity": "sha512-Ysg4v6AmF26k9vpfFuTZg8HRfVWzsh1kVfowA23y9j/Gu6dOuahdUVhkLqpObp3JIv27MLSii6noRnuKN8H0Mg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1721,8 +1512,6 @@
     },
     "node_modules/@babel/plugin-transform-unicode-property-regex": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.28.6.tgz",
-      "integrity": "sha512-4Wlbdl/sIZjzi/8St0evF0gEZrgOswVO6aOzqxh1kDZOl9WmLrHq2HtGhnOJZmHZYKP8WZ1MDLCt5DAWwRo57A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1738,8 +1527,6 @@
     },
     "node_modules/@babel/plugin-transform-unicode-regex": {
       "version": "7.27.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.27.1.tgz",
-      "integrity": "sha512-xvINq24TRojDuyt6JGtHmkVkrfVV3FPT16uytxImLeBZqW3/H52yN+kM1MGuyPkIQxrzKwPHs5U/MP3qKyzkGw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1755,8 +1542,6 @@
     },
     "node_modules/@babel/plugin-transform-unicode-sets-regex": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.28.6.tgz",
-      "integrity": "sha512-/wHc/paTUmsDYN7SZkpWxogTOBNnlx7nBQYfy6JJlCT7G3mVhltk3e++N7zV0XfgGsrqBxd4rJQt9H16I21Y1Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1772,8 +1557,6 @@
     },
     "node_modules/@babel/preset-env": {
       "version": "7.29.5",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.29.5.tgz",
-      "integrity": "sha512-/69t2aEzGKHD76DyLbHysF/QH2LJOB8iFnYO37unDTKBTubzcMRv0f3H5EiN1Q6ajOd/eB7dAInF0qdFVS06kA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1858,8 +1641,6 @@
     },
     "node_modules/@babel/preset-modules": {
       "version": "0.1.6-no-external-plugins",
-      "resolved": "https://registry.npmjs.org/@babel/preset-modules/-/preset-modules-0.1.6-no-external-plugins.tgz",
-      "integrity": "sha512-HrcgcIESLm9aIR842yhJ5RWan/gebQUJ6E/E5+rf0y9o6oj7w0Br+sWuL6kEQ/o/AdfvR1Je9jG18/gnpwjEyA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1873,8 +1654,6 @@
     },
     "node_modules/@babel/preset-typescript": {
       "version": "7.28.5",
-      "resolved": "https://registry.npmjs.org/@babel/preset-typescript/-/preset-typescript-7.28.5.tgz",
-      "integrity": "sha512-+bQy5WOI2V6LJZpPVxY+yp66XdZ2yifu0Mc1aP5CQKgjn4QM5IN2i5fAZ4xKop47pr8rpVhiAeu+nDQa12C8+g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1893,8 +1672,6 @@
     },
     "node_modules/@babel/runtime": {
       "version": "7.29.2",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.29.2.tgz",
-      "integrity": "sha512-JiDShH45zKHWyGe4ZNVRrCjBz8Nh9TMmZG1kh4QTK8hCBTWBi8Da+i7s1fJw7/lYpM4ccepSNfqzZ/QvABBi5g==",
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -1902,8 +1679,6 @@
     },
     "node_modules/@babel/template": {
       "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.28.6.tgz",
-      "integrity": "sha512-YA6Ma2KsCdGb+WC6UpBVFJGXL58MDA6oyONbjyF/+5sBgxY/dwkhLogbMT2GXXyU84/IhRw/2D1Os1B/giz+BQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1917,8 +1692,6 @@
     },
     "node_modules/@babel/traverse": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.29.0.tgz",
-      "integrity": "sha512-4HPiQr0X7+waHfyXPZpWPfWL/J7dcN1mx9gL6WdQVMbPnF3+ZhSMs8tCxN7oHddJE9fhNE7+lxdnlyemKfJRuA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1936,8 +1709,6 @@
     },
     "node_modules/@babel/types": {
       "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.29.0.tgz",
-      "integrity": "sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1950,15 +1721,11 @@
     },
     "node_modules/@bcoe/v8-coverage": {
       "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz",
-      "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@bramus/specificity": {
       "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/@bramus/specificity/-/specificity-2.4.2.tgz",
-      "integrity": "sha512-ctxtJ/eA+t+6q2++vj5j7FYX3nRu311q1wfYH3xjlLOsczhlhxAg2FWNUXhpGvAw3BWo1xBcvOV6/YLc2r5FJw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1970,8 +1737,6 @@
     },
     "node_modules/@csstools/color-helpers": {
       "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-6.0.2.tgz",
-      "integrity": "sha512-LMGQLS9EuADloEFkcTBR3BwV/CGHV7zyDxVRtVDTwdI2Ca4it0CCVTT9wCkxSgokjE5Ho41hEPgb8OEUwoXr6Q==",
       "dev": true,
       "funding": [
         {
@@ -1990,8 +1755,6 @@
     },
     "node_modules/@csstools/css-calc": {
       "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-3.2.1.tgz",
-      "integrity": "sha512-DtdHlgXh5ZkA43cwBcAm+huzgJiwx3ZTWVjBs94kwz2xKqSimDA3lBgCjphYgwgVUMWatSM0pDd8TILB1yrVVg==",
       "dev": true,
       "funding": [
         {
@@ -2014,8 +1777,6 @@
     },
     "node_modules/@csstools/css-color-parser": {
       "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-4.1.1.tgz",
-      "integrity": "sha512-eZ5XOtyhK+mggRafYUWzA0tvaYOFgdY8AkgQiCJF9qNAePnUo/zmsqqYubBBb3sQ8uNUaSKTY9s9klfRaAXL0g==",
       "dev": true,
       "funding": [
         {
@@ -2042,8 +1803,6 @@
     },
     "node_modules/@csstools/css-parser-algorithms": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-4.0.0.tgz",
-      "integrity": "sha512-+B87qS7fIG3L5h3qwJ/IFbjoVoOe/bpOdh9hAjXbvx0o8ImEmUsGXN0inFOnk2ChCFgqkkGFQ+TpM5rbhkKe4w==",
       "dev": true,
       "funding": [
         {
@@ -2065,8 +1824,6 @@
     },
     "node_modules/@csstools/css-syntax-patches-for-csstree": {
       "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/@csstools/css-syntax-patches-for-csstree/-/css-syntax-patches-for-csstree-1.1.4.tgz",
-      "integrity": "sha512-wgsqt92b7C7tQhIdPNxj0n9zuUbQlvAuI1exyzeNrOKOi62SD7ren8zqszmpVREjAOqg8cD2FqYhQfAuKjk4sw==",
       "dev": true,
       "funding": [
         {
@@ -2090,8 +1847,6 @@
     },
     "node_modules/@csstools/css-tokenizer": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-4.0.0.tgz",
-      "integrity": "sha512-QxULHAm7cNu72w97JUNCBFODFaXpbDg+dP8b/oWFAZ2MTRppA3U00Y2L1HqaS4J6yBqxwa/Y3nMBaxVKbB/NsA==",
       "dev": true,
       "funding": [
         {
@@ -2110,8 +1865,6 @@
     },
     "node_modules/@digitalbazaar/http-client": {
       "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/@digitalbazaar/http-client/-/http-client-4.3.0.tgz",
-      "integrity": "sha512-6lMpxpt9BOmqHKGs9Xm6DP4LlZTBFer/ZjHvP3FcW3IaUWYIWC7dw5RFZnvw4fP57kAVcm1dp3IF+Y50qhBvAw==",
       "license": "BSD-3-Clause",
       "dependencies": {
         "ky": "^1.14.2",
@@ -2123,8 +1876,6 @@
     },
     "node_modules/@digitalbazaar/http-client/node_modules/undici": {
       "version": "6.25.0",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-6.25.0.tgz",
-      "integrity": "sha512-ZgpWDC5gmNiuY9CnLVXEH8rl50xhRCuLNA97fAUnKi8RRuV4E6KG31pDTsLVUKnohJE0I3XDrTeEydAXRw47xg==",
       "license": "MIT",
       "engines": {
         "node": ">=18.17"
@@ -2132,8 +1883,6 @@
     },
     "node_modules/@discoveryjs/json-ext": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-1.1.0.tgz",
-      "integrity": "sha512-Xc3VhU02wqZ1HvHRJUwL09HkZSTvidqY5Ya0NXBSYOxAp+Ln9dcJr9fySI+CkONzP3PekQo9WdzCv0PGER/mOA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2176,8 +1925,6 @@
     },
     "node_modules/@eslint-community/eslint-utils": {
       "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz",
-      "integrity": "sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2195,8 +1942,6 @@
     },
     "node_modules/@eslint-community/regexpp": {
       "version": "4.12.2",
-      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.2.tgz",
-      "integrity": "sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2205,8 +1950,6 @@
     },
     "node_modules/@eslint/config-array": {
       "version": "0.21.2",
-      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.2.tgz",
-      "integrity": "sha512-nJl2KGTlrf9GjLimgIru+V/mzgSK0ABCDQRvxw5BjURL7WfH5uoWmizbH7QB6MmnMBd8cIC9uceWnezL1VZWWw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -2220,15 +1963,11 @@
     },
     "node_modules/@eslint/config-array/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@eslint/config-array/node_modules/brace-expansion": {
       "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.14.tgz",
-      "integrity": "sha512-MWPGfDxnyzKU7rNOW9SP/c50vi3xrmrua/+6hfPbCS2ABNWfx24vPidzvC7krjU/RTo235sV776ymlsMtGKj8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2238,8 +1977,6 @@
     },
     "node_modules/@eslint/config-array/node_modules/minimatch": {
       "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -2251,8 +1988,6 @@
     },
     "node_modules/@eslint/config-helpers": {
       "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.4.2.tgz",
-      "integrity": "sha512-gBrxN88gOIf3R7ja5K9slwNayVcZgK6SOUORm2uBzTeIEfeVaIhOpCtTox3P6R7o2jLFwLFTLnC7kU/RGcYEgw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -2264,8 +1999,6 @@
     },
     "node_modules/@eslint/core": {
       "version": "0.17.0",
-      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.17.0.tgz",
-      "integrity": "sha512-yL/sLrpmtDaFEiUj1osRP4TI2MDz1AddJL+jZ7KSqvBuliN4xqYY54IfdN8qD8Toa6g1iloph1fxQNkjOxrrpQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -2277,8 +2010,6 @@
     },
     "node_modules/@eslint/eslintrc": {
       "version": "3.3.5",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.5.tgz",
-      "integrity": "sha512-4IlJx0X0qftVsN5E+/vGujTRIFtwuLbNsVUe7TO6zYPDR1O6nFwvwhIKEKSrl6dZchmYBITazxKoUYOjdtjlRg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2301,22 +2032,16 @@
     },
     "node_modules/@eslint/eslintrc/node_modules/argparse": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
-      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
       "dev": true,
       "license": "Python-2.0"
     },
     "node_modules/@eslint/eslintrc/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@eslint/eslintrc/node_modules/brace-expansion": {
       "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.14.tgz",
-      "integrity": "sha512-MWPGfDxnyzKU7rNOW9SP/c50vi3xrmrua/+6hfPbCS2ABNWfx24vPidzvC7krjU/RTo235sV776ymlsMtGKj8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2326,8 +2051,6 @@
     },
     "node_modules/@eslint/eslintrc/node_modules/ignore": {
       "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
-      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2336,8 +2059,6 @@
     },
     "node_modules/@eslint/eslintrc/node_modules/js-yaml": {
       "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
-      "integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2349,8 +2070,6 @@
     },
     "node_modules/@eslint/eslintrc/node_modules/minimatch": {
       "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -2362,8 +2081,6 @@
     },
     "node_modules/@eslint/js": {
       "version": "9.39.4",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.4.tgz",
-      "integrity": "sha512-nE7DEIchvtiFTwBw4Lfbu59PG+kCofhjsKaCWzxTpt4lfRjRMqG6uMBzKXuEcyXhOHoUp9riAm7/aWYGhXZ9cw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2375,8 +2092,6 @@
     },
     "node_modules/@eslint/object-schema": {
       "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.7.tgz",
-      "integrity": "sha512-VtAOaymWVfZcmZbp6E2mympDIHvyjXs/12LqWYjVw6qjrfF+VK+fyG33kChz3nnK+SU5/NeHOqrTEHS8sXO3OA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -2385,8 +2100,6 @@
     },
     "node_modules/@eslint/plugin-kit": {
       "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.4.1.tgz",
-      "integrity": "sha512-43/qtrDUokr7LJqoF2c3+RInu/t4zfrpYdoSDfYyhg52rwLV6TnOvdG4fXm7IkSB3wErkcmJS9iEhjVtOSEjjA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -2399,8 +2112,6 @@
     },
     "node_modules/@exodus/bytes": {
       "version": "1.15.0",
-      "resolved": "https://registry.npmjs.org/@exodus/bytes/-/bytes-1.15.0.tgz",
-      "integrity": "sha512-UY0nlA+feH81UGSHv92sLEPLCeZFjXOuHhrIo0HQydScuQc8s0A7kL/UdgwgDq8g8ilksmuoF35YVTNphV2aBQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2417,8 +2128,6 @@
     },
     "node_modules/@frogcat/ttl2jsonld": {
       "version": "0.0.10",
-      "resolved": "https://registry.npmjs.org/@frogcat/ttl2jsonld/-/ttl2jsonld-0.0.10.tgz",
-      "integrity": "sha512-0NLM96V3ziZkkOlhixSZiXe8CzewECVNtSj04s2hW2e65SgzQPzM12VWSovuRIy+2UJA2Bjkf9405yrty9tgcg==",
       "license": "MIT",
       "bin": {
         "ttl2jsonld": "bin/cli.js"
@@ -2426,8 +2135,6 @@
     },
     "node_modules/@humanfs/core": {
       "version": "0.19.2",
-      "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.2.tgz",
-      "integrity": "sha512-UhXNm+CFMWcbChXywFwkmhqjs3PRCmcSa/hfBgLIb7oQ5HNb1wS0icWsGtSAUNgefHeI+eBrA8I1fxmbHsGdvA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -2439,8 +2146,6 @@
     },
     "node_modules/@humanfs/node": {
       "version": "0.16.8",
-      "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.8.tgz",
-      "integrity": "sha512-gE1eQNZ3R++kTzFUpdGlpmy8kDZD/MLyHqDwqjkVQI0JMdI1D51sy1H958PNXYkM2rAac7e5/CnIKZrHtPh3BQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -2454,8 +2159,6 @@
     },
     "node_modules/@humanfs/types": {
       "version": "0.15.0",
-      "resolved": "https://registry.npmjs.org/@humanfs/types/-/types-0.15.0.tgz",
-      "integrity": "sha512-ZZ1w0aoQkwuUuC7Yf+7sdeaNfqQiiLcSRbfI08oAxqLtpXQr9AIVX7Ay7HLDuiLYAaFPu8oBYNq/QIi9URHJ3Q==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -2464,8 +2167,6 @@
     },
     "node_modules/@humanwhocodes/module-importer": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
-      "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -2478,8 +2179,6 @@
     },
     "node_modules/@humanwhocodes/retry": {
       "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.3.tgz",
-      "integrity": "sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -2531,8 +2230,6 @@
     },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
-      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -2549,8 +2246,6 @@
     },
     "node_modules/@isaacs/cliui/node_modules/ansi-regex": {
       "version": "6.2.2",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.2.tgz",
-      "integrity": "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2562,8 +2257,6 @@
     },
     "node_modules/@isaacs/cliui/node_modules/ansi-styles": {
       "version": "6.2.3",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
-      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2575,15 +2268,11 @@
     },
     "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
       "version": "9.2.2",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
-      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@isaacs/cliui/node_modules/string-width": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
-      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2600,8 +2289,6 @@
     },
     "node_modules/@isaacs/cliui/node_modules/strip-ansi": {
       "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.2.0.tgz",
-      "integrity": "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2616,8 +2303,6 @@
     },
     "node_modules/@isaacs/cliui/node_modules/wrap-ansi": {
       "version": "8.1.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
-      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2634,8 +2319,6 @@
     },
     "node_modules/@istanbuljs/load-nyc-config": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@istanbuljs/load-nyc-config/-/load-nyc-config-1.1.0.tgz",
-      "integrity": "sha512-VjeHSlIzpv/NyD3N0YuHfXOPDIixcA1q2ZV98wsMqcYlPmv2n3Yb2lYP9XMElnaFVXg5A7YLTeLu6V84uQDjmQ==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -2651,8 +2334,6 @@
     },
     "node_modules/@istanbuljs/load-nyc-config/node_modules/find-up": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
-      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2665,8 +2346,6 @@
     },
     "node_modules/@istanbuljs/load-nyc-config/node_modules/locate-path": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
-      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2678,8 +2357,6 @@
     },
     "node_modules/@istanbuljs/load-nyc-config/node_modules/p-limit": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
-      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2694,8 +2371,6 @@
     },
     "node_modules/@istanbuljs/load-nyc-config/node_modules/p-locate": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
-      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2707,8 +2382,6 @@
     },
     "node_modules/@istanbuljs/schema": {
       "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/@istanbuljs/schema/-/schema-0.1.6.tgz",
-      "integrity": "sha512-+Sg6GCR/wy1oSmQDFq4LQDAhm3ETKnorxN+y5nbLULOR3P0c14f2Wurzj3/xqPXtasLFfHd5iRFQ7AJt4KH2cw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2717,8 +2390,6 @@
     },
     "node_modules/@jest/console": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/console/-/console-30.4.1.tgz",
-      "integrity": "sha512-v3bhyxUh9Hgmo5p6hAOXe14/R3ZxZDOsvHleh4B07z3m/x4/ngPUXEm9XwK4sF4u+f+P2ORb0Ge+MgpaqRMVDA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2735,8 +2406,6 @@
     },
     "node_modules/@jest/console/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2745,8 +2414,6 @@
     },
     "node_modules/@jest/core": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/@jest/core/-/core-30.4.2.tgz",
-      "integrity": "sha512-TZJA6cPJUFxoWhxaLo8t0VX/MZX2wPWr0uIDvLSHIvN4gu9h02vSzqI2kBADG1ExqQlC+cY09xKMSreivvrChQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2793,8 +2460,6 @@
     },
     "node_modules/@jest/core/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2806,8 +2471,6 @@
     },
     "node_modules/@jest/core/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2822,8 +2485,6 @@
     },
     "node_modules/@jest/core/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2832,8 +2493,6 @@
     },
     "node_modules/@jest/diff-sequences": {
       "version": "30.4.0",
-      "resolved": "https://registry.npmjs.org/@jest/diff-sequences/-/diff-sequences-30.4.0.tgz",
-      "integrity": "sha512-zOpzlfUs45l6u7jm39qr87JCHUDsaeCtvL+kQe/Vn9jSnRB4/5IPXISm0h9I1vZW/o00Kn4UTJ2MOlhnUGwv3g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2842,8 +2501,6 @@
     },
     "node_modules/@jest/environment": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/environment/-/environment-30.4.1.tgz",
-      "integrity": "sha512-AK9yNRqgKxiabqMoe4oW+3/TSSeV8vkdC7BGaxZdU0AFXfOpofTLqdru2GXKZghP3sdgwE9XXpnVwfZ8JnFV4w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2858,8 +2515,6 @@
     },
     "node_modules/@jest/environment-jsdom-abstract": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/environment-jsdom-abstract/-/environment-jsdom-abstract-30.4.1.tgz",
-      "integrity": "sha512-dSlKrqug3siYNHVnjwIldShY12wAH3spwRltO/+8VOjg0X+xEq7vOs3DbBs4LRKsu7OH+NUb9kuZUNBF9Ho3TA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2886,8 +2541,6 @@
     },
     "node_modules/@jest/expect": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/expect/-/expect-30.4.1.tgz",
-      "integrity": "sha512-ginrj6TMgh2GshLUGCjO94Ptx9HhdZA/I6A9iUfyeLKFtdAjnKzHDgzgP9HYQgbxM1lbXScQ2eUBz2lGeVDPWA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2900,8 +2553,6 @@
     },
     "node_modules/@jest/expect-utils": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/expect-utils/-/expect-utils-30.4.1.tgz",
-      "integrity": "sha512-ZBn5CglH8fBsQsvs4VWNzD4aWfUYks+IdOOQU3MEK71ol/BcVm+P+rtb1KpiFBpSWSCE27uOahyyf1vfqOVbcQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2913,8 +2564,6 @@
     },
     "node_modules/@jest/fake-timers": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-30.4.1.tgz",
-      "integrity": "sha512-iW5umdmfPeWzehrVhugFQZqCchSCud5S1l2YT0O9ZhjRR0ExclANDZkiSBwzqtnlOn0J1JXvO+HZ6rkuyOVOgQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2931,8 +2580,6 @@
     },
     "node_modules/@jest/get-type": {
       "version": "30.1.0",
-      "resolved": "https://registry.npmjs.org/@jest/get-type/-/get-type-30.1.0.tgz",
-      "integrity": "sha512-eMbZE2hUnx1WV0pmURZY9XoXPkUYjpc55mb0CrhtdWLtzMQPFvu/rZkTLZFTsdaVQa+Tr4eWAteqcUzoawq/uA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -2941,8 +2588,6 @@
     },
     "node_modules/@jest/globals": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/globals/-/globals-30.4.1.tgz",
-      "integrity": "sha512-ZbuY4cmXC8DkxYjfvT2DbcHWL2T6vmsMhXCDcmTB2T0y0gaezBI77ufq5ZAIdcRkYZ7NEQEDg1xFeKbxUJ5v5Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2957,8 +2602,6 @@
     },
     "node_modules/@jest/pattern": {
       "version": "30.4.0",
-      "resolved": "https://registry.npmjs.org/@jest/pattern/-/pattern-30.4.0.tgz",
-      "integrity": "sha512-RAWn3+f9u8BsHijKJ71uHcFp6vmyEt6VvoWXkl6hKF3qVIuWNmudVjg12DlBPGup/frIl5UcUlH5HfEuvHpEXg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2971,8 +2614,6 @@
     },
     "node_modules/@jest/reporters": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/reporters/-/reporters-30.4.1.tgz",
-      "integrity": "sha512-/SnkPCzEQpUaBH81kjdEdDdo2WZl5hxw+BmLDGWjRkm8o7XlhjwsU36cqwe5PGBE5WYpBvDzRSdXx9rbGuJtNA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3014,15 +2655,11 @@
     },
     "node_modules/@jest/reporters/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@jest/reporters/node_modules/brace-expansion": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.1.0.tgz",
-      "integrity": "sha512-TN1kCZAgdgweJhWWpgKYrQaMNHcDULHkWwQIspdtjV4Y5aurRdZpjAqn6yX3FPqTA9ngHCc4hJxMAMgGfve85w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3031,9 +2668,6 @@
     },
     "node_modules/@jest/reporters/node_modules/glob": {
       "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -3053,8 +2687,6 @@
     },
     "node_modules/@jest/reporters/node_modules/minimatch": {
       "version": "9.0.9",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
-      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -3069,8 +2701,6 @@
     },
     "node_modules/@jest/reporters/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -3079,8 +2709,6 @@
     },
     "node_modules/@jest/schemas": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-30.4.1.tgz",
-      "integrity": "sha512-i6b4qw5qnP8c5FEeBJg/uZQ4ddrkN6Ca8qISJh0pr7a5hfn3h3v5x60BEbOC7OYAGZNMs1LfFLwnW2CuK8F57Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3092,8 +2720,6 @@
     },
     "node_modules/@jest/snapshot-utils": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/snapshot-utils/-/snapshot-utils-30.4.1.tgz",
-      "integrity": "sha512-ObY4ljvQ95mt6iwKtVLetR/4yXiAgl3H4nJxhztr0MTjrN97TwDYrnCp/kF60Ec9HdhkWTHSu+Hg05aXfngpOA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3108,8 +2734,6 @@
     },
     "node_modules/@jest/source-map": {
       "version": "30.0.1",
-      "resolved": "https://registry.npmjs.org/@jest/source-map/-/source-map-30.0.1.tgz",
-      "integrity": "sha512-MIRWMUUR3sdbP36oyNyhbThLHyJ2eEDClPCiHVbrYAe5g3CHRArIVpBw7cdSB5fr+ofSfIb2Tnsw8iEHL0PYQg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3123,8 +2747,6 @@
     },
     "node_modules/@jest/test-result": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/test-result/-/test-result-30.4.1.tgz",
-      "integrity": "sha512-/ZG7pgEiOmmWkN9TplKbOu4id2N5lh7FHwRwlkgBVAzGdRH+OkkQ8wX/kIxg4zmd3ZQvAL1RwL2yWsvNYYECTw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3139,8 +2761,6 @@
     },
     "node_modules/@jest/test-sequencer": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/test-sequencer/-/test-sequencer-30.4.1.tgz",
-      "integrity": "sha512-PeYE+4td5rKjoRPxztObrXU+H8hsjZfxKMXOcmrr34JerSyB/ROOxbbicz8B7A5j9R9VayDnVPvBmedqCsFCdw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3155,8 +2775,6 @@
     },
     "node_modules/@jest/test-sequencer/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -3165,8 +2783,6 @@
     },
     "node_modules/@jest/transform": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/transform/-/transform-30.4.1.tgz",
-      "integrity": "sha512-Wz0LyktlTvRefoymh+n64hQ84KNXsRGcwdoZ8CSa0Ea+fgYcHZlnk+hDP7v2MS7il2bQ5uTEIxf4/NNfhMN4KQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3191,8 +2807,6 @@
     },
     "node_modules/@jest/transform/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -3201,8 +2815,6 @@
     },
     "node_modules/@jest/types": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/@jest/types/-/types-30.4.1.tgz",
-      "integrity": "sha512-f1x/vJXIfjOlEmejYpbkbgw1gOqpPECwMvMEtBqe47j7H2Hg8h8w3o3ikhSXq3MI15kg+oQ0exWO0uCtTNJLoQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3220,8 +2832,6 @@
     },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.3.13",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
-      "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3231,8 +2841,6 @@
     },
     "node_modules/@jridgewell/remapping": {
       "version": "2.3.5",
-      "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
-      "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3242,8 +2850,6 @@
     },
     "node_modules/@jridgewell/resolve-uri": {
       "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
-      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -3252,8 +2858,6 @@
     },
     "node_modules/@jridgewell/source-map": {
       "version": "0.3.11",
-      "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.11.tgz",
-      "integrity": "sha512-ZMp1V8ZFcPG5dIWnQLr3NSI1MiCU7UETdS/A0G8V/XWHvJv3ZsFqutJn1Y5RPmAPX6F3BiE397OqveU/9NCuIA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3263,15 +2867,11 @@
     },
     "node_modules/@jridgewell/sourcemap-codec": {
       "version": "1.5.5",
-      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
-      "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@jridgewell/trace-mapping": {
       "version": "0.3.31",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz",
-      "integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3281,8 +2881,6 @@
     },
     "node_modules/@jsonjoy.com/base64": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/base64/-/base64-1.1.2.tgz",
-      "integrity": "sha512-q6XAnWQDIMA3+FTiOYajoYqySkO+JSat0ytXGSuRdq9uXE7o92gzuQwQM14xaCRlBLGq3v5miDGC4vkVTn54xA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3298,8 +2896,6 @@
     },
     "node_modules/@jsonjoy.com/buffers": {
       "version": "17.67.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/buffers/-/buffers-17.67.0.tgz",
-      "integrity": "sha512-tfExRpYxBvi32vPs9ZHaTjSP4fHAfzSmcahOfNxtvGHcyJel+aibkPlGeBB+7AoC6hL7lXIE++8okecBxx7lcw==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3315,8 +2911,6 @@
     },
     "node_modules/@jsonjoy.com/codegen": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/codegen/-/codegen-1.0.0.tgz",
-      "integrity": "sha512-E8Oy+08cmCf0EK/NMxpaJZmOxPqM+6iSe2S4nlSBrPZOORoDJILxtbSUEDKQyTamm/BVAhIGllOBNU79/dwf0g==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3332,8 +2926,6 @@
     },
     "node_modules/@jsonjoy.com/fs-core": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-core/-/fs-core-4.57.2.tgz",
-      "integrity": "sha512-SVjwklkpIV5wrynpYtuYnfYH1QF4/nDuLBX7VXdb+3miglcAgBVZb/5y0cOsehRV/9Vb+3UqhkMq3/NR3ztdkQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3354,8 +2946,6 @@
     },
     "node_modules/@jsonjoy.com/fs-fsa": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-fsa/-/fs-fsa-4.57.2.tgz",
-      "integrity": "sha512-fhO8+iR2I+OCw668ISDJdn1aArc9zx033sWejIyzQ8RBeXa9bDSaUeA3ix0poYOfrj1KdOzytmYNv2/uLDfV6g==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3377,8 +2967,6 @@
     },
     "node_modules/@jsonjoy.com/fs-node": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-node/-/fs-node-4.57.2.tgz",
-      "integrity": "sha512-nX2AdL6cOFwLdju9G4/nbRnYevmCJbh7N7hvR3gGm97Cs60uEjyd0rpR+YBS7cTg175zzl22pGKXR5USaQMvKg==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3403,8 +2991,6 @@
     },
     "node_modules/@jsonjoy.com/fs-node-builtins": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-node-builtins/-/fs-node-builtins-4.57.2.tgz",
-      "integrity": "sha512-xhiegylRmhw43Ki2HO1ZBL7DQ5ja/qpRsL29VtQ2xuUHiuDGbgf2uD4p9Qd8hJI5P6RCtGYD50IXHXVq/Ocjcg==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3420,8 +3006,6 @@
     },
     "node_modules/@jsonjoy.com/fs-node-to-fsa": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-node-to-fsa/-/fs-node-to-fsa-4.57.2.tgz",
-      "integrity": "sha512-18LmWTSONhoAPW+IWRuf8w/+zRolPFGPeGwMxlAhhfY11EKzX+5XHDBPAw67dBF5dxDErHJbl40U+3IXSDRXSQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3442,8 +3026,6 @@
     },
     "node_modules/@jsonjoy.com/fs-node-utils": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-node-utils/-/fs-node-utils-4.57.2.tgz",
-      "integrity": "sha512-rsPSJgekz43IlNbLyAM/Ab+ouYLWGp5DDBfYBNNEqDaSpsbXfthBn29Q4muFA9L0F+Z3mKo+CWlgSCXrf+mOyQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3462,8 +3044,6 @@
     },
     "node_modules/@jsonjoy.com/fs-print": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-print/-/fs-print-4.57.2.tgz",
-      "integrity": "sha512-wK9NSow48i4DbDl9F1CQE5TqnyZOJ04elU3WFG5aJ76p+YxO/ulyBBQvKsessPxdo381Bc2pcEoyPujMOhcRqQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3483,8 +3063,6 @@
     },
     "node_modules/@jsonjoy.com/fs-snapshot": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/fs-snapshot/-/fs-snapshot-4.57.2.tgz",
-      "integrity": "sha512-GdduDZuoP5V/QCgJkx9+BZ6SC0EZ/smXAdTS7PfMqgMTGXLlt/bH/FqMYaqB9JmLf05sJPtO0XRbAwwkEEPbVw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3506,8 +3084,6 @@
     },
     "node_modules/@jsonjoy.com/fs-snapshot/node_modules/@jsonjoy.com/base64": {
       "version": "17.67.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/base64/-/base64-17.67.0.tgz",
-      "integrity": "sha512-5SEsJGsm15aP8TQGkDfJvz9axgPwAEm98S5DxOuYe8e1EbfajcDmgeXXzccEjh+mLnjqEKrkBdjHWS5vFNwDdw==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3523,8 +3099,6 @@
     },
     "node_modules/@jsonjoy.com/fs-snapshot/node_modules/@jsonjoy.com/codegen": {
       "version": "17.67.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/codegen/-/codegen-17.67.0.tgz",
-      "integrity": "sha512-idnkUplROpdBOV0HMcwhsCUS5TRUi9poagdGs70A6S4ux9+/aPuKbh8+UYRTLYQHtXvAdNfQWXDqZEx5k4Dj2Q==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3540,8 +3114,6 @@
     },
     "node_modules/@jsonjoy.com/fs-snapshot/node_modules/@jsonjoy.com/json-pack": {
       "version": "17.67.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pack/-/json-pack-17.67.0.tgz",
-      "integrity": "sha512-t0ejURcGaZsn1ClbJ/3kFqSOjlryd92eQY465IYrezsXmPcfHPE/av4twRSxf6WE+TkZgLY+71vCZbiIiFKA/w==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3567,8 +3139,6 @@
     },
     "node_modules/@jsonjoy.com/fs-snapshot/node_modules/@jsonjoy.com/json-pointer": {
       "version": "17.67.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pointer/-/json-pointer-17.67.0.tgz",
-      "integrity": "sha512-+iqOFInH+QZGmSuaybBUNdh7yvNrXvqR+h3wjXm0N/3JK1EyyFAeGJvqnmQL61d1ARLlk/wJdFKSL+LHJ1eaUA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3587,8 +3157,6 @@
     },
     "node_modules/@jsonjoy.com/fs-snapshot/node_modules/@jsonjoy.com/util": {
       "version": "17.67.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/util/-/util-17.67.0.tgz",
-      "integrity": "sha512-6+8xBaz1rLSohlGh68D1pdw3AwDi9xydm8QNlAFkvnavCJYSze+pxoW2VKP8p308jtlMRLs5NTHfPlZLd4w7ew==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3608,8 +3176,6 @@
     },
     "node_modules/@jsonjoy.com/json-pack": {
       "version": "1.21.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pack/-/json-pack-1.21.0.tgz",
-      "integrity": "sha512-+AKG+R2cfZMShzrF2uQw34v3zbeDYUqnQ+jg7ORic3BGtfw9p/+N6RJbq/kkV8JmYZaINknaEQ2m0/f693ZPpg==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3635,8 +3201,6 @@
     },
     "node_modules/@jsonjoy.com/json-pack/node_modules/@jsonjoy.com/buffers": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/buffers/-/buffers-1.2.1.tgz",
-      "integrity": "sha512-12cdlDwX4RUM3QxmUbVJWqZ/mrK6dFQH4Zxq6+r1YXKXYBNgZXndx2qbCJwh3+WWkCSn67IjnlG3XYTvmvYtgA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3652,8 +3216,6 @@
     },
     "node_modules/@jsonjoy.com/json-pointer": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pointer/-/json-pointer-1.0.2.tgz",
-      "integrity": "sha512-Fsn6wM2zlDzY1U+v4Nc8bo3bVqgfNTGcn6dMgs6FjrEnt4ZCe60o6ByKRjOGlI2gow0aE/Q41QOigdTqkyK5fg==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3673,8 +3235,6 @@
     },
     "node_modules/@jsonjoy.com/util": {
       "version": "1.9.0",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/util/-/util-1.9.0.tgz",
-      "integrity": "sha512-pLuQo+VPRnN8hfPqUTLTHk126wuYdXVxE6aDmjSeV4NCAgyxWbiOIeNJVtID3h1Vzpoi9m4jXezf73I6LgabgQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -3694,8 +3254,6 @@
     },
     "node_modules/@jsonjoy.com/util/node_modules/@jsonjoy.com/buffers": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/buffers/-/buffers-1.2.1.tgz",
-      "integrity": "sha512-12cdlDwX4RUM3QxmUbVJWqZ/mrK6dFQH4Zxq6+r1YXKXYBNgZXndx2qbCJwh3+WWkCSn67IjnlG3XYTvmvYtgA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -3711,8 +3269,6 @@
     },
     "node_modules/@leichtgewicht/ip-codec": {
       "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz",
-      "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==",
       "dev": true,
       "license": "MIT"
     },
@@ -3748,8 +3304,6 @@
     },
     "node_modules/@nicolo-ribaudo/chokidar-2": {
       "version": "2.1.8-no-fsevents.3",
-      "resolved": "https://registry.npmjs.org/@nicolo-ribaudo/chokidar-2/-/chokidar-2-2.1.8-no-fsevents.3.tgz",
-      "integrity": "sha512-s88O1aVtXftvp5bCPB7WnmXc5IwOZZ7YPuwNPt+GtOOXpPvad1LfbmjYv+qII7zP6RU2QGnqve27dnLycEnyEQ==",
       "dev": true,
       "license": "MIT",
       "optional": true
@@ -3785,8 +3339,6 @@
     },
     "node_modules/@peculiar/asn1-cms": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-cms/-/asn1-cms-2.7.0.tgz",
-      "integrity": "sha512-hew63shtzzvBcSHbhm+cyAmKe6AIfinT9hzEqSPjDC6opTTMKmTkQ0gHuN2KsWlvqiKw1S/fS94fhag/FJkioQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3799,8 +3351,6 @@
     },
     "node_modules/@peculiar/asn1-csr": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-csr/-/asn1-csr-2.7.0.tgz",
-      "integrity": "sha512-VVsAyGqErT9D1SY4aEqozThXMVI+ssVRiv2DDeYuvpBKLIgZ3hYs3Ay3u/VSoKq6ESFi9cf6rf3IOOzfwh7oMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3812,8 +3362,6 @@
     },
     "node_modules/@peculiar/asn1-ecc": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-ecc/-/asn1-ecc-2.7.0.tgz",
-      "integrity": "sha512-n7KEs/Q/wrB415cxy4fHOBhegp4NdJ15fkJPwcB/3/8iNBQC2L/N7SChJPKDJPZGYH0jD4Tg4/0vnHmwghnbKw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3825,8 +3373,6 @@
     },
     "node_modules/@peculiar/asn1-pfx": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-pfx/-/asn1-pfx-2.7.0.tgz",
-      "integrity": "sha512-V/nrlQVmhg7lYAsM7E13UDL5erAwFv6kCIVFqNaMIHSVi7dngcT839JkRTkQBqznMG98l2XjxYk74ZztAohZzA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3840,8 +3386,6 @@
     },
     "node_modules/@peculiar/asn1-pkcs8": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-pkcs8/-/asn1-pkcs8-2.7.0.tgz",
-      "integrity": "sha512-9GTl1nE8Mx1kTZ+7QyYatDyKsm34QcWRBFkY1iPvWC3X4Dona5s/tlLiQsx5WzVdZqiMBZNYT0buyw4/vbhnjw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3853,8 +3397,6 @@
     },
     "node_modules/@peculiar/asn1-pkcs9": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-pkcs9/-/asn1-pkcs9-2.7.0.tgz",
-      "integrity": "sha512-Bh7m+OuIaSEllPQcSd9OSp93F4ROWH7sbITWV8MI+8dwsjE5111/87VxiWVvYFKyww3vp39geLv9ENqhwWHcew==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3870,8 +3412,6 @@
     },
     "node_modules/@peculiar/asn1-rsa": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-rsa/-/asn1-rsa-2.7.0.tgz",
-      "integrity": "sha512-/qvENQrXyTZURjMqSeofHul0JJt2sNSzSwk36pl2olkHbaioMQgrASDZAlHXl0xUlnVbHj0uGgOrBMTb5x2aJQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3883,8 +3423,6 @@
     },
     "node_modules/@peculiar/asn1-schema": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-schema/-/asn1-schema-2.7.0.tgz",
-      "integrity": "sha512-W8ZfWzLmQnrcky+eh3tni4IozMdqBDiHWU0N+vve/UGjMaUs8c0L7A2oEdkBXS8rTpWDpK/aoI3DG/L/hxmxPg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3895,8 +3433,6 @@
     },
     "node_modules/@peculiar/asn1-x509": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-x509/-/asn1-x509-2.7.0.tgz",
-      "integrity": "sha512-mUn9RRrkGDnG4ALfunDmzyRW5dg+sWCj/pfnCCqEHYbkGxEpvUt6iVJv8Yw1cyp6SWZ26ZE5oSmI5SqEaen15g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3908,8 +3444,6 @@
     },
     "node_modules/@peculiar/asn1-x509-attr": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/@peculiar/asn1-x509-attr/-/asn1-x509-attr-2.7.0.tgz",
-      "integrity": "sha512-NS8e7SOgXipkzUPLF/sce7ukpMpWjhxYsH0n6Y+bHYo4TTxOb95Zv7hqwSuL212mj5YxovjdOKQOgH1As3E94w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3921,8 +3455,6 @@
     },
     "node_modules/@peculiar/utils": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/@peculiar/utils/-/utils-2.0.3.tgz",
-      "integrity": "sha512-+oL3HPFRIZ1St2K50lWCXiioIgSoxzz7R1J3uF6neO2yl1sgmpgY6XXJH4BdpoDkMWznQTeYF6oWNDZLCdQ4eQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3931,8 +3463,6 @@
     },
     "node_modules/@peculiar/x509": {
       "version": "1.14.3",
-      "resolved": "https://registry.npmjs.org/@peculiar/x509/-/x509-1.14.3.tgz",
-      "integrity": "sha512-C2Xj8FZ0uHWeCXXqX5B4/gVFQmtSkiuOolzAgutjTfseNOHT3pUjljDZsTSxXFGgio54bCzVFqmEOUrIVk8RDA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3954,8 +3484,6 @@
     },
     "node_modules/@pkgjs/parseargs": {
       "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
-      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
       "dev": true,
       "license": "MIT",
       "optional": true,
@@ -3965,8 +3493,6 @@
     },
     "node_modules/@pkgr/core": {
       "version": "0.2.9",
-      "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.2.9.tgz",
-      "integrity": "sha512-QNqXyfVS2wm9hweSYD2O7F0G06uurj9kZ96TRQE5Y9hU7+tgdZwIkbAKc5Ocy1HxEY2kuDQa6cQ1WRs/O5LFKA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -3978,8 +3504,6 @@
     },
     "node_modules/@rdfjs/types": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/@rdfjs/types/-/types-2.0.1.tgz",
-      "integrity": "sha512-uyAzpugX7KekAXAHq26m3JlUIZJOC0uSBhpnefGV5i15bevDyyejoB7I+9MKeUrzXD8OOUI3+4FeV1wwQr5ihA==",
       "license": "MIT",
       "dependencies": {
         "@types/node": "*"
@@ -3987,15 +3511,11 @@
     },
     "node_modules/@sinclair/typebox": {
       "version": "0.34.49",
-      "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.34.49.tgz",
-      "integrity": "sha512-brySQQs7Jtn0joV8Xh9ZV/hZb9Ozb0pmazDIASBkYKCjXrXU3mpcFahmK/z4YDhGkQvP9mWJbVyahdtU5wQA+A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@sinonjs/commons": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz",
-      "integrity": "sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -4004,18 +3524,38 @@
     },
     "node_modules/@sinonjs/fake-timers": {
       "version": "15.4.0",
-      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-15.4.0.tgz",
-      "integrity": "sha512-DsG+8/LscQIQg68J6Ef3dv10u6nVyetYn923s3/sus5eaGfTo1of5WMZSLf0UJc9KDuKPilPH0UDJCjvNbDNCA==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
         "@sinonjs/commons": "^3.0.1"
       }
     },
+    "node_modules/@solid-data-modules/contacts-rdflib": {
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/@solid-data-modules/contacts-rdflib/-/contacts-rdflib-0.7.1.tgz",
+      "integrity": "sha512-jjSVCyXjOdMlPEdTysboLg1Tc8E3jDFlbEIv7mjnNkFK61UdI/BfnNPT5XnNSUSiZYBZklUwsniJhclFhoZmBw==",
+      "license": "MIT",
+      "dependencies": {
+        "@solid-data-modules/rdflib-utils": "^0.2.0"
+      },
+      "peerDependencies": {
+        "rdflib": "2.x"
+      }
+    },
+    "node_modules/@solid-data-modules/rdflib-utils": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/@solid-data-modules/rdflib-utils/-/rdflib-utils-0.2.0.tgz",
+      "integrity": "sha512-WXpyiMmgmeeTHUz/jFGGBy02GxClxT2uew3eUWh/XOQQQeOxlzYFRO0tOa3Nv9/3Y1qcAyS7tSaW5x42Q8WPLQ==",
+      "license": "MIT",
+      "dependencies": {
+        "short-unique-id": "^5.2.0"
+      },
+      "peerDependencies": {
+        "rdflib": "2.x"
+      }
+    },
     "node_modules/@testing-library/dom": {
       "version": "10.4.1",
-      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz",
-      "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4034,8 +3574,6 @@
     },
     "node_modules/@testing-library/jest-dom": {
       "version": "6.9.1",
-      "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.9.1.tgz",
-      "integrity": "sha512-zIcONa+hVtVSSep9UT3jZ5rizo2BsxgyDYU7WFD5eICBE7no3881HGeb/QkGfsJs6JTkY1aQhT7rIPC7e+0nnA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4054,8 +3592,6 @@
     },
     "node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api": {
       "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz",
-      "integrity": "sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==",
       "dev": true,
       "license": "MIT"
     },
@@ -4072,15 +3608,11 @@
     },
     "node_modules/@types/aria-query": {
       "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
-      "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
-      "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
-      "integrity": "sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4093,8 +3625,6 @@
     },
     "node_modules/@types/babel__generator": {
       "version": "7.27.0",
-      "resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.27.0.tgz",
-      "integrity": "sha512-ufFd2Xi92OAVPYsy+P4n7/U7e68fex0+Ee8gSG9KX7eo084CWiQ4sdxktvdl0bOPupXtVJPY19zk6EwWqUQ8lg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4103,8 +3633,6 @@
     },
     "node_modules/@types/babel__template": {
       "version": "7.4.4",
-      "resolved": "https://registry.npmjs.org/@types/babel__template/-/babel__template-7.4.4.tgz",
-      "integrity": "sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4114,8 +3642,6 @@
     },
     "node_modules/@types/babel__traverse": {
       "version": "7.28.0",
-      "resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.28.0.tgz",
-      "integrity": "sha512-8PvcXf70gTDZBgt9ptxJ8elBeBjcLOAcOtoO/mPJjtji1+CdGbHgm77om1GrsPxsiE+uXIpNSK64UYaIwQXd4Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4124,8 +3650,6 @@
     },
     "node_modules/@types/body-parser": {
       "version": "1.19.6",
-      "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.6.tgz",
-      "integrity": "sha512-HLFeCYgz89uk22N5Qg3dvGvsv46B8GLvKKo1zKG4NybA8U2DiEO3w9lqGg29t/tfLRJpJ6iQxnVw4OnB7MoM9g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4135,8 +3659,6 @@
     },
     "node_modules/@types/bonjour": {
       "version": "3.5.13",
-      "resolved": "https://registry.npmjs.org/@types/bonjour/-/bonjour-3.5.13.tgz",
-      "integrity": "sha512-z9fJ5Im06zvUL548KvYNecEVlA7cVDkGUi6kZusb04mpyEFKCIZJvloCcmpmLaIahDpOQGHaHmG6imtPMmPXGQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4145,8 +3667,6 @@
     },
     "node_modules/@types/connect": {
       "version": "3.4.38",
-      "resolved": "https://registry.npmjs.org/@types/connect/-/connect-3.4.38.tgz",
-      "integrity": "sha512-K6uROf1LD88uDQqJCktA4yzL1YYAK6NgfsI0v/mTgyPKWsX1CnJ0XPSDhViejru1GcRkLWb8RlzFYJRqGUbaug==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4155,8 +3675,6 @@
     },
     "node_modules/@types/connect-history-api-fallback": {
       "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/@types/connect-history-api-fallback/-/connect-history-api-fallback-1.5.4.tgz",
-      "integrity": "sha512-n6Cr2xS1h4uAulPRdlw6Jl6s1oG8KrVilPN2yUITEs+K48EzMJJ3W1xy8K5eWuFvjp3R74AOIGSmp2UfBJ8HFw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4166,8 +3684,6 @@
     },
     "node_modules/@types/eslint": {
       "version": "9.6.1",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-9.6.1.tgz",
-      "integrity": "sha512-FXx2pKgId/WyYo2jXw63kk7/+TY7u7AziEJxJAnSFzHlqTAS3Ync6SvgYAN/k4/PQpnnVuzoMuVnByKK2qp0ag==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4177,8 +3693,6 @@
     },
     "node_modules/@types/eslint-scope": {
       "version": "3.7.7",
-      "resolved": "https://registry.npmjs.org/@types/eslint-scope/-/eslint-scope-3.7.7.tgz",
-      "integrity": "sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4188,15 +3702,11 @@
     },
     "node_modules/@types/estree": {
       "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.9.tgz",
-      "integrity": "sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/express": {
       "version": "4.17.25",
-      "resolved": "https://registry.npmjs.org/@types/express/-/express-4.17.25.tgz",
-      "integrity": "sha512-dVd04UKsfpINUnK0yBoYHDF3xu7xVH4BuDotC/xGuycx4CgbP48X/KF/586bcObxT0HENHXEU8Nqtu6NR+eKhw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4208,8 +3718,6 @@
     },
     "node_modules/@types/express-serve-static-core": {
       "version": "4.19.8",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.19.8.tgz",
-      "integrity": "sha512-02S5fmqeoKzVZCHPZid4b8JH2eM5HzQLZWN2FohQEy/0eXTq8VXZfSN6Pcr3F6N9R/vNrj7cpgbhjie6m/1tCA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4221,22 +3729,16 @@
     },
     "node_modules/@types/html-minifier-terser": {
       "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz",
-      "integrity": "sha512-oh/6byDPnL1zeNXFrDXFLyZjkr1MsBG667IM792caf1L2UPOOMf65NFzjUH/ltyfwjAGfs1rsX1eftK0jC/KIg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/http-errors": {
       "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/@types/http-errors/-/http-errors-2.0.5.tgz",
-      "integrity": "sha512-r8Tayk8HJnX0FztbZN7oVqGccWgw98T/0neJphO91KkmOzug1KkofZURD4UaD5uH8AqcFLfdPErnBod0u71/qg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/http-proxy": {
       "version": "1.17.17",
-      "resolved": "https://registry.npmjs.org/@types/http-proxy/-/http-proxy-1.17.17.tgz",
-      "integrity": "sha512-ED6LB+Z1AVylNTu7hdzuBqOgMnvG/ld6wGCG8wFnAzKX5uyW2K3WD52v0gnLCTK/VLpXtKckgWuyScYK6cSPaw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4245,15 +3747,11 @@
     },
     "node_modules/@types/istanbul-lib-coverage": {
       "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.6.tgz",
-      "integrity": "sha512-2QF/t/auWm0lsy8XtKVPG19v3sSOQlJe/YHZgfjb/KBBHOGSV+J2q/S671rcq9uTBrLAXmZpqJiaQbMT+zNU1w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/istanbul-lib-report": {
       "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-report/-/istanbul-lib-report-3.0.3.tgz",
-      "integrity": "sha512-NQn7AHQnk/RSLOxrBbGyJM/aVQ+pjj5HCgasFxc0K/KhoATfQ/47AyUl15I2yBUpihjmas+a+VJBOqecrFH+uA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4262,8 +3760,6 @@
     },
     "node_modules/@types/istanbul-reports": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/@types/istanbul-reports/-/istanbul-reports-3.0.4.tgz",
-      "integrity": "sha512-pk2B1NWalF9toCRu6gjBzR69syFjP4Od8WRAX+0mmf9lAjCRicLOWc+ZrxZHx/0XRjotgkF9t6iaMJ+aXcOdZQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4272,8 +3768,6 @@
     },
     "node_modules/@types/jest": {
       "version": "30.0.0",
-      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-30.0.0.tgz",
-      "integrity": "sha512-XTYugzhuwqWjws0CVz8QpM36+T+Dz5mTEBKhNs/esGLnCIlGdRy+Dq78NRjd7ls7r8BC8ZRMOrKlkO1hU0JOwA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4283,8 +3777,6 @@
     },
     "node_modules/@types/jest/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -4296,8 +3788,6 @@
     },
     "node_modules/@types/jest/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4312,8 +3802,6 @@
     },
     "node_modules/@types/jsdom": {
       "version": "21.1.7",
-      "resolved": "https://registry.npmjs.org/@types/jsdom/-/jsdom-21.1.7.tgz",
-      "integrity": "sha512-yOriVnggzrnQ3a9OKOCxaVuSug3w3/SbOj5i7VwXWZEyUNl3bLF9V3MfxGbZKuwqJOQyRfqXyROBB1CoZLFWzA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4324,22 +3812,16 @@
     },
     "node_modules/@types/json-schema": {
       "version": "7.0.15",
-      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
-      "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/mime": {
       "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.5.tgz",
-      "integrity": "sha512-/pyBZWSLD2n0dcHE3hq8s8ZvcETHtEuF+3E7XVt0Ig2nvsVQXdghHVcEkIWjy9A0wKfTn97a/PSDYohKIlnP/w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/node": {
       "version": "25.8.0",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-25.8.0.tgz",
-      "integrity": "sha512-TCFSk8IZh+iLX1xtksoBVtdmgL+1IX0fC9BeU4QqFSuNdN/K+HUlhqOzEmSYYpZUVsLYcPqc9KX+60iDuninSQ==",
       "license": "MIT",
       "dependencies": {
         "undici-types": ">=7.24.0 <7.24.7"
@@ -4347,29 +3829,21 @@
     },
     "node_modules/@types/qs": {
       "version": "6.15.1",
-      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.15.1.tgz",
-      "integrity": "sha512-GZHUBZR9hckSUhrxmp1nG6NwdpM9fCunJwyThLW1X3AyHgd9IlHb6VANpQQqDr2o/qQp6McZ3y/IA2rVzKzSbw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/range-parser": {
       "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/@types/range-parser/-/range-parser-1.2.7.tgz",
-      "integrity": "sha512-hKormJbkJqzQGhziax5PItDUTMAM9uE2XXQmM37dyd4hVM+5aVl7oVxMVUiVQn2oCQFN/LKCZdvSM0pFRqbSmQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/retry": {
       "version": "0.12.2",
-      "resolved": "https://registry.npmjs.org/@types/retry/-/retry-0.12.2.tgz",
-      "integrity": "sha512-XISRgDJ2Tc5q4TRqvgJtzsRkFYNJzZrhTdtMoGVBttwzzQJkPnS3WWTFc7kuDRoPtPakl+T+OfdEUjYJj7Jbow==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/send": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@types/send/-/send-1.2.1.tgz",
-      "integrity": "sha512-arsCikDvlU99zl1g69TcAB3mzZPpxgw0UQnaHeC1Nwb015xp8bknZv5rIfri9xTOcMuaVgvabfIRA7PSZVuZIQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4378,8 +3852,6 @@
     },
     "node_modules/@types/serve-index": {
       "version": "1.9.4",
-      "resolved": "https://registry.npmjs.org/@types/serve-index/-/serve-index-1.9.4.tgz",
-      "integrity": "sha512-qLpGZ/c2fhSs5gnYsQxtDEq3Oy8SXPClIXkW5ghvAvsNuVSA8k+gCONcUCS/UjLEYvYps+e8uBtfgXgvhwfNug==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4388,8 +3860,6 @@
     },
     "node_modules/@types/serve-static": {
       "version": "1.15.10",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.10.tgz",
-      "integrity": "sha512-tRs1dB+g8Itk72rlSI2ZrW6vZg0YrLI81iQSTkMmOqnqCaNr/8Ek4VwWcN5vZgCYWbg/JJSGBlUaYGAOP73qBw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4400,8 +3870,6 @@
     },
     "node_modules/@types/serve-static/node_modules/@types/send": {
       "version": "0.17.6",
-      "resolved": "https://registry.npmjs.org/@types/send/-/send-0.17.6.tgz",
-      "integrity": "sha512-Uqt8rPBE8SY0RK8JB1EzVOIZ32uqy8HwdxCnoCOsYrvnswqmFZ/k+9Ikidlk/ImhsdvBsloHbAlewb2IEBV/Og==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4411,8 +3879,6 @@
     },
     "node_modules/@types/sockjs": {
       "version": "0.3.36",
-      "resolved": "https://registry.npmjs.org/@types/sockjs/-/sockjs-0.3.36.tgz",
-      "integrity": "sha512-MK9V6NzAS1+Ud7JV9lJLFqW85VbC9dq3LmwZCuBe4wBDgKC0Kj/jd8Xl+nSviU+Qc3+m7umHHyHg//2KSa0a0Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4421,28 +3887,20 @@
     },
     "node_modules/@types/stack-utils": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.3.tgz",
-      "integrity": "sha512-9aEbYZ3TbYMznPdcdr3SmIrLXwC/AKZXQeCf9Pgao5CKb8CyHuEX5jzWPTkvregvhRJHcpRO6BFoGW9ycaOkYw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/tough-cookie": {
       "version": "4.0.5",
-      "resolved": "https://registry.npmjs.org/@types/tough-cookie/-/tough-cookie-4.0.5.tgz",
-      "integrity": "sha512-/Ad8+nIOV7Rl++6f1BdKxFSMgmoqEoYbHRpPcx3JEfv8VRsQe9Z4mCXeJBzxs7mbHY/XOZZuXlRNfhpVPbs6ZA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@types/trusted-types": {
       "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
-      "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
       "license": "MIT"
     },
     "node_modules/@types/ws": {
       "version": "8.18.1",
-      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.18.1.tgz",
-      "integrity": "sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4451,8 +3909,6 @@
     },
     "node_modules/@types/yargs": {
       "version": "17.0.35",
-      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.35.tgz",
-      "integrity": "sha512-qUHkeCyQFxMXg79wQfTtfndEC+N9ZZg76HJftDJp+qH2tV7Gj4OJi7l+PiWwJ+pWtW8GwSmqsDj/oymhrTWXjg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4461,15 +3917,11 @@
     },
     "node_modules/@types/yargs-parser": {
       "version": "21.0.3",
-      "resolved": "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-21.0.3.tgz",
-      "integrity": "sha512-I4q9QU9MQv4oEOz4tAHJtNz1cwuLxn2F3xcc2iV5WdqLPpUnj30aUuxt1mAxYTG+oe8CZMV/+6rU4S4gRDzqtQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.59.3.tgz",
-      "integrity": "sha512-PwFvSKsXGShKGW6n5bZOhGHEcCZXM8HofLK9fNsEwZXzFRjoY+XT1Vsf1zgyXdwTr0ZYz1/2tkZ0DBTT9jZjhw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4497,8 +3949,6 @@
     },
     "node_modules/@typescript-eslint/parser": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.59.3.tgz",
-      "integrity": "sha512-HPwA+hVkfcriajbNvTmZv4VRauibay+cWArYUYq7u7W7PmGShMxbPxLvrwDme55a6d5alG3nrYfhyJ/G28XlLg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4522,8 +3972,6 @@
     },
     "node_modules/@typescript-eslint/project-service": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.59.3.tgz",
-      "integrity": "sha512-ECiUWa/KYRGDFUqTNehaRgzDshnJfkTABJxVemHk4ko22gcr0ukloKjWvyQ64g8YCV/UI47kN1dbmjf/GaQYng==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4544,8 +3992,6 @@
     },
     "node_modules/@typescript-eslint/scope-manager": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.59.3.tgz",
-      "integrity": "sha512-t2LvZnoEfzKtnPjgeEu41xw5gxq9mQVfYy4OoZ4Vlt0sk3JwxmhCca/AR7DwOiHrjWgjAj6as4AhRLKSDfvZIA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4562,8 +4008,6 @@
     },
     "node_modules/@typescript-eslint/tsconfig-utils": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.59.3.tgz",
-      "integrity": "sha512-PcIJHjmaREXLgIAIzLnSY9VucEzz8FKXsRgFa1DmdGCK/5tJpW03TKJF01Q6VZd1lLdz2sIKPWaDUZN9dp//dw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -4579,8 +4023,6 @@
     },
     "node_modules/@typescript-eslint/type-utils": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.59.3.tgz",
-      "integrity": "sha512-g71d8QD8UaiHGvrJwyIS1hCX5r63w6Jll+4VEYhEAHXTDIqX1JgxhTAbEHtKntL9kuc4jRo7/GWw5xfCepSccQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4604,8 +4046,6 @@
     },
     "node_modules/@typescript-eslint/types": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.3.tgz",
-      "integrity": "sha512-ePFoH0g4ludssdRFqqDxQePCxU4WQyRa9+XVwjm7yLn0FKhMeoetC+qBEEI1Eyb1pGSDveTIT09Bvw2WhlGayg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -4618,8 +4058,6 @@
     },
     "node_modules/@typescript-eslint/typescript-estree": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.59.3.tgz",
-      "integrity": "sha512-CbRjVRAf7Lr9Kr8RopKcbY45p2VfmmHrm0ygOCYFi7oU8q19m0Fs/6iHS7kNOmwpp+ob07ZVcAqlxUod9lYdmg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4646,8 +4084,6 @@
     },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
       "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
-      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -4659,8 +4095,6 @@
     },
     "node_modules/@typescript-eslint/utils": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.59.3.tgz",
-      "integrity": "sha512-JAvT14goBzRzzzZyqq3P9BLArIxTtQURUtFgQ/V7FO+eU+Gg6ES+5ymOPP1wRxXcxAYeivCk4uS3jCKWI1K8Zg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4683,8 +4117,6 @@
     },
     "node_modules/@typescript-eslint/visitor-keys": {
       "version": "8.59.3",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.59.3.tgz",
-      "integrity": "sha512-f1UQF7ggd42YiwI5wGrRaPsa+P0CINBlrkLPmGfpq/u/I/oVtecoEIfFR9ag/oa1sLOsRNZ6xehf6qMZhQGBDg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4701,8 +4133,6 @@
     },
     "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
-      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -4714,8 +4144,6 @@
     },
     "node_modules/@ungap/structured-clone": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.1.tgz",
-      "integrity": "sha512-mUFwbeTqrVgDQxFveS+df2yfap6iuP20NAKAsBt5jDEoOTDew+zwLAOilHCeQJOVSvmgCX4ogqIrA0mnyr08yQ==",
       "dev": true,
       "license": "ISC"
     },
@@ -4763,8 +4191,6 @@
     },
     "node_modules/@unrs/resolver-binding-darwin-x64": {
       "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/@unrs/resolver-binding-darwin-x64/-/resolver-binding-darwin-x64-1.11.1.tgz",
-      "integrity": "sha512-cFzP7rWKd3lZaCsDze07QX1SC24lO8mPty9vdP+YVa3MGdVgPmFc59317b2ioXtgCMKGiCLxJ4HQs62oz6GfRQ==",
       "cpu": [
         "x64"
       ],
@@ -4825,6 +4251,9 @@
         "arm64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4839,6 +4268,9 @@
         "arm64"
       ],
       "dev": true,
+      "libc": [
+        "musl"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4853,6 +4285,9 @@
         "ppc64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4867,6 +4302,9 @@
         "riscv64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4881,6 +4319,9 @@
         "riscv64"
       ],
       "dev": true,
+      "libc": [
+        "musl"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4895,6 +4336,9 @@
         "s390x"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4909,6 +4353,9 @@
         "x64"
       ],
       "dev": true,
+      "libc": [
+        "glibc"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4923,6 +4370,9 @@
         "x64"
       ],
       "dev": true,
+      "libc": [
+        "musl"
+      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4990,8 +4440,6 @@
     },
     "node_modules/@webassemblyjs/ast": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.14.1.tgz",
-      "integrity": "sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5001,29 +4449,21 @@
     },
     "node_modules/@webassemblyjs/floating-point-hex-parser": {
       "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.13.2.tgz",
-      "integrity": "sha512-6oXyTOzbKxGH4steLbLNOu71Oj+C8Lg34n6CqRvqfS2O71BxY6ByfMDRhBytzknj9yGUPVJ1qIKhRlAwO1AovA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-api-error": {
       "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-api-error/-/helper-api-error-1.13.2.tgz",
-      "integrity": "sha512-U56GMYxy4ZQCbDZd6JuvvNV/WFildOjsaWD3Tzzvmw/mas3cXzRJPMjP83JqEsgSbyrmaGjBfDtV7KDXV9UzFQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-buffer": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.14.1.tgz",
-      "integrity": "sha512-jyH7wtcHiKssDtFPRB+iQdxlDf96m0E39yb0k5uJVhFGleZFoNw1c4aeIcVUPPbXUVJ94wwnMOAqUHyzoEPVMA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-numbers": {
       "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-numbers/-/helper-numbers-1.13.2.tgz",
-      "integrity": "sha512-FE8aCmS5Q6eQYcV3gI35O4J789wlQA+7JrqTTpJqn5emA4U2hvwJmvFRC0HODS+3Ye6WioDklgd6scJ3+PLnEA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5034,15 +4474,11 @@
     },
     "node_modules/@webassemblyjs/helper-wasm-bytecode": {
       "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.13.2.tgz",
-      "integrity": "sha512-3QbLKy93F0EAIXLh0ogEVR6rOubA9AoZ+WRYhNbFyuB70j3dRdwH9g+qXhLAO0kiYGlg3TxDV+I4rQTr/YNXkA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@webassemblyjs/helper-wasm-section": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.14.1.tgz",
-      "integrity": "sha512-ds5mXEqTJ6oxRoqjhWDU83OgzAYjwsCV8Lo/N+oRsNDmx/ZDpqalmrtgOMkHwxsG0iI//3BwWAErYRHtgn0dZw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5054,8 +4490,6 @@
     },
     "node_modules/@webassemblyjs/ieee754": {
       "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/ieee754/-/ieee754-1.13.2.tgz",
-      "integrity": "sha512-4LtOzh58S/5lX4ITKxnAK2USuNEvpdVV9AlgGQb8rJDHaLeHciwG4zlGr0j/SNWlr7x3vO1lDEsuePvtcDNCkw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5064,8 +4498,6 @@
     },
     "node_modules/@webassemblyjs/leb128": {
       "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/leb128/-/leb128-1.13.2.tgz",
-      "integrity": "sha512-Lde1oNoIdzVzdkNEAWZ1dZ5orIbff80YPdHx20mrHwHrVNNTjNr8E3xz9BdpcGqRQbAEa+fkrCb+fRFTl/6sQw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -5074,15 +4506,11 @@
     },
     "node_modules/@webassemblyjs/utf8": {
       "version": "1.13.2",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/utf8/-/utf8-1.13.2.tgz",
-      "integrity": "sha512-3NQWGjKTASY1xV5m7Hr0iPeXD9+RDobLll3T9d2AO+g3my8xy5peVyjSag4I50mR1bBSN/Ct12lo+R9tJk0NZQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@webassemblyjs/wasm-edit": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-edit/-/wasm-edit-1.14.1.tgz",
-      "integrity": "sha512-RNJUIQH/J8iA/1NzlE4N7KtyZNHi3w7at7hDjvRNm5rcUXa00z1vRz3glZoULfJ5mpvYhLybmVcwcjGrC1pRrQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5098,8 +4526,6 @@
     },
     "node_modules/@webassemblyjs/wasm-gen": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-gen/-/wasm-gen-1.14.1.tgz",
-      "integrity": "sha512-AmomSIjP8ZbfGQhumkNvgC33AY7qtMCXnN6bL2u2Js4gVCg8fp735aEiMSBbDR7UQIj90n4wKAFUSEd0QN2Ukg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5112,8 +4538,6 @@
     },
     "node_modules/@webassemblyjs/wasm-opt": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-opt/-/wasm-opt-1.14.1.tgz",
-      "integrity": "sha512-PTcKLUNvBqnY2U6E5bdOQcSM+oVP/PmrDY9NzowJjislEjwP/C4an2303MCVS2Mg9d3AJpIGdUFIQQWbPds0Sw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5125,8 +4549,6 @@
     },
     "node_modules/@webassemblyjs/wasm-parser": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-parser/-/wasm-parser-1.14.1.tgz",
-      "integrity": "sha512-JLBl+KZ0R5qB7mCnud/yyX08jWFw5MsoalJ1pQ4EdFlgj9VdXKGuENGsiCIjegI1W7p91rUlcB/LB5yRJKNTcQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5140,8 +4562,6 @@
     },
     "node_modules/@webassemblyjs/wast-printer": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-printer/-/wast-printer-1.14.1.tgz",
-      "integrity": "sha512-kPSSXE6De1XOR820C90RIo2ogvZG+c3KiHzqUoO/F34Y2shGzesfqv7o57xrxovZJH/MetF5UjroJ/R/3isoiw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5151,8 +4571,6 @@
     },
     "node_modules/@xmldom/xmldom": {
       "version": "0.9.10",
-      "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.9.10.tgz",
-      "integrity": "sha512-A9gOqLdi6cV4ibazAjcQufGj0B1y/vDqYrcuP6d/6x8P27gRS8643Dj9o1dEKtB6O7fwxb2FgBmJS2mX7gpvdw==",
       "license": "MIT",
       "engines": {
         "node": ">=14.6"
@@ -5160,22 +4578,16 @@
     },
     "node_modules/@xtuc/ieee754": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
-      "integrity": "sha512-DX8nKgqcGwsc0eJSqYt5lwP4DH5FlHnmuWWBRy7X0NcaGR0ZtuyeESgMwTYVEtxmsNGY+qit4QYT/MIYTOTPeA==",
       "dev": true,
       "license": "BSD-3-Clause"
     },
     "node_modules/@xtuc/long": {
       "version": "4.2.2",
-      "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
-      "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
       "dev": true,
       "license": "Apache-2.0"
     },
     "node_modules/abort-controller": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/abort-controller/-/abort-controller-3.0.0.tgz",
-      "integrity": "sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==",
       "license": "MIT",
       "dependencies": {
         "event-target-shim": "^5.0.0"
@@ -5186,8 +4598,6 @@
     },
     "node_modules/abs": {
       "version": "1.3.15",
-      "resolved": "https://registry.npmjs.org/abs/-/abs-1.3.15.tgz",
-      "integrity": "sha512-bpFChpVyZ2F2ppgx7qjZ5TTEO6VVwBauUZDZibpclRGhfcXTHyj11nlqwrg5dN1knxCchssROehm76uCcCayRA==",
       "license": "MIT",
       "dependencies": {
         "ul": "^5.0.0"
@@ -5195,8 +4605,6 @@
     },
     "node_modules/accepts": {
       "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz",
-      "integrity": "sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5209,8 +4617,6 @@
     },
     "node_modules/accepts/node_modules/mime-db": {
       "version": "1.52.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
-      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5219,8 +4625,6 @@
     },
     "node_modules/accepts/node_modules/mime-types": {
       "version": "2.1.35",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
-      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5232,8 +4636,6 @@
     },
     "node_modules/accepts/node_modules/negotiator": {
       "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
-      "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5242,8 +4644,6 @@
     },
     "node_modules/acorn": {
       "version": "8.16.0",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.16.0.tgz",
-      "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -5255,8 +4655,6 @@
     },
     "node_modules/acorn-import-phases": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/acorn-import-phases/-/acorn-import-phases-1.0.4.tgz",
-      "integrity": "sha512-wKmbr/DDiIXzEOiWrTTUcDm24kQ2vGfZQvM2fwg2vXqR5uW6aapr7ObPtj1th32b9u90/Pf4AItvdTh42fBmVQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5268,8 +4666,6 @@
     },
     "node_modules/acorn-jsx": {
       "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
-      "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
       "dev": true,
       "license": "MIT",
       "peerDependencies": {
@@ -5278,8 +4674,6 @@
     },
     "node_modules/agent-base": {
       "version": "7.1.4",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
-      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5288,8 +4682,6 @@
     },
     "node_modules/ajv": {
       "version": "6.15.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.15.0.tgz",
-      "integrity": "sha512-fgFx7Hfoq60ytK2c7DhnF8jIvzYgOMxfugjLOSMHjLIPgenqa7S7oaagATUq99mV6IYvN2tRmC0wnTYX6iPbMw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5305,8 +4697,6 @@
     },
     "node_modules/ajv-formats": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.1.tgz",
-      "integrity": "sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5323,8 +4713,6 @@
     },
     "node_modules/ajv-formats/node_modules/ajv": {
       "version": "8.20.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.20.0.tgz",
-      "integrity": "sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5340,15 +4728,11 @@
     },
     "node_modules/ajv-formats/node_modules/json-schema-traverse": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
-      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/ansi-escapes": {
       "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
-      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5363,8 +4747,6 @@
     },
     "node_modules/ansi-html-community": {
       "version": "0.0.8",
-      "resolved": "https://registry.npmjs.org/ansi-html-community/-/ansi-html-community-0.0.8.tgz",
-      "integrity": "sha512-1APHAyr3+PCamwNw3bXCPp4HFLONZt/yIH0sZp0/469KWNTEy+qN5jQ3GVX6DMZ1UXAi34yVwtTeaG/HpBuuzw==",
       "dev": true,
       "engines": [
         "node >= 0.8.0"
@@ -5376,8 +4758,6 @@
     },
     "node_modules/ansi-regex": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
-      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -5385,8 +4765,6 @@
     },
     "node_modules/ansi-styles": {
       "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
       "license": "MIT",
       "dependencies": {
         "color-convert": "^2.0.1"
@@ -5400,8 +4778,6 @@
     },
     "node_modules/anymatch": {
       "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
-      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -5414,8 +4790,6 @@
     },
     "node_modules/argparse": {
       "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
-      "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5424,8 +4798,6 @@
     },
     "node_modules/aria-query": {
       "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
-      "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -5434,15 +4806,11 @@
     },
     "node_modules/array-flatten": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/asn1.js": {
       "version": "4.10.1",
-      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.10.1.tgz",
-      "integrity": "sha512-p32cOF5q0Zqs9uBiONKYLm6BClCoBCM5O9JfeUSlnQLBTxYdTK+pW+nXflm8UkKd2UYlEbYz5qEi0JuZR9ckSw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5453,15 +4821,11 @@
     },
     "node_modules/asn1.js/node_modules/bn.js": {
       "version": "4.12.3",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.3.tgz",
-      "integrity": "sha512-fGTi3gxV/23FTYdAoUtLYp6qySe2KE3teyZitipKNRuVYcBkoP/bB3guXN/XVKUe9mxCHXnc9C4ocyz8OmgN0g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/asn1js": {
       "version": "3.0.10",
-      "resolved": "https://registry.npmjs.org/asn1js/-/asn1js-3.0.10.tgz",
-      "integrity": "sha512-S2s3aOytiKdFRdulw2qPE51MzjzVOisppcVv7jVFR+Kw0kxwvFrDcYA0h7Ndqbmj0HkMIXYWaoj7fli8kgx1eg==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -5475,8 +4839,6 @@
     },
     "node_modules/assert": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/assert/-/assert-2.1.0.tgz",
-      "integrity": "sha512-eLHpSK/Y4nhMJ07gDaAzoX/XAKS8PSaojml3M0DM4JpV1LAi5JOJ/p6H/XWrl8L+DzVEvVCW1z3vWAaB9oTsQw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5489,8 +4851,6 @@
     },
     "node_modules/available-typed-arrays": {
       "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
-      "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5505,8 +4865,6 @@
     },
     "node_modules/axe-core": {
       "version": "4.11.4",
-      "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.11.4.tgz",
-      "integrity": "sha512-KunSNx+TVpkAw/6ULfhnx+HWRecjqZGTOyquAoWHYLRSdK1tB5Ihce1ZW+UY3fj33bYAFWPu7W/GRSmmrCGuxA==",
       "dev": true,
       "license": "MPL-2.0",
       "engines": {
@@ -5515,8 +4873,6 @@
     },
     "node_modules/babel-jest": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/babel-jest/-/babel-jest-30.4.1.tgz",
-      "integrity": "sha512-fATAbM8piYxkiXQp3RBXmZHxZVNJZAVXXfyeyCN2Tida3+qJ8ea9UxhiJ2y4fLO90ZImKt6k9FlcH2+rLkJGhw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5537,8 +4893,6 @@
     },
     "node_modules/babel-jest/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5547,8 +4901,6 @@
     },
     "node_modules/babel-loader": {
       "version": "10.1.1",
-      "resolved": "https://registry.npmjs.org/babel-loader/-/babel-loader-10.1.1.tgz",
-      "integrity": "sha512-JwKSzk2kjIe7mgPK+/lyZ2QAaJcpahNAdM+hgR2HI8D0OJVkdj8Rl6J3kaLYki9pwF7P2iWnD8qVv80Lq1ABtg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5573,8 +4925,6 @@
     },
     "node_modules/babel-plugin-inline-import": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-inline-import/-/babel-plugin-inline-import-3.0.0.tgz",
-      "integrity": "sha512-thnykl4FMb8QjMjVCuZoUmAM7r2mnTn5qJwrryCvDv6rugbJlTHZMctdjDtEgD0WBAXJOLJSGXN3loooEwx7UQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5583,8 +4933,6 @@
     },
     "node_modules/babel-plugin-istanbul": {
       "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-7.0.1.tgz",
-      "integrity": "sha512-D8Z6Qm8jCvVXtIRkBnqNHX0zJ37rQcFJ9u8WOS6tkYOsRdHBzypCstaxWiu5ZIlqQtviRYbgnRLSoCEvjqcqbA==",
       "dev": true,
       "license": "BSD-3-Clause",
       "workspaces": [
@@ -5603,8 +4951,6 @@
     },
     "node_modules/babel-plugin-jest-hoist": {
       "version": "30.4.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-30.4.0.tgz",
-      "integrity": "sha512-9EdtWM/sSfXLOGLwSn+GS6pIXyBnL07/8gyJlwFXjWy4DxMOyItqyUT29d4lQiS380EZwYlX7/At4PgBS+m2aA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5616,8 +4962,6 @@
     },
     "node_modules/babel-plugin-polyfill-corejs2": {
       "version": "0.4.17",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.17.tgz",
-      "integrity": "sha512-aTyf30K/rqAsNwN76zYrdtx8obu0E4KoUME29B1xj+B3WxgvWkp943vYQ+z8Mv3lw9xHXMHpvSPOBxzAkIa94w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5631,8 +4975,6 @@
     },
     "node_modules/babel-plugin-polyfill-corejs3": {
       "version": "0.14.2",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.14.2.tgz",
-      "integrity": "sha512-coWpDLJ410R781Npmn/SIBZEsAetR4xVi0SxLMXPaMO4lSf1MwnkGYMtkFxew0Dn8B3/CpbpYxN0JCgg8mn67g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5645,8 +4987,6 @@
     },
     "node_modules/babel-plugin-polyfill-regenerator": {
       "version": "0.6.8",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.6.8.tgz",
-      "integrity": "sha512-M762rNHfSF1EV3SLtnCJXFoQbbIIz0OyRwnCmV0KPC7qosSfCO0QLTSuJX3ayAebubhE6oYBAYPrBA5ljowaZg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5658,8 +4998,6 @@
     },
     "node_modules/babel-preset-current-node-syntax": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-current-node-syntax/-/babel-preset-current-node-syntax-1.2.0.tgz",
-      "integrity": "sha512-E/VlAEzRrsLEb2+dv8yp3bo4scof3l9nR4lrld+Iy5NyVqgVYUJnDAmunkhPMisRI32Qc4iRiz425d8vM++2fg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5685,8 +5023,6 @@
     },
     "node_modules/babel-preset-jest": {
       "version": "30.4.0",
-      "resolved": "https://registry.npmjs.org/babel-preset-jest/-/babel-preset-jest-30.4.0.tgz",
-      "integrity": "sha512-lBY4jxsNmCnSiu7kquw8ZC9F4+XLMOKypT3RnNHPvU2Kpd4W0xaPuLr5ZkRyOsvLYAY4yaW1ZwTW4xB7NIiZzg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5702,8 +5038,6 @@
     },
     "node_modules/balanced-match": {
       "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
-      "integrity": "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5712,8 +5046,6 @@
     },
     "node_modules/base64-js": {
       "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
-      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
       "funding": [
         {
           "type": "github",
@@ -5731,9 +5063,7 @@
       "license": "MIT"
     },
     "node_modules/baseline-browser-mapping": {
-      "version": "2.10.30",
-      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.30.tgz",
-      "integrity": "sha512-xjOFN16Ha1+Rz4nFYKqHU/LSB+gx/Vi3yQLX7r7sAW+Wa+8hhF2h4pvqTrTMc8+WcDBEunnUurr46Jvv0jk3Vg==",
+      "version": "2.10.29",
       "dev": true,
       "license": "Apache-2.0",
       "bin": {
@@ -5745,15 +5075,11 @@
     },
     "node_modules/batch": {
       "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
-      "integrity": "sha512-x+VAiMRL6UPkx+kudNvxTl6hB2XNNCG2r+7wixVfIYwu/2HKRXimwQyaumLjMveWvT2Hkd/cAJw+QBMfJ/EKVw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/bidi-js": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.3.tgz",
-      "integrity": "sha512-RKshQI1R3YQ+n9YJz2QQ147P66ELpa1FQEg20Dk8oW9t2KgLbpDLLp9aGZ7y8WHSshDknG0bknqGw5/tyCs5tw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5762,8 +5088,6 @@
     },
     "node_modules/binary-extensions": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
-      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5775,15 +5099,11 @@
     },
     "node_modules/bn.js": {
       "version": "5.2.3",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-5.2.3.tgz",
-      "integrity": "sha512-EAcmnPkxpntVL+DS7bO1zhcZNvCkxqtkd0ZY53h06GNQ3DEkkGZ/gKgmDv6DdZQGj9BgfSPKtJJ7Dp1GPP8f7w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/body-parser": {
       "version": "1.20.5",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.5.tgz",
-      "integrity": "sha512-3grm+/2tUOvu2cjJkvsIxrv/wVpfXQW4PsQHYm7yk4vfpu7Ekl6nEsYBoJUL6qDwZUx8wUhQ8tR2qz+ad9c9OA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5807,8 +5127,6 @@
     },
     "node_modules/body-parser/node_modules/debug": {
       "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5817,15 +5135,11 @@
     },
     "node_modules/body-parser/node_modules/ms": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/bonjour-service": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.3.0.tgz",
-      "integrity": "sha512-3YuAUiSkWykd+2Azjgyxei8OWf8thdn8AITIog2M4UICzoqfjlqr64WIjEXZllf/W6vK1goqleSR6brGomxQqA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5835,15 +5149,11 @@
     },
     "node_modules/boolbase": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
-      "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/brace-expansion": {
       "version": "5.0.6",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.6.tgz",
-      "integrity": "sha512-kLpxurY4Z4r9sgMsyG0Z9uzsBlgiU/EFKhj/h91/8yHu0edo7XuixOIH3VcJ8kkxs6/jPzoI6U9Vj3WqbMQ94g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5855,8 +5165,6 @@
     },
     "node_modules/braces": {
       "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
-      "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5868,15 +5176,11 @@
     },
     "node_modules/brorand": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz",
-      "integrity": "sha512-cKV8tMCEpQs4hK/ik71d6LrPOnpkpGBR0wzxqr68g2m/LB2GxVYQroAjMJZRVM1Y4BCjCKc3vAamxSzOY2RP+w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/browser-resolve": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/browser-resolve/-/browser-resolve-2.0.0.tgz",
-      "integrity": "sha512-7sWsQlYL2rGLy2IWm8WL8DCTJvYLc/qlOnsakDac87SOoCd16WLsaAMdCiAqsTNHIe+SXfaqyxyo6THoWqs8WQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5885,8 +5189,6 @@
     },
     "node_modules/browserify-aes": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
-      "integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5900,8 +5202,6 @@
     },
     "node_modules/browserify-cipher": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/browserify-cipher/-/browserify-cipher-1.0.1.tgz",
-      "integrity": "sha512-sPhkz0ARKbf4rRQt2hTpAHqn47X3llLkUGn+xEJzLjwY8LRs2p0v7ljvI5EyoRO/mexrNunNECisZs+gw2zz1w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5912,8 +5212,6 @@
     },
     "node_modules/browserify-des": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/browserify-des/-/browserify-des-1.0.2.tgz",
-      "integrity": "sha512-BioO1xf3hFwz4kc6iBhI3ieDFompMhrMlnDFC4/0/vd5MokpuAc3R+LYbwTA9A5Yc9pq9UYPqffKpW2ObuwX5A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5925,8 +5223,6 @@
     },
     "node_modules/browserify-rsa": {
       "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.1.1.tgz",
-      "integrity": "sha512-YBjSAiTqM04ZVei6sXighu679a3SqWORA3qZTEqZImnlkDIFtKc6pNutpjyZ8RJTjQtuYfeetkxM11GwoYXMIQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5940,8 +5236,6 @@
     },
     "node_modules/browserify-sign": {
       "version": "4.2.5",
-      "resolved": "https://registry.npmjs.org/browserify-sign/-/browserify-sign-4.2.5.tgz",
-      "integrity": "sha512-C2AUdAJg6rlM2W5QMp2Q4KGQMVBwR1lIimTsUnutJ8bMpW5B52pGpR2gEnNBNwijumDo5FojQ0L9JrXA8m4YEw==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -5961,15 +5255,11 @@
     },
     "node_modules/browserify-sign/node_modules/isarray": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/browserify-sign/node_modules/readable-stream": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5984,15 +5274,11 @@
     },
     "node_modules/browserify-sign/node_modules/readable-stream/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/browserify-sign/node_modules/string_decoder": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6001,15 +5287,11 @@
     },
     "node_modules/browserify-sign/node_modules/string_decoder/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/browserify-zlib": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/browserify-zlib/-/browserify-zlib-0.2.0.tgz",
-      "integrity": "sha512-Z942RysHXmJrhqk88FmKBVq/v5tqmSkDz7p54G/MGyjMnCFFnC79XWNbg+Vta8W6Wb2qtSZTSxIGkJrRpCFEiA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6018,8 +5300,6 @@
     },
     "node_modules/browserslist": {
       "version": "4.28.2",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.2.tgz",
-      "integrity": "sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==",
       "dev": true,
       "funding": [
         {
@@ -6052,8 +5332,6 @@
     },
     "node_modules/bser": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/bser/-/bser-2.1.1.tgz",
-      "integrity": "sha512-gQxTNE/GAfIIrmHLUE3oJyp5FO6HRBfhjnw4/wMmA63ZGDJnWBmgY/lyQBpnDUkGmAhbSe39tx2d/iTOAfglwQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -6062,8 +5340,6 @@
     },
     "node_modules/buffer": {
       "version": "5.7.1",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
-      "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
       "dev": true,
       "funding": [
         {
@@ -6087,29 +5363,21 @@
     },
     "node_modules/buffer-from": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
-      "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/buffer-xor": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz",
-      "integrity": "sha512-571s0T7nZWK6vB67HI5dyUF7wXiNcfaPPPTl6zYCNApANjIvYJTg7hlud/+cJpdAhS7dVzqMLmfhfHR3rAcOjQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/builtin-status-codes": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
-      "integrity": "sha512-HpGFw18DgFWlncDfjTa2rcQ4W88O1mC8e8yZ2AvQY5KDaktSTwo+KRf6nHK6FRI5FyRyb/5T6+TSxfP7QyGsmQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/bundle-name": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/bundle-name/-/bundle-name-4.1.0.tgz",
-      "integrity": "sha512-tjwM5exMg6BGRI+kNmTntNsvdZS1X8BFYS6tnJ2hdH0kVxM6/eVZ2xy+FqStSWvYmtfFMDLIxurorHwDKfDz5Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6124,8 +5392,6 @@
     },
     "node_modules/bytes": {
       "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
-      "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6134,8 +5400,6 @@
     },
     "node_modules/bytestreamjs": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/bytestreamjs/-/bytestreamjs-2.0.1.tgz",
-      "integrity": "sha512-U1Z/ob71V/bXfVABvNr/Kumf5VyeQRBEm6Txb0PQ6S7V5GpBM3w4Cbqz/xPDicR5tN0uvDifng8C+5qECeGwyQ==",
       "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
@@ -6144,8 +5408,6 @@
     },
     "node_modules/call-bind": {
       "version": "1.0.9",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.9.tgz",
-      "integrity": "sha512-a/hy+pNsFUTR+Iz8TCJvXudKVLAnz/DyeSUo10I5yvFDQJBFU2s9uqQpoSrJlroHUKoKqzg+epxyP9lqFdzfBQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6163,8 +5425,6 @@
     },
     "node_modules/call-bind-apply-helpers": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
-      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6177,8 +5437,6 @@
     },
     "node_modules/call-bound": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
-      "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6194,8 +5452,6 @@
     },
     "node_modules/callsites": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
-      "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6204,8 +5460,6 @@
     },
     "node_modules/camel-case": {
       "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/camel-case/-/camel-case-4.1.2.tgz",
-      "integrity": "sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6215,17 +5469,13 @@
     },
     "node_modules/camelcase": {
       "version": "5.3.1",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
-      "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
       "license": "MIT",
       "engines": {
         "node": ">=6"
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001793",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001793.tgz",
-      "integrity": "sha512-iwSsYWaCOoh26cV8NwNRViHlrfUvYsHDfRVcbtmw0Kg6PJIZZXwMkj1442FYLBGkeUf1juAsU3DTfxW579mrPA==",
+      "version": "1.0.30001792",
       "dev": true,
       "funding": [
         {
@@ -6245,8 +5495,6 @@
     },
     "node_modules/canonicalize": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/canonicalize/-/canonicalize-2.1.0.tgz",
-      "integrity": "sha512-F705O3xrsUtgt98j7leetNhTWPe+5S72rlL5O4jA1pKqBVQ/dT1O1D6PFxmSXvc0SUOinWS57DKx0I3CHrXJHQ==",
       "license": "Apache-2.0",
       "bin": {
         "canonicalize": "bin/canonicalize.js"
@@ -6254,8 +5502,6 @@
     },
     "node_modules/capture-stack-trace": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/capture-stack-trace/-/capture-stack-trace-1.0.2.tgz",
-      "integrity": "sha512-X/WM2UQs6VMHUtjUDnZTRI+i1crWteJySFzr9UpGoQa4WQffXVTTXuekjl7TjZRlcF2XfjgITT0HxZ9RnxeT0w==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -6266,8 +5512,6 @@
     },
     "node_modules/chalk": {
       "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6283,8 +5527,6 @@
     },
     "node_modules/char-regex": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/char-regex/-/char-regex-1.0.2.tgz",
-      "integrity": "sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6293,8 +5535,6 @@
     },
     "node_modules/chat-pane": {
       "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/chat-pane/-/chat-pane-3.0.3.tgz",
-      "integrity": "sha512-3RDYbJLRCbVPFFz8P8u9zb+Xo2P/ynNPSPF+6nGLrhg1TtBbZv8HloUICdiud/LEsF19DLBkiIHk7Bd2KSE1KQ==",
       "dev": true,
       "license": "MIT",
       "peerDependencies": {
@@ -6305,8 +5545,6 @@
     },
     "node_modules/chokidar": {
       "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
-      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6330,8 +5568,6 @@
     },
     "node_modules/chrome-trace-event": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz",
-      "integrity": "sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6340,8 +5576,6 @@
     },
     "node_modules/ci-info": {
       "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-4.4.0.tgz",
-      "integrity": "sha512-77PSwercCZU2Fc4sX94eF8k8Pxte6JAwL4/ICZLFjJLqegs7kCuAsqqj/70NQF6TvDpgFjkubQB2FW2ZZddvQg==",
       "dev": true,
       "funding": [
         {
@@ -6356,8 +5590,6 @@
     },
     "node_modules/cipher-base": {
       "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.7.tgz",
-      "integrity": "sha512-Mz9QMT5fJe7bKI7MH31UilT5cEK5EHHRCccw/YRFsRY47AuNgaV6HY3rscp0/I4Q+tTW/5zoqpSeRRI54TkDWA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6371,15 +5603,11 @@
     },
     "node_modules/cjs-module-lexer": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-2.2.0.tgz",
-      "integrity": "sha512-4bHTS2YuzUvtoLjdy+98ykbNB5jS0+07EvFNXerqZQJ89F7DI6ET7OQo/HJuW6K0aVsKA9hj9/RVb2kQVOrPDQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/clean-css": {
       "version": "5.3.3",
-      "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-5.3.3.tgz",
-      "integrity": "sha512-D5J+kHaVb/wKSFcyyV75uCn8fiY4sV38XJoe4CUyGQ+mOU/fMVYUdH1hJC+CJQ5uY3EnW27SbJYS4X8BiLrAFg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6391,8 +5619,6 @@
     },
     "node_modules/cliui": {
       "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
-      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -6406,8 +5632,6 @@
     },
     "node_modules/clone-deep": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz",
-      "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6421,8 +5645,6 @@
     },
     "node_modules/co": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
-      "integrity": "sha512-QVb0dM5HvG+uaxitm8wONl7jltx8dqhfU33DcqtOZcLSVIKSDDLDi7+0LbAKiyI8hD9u42m2YxXSkMGWThaecQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6432,15 +5654,11 @@
     },
     "node_modules/collect-v8-coverage": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/collect-v8-coverage/-/collect-v8-coverage-1.0.3.tgz",
-      "integrity": "sha512-1L5aqIkwPfiodaMgQunkF1zRhNqifHBmtbbbxcr6yVxxBnliw4TDOW6NxpO8DJLgJ16OT+Y4ztZqP6p/FtXnAw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/color-convert": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
       "license": "MIT",
       "dependencies": {
         "color-name": "~1.1.4"
@@ -6451,21 +5669,15 @@
     },
     "node_modules/color-name": {
       "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
       "license": "MIT"
     },
     "node_modules/colorette": {
       "version": "2.0.20",
-      "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.20.tgz",
-      "integrity": "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/commander": {
       "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-6.2.1.tgz",
-      "integrity": "sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6474,8 +5686,6 @@
     },
     "node_modules/compressible": {
       "version": "2.0.18",
-      "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
-      "integrity": "sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6487,8 +5697,6 @@
     },
     "node_modules/compression": {
       "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/compression/-/compression-1.8.1.tgz",
-      "integrity": "sha512-9mAqGPHLakhCLeNyxPkK4xVo746zQ/czLH1Ky+vkitMnWfWZps8r0qXuwhwizagCRttsL4lfG4pIOvaWLpAP0w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6506,8 +5714,6 @@
     },
     "node_modules/compression/node_modules/debug": {
       "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6516,22 +5722,16 @@
     },
     "node_modules/compression/node_modules/ms": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/concat-map": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
-      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/connect-history-api-fallback": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz",
-      "integrity": "sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6540,21 +5740,15 @@
     },
     "node_modules/console-browserify": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz",
-      "integrity": "sha512-ZMkYO/LkF17QvCPqM0gxw8yUzigAOZOSWSHg91FH6orS7vcEj5dVZTidN2fQ14yBSdg97RqhSNwLUXInd52OTA==",
       "dev": true
     },
     "node_modules/constants-browserify": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz",
-      "integrity": "sha512-xFxOwqIzR/e1k1gLiWEophSCMqXcwVHIH7akf7b/vxcUeGunlj3hvZaaqxwHsTgn+IndtkQJgSztIDWeumWJDQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/contacts-pane": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/contacts-pane/-/contacts-pane-3.2.0.tgz",
-      "integrity": "sha512-THpuEP4knPiXK0/yp9E/dJ2qTgLh4xhukE6CvpriB8pNBM5GTqmSHhKJJkM9YUuAJKpsHgu14b30WRvd3eMhJQ==",
       "dev": true,
       "license": "MIT",
       "peerDependencies": {
@@ -6565,8 +5759,6 @@
     },
     "node_modules/content-disposition": {
       "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.4.tgz",
-      "integrity": "sha512-FveZTNuGw04cxlAiWbzi6zTAL/lhehaWbTtgluJh4/E95DqMwTmha3KZN1aAWA8cFIhHzMZUvLevkw5Rqk+tSQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6578,8 +5770,6 @@
     },
     "node_modules/content-type": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
-      "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6588,15 +5778,11 @@
     },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
-      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/cookie": {
       "version": "0.7.2",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
-      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -6605,15 +5791,11 @@
     },
     "node_modules/cookie-signature": {
       "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.7.tgz",
-      "integrity": "sha512-NXdYc3dLr47pBkpUCHtKSwIOQXLVn8dZEuywboCOJY/osA0wFSLlSawr3KN8qXJEyX66FcONTH8EIlVuK0yyFA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/copy-webpack-plugin": {
       "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-14.0.0.tgz",
-      "integrity": "sha512-3JLW90aBGeaTLpM7mYQKpnVdgsUZRExY55giiZgLuX/xTQRUs1dOCwbBnWnvY6Q6rfZoXMNwzOQJCSZPppfqXA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6636,8 +5818,6 @@
     },
     "node_modules/copy-webpack-plugin/node_modules/glob-parent": {
       "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
-      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -6649,8 +5829,6 @@
     },
     "node_modules/core-js-compat": {
       "version": "3.49.0",
-      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.49.0.tgz",
-      "integrity": "sha512-VQXt1jr9cBz03b331DFDCCP90b3fanciLkgiOoy8SBHy06gNf+vQ1A3WFLqG7I8TipYIKeYK9wxd0tUrvHcOZA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6663,14 +5841,10 @@
     },
     "node_modules/core-util-is": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
-      "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==",
       "license": "MIT"
     },
     "node_modules/create-ecdh": {
       "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz",
-      "integrity": "sha512-mf+TCx8wWc9VpuxfP2ht0iSISLZnt0JgWlrOKZiNqyUZWnjIaCIVNQArMHnCZKfEYRg6IM7A+NeJoN8gf/Ws0A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6680,15 +5854,11 @@
     },
     "node_modules/create-ecdh/node_modules/bn.js": {
       "version": "4.12.3",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.3.tgz",
-      "integrity": "sha512-fGTi3gxV/23FTYdAoUtLYp6qySe2KE3teyZitipKNRuVYcBkoP/bB3guXN/XVKUe9mxCHXnc9C4ocyz8OmgN0g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/create-error-class": {
       "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/create-error-class/-/create-error-class-3.0.2.tgz",
-      "integrity": "sha512-gYTKKexFO3kh200H1Nit76sRwRtOY32vQd3jpAQKpLtZqyNsSQNfI4N7o3eP2wUjV35pTWKRYqFUDBvUha/Pkw==",
       "license": "MIT",
       "dependencies": {
         "capture-stack-trace": "^1.0.0"
@@ -6699,8 +5869,6 @@
     },
     "node_modules/create-hash": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
-      "integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6713,8 +5881,6 @@
     },
     "node_modules/create-hmac": {
       "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
-      "integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6728,15 +5894,11 @@
     },
     "node_modules/create-require": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
-      "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/cross-fetch": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.2.0.tgz",
-      "integrity": "sha512-Q+xVJLoGOeIMXZmbUK4HYk+69cQH6LudR0Vu/pRm2YlU/hDV9CiS0gKUMaWY5f2NeUH9C1nV3bsTlCo0FsTV1Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6745,8 +5907,6 @@
     },
     "node_modules/cross-spawn": {
       "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
-      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6760,8 +5920,6 @@
     },
     "node_modules/crypto-browserify": {
       "version": "3.12.1",
-      "resolved": "https://registry.npmjs.org/crypto-browserify/-/crypto-browserify-3.12.1.tgz",
-      "integrity": "sha512-r4ESw/IlusD17lgQi1O20Fa3qNnsckR126TdUuBgAu7GBYSIPvdNyONd3Zrxh0xCwA4+6w/TDArBPsMvhur+KQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6787,8 +5945,6 @@
     },
     "node_modules/css-loader": {
       "version": "7.1.4",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-7.1.4.tgz",
-      "integrity": "sha512-vv3J9tlOl04WjiMvHQI/9tmIrCxVrj6PFbHemBB1iihpeRbi/I4h033eoFIhwxBBqLhI0KYFS7yvynBFhIZfTw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6823,8 +5979,6 @@
     },
     "node_modules/css-loader/node_modules/semver": {
       "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
-      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -6836,8 +5990,6 @@
     },
     "node_modules/css-select": {
       "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/css-select/-/css-select-4.3.0.tgz",
-      "integrity": "sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -6853,8 +6005,6 @@
     },
     "node_modules/css-tree": {
       "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.2.1.tgz",
-      "integrity": "sha512-X7sjQzceUhu1u7Y/ylrRZFU2FS6LRiFVp6rKLPg23y3x3c3DOKAwuXGDp+PAGjh6CSnCjYeAul8pcT8bAl+lSA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6867,8 +6017,6 @@
     },
     "node_modules/css-what": {
       "version": "6.2.2",
-      "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.2.2.tgz",
-      "integrity": "sha512-u/O3vwbptzhMs3L1fQE82ZSLHQQfto5gyZzwteVIEyeaY5Fc7R4dapF/BvRoSYFeqfBk4m0V1Vafq5Pjv25wvA==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -6880,15 +6028,11 @@
     },
     "node_modules/css.escape": {
       "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
-      "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/cssesc": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
-      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -6900,8 +6044,6 @@
     },
     "node_modules/cssstyle": {
       "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.6.0.tgz",
-      "integrity": "sha512-2z+rWdzbbSZv6/rhtvzvqeZQHrBaqgogqt85sqFNbabZOuFbCVFb8kPeEtZjiKkbrm395irpNKiYeFeLiQnFPg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6914,8 +6056,6 @@
     },
     "node_modules/cssstyle/node_modules/@asamuzakjp/css-color": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-3.2.0.tgz",
-      "integrity": "sha512-K1A6z8tS3XsmCMM86xoWdn7Fkdn9m6RSVtocUrJYIwZnFVkng/PvkEoWtOWmP+Scc6saYWHWZYbndEEXxl24jw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6928,8 +6068,6 @@
     },
     "node_modules/cssstyle/node_modules/@csstools/color-helpers": {
       "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.1.0.tgz",
-      "integrity": "sha512-S11EXWJyy0Mz5SYvRmY8nJYTFFd1LCNV+7cXyAgQtOOuzb4EsgfqDufL+9esx72/eLhsRdGZwaldu/h+E4t4BA==",
       "dev": true,
       "funding": [
         {
@@ -6948,8 +6086,6 @@
     },
     "node_modules/cssstyle/node_modules/@csstools/css-calc": {
       "version": "2.1.4",
-      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-2.1.4.tgz",
-      "integrity": "sha512-3N8oaj+0juUw/1H3YwmDDJXCgTB1gKU6Hc/bB502u9zR0q2vd786XJH9QfrKIEgFlZmhZiq6epXl4rHqhzsIgQ==",
       "dev": true,
       "funding": [
         {
@@ -6972,8 +6108,6 @@
     },
     "node_modules/cssstyle/node_modules/@csstools/css-color-parser": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-3.1.0.tgz",
-      "integrity": "sha512-nbtKwh3a6xNVIp/VRuXV64yTKnb1IjTAEEh3irzS+HkKjAOYLTGNb9pmVNntZ8iVBHcWDA2Dof0QtPgFI1BaTA==",
       "dev": true,
       "funding": [
         {
@@ -7000,8 +6134,6 @@
     },
     "node_modules/cssstyle/node_modules/@csstools/css-parser-algorithms": {
       "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-3.0.5.tgz",
-      "integrity": "sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==",
       "dev": true,
       "funding": [
         {
@@ -7023,8 +6155,6 @@
     },
     "node_modules/cssstyle/node_modules/@csstools/css-tokenizer": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-3.0.4.tgz",
-      "integrity": "sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==",
       "dev": true,
       "funding": [
         {
@@ -7043,15 +6173,11 @@
     },
     "node_modules/cssstyle/node_modules/lru-cache": {
       "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/data-urls": {
       "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-7.0.0.tgz",
-      "integrity": "sha512-23XHcCF+coGYevirZceTVD7NdJOqVn+49IHyxgszm+JIiHLoB2TkmPtsYkNWT1pvRSGkc35L6NHs0yHkN2SumA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7064,8 +6190,6 @@
     },
     "node_modules/debug": {
       "version": "4.4.3",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
-      "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7082,8 +6206,6 @@
     },
     "node_modules/decamelize": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-      "integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -7091,15 +6213,11 @@
     },
     "node_modules/decimal.js": {
       "version": "10.6.0",
-      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.6.0.tgz",
-      "integrity": "sha512-YpgQiITW3JXGntzdUmyUR1V812Hn8T1YVXhCu+wO3OpS4eU9l4YdD3qjyiKdV6mvV29zapkMeD390UVEf2lkUg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/dedent": {
       "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/dedent/-/dedent-1.7.2.tgz",
-      "integrity": "sha512-WzMx3mW98SN+zn3hgemf4OzdmyNhhhKz5Ay0pUfQiMQ3e1g+xmTJWp/pKdwKVXhdSkAEGIIzqeuWrL3mV/AXbA==",
       "dev": true,
       "license": "MIT",
       "peerDependencies": {
@@ -7113,8 +6231,6 @@
     },
     "node_modules/deep-extend": {
       "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz",
-      "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==",
       "license": "MIT",
       "engines": {
         "node": ">=4.0.0"
@@ -7122,15 +6238,11 @@
     },
     "node_modules/deep-is": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
-      "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/deepmerge": {
       "version": "4.3.1",
-      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz",
-      "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7139,8 +6251,6 @@
     },
     "node_modules/default-browser": {
       "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/default-browser/-/default-browser-5.5.0.tgz",
-      "integrity": "sha512-H9LMLr5zwIbSxrmvikGuI/5KGhZ8E2zH3stkMgM5LpOWDutGM2JZaj460Udnf1a+946zc7YBgrqEWwbk7zHvGw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7156,8 +6266,6 @@
     },
     "node_modules/default-browser-id": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/default-browser-id/-/default-browser-id-5.0.1.tgz",
-      "integrity": "sha512-x1VCxdX4t+8wVfd1so/9w+vQ4vx7lKd2Qp5tDRutErwmR85OgmfX7RlLRMWafRMY7hbEiXIbudNrjOAPa/hL8Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7169,8 +6277,6 @@
     },
     "node_modules/deffy": {
       "version": "2.2.5",
-      "resolved": "https://registry.npmjs.org/deffy/-/deffy-2.2.5.tgz",
-      "integrity": "sha512-6TX2cfIo97eKqWmqgMDAUulCwnveAe3K+4VGsTGPJsL3NtSEnSBFZ3sUXdS4EBhZ8GbdaZBzXQ04ton18dJrug==",
       "license": "MIT",
       "dependencies": {
         "typpy": "^2.0.0"
@@ -7178,8 +6284,6 @@
     },
     "node_modules/define-data-property": {
       "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
-      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7196,8 +6300,6 @@
     },
     "node_modules/define-lazy-prop": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/define-lazy-prop/-/define-lazy-prop-3.0.0.tgz",
-      "integrity": "sha512-N+MeXYoqr3pOgn8xfyRPREN7gHakLYjhsHhWGT3fWAiL4IkAt0iDw14QiiEm2bE30c5XX5q0FtAA3CK5f9/BUg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7209,8 +6311,6 @@
     },
     "node_modules/define-properties": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz",
-      "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7227,8 +6327,6 @@
     },
     "node_modules/depd": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
-      "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7237,8 +6335,6 @@
     },
     "node_modules/dequal": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
-      "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7247,8 +6343,6 @@
     },
     "node_modules/des.js": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.1.0.tgz",
-      "integrity": "sha512-r17GxjhUCjSRy8aiJpr8/UadFIzMzJGexI3Nmz4ADi9LYSFx4gTBp80+NaX/YsXWWLhpZ7v/v/ubEc/bCNfKwg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7258,8 +6352,6 @@
     },
     "node_modules/destroy": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
-      "integrity": "sha512-2sJGJTaXIIaR1w4iJSNoN0hnMY7Gpc/n8D4qSCJw8QqFWXf7cuAgnEHxBpweaVcPevC2l3KpjYCx3NypQQgaJg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7269,8 +6361,6 @@
     },
     "node_modules/detect-newline": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/detect-newline/-/detect-newline-3.1.0.tgz",
-      "integrity": "sha512-TLz+x/vEXm/Y7P7wn1EJFNLxYpUD4TgMosxY6fAVJUnJMbupHBOncxyWUG9OpTaH9EBD7uFI5LfEgmMOc54DsA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7279,15 +6369,11 @@
     },
     "node_modules/detect-node": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz",
-      "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/diffie-hellman": {
       "version": "5.0.3",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
-      "integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7298,21 +6384,15 @@
     },
     "node_modules/diffie-hellman/node_modules/bn.js": {
       "version": "4.12.3",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.3.tgz",
-      "integrity": "sha512-fGTi3gxV/23FTYdAoUtLYp6qySe2KE3teyZitipKNRuVYcBkoP/bB3guXN/XVKUe9mxCHXnc9C4ocyz8OmgN0g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/dijkstrajs": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz",
-      "integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==",
       "license": "MIT"
     },
     "node_modules/dns-packet": {
       "version": "5.6.1",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz",
-      "integrity": "sha512-l4gcSouhcgIKRvyy99RNVOgxXiicE+2jZoNmaNmZ6JXiGajBOJAesk1OBlJuM5k2c+eudGdLxDqXuPCKIj6kpw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7324,15 +6404,11 @@
     },
     "node_modules/dom-accessibility-api": {
       "version": "0.5.16",
-      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
-      "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/dom-converter": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz",
-      "integrity": "sha512-gd3ypIPfOMr9h5jIKq8E3sHOTCjeirnl0WK5ZdS1AW0Odt0b1PaWaHdJ4Qk4klv+YB9aJBS7mESXjFoDQPu6DA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7341,8 +6417,6 @@
     },
     "node_modules/dom-serializer": {
       "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz",
-      "integrity": "sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7356,8 +6430,6 @@
     },
     "node_modules/dom-serializer/node_modules/entities": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
-      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
       "dev": true,
       "license": "BSD-2-Clause",
       "funding": {
@@ -7366,8 +6438,6 @@
     },
     "node_modules/domain-browser": {
       "version": "4.22.0",
-      "resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-4.22.0.tgz",
-      "integrity": "sha512-IGBwjF7tNk3cwypFNH/7bfzBcgSCbaMOD3GsaY1AU/JRrnHnYgEM0+9kQt52iZxjNsjBtJYtao146V+f8jFZNw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7379,8 +6449,6 @@
     },
     "node_modules/domelementtype": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
-      "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==",
       "dev": true,
       "funding": [
         {
@@ -7392,8 +6460,6 @@
     },
     "node_modules/domhandler": {
       "version": "4.3.1",
-      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.3.1.tgz",
-      "integrity": "sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -7408,8 +6474,6 @@
     },
     "node_modules/domutils": {
       "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.8.0.tgz",
-      "integrity": "sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -7423,8 +6487,6 @@
     },
     "node_modules/dot-case": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz",
-      "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7434,8 +6496,6 @@
     },
     "node_modules/dunder-proto": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
-      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7449,8 +6509,6 @@
     },
     "node_modules/duplexer2": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.1.4.tgz",
-      "integrity": "sha512-asLFVfWWtJ90ZyOUHMqk7/S2w2guQKxUI2itj3d92ADHhxUSbCMGi1f1cBcJ7xM1To+pE/Khbwo1yuNbMEPKeA==",
       "license": "BSD-3-Clause",
       "dependencies": {
         "readable-stream": "^2.0.2"
@@ -7458,14 +6516,10 @@
     },
     "node_modules/duplexer2/node_modules/isarray": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "license": "MIT"
     },
     "node_modules/duplexer2/node_modules/readable-stream": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
       "license": "MIT",
       "dependencies": {
         "core-util-is": "~1.0.0",
@@ -7479,14 +6533,10 @@
     },
     "node_modules/duplexer2/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "license": "MIT"
     },
     "node_modules/duplexer2/node_modules/string_decoder": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "license": "MIT",
       "dependencies": {
         "safe-buffer": "~5.1.0"
@@ -7494,29 +6544,21 @@
     },
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
-      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/ee-first": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
-      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.357",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.357.tgz",
-      "integrity": "sha512-NHlTIQDK8fmVwHwuIzmXYEJ1Ewq3D9wDNc0cWXxDGysP6Pb21giwGNkxiTifyKy/4SoPuN5l6GLP1W9Sv7zB2g==",
+      "version": "1.5.356",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/elliptic": {
       "version": "6.6.1",
-      "resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.6.1.tgz",
-      "integrity": "sha512-RaddvvMatK2LJHqFJ+YA4WysVN5Ita9E35botqIYspQ4TkRAlCicdzKOjlyv/1Za5RyTNn7di//eEV0uTAfe3g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7531,15 +6573,11 @@
     },
     "node_modules/elliptic/node_modules/bn.js": {
       "version": "4.12.3",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.3.tgz",
-      "integrity": "sha512-fGTi3gxV/23FTYdAoUtLYp6qySe2KE3teyZitipKNRuVYcBkoP/bB3guXN/XVKUe9mxCHXnc9C4ocyz8OmgN0g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/emittery": {
       "version": "0.13.1",
-      "resolved": "https://registry.npmjs.org/emittery/-/emittery-0.13.1.tgz",
-      "integrity": "sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7551,14 +6589,10 @@
     },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
       "license": "MIT"
     },
     "node_modules/encodeurl": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
-      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7567,8 +6601,6 @@
     },
     "node_modules/enhanced-resolve": {
       "version": "5.21.3",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.21.3.tgz",
-      "integrity": "sha512-QyL119InA+XXEkNLNTPCXPugSvOfhwv0JOlGNzvxs0hZaiHLNvXSpudUWsOlsXGWJh8G6ckCScEkVHfX3kw/2Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7581,8 +6613,6 @@
     },
     "node_modules/entities": {
       "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
-      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -7594,8 +6624,6 @@
     },
     "node_modules/envinfo": {
       "version": "7.21.0",
-      "resolved": "https://registry.npmjs.org/envinfo/-/envinfo-7.21.0.tgz",
-      "integrity": "sha512-Lw7I8Zp5YKHFCXL7+Dz95g4CcbMEpgvqZNNq3AmlT5XAV6CgAAk6gyAMqn2zjw08K9BHfcNuKrMiCPLByGafow==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -7607,8 +6635,6 @@
     },
     "node_modules/err": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/err/-/err-1.1.1.tgz",
-      "integrity": "sha512-N97Ybd2jJHVQ+Ft3Q5+C2gM3kgygkdeQmEqbN2z15UTVyyEsIwLA1VK39O1DHEJhXbwIFcJLqm6iARNhFANcQA==",
       "license": "MIT",
       "dependencies": {
         "typpy": "^2.2.0"
@@ -7616,8 +6642,6 @@
     },
     "node_modules/error-ex": {
       "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.4.tgz",
-      "integrity": "sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==",
       "license": "MIT",
       "dependencies": {
         "is-arrayish": "^0.2.1"
@@ -7625,8 +6649,6 @@
     },
     "node_modules/es-define-property": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
-      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7635,8 +6657,6 @@
     },
     "node_modules/es-errors": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
-      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
       "license": "MIT",
       "engines": {
         "node": ">= 0.4"
@@ -7644,15 +6664,11 @@
     },
     "node_modules/es-module-lexer": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-2.1.0.tgz",
-      "integrity": "sha512-n27zTYMjYu1aj4MjCWzSP7G9r75utsaoc8m61weK+W8JMBGGQybd43GstCXZ3WNmSFtGT9wi59qQTW6mhTR5LQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/es-object-atoms": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
-      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7664,8 +6680,6 @@
     },
     "node_modules/escalade": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
-      "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7674,15 +6688,11 @@
     },
     "node_modules/escape-html": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
-      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/escape-string-regexp": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
-      "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7694,8 +6704,6 @@
     },
     "node_modules/eslint": {
       "version": "9.39.4",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.4.tgz",
-      "integrity": "sha512-XoMjdBOwe/esVgEvLmNsD3IRHkm7fbKIUGvrleloJXUZgDHig2IPWNniv+GwjyJXzuNqVjlr5+4yVUZjycJwfQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7754,8 +6762,6 @@
     },
     "node_modules/eslint-scope": {
       "version": "8.4.0",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz",
-      "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -7771,8 +6777,6 @@
     },
     "node_modules/eslint-visitor-keys": {
       "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
-      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -7784,15 +6788,11 @@
     },
     "node_modules/eslint/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/eslint/node_modules/brace-expansion": {
       "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.14.tgz",
-      "integrity": "sha512-MWPGfDxnyzKU7rNOW9SP/c50vi3xrmrua/+6hfPbCS2ABNWfx24vPidzvC7krjU/RTo235sV776ymlsMtGKj8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7802,8 +6802,6 @@
     },
     "node_modules/eslint/node_modules/eslint-visitor-keys": {
       "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
-      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -7815,8 +6813,6 @@
     },
     "node_modules/eslint/node_modules/glob-parent": {
       "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
-      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -7828,8 +6824,6 @@
     },
     "node_modules/eslint/node_modules/ignore": {
       "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
-      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7838,8 +6832,6 @@
     },
     "node_modules/eslint/node_modules/minimatch": {
       "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -7851,8 +6843,6 @@
     },
     "node_modules/espree": {
       "version": "10.4.0",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz",
-      "integrity": "sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -7869,8 +6859,6 @@
     },
     "node_modules/espree/node_modules/eslint-visitor-keys": {
       "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
-      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -7882,8 +6870,6 @@
     },
     "node_modules/esprima": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
-      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
       "dev": true,
       "license": "BSD-2-Clause",
       "bin": {
@@ -7896,8 +6882,6 @@
     },
     "node_modules/esquery": {
       "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.7.0.tgz",
-      "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -7909,8 +6893,6 @@
     },
     "node_modules/esrecurse": {
       "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
-      "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -7922,8 +6904,6 @@
     },
     "node_modules/estraverse": {
       "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -7932,8 +6912,6 @@
     },
     "node_modules/esutils": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
-      "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -7942,8 +6920,6 @@
     },
     "node_modules/etag": {
       "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
-      "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7952,8 +6928,6 @@
     },
     "node_modules/event-target-shim": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-5.0.1.tgz",
-      "integrity": "sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==",
       "license": "MIT",
       "engines": {
         "node": ">=6"
@@ -7961,15 +6935,11 @@
     },
     "node_modules/eventemitter3": {
       "version": "4.0.7",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
-      "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/events": {
       "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
-      "integrity": "sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==",
       "license": "MIT",
       "engines": {
         "node": ">=0.8.x"
@@ -7977,8 +6947,6 @@
     },
     "node_modules/evp_bytestokey": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/evp_bytestokey/-/evp_bytestokey-1.0.3.tgz",
-      "integrity": "sha512-/f2Go4TognH/KvCISP7OUsHn85hT9nUkxxA9BEWxFn+Oj9o8ZNLm/40hdlgSLyuOimsrTKLUMEorQexp/aPQeA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7988,8 +6956,6 @@
     },
     "node_modules/exec-limiter": {
       "version": "3.2.14",
-      "resolved": "https://registry.npmjs.org/exec-limiter/-/exec-limiter-3.2.14.tgz",
-      "integrity": "sha512-ZQjJmAnXD+1kQ6ejMZAS5Vxdt7LLMz0Eq7mEu6+7NhlauykuyLihhUkpp4S784QKsmJQIpuuERhQ8Tav8bF3zQ==",
       "license": "MIT",
       "dependencies": {
         "limit-it": "^3.0.0",
@@ -7998,8 +6964,6 @@
     },
     "node_modules/execa": {
       "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/execa/-/execa-5.1.1.tgz",
-      "integrity": "sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8022,8 +6986,6 @@
     },
     "node_modules/exit-x": {
       "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/exit-x/-/exit-x-0.2.2.tgz",
-      "integrity": "sha512-+I6B/IkJc1o/2tiURyz/ivu/O0nKNEArIUB5O7zBrlDVJr22SCLH3xTeEry428LvFhRzIA1g8izguxJ/gbNcVQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8032,8 +6994,6 @@
     },
     "node_modules/expect": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/expect/-/expect-30.4.1.tgz",
-      "integrity": "sha512-PMARsyh/JtqC20HoGqlFcIlQAyqUtW4PlI1rup1uhYJtKuwAjbvWi3GQMAn+STdHum/dk8xrKfUM1+5SAwpolA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8050,8 +7010,6 @@
     },
     "node_modules/express": {
       "version": "4.22.2",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.22.2.tgz",
-      "integrity": "sha512-IuL+Elrou2ZvCFHs18/CIzy2Nzvo25nZ1/D2eIZlz7c+QUayAcYoiM2BthCjs+EBHVpjYjcuLDAiCWgeIX3X1Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8097,8 +7055,6 @@
     },
     "node_modules/express/node_modules/debug": {
       "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8107,36 +7063,26 @@
     },
     "node_modules/express/node_modules/ms": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-deep-equal": {
       "version": "3.1.3",
-      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
-      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-json-stable-stringify": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
-      "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-levenshtein": {
       "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
-      "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-uri": {
       "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.2.tgz",
-      "integrity": "sha512-rVjf7ArG3LTk+FS6Yw81V1DLuZl1bRbNrev6Tmd/9RaroeeRRJhAt7jg/6YFxbvAQXUCavSoZhPPj6oOx+5KjQ==",
       "dev": true,
       "funding": [
         {
@@ -8152,8 +7098,6 @@
     },
     "node_modules/fastest-levenshtein": {
       "version": "1.0.16",
-      "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz",
-      "integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8162,8 +7106,6 @@
     },
     "node_modules/faye-websocket": {
       "version": "0.11.4",
-      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
-      "integrity": "sha512-CzbClwlXAuiRQAlUyfqPgvPoNKTckTPGfwZV4ZdAhVcP2lh9KUxJg2b5GkE7XbjKQ3YJnQ9z6D9ntLAlB+tP8g==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -8175,8 +7117,6 @@
     },
     "node_modules/fb-watchman": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/fb-watchman/-/fb-watchman-2.0.2.tgz",
-      "integrity": "sha512-p5161BqbuCaSnB8jIbzQHOlpgsPmK5rJVDfDKO91Axs5NC1uu3HRQm6wt9cd9/+GtQQIO53JdGXXoyDpTAsgYA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -8185,8 +7125,6 @@
     },
     "node_modules/file-entry-cache": {
       "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
-      "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8198,8 +7136,6 @@
     },
     "node_modules/fill-range": {
       "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
-      "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8211,8 +7147,6 @@
     },
     "node_modules/finalhandler": {
       "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.3.2.tgz",
-      "integrity": "sha512-aA4RyPcd3badbdABGDuTXCMTtOneUCAYH/gxoYRTZlIJdF0YPWuGqiAsIrhNnnqdXGswYk6dGujem4w80UJFhg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8230,8 +7164,6 @@
     },
     "node_modules/finalhandler/node_modules/debug": {
       "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8240,15 +7172,11 @@
     },
     "node_modules/finalhandler/node_modules/ms": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/find-up": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
-      "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8264,8 +7192,6 @@
     },
     "node_modules/flat": {
       "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
-      "integrity": "sha512-b6suED+5/3rTpUBdG1gupIl8MPFCAMA0QXwmljLhvCUKcUvdE4gWky9zpuGCcXHOsz4J9wPGNWq6OKpmIzz3hQ==",
       "dev": true,
       "license": "BSD-3-Clause",
       "bin": {
@@ -8274,8 +7200,6 @@
     },
     "node_modules/flat-cache": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
-      "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8288,15 +7212,11 @@
     },
     "node_modules/flatted": {
       "version": "3.4.2",
-      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.4.2.tgz",
-      "integrity": "sha512-PjDse7RzhcPkIJwy5t7KPWQSZ9cAbzQXcafsetQoD7sOJRQlGikNbx7yZp2OotDnJyrDcbyRq3Ttb18iYOqkxA==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/follow-redirects": {
       "version": "1.16.0",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.16.0.tgz",
-      "integrity": "sha512-y5rN/uOsadFT/JfYwhxRS5R7Qce+g3zG97+JrtFZlC9klX/W5hD7iiLzScI4nZqUS7DNUdhPgw4xI8W2LuXlUw==",
       "dev": true,
       "funding": [
         {
@@ -8316,8 +7236,6 @@
     },
     "node_modules/for-each": {
       "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
-      "integrity": "sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8332,8 +7250,6 @@
     },
     "node_modules/foreground-child": {
       "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
-      "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -8349,8 +7265,6 @@
     },
     "node_modules/foreground-child/node_modules/signal-exit": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -8362,8 +7276,6 @@
     },
     "node_modules/forwarded": {
       "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
-      "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8372,8 +7284,6 @@
     },
     "node_modules/fresh": {
       "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
-      "integrity": "sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8382,24 +7292,17 @@
     },
     "node_modules/fs-readdir-recursive": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/fs-readdir-recursive/-/fs-readdir-recursive-1.1.0.tgz",
-      "integrity": "sha512-GNanXlVr2pf02+sPN40XN8HG+ePaNcvM0q5mZBd668Obwb0yD5GiUbZOFgwn8kGMY6I3mdyDJzieUy3PTYyTRA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/fs.realpath": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
-      "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/fsevents": {
       "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
-      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
       "dev": true,
-      "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -8411,8 +7314,6 @@
     },
     "node_modules/function-bind": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
-      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -8420,8 +7321,6 @@
     },
     "node_modules/function.name": {
       "version": "1.0.14",
-      "resolved": "https://registry.npmjs.org/function.name/-/function.name-1.0.14.tgz",
-      "integrity": "sha512-s99L814NRuLxwF2sJMIcLhkQhueGXb3oKyvorzrUKKwlVB0SBbWrgZt4+EwKAo3ujCXnT7vshmCvXgZA09kCMw==",
       "license": "MIT",
       "dependencies": {
         "noop6": "^1.0.1"
@@ -8429,8 +7328,6 @@
     },
     "node_modules/generator-function": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/generator-function/-/generator-function-2.0.1.tgz",
-      "integrity": "sha512-SFdFmIJi+ybC0vjlHN0ZGVGHc3lgE0DxPAT0djjVg+kjOnSqclqmj0KQ7ykTOLP6YxoqOvuAODGdcHJn+43q3g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8439,8 +7336,6 @@
     },
     "node_modules/gensync": {
       "version": "1.0.0-beta.2",
-      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
-      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8449,8 +7344,6 @@
     },
     "node_modules/get-caller-file": {
       "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
-      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
       "license": "ISC",
       "engines": {
         "node": "6.* || 8.* || >= 10.*"
@@ -8458,8 +7351,6 @@
     },
     "node_modules/get-intrinsic": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
-      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8483,8 +7374,6 @@
     },
     "node_modules/get-package-type": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz",
-      "integrity": "sha512-pjzuKtY64GYfWizNAJ0fr9VqttZkNiK2iS430LtIHzjBEr6bX8Am2zm4sW4Ro5wjWW5cAlRL1qAMTcXbjNAO2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8493,8 +7382,6 @@
     },
     "node_modules/get-proto": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
-      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8507,8 +7394,6 @@
     },
     "node_modules/get-stream": {
       "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-6.0.1.tgz",
-      "integrity": "sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8520,8 +7405,6 @@
     },
     "node_modules/git-package-json": {
       "version": "1.4.11",
-      "resolved": "https://registry.npmjs.org/git-package-json/-/git-package-json-1.4.11.tgz",
-      "integrity": "sha512-A/P5K2qqQ52+BwBf+qyrjtdauMlb7n1WVa++/VPDxTcgKZ2X5/Eh/EQwbxNvRKBsKAkMAeyV/UIdnb/saVFnnQ==",
       "license": "MIT",
       "dependencies": {
         "deffy": "^2.2.1",
@@ -8537,8 +7420,6 @@
     },
     "node_modules/git-source": {
       "version": "1.1.11",
-      "resolved": "https://registry.npmjs.org/git-source/-/git-source-1.1.11.tgz",
-      "integrity": "sha512-oubUf/uply9xvR5olZxxPpip19wMEpESN3bFfPcFMvl/0fwrVrcAppwOJ7Dghcguze68WAIjs/A1YrdMDIW8XA==",
       "license": "MIT",
       "dependencies": {
         "git-url-parse": "^5.0.1"
@@ -8546,8 +7427,6 @@
     },
     "node_modules/git-up": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/git-up/-/git-up-1.2.1.tgz",
-      "integrity": "sha512-SRVN3rOLACva8imc7BFrB6ts5iISWKH1/h/1Z+JZYoUI7UVQM7gQqk4M2yxUENbq2jUUT09NEND5xwP1i7Ktlw==",
       "license": "MIT",
       "dependencies": {
         "is-ssh": "^1.0.0",
@@ -8556,8 +7435,6 @@
     },
     "node_modules/git-url-parse": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/git-url-parse/-/git-url-parse-5.0.1.tgz",
-      "integrity": "sha512-4uSiOgrryNEMBX+gTWogenYRUh2j1D+95STTSEF2RCTgLkfJikl8c7BGr0Bn274hwuxTsbS2/FQ5pVS9FoXegQ==",
       "license": "MIT",
       "dependencies": {
         "git-up": "^1.0.0"
@@ -8565,9 +7442,6 @@
     },
     "node_modules/glob": {
       "version": "7.2.3",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
-      "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -8587,8 +7461,6 @@
     },
     "node_modules/glob-parent": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -8600,8 +7472,6 @@
     },
     "node_modules/glob-to-regex.js": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/glob-to-regex.js/-/glob-to-regex.js-1.2.0.tgz",
-      "integrity": "sha512-QMwlOQKU/IzqMUOAZWubUOT8Qft+Y0KQWnX9nK3ch0CJg0tTp4TvGZsTfudYKv2NzoQSyPcnA6TYeIQ3jGichQ==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -8617,22 +7487,16 @@
     },
     "node_modules/glob-to-regexp": {
       "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz",
-      "integrity": "sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==",
       "dev": true,
       "license": "BSD-2-Clause"
     },
     "node_modules/glob/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/glob/node_modules/brace-expansion": {
       "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.14.tgz",
-      "integrity": "sha512-MWPGfDxnyzKU7rNOW9SP/c50vi3xrmrua/+6hfPbCS2ABNWfx24vPidzvC7krjU/RTo235sV776ymlsMtGKj8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8642,8 +7506,6 @@
     },
     "node_modules/glob/node_modules/minimatch": {
       "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -8655,8 +7517,6 @@
     },
     "node_modules/globals": {
       "version": "14.0.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz",
-      "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8668,8 +7528,6 @@
     },
     "node_modules/gopd": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
-      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8681,8 +7539,6 @@
     },
     "node_modules/got": {
       "version": "5.6.0",
-      "resolved": "https://registry.npmjs.org/got/-/got-5.6.0.tgz",
-      "integrity": "sha512-MnypzkaW8dldA8AbJFjMs7y14+ykd2V8JCLKSvX1Gmzx1alH3Y+3LArywHDoAF2wS3pnZp4gacoYtvqBeF6drQ==",
       "license": "MIT",
       "dependencies": {
         "create-error-class": "^3.0.1",
@@ -8706,10 +7562,15 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/got/node_modules/is-plain-obj": {
+      "version": "1.1.0",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/got/node_modules/is-stream": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz",
-      "integrity": "sha512-uQPm8kcs47jx38atAcWTVxyltQYoPT68y9aWYdV6yWXSyW8mzSat0TL6CiWdZeCdF3KrAvpVtnHbTv4RN+rqdQ==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -8717,14 +7578,10 @@
     },
     "node_modules/got/node_modules/isarray": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "license": "MIT"
     },
     "node_modules/got/node_modules/parse-json": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-2.2.0.tgz",
-      "integrity": "sha512-QR/GGaKCkhwk1ePQNYDRKYZ3mwU9ypsKhB0XyFnLQdomyEqk3e8wpW3V5Jp88zbxK4n5ST1nqo+g9juTpownhQ==",
       "license": "MIT",
       "dependencies": {
         "error-ex": "^1.2.0"
@@ -8735,8 +7592,6 @@
     },
     "node_modules/got/node_modules/readable-stream": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
       "license": "MIT",
       "dependencies": {
         "core-util-is": "~1.0.0",
@@ -8750,14 +7605,10 @@
     },
     "node_modules/got/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "license": "MIT"
     },
     "node_modules/got/node_modules/string_decoder": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "license": "MIT",
       "dependencies": {
         "safe-buffer": "~5.1.0"
@@ -8765,15 +7616,11 @@
     },
     "node_modules/graceful-fs": {
       "version": "4.2.11",
-      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
-      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/gry": {
       "version": "5.0.8",
-      "resolved": "https://registry.npmjs.org/gry/-/gry-5.0.8.tgz",
-      "integrity": "sha512-meq9ZjYVpLzZh3ojhTg7IMad9grGsx6rUUKHLqPnhLXzJkRQvEL2U3tQpS5/WentYTtHtxkT3Ew/mb10D6F6/g==",
       "license": "MIT",
       "dependencies": {
         "abs": "^1.2.1",
@@ -8784,15 +7631,11 @@
     },
     "node_modules/handle-thing": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.1.tgz",
-      "integrity": "sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/has-flag": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8801,8 +7644,6 @@
     },
     "node_modules/has-property-descriptors": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
-      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8814,8 +7655,6 @@
     },
     "node_modules/has-symbols": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
-      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -8827,8 +7666,6 @@
     },
     "node_modules/has-tostringtag": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
-      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8843,8 +7680,6 @@
     },
     "node_modules/hash-base": {
       "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.0.5.tgz",
-      "integrity": "sha512-vXm0l45VbcHEVlTCzs8M+s0VeYsB2lnlAaThoLKGXr3bE/VWDOelNUnycUPEhKEaXARL2TEFjBOyUiM6+55KBg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8857,8 +7692,6 @@
     },
     "node_modules/hash.js": {
       "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/hash.js/-/hash.js-1.1.7.tgz",
-      "integrity": "sha512-taOaskGt4z4SOANNseOviYDvjEJinIkRgmp7LbKP2YTTmVxWBl87s/uzK9r+44BclBSp2X7K1hqeNfz9JbBeXA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8868,8 +7701,6 @@
     },
     "node_modules/hasown": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.3.tgz",
-      "integrity": "sha512-ej4AhfhfL2Q2zpMmLo7U1Uv9+PyhIZpgQLGT1F9miIGmiCJIoCgSmczFdrc97mWT4kVY72KA+WnnhJ5pghSvSg==",
       "license": "MIT",
       "dependencies": {
         "function-bind": "^1.1.2"
@@ -8880,8 +7711,6 @@
     },
     "node_modules/he": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
-      "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -8890,8 +7719,6 @@
     },
     "node_modules/hmac-drbg": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
-      "integrity": "sha512-Tti3gMqLdZfhOQY1Mzf/AanLiqh1WTiJgEj26ZuYQ9fbkLomzGchCws4FyrSd4VkpBfiNhaE1On+lOz894jvXg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8902,14 +7729,10 @@
     },
     "node_modules/hosted-git-info": {
       "version": "2.8.9",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
-      "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
       "license": "ISC"
     },
     "node_modules/hpack.js": {
       "version": "2.1.6",
-      "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
-      "integrity": "sha512-zJxVehUdMGIKsRaNt7apO2Gqp0BdqW5yaiGHXXmbpvxgBYVZnAql+BJb4RO5ad2MgpbZKn5G6nMnegrH1FcNYQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8921,15 +7744,11 @@
     },
     "node_modules/hpack.js/node_modules/isarray": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/hpack.js/node_modules/readable-stream": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8944,15 +7763,11 @@
     },
     "node_modules/hpack.js/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/hpack.js/node_modules/string_decoder": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8961,8 +7776,6 @@
     },
     "node_modules/html-encoding-sniffer": {
       "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-6.0.0.tgz",
-      "integrity": "sha512-CV9TW3Y3f8/wT0BRFc1/KAVQ3TUHiXmaAb6VW9vtiMFf7SLoMd1PdAc4W3KFOFETBJUb90KatHqlsZMWV+R9Gg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8974,15 +7787,11 @@
     },
     "node_modules/html-escaper": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
-      "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/html-minifier-terser": {
       "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz",
-      "integrity": "sha512-YXxSlJBZTP7RS3tWnQw74ooKa6L9b9i9QYXY21eUEvhZ3u9XLfv6OnFsQq6RxkhHygsaUMvYsZRV5rU/OVNZxw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9003,8 +7812,6 @@
     },
     "node_modules/html-minifier-terser/node_modules/commander": {
       "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
-      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9013,8 +7820,6 @@
     },
     "node_modules/html-webpack-plugin": {
       "version": "5.6.7",
-      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-5.6.7.tgz",
-      "integrity": "sha512-md+vXtdCAe60s1k6AU3dUyMJnDxUyQAwfwPKoLisvgUF1IXjtlLsk2se54+qfL9Mdm26bbwvjJybpNx48NKRLw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9046,8 +7851,6 @@
     },
     "node_modules/htmlparser2": {
       "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz",
-      "integrity": "sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==",
       "dev": true,
       "funding": [
         "https://github.com/fb55/htmlparser2?sponsor=1",
@@ -9066,8 +7869,6 @@
     },
     "node_modules/htmlparser2/node_modules/entities": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
-      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
       "dev": true,
       "license": "BSD-2-Clause",
       "funding": {
@@ -9076,15 +7877,11 @@
     },
     "node_modules/http-deceiver": {
       "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
-      "integrity": "sha512-LmpOGxTfbpgtGVxJrj5k7asXHCgNZp5nLfp+hWc8QQRqtb7fUy6kRY3BO1h9ddF6yIPYUARgxGOwB42DnxIaNw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/http-errors": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
-      "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9104,15 +7901,11 @@
     },
     "node_modules/http-parser-js": {
       "version": "0.5.10",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.10.tgz",
-      "integrity": "sha512-Pysuw9XpUq5dVc/2SMHpuTY01RFl8fttgcyunjL7eEMhGM3cI4eOmiCycJDVCo/7O7ClfQD3SaI6ftDzqOXYMA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/http-proxy": {
       "version": "1.18.1",
-      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.18.1.tgz",
-      "integrity": "sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9126,8 +7919,6 @@
     },
     "node_modules/http-proxy-agent": {
       "version": "7.0.2",
-      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
-      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9140,8 +7931,6 @@
     },
     "node_modules/http-proxy-middleware": {
       "version": "2.0.9",
-      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-2.0.9.tgz",
-      "integrity": "sha512-c1IyJYLYppU574+YI7R4QyX2ystMtVXZwIdzazUIPIJsHuWNd+mho2j+bKoHftndicGj9yh+xjd+l0yj7VeT1Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9163,30 +7952,13 @@
         }
       }
     },
-    "node_modules/http-proxy-middleware/node_modules/is-plain-obj": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-3.0.0.tgz",
-      "integrity": "sha512-gwsOE28k+23GP1B6vFl1oVh/WOzmawBrKwo5Ev6wMKzPkaXaCDIQKzLnvsA42DRlbVTWorkgTKIviAKCWkfUwA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/https-browserify": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
-      "integrity": "sha512-J+FkSdyD+0mA0N+81tMotaRMfSL9SGi+xpD3T6YApKsc3bGSXJlfXri3VyFOeYkfLRQisDk1W+jIFFKBeUBbBg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/https-proxy-agent": {
       "version": "7.0.6",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
-      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9199,8 +7971,6 @@
     },
     "node_modules/human-signals": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz",
-      "integrity": "sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -9209,8 +7979,6 @@
     },
     "node_modules/hyperdyperid": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/hyperdyperid/-/hyperdyperid-1.2.0.tgz",
-      "integrity": "sha512-Y93lCzHYgGWdrJ66yIktxiaGULYc6oGiABxhcO5AufBeOyoIdZF7bIfLaOrbM0iGIOXQQgxxRrFEnb+Y6w1n4A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9219,8 +7987,6 @@
     },
     "node_modules/iconv-lite": {
       "version": "0.4.24",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
-      "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9232,8 +7998,6 @@
     },
     "node_modules/icss-utils": {
       "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
-      "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -9245,8 +8009,6 @@
     },
     "node_modules/ieee754": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
-      "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==",
       "funding": [
         {
           "type": "github",
@@ -9265,8 +8027,6 @@
     },
     "node_modules/ignore": {
       "version": "7.0.5",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
-      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9275,8 +8035,6 @@
     },
     "node_modules/import-fresh": {
       "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
-      "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9292,8 +8050,6 @@
     },
     "node_modules/import-fresh/node_modules/resolve-from": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
-      "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9302,8 +8058,6 @@
     },
     "node_modules/import-local": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/import-local/-/import-local-3.2.0.tgz",
-      "integrity": "sha512-2SPlun1JUPWoM6t3F0dw0FkCF/jWY8kttcY4f599GLTSjh2OCuuhdTkJQsEcZzBqbXZGKMK2OqW1oZsjtf/gQA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9322,8 +8076,6 @@
     },
     "node_modules/imurmurhash": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
-      "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9332,8 +8084,6 @@
     },
     "node_modules/indent-string": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz",
-      "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9342,9 +8092,6 @@
     },
     "node_modules/inflight": {
       "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
-      "integrity": "sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==",
-      "deprecated": "This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -9354,20 +8101,14 @@
     },
     "node_modules/inherits": {
       "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
-      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
       "license": "ISC"
     },
     "node_modules/ini": {
       "version": "1.3.8",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
-      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
       "license": "ISC"
     },
     "node_modules/interpret": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/interpret/-/interpret-3.1.1.tgz",
-      "integrity": "sha512-6xwYfHbajpoF0xLW+iwLkhwgvLoZDfjYfoFNu8ftMoXINzwuymNLd9u/KmwtdT2GbR+/Cz66otEGEVVUHX9QLQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9376,8 +8117,6 @@
     },
     "node_modules/ipaddr.js": {
       "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.4.0.tgz",
-      "integrity": "sha512-9VGk3HGanVE6JoZXHiCpnGy5X0jYDnN4EA4lntFPj+1vIWlFhIylq2CrrCOJH9EAhc5CYhq18F2Av2tgoAPsYQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9386,8 +8125,6 @@
     },
     "node_modules/is-arguments": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.2.0.tgz",
-      "integrity": "sha512-7bVbi0huj/wrIAOzb8U1aszg9kdi3KN/CyU19CTI7tAoZYEZoL9yCDXpbXN+uPsuWnP02cyug1gleqq+TU+YCA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9403,14 +8140,10 @@
     },
     "node_modules/is-arrayish": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
-      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
       "license": "MIT"
     },
     "node_modules/is-binary-path": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
-      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9422,8 +8155,6 @@
     },
     "node_modules/is-callable": {
       "version": "1.2.7",
-      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz",
-      "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9435,8 +8166,6 @@
     },
     "node_modules/is-core-module": {
       "version": "2.16.2",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.2.tgz",
-      "integrity": "sha512-evOr8xfXKxE6qSR0hSXL2r3sd7ALj8+7jQEUvPYcm5sgZFdJ+AYzT6yNmJenvIYQBgIGwfwz08sL8zoL7yq2BA==",
       "license": "MIT",
       "dependencies": {
         "hasown": "^2.0.3"
@@ -9450,8 +8179,6 @@
     },
     "node_modules/is-docker": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-docker/-/is-docker-3.0.0.tgz",
-      "integrity": "sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -9466,8 +8193,6 @@
     },
     "node_modules/is-extglob": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
-      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9476,8 +8201,6 @@
     },
     "node_modules/is-fullwidth-code-point": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
-      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -9485,8 +8208,6 @@
     },
     "node_modules/is-generator-fn": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/is-generator-fn/-/is-generator-fn-2.1.0.tgz",
-      "integrity": "sha512-cTIB4yPYL/Grw0EaSzASzg6bBy9gqCofvWN8okThAYIxKJZC+udlRAmGbM0XLeniEJSs8uEgHPGuHSe1XsOLSQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9495,8 +8216,6 @@
     },
     "node_modules/is-generator-function": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.1.2.tgz",
-      "integrity": "sha512-upqt1SkGkODW9tsGNG5mtXTXtECizwtS2kA161M+gJPc1xdb/Ax629af6YrTwcOeQHbewrPNlE5Dx7kzvXTizA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9515,8 +8234,6 @@
     },
     "node_modules/is-glob": {
       "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
-      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9528,8 +8245,6 @@
     },
     "node_modules/is-inside-container": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-inside-container/-/is-inside-container-1.0.0.tgz",
-      "integrity": "sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9547,8 +8262,6 @@
     },
     "node_modules/is-nan": {
       "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/is-nan/-/is-nan-1.3.2.tgz",
-      "integrity": "sha512-E+zBKpQ2t6MEo1VsonYmluk9NxGrbzpeeLC2xIViuO2EjU2xsXsBPwTr3Ykv9l08UYEVEdWeRZNouaZqF6RN0w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9564,8 +8277,6 @@
     },
     "node_modules/is-network-error": {
       "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/is-network-error/-/is-network-error-1.3.2.tgz",
-      "integrity": "sha512-PhBY86zaxNZUuWP6h13Vu5oFe0XY6/UlKzQnYFELzGVHygP3MxmvTfYSG7GN3aIab/iWudSMgjSnG9Dq+nHrgA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9577,8 +8288,6 @@
     },
     "node_modules/is-number": {
       "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
-      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9586,18 +8295,18 @@
       }
     },
     "node_modules/is-plain-obj": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz",
-      "integrity": "sha512-yvkRyxmFKEOQ4pNXCmJG5AEQNlXJS5LaONXo5/cLdTZdWvsZ1ioJEonLGAosKlMWE8lwUy/bJzMjcw8az73+Fg==",
+      "version": "3.0.0",
+      "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=0.10.0"
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/is-plain-object": {
       "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
-      "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9609,15 +8318,11 @@
     },
     "node_modules/is-potential-custom-element-name": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
-      "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/is-redirect": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-redirect/-/is-redirect-1.0.0.tgz",
-      "integrity": "sha512-cr/SlUEe5zOGmzvj9bUyC4LVvkNVAXu4GytXLNMr1pny+a65MpQ9IJzFHD5vi7FyJgb4qt27+eS3TuQnqB+RQw==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -9625,8 +8330,6 @@
     },
     "node_modules/is-regex": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
-      "integrity": "sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9644,8 +8347,6 @@
     },
     "node_modules/is-retry-allowed": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-1.2.0.tgz",
-      "integrity": "sha512-RUbUeKwvm3XG2VYamhJL1xFktgjvPzL0Hq8C+6yrWIswDy3BIXGqCxhxkc30N9jqK311gVU137K8Ei55/zVJRg==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -9653,8 +8354,6 @@
     },
     "node_modules/is-ssh": {
       "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/is-ssh/-/is-ssh-1.4.1.tgz",
-      "integrity": "sha512-JNeu1wQsHjyHgn9NcWTaXq6zWSR6hqE0++zhfZlkFBbScNkyvxCdeV8sRkSBaeLKxmbpR21brail63ACNxJ0Tg==",
       "license": "MIT",
       "dependencies": {
         "protocols": "^2.0.1"
@@ -9662,8 +8361,6 @@
     },
     "node_modules/is-stream": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-2.0.1.tgz",
-      "integrity": "sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9675,8 +8372,6 @@
     },
     "node_modules/is-typed-array": {
       "version": "1.1.15",
-      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.15.tgz",
-      "integrity": "sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9691,8 +8386,6 @@
     },
     "node_modules/is-wsl": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-3.1.1.tgz",
-      "integrity": "sha512-e6rvdUCiQCAuumZslxRJWR/Doq4VpPR82kqclvcS0efgt430SlGIk05vdCN58+VrzgtIcfNODjozVielycD4Sw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9707,22 +8400,16 @@
     },
     "node_modules/isarray": {
       "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
-      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/isexe": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/isobject": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz",
-      "integrity": "sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9731,8 +8418,6 @@
     },
     "node_modules/isomorphic-timers-promises": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/isomorphic-timers-promises/-/isomorphic-timers-promises-1.0.1.tgz",
-      "integrity": "sha512-u4sej9B1LPSxTGKB/HiuzvEQnXH0ECYkSVQU39koSwmFAxhlEAFl9RdTvLv4TOTQUgBS5O3O5fwUxk6byBZ+IQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9741,8 +8426,6 @@
     },
     "node_modules/istanbul-lib-coverage": {
       "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz",
-      "integrity": "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==",
       "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
@@ -9751,8 +8434,6 @@
     },
     "node_modules/istanbul-lib-instrument": {
       "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-6.0.3.tgz",
-      "integrity": "sha512-Vtgk7L/R2JHyyGW07spoFlB8/lpjiOLTjMdms6AFMraYt3BaJauod/NGrfnVG/y4Ix1JEuMRPDPEj2ua+zz1/Q==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -9768,8 +8449,6 @@
     },
     "node_modules/istanbul-lib-instrument/node_modules/semver": {
       "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
-      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -9781,8 +8460,6 @@
     },
     "node_modules/istanbul-lib-report": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz",
-      "integrity": "sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -9796,8 +8473,6 @@
     },
     "node_modules/istanbul-lib-report/node_modules/make-dir": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz",
-      "integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9812,8 +8487,6 @@
     },
     "node_modules/istanbul-lib-report/node_modules/semver": {
       "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
-      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -9825,8 +8498,6 @@
     },
     "node_modules/istanbul-lib-source-maps": {
       "version": "5.0.6",
-      "resolved": "https://registry.npmjs.org/istanbul-lib-source-maps/-/istanbul-lib-source-maps-5.0.6.tgz",
-      "integrity": "sha512-yg2d+Em4KizZC5niWhQaIomgf5WlL4vOOjZ5xGCmF8SnPE/mDWWXgvRExdcpCgh9lLRRa1/fSYp2ymmbJ1pI+A==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -9840,8 +8511,6 @@
     },
     "node_modules/istanbul-reports": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.2.0.tgz",
-      "integrity": "sha512-HGYWWS/ehqTV3xN10i23tkPkpH46MLCIMFNCaaKNavAXTF1RkqxawEPtnjnGZ6XKSInBKkiOA5BKS+aZiY3AvA==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -9854,14 +8523,10 @@
     },
     "node_modules/iterate-object": {
       "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/iterate-object/-/iterate-object-1.3.5.tgz",
-      "integrity": "sha512-eL23u8oFooYTq6TtJKjp2RYjZnCkUYQvC0T/6fJfWykXJ3quvdDdzKZ3CEjy8b3JGOvLTjDYMEMIp5243R906A==",
       "license": "MIT"
     },
     "node_modules/jackspeak": {
       "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
-      "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
       "dev": true,
       "license": "BlueOak-1.0.0",
       "dependencies": {
@@ -9876,8 +8541,6 @@
     },
     "node_modules/jest": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/jest/-/jest-30.4.2.tgz",
-      "integrity": "sha512-Yi1jqNC/Oq0N4hBgNH/YvBpP1P57QqundgytzYqy3yqAa7NZPNjSoi4SGbRAXDMdBzNE6xBCi5U7RgfrvMEUVQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9903,8 +8566,6 @@
     },
     "node_modules/jest-changed-files": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-changed-files/-/jest-changed-files-30.4.1.tgz",
-      "integrity": "sha512-IuctmYrxi21iOSOaIXpJWalHyPAsVv0GeBHKDn8C1CA4W5htHn7INL+wdnL4Bo0+olEndvAFkmb++tIQJG+vvg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9918,8 +8579,6 @@
     },
     "node_modules/jest-circus": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/jest-circus/-/jest-circus-30.4.2.tgz",
-      "integrity": "sha512-rvHH7VlY6LgbJXJTQ87GW62g1FntOtbhh0zT+v04kC+pgL6aBKyYINXxWukCpj3dcIBMw5/XUbtDS9dU9JTXeQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9950,8 +8609,6 @@
     },
     "node_modules/jest-circus/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9963,8 +8620,6 @@
     },
     "node_modules/jest-circus/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9979,8 +8634,6 @@
     },
     "node_modules/jest-circus/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -9989,8 +8642,6 @@
     },
     "node_modules/jest-cli": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/jest-cli/-/jest-cli-30.4.2.tgz",
-      "integrity": "sha512-jfA2ocvVHMXS2QijrJ0d31ektP+d/W0T5RpcTX2Pq+3sVqHlsXVCM2+FmwpL+bdY8OfHpIg9xMxLF17Zg0U49Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10022,8 +8673,6 @@
     },
     "node_modules/jest-config": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/jest-config/-/jest-config-30.4.2.tgz",
-      "integrity": "sha512-rNHAShJQqQwFNoL0hbf3BphSBOWnpOUAKvidLS/AjNVLPfoj5mSf4jQMfW3cYOs6hXeZC7nF7mDHaBnbxELOzg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10073,8 +8722,6 @@
     },
     "node_modules/jest-config/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10086,15 +8733,11 @@
     },
     "node_modules/jest-config/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/jest-config/node_modules/brace-expansion": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.1.0.tgz",
-      "integrity": "sha512-TN1kCZAgdgweJhWWpgKYrQaMNHcDULHkWwQIspdtjV4Y5aurRdZpjAqn6yX3FPqTA9ngHCc4hJxMAMgGfve85w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10103,9 +8746,6 @@
     },
     "node_modules/jest-config/node_modules/glob": {
       "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -10125,8 +8765,6 @@
     },
     "node_modules/jest-config/node_modules/minimatch": {
       "version": "9.0.9",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
-      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -10141,8 +8779,6 @@
     },
     "node_modules/jest-config/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10157,8 +8793,6 @@
     },
     "node_modules/jest-config/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10167,8 +8801,6 @@
     },
     "node_modules/jest-diff": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-30.4.1.tgz",
-      "integrity": "sha512-CRpFK0RtLriVDGcPPAnR6HMVI8bSR2jnUIgralhauzYQZIb4RH9AtEInTuQr65LmmGggGcRT6HIASxwqsVsmlA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10183,8 +8815,6 @@
     },
     "node_modules/jest-diff/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10196,8 +8826,6 @@
     },
     "node_modules/jest-diff/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10212,8 +8840,6 @@
     },
     "node_modules/jest-docblock": {
       "version": "30.4.0",
-      "resolved": "https://registry.npmjs.org/jest-docblock/-/jest-docblock-30.4.0.tgz",
-      "integrity": "sha512-ZPMabUZCx5MpbZ2eBYSvZ0J8fvo3dR9oM+eeUpb3aKNQFuS2tu3Duw1TNlMoP8k3WQgKGJuhcMFvwcVuq6T7oA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10225,8 +8851,6 @@
     },
     "node_modules/jest-each": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-each/-/jest-each-30.4.1.tgz",
-      "integrity": "sha512-/8MJbH6fuj48TstjrMf+u/pd06Qezz5xOXvZA6442heNOWr8bdeoGZX2d9fCn028CoMgYmroH9//zky5GfyYmA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10242,8 +8866,6 @@
     },
     "node_modules/jest-each/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10255,8 +8877,6 @@
     },
     "node_modules/jest-each/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10271,8 +8891,6 @@
     },
     "node_modules/jest-environment-jsdom": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-30.4.1.tgz",
-      "integrity": "sha512-o3nfaN4zej7qgk2X0j8Jhq/S9nAVKs2xK3QeQxeHVvpkEPxaA1yxDGydR+iVI7zPy7Cp62Aq2h3Ja46QvfWHGA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10294,8 +8912,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/data-urls": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
-      "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10308,8 +8924,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/html-encoding-sniffer": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
-      "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10321,8 +8935,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/jsdom": {
       "version": "26.1.0",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-26.1.0.tgz",
-      "integrity": "sha512-Cvc9WUhxSMEo4McES3P7oK3QaXldCfNWp7pl2NNeiIFlCoLr3kfq9kb1fxftiwk1FLV7CvpvDfonxtzUDeSOPg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10361,8 +8973,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/punycode": {
       "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
-      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10371,8 +8981,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/tldts": {
       "version": "6.1.86",
-      "resolved": "https://registry.npmjs.org/tldts/-/tldts-6.1.86.tgz",
-      "integrity": "sha512-WMi/OQ2axVTf/ykqCQgXiIct+mSQDFdH2fkwhPwgEwvJ1kSzZRiinb0zF2Xb8u4+OqPChmyI6MEu4EezNJz+FQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10384,15 +8992,11 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/tldts-core": {
       "version": "6.1.86",
-      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-6.1.86.tgz",
-      "integrity": "sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/jest-environment-jsdom/node_modules/tough-cookie": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-5.1.2.tgz",
-      "integrity": "sha512-FVDYdxtnj0G6Qm/DhNPSb8Ju59ULcup3tuJxkFb5K8Bv2pUXILbf0xZWU8PX8Ov19OXljbUyveOFwRMwkXzO+A==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -10404,8 +9008,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/tr46": {
       "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.1.1.tgz",
-      "integrity": "sha512-hdF5ZgjTqgAntKkklYw0R03MG2x/bSzTtkxmIRw/sTNV8YXsCJ1tfLAX23lhxhHJlEf3CRCOCGGWw3vI3GaSPw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10417,8 +9019,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/webidl-conversions": {
       "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
-      "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -10427,8 +9027,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/whatwg-mimetype": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
-      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10437,8 +9035,6 @@
     },
     "node_modules/jest-environment-jsdom/node_modules/whatwg-url": {
       "version": "14.2.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.2.0.tgz",
-      "integrity": "sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10451,8 +9047,6 @@
     },
     "node_modules/jest-environment-node": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-environment-node/-/jest-environment-node-30.4.1.tgz",
-      "integrity": "sha512-4FZYVOk85hz2AyT6BbarKy9u37g6DbrDyCdFhsnDdXqyrueYQvB+0zO4f/kqLCRD0BsPRXPMNJeQwihKZV8naw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10470,8 +9064,6 @@
     },
     "node_modules/jest-fetch-mock": {
       "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/jest-fetch-mock/-/jest-fetch-mock-3.0.3.tgz",
-      "integrity": "sha512-Ux1nWprtLrdrH4XwE7O7InRY6psIi3GOsqNESJgMJ+M5cv4A8Lh7SN9d2V2kKRZ8ebAfcd1LNyZguAOb6JiDqw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10481,8 +9073,6 @@
     },
     "node_modules/jest-haste-map": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-haste-map/-/jest-haste-map-30.4.1.tgz",
-      "integrity": "sha512-rFrcONd8jeFsyw+Z9CrScJgglRf2+NFmNam8dKu7n+SoHqNYT47mn0DdEcVUZJpvh7Iz6/si7f7yUH7GJHVgnw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10506,8 +9096,6 @@
     },
     "node_modules/jest-haste-map/node_modules/picomatch": {
       "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
-      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10519,8 +9107,6 @@
     },
     "node_modules/jest-leak-detector": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-leak-detector/-/jest-leak-detector-30.4.1.tgz",
-      "integrity": "sha512-IpmyiioeHxiWDhesHnUFmOxcTzwCwKpgACgWajtAP+nYQXiY7DakTxB6Bx9JFiRMljr0AX1PvnQdaU1KFoz6NQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10533,8 +9119,6 @@
     },
     "node_modules/jest-leak-detector/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10546,8 +9130,6 @@
     },
     "node_modules/jest-leak-detector/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10562,8 +9144,6 @@
     },
     "node_modules/jest-matcher-utils": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-30.4.1.tgz",
-      "integrity": "sha512-zvYfX5CaeEkFrrLS9suWe9rvJrm9J1Iv3ua8kIBv9GEPzcnsfBf0bob37la7s67fs0nlBC3EuvkOLnXQKxtx4A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10578,8 +9158,6 @@
     },
     "node_modules/jest-matcher-utils/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10591,8 +9169,6 @@
     },
     "node_modules/jest-matcher-utils/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10607,8 +9183,6 @@
     },
     "node_modules/jest-message-util": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-30.4.1.tgz",
-      "integrity": "sha512-kwCKIvq0MCW1HzLoGola9Te6JUdzgV0loyKJ3Qghrkz9i5/RRIHsL95BMQc2HBBhlBKC4j22K9p11TGHH8RBpQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10629,8 +9203,6 @@
     },
     "node_modules/jest-message-util/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10642,8 +9214,6 @@
     },
     "node_modules/jest-message-util/node_modules/picomatch": {
       "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
-      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10655,8 +9225,6 @@
     },
     "node_modules/jest-message-util/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10671,8 +9239,6 @@
     },
     "node_modules/jest-message-util/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10681,8 +9247,6 @@
     },
     "node_modules/jest-mock": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-30.4.1.tgz",
-      "integrity": "sha512-/i8SVb8/NSB7RfNi8gfqu8gxLV23KaL5EpAttyb9iz8qWRIqXRLflycz/32wXsYkOnaUlx8NAKnJYtpsmXUmfw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10696,8 +9260,6 @@
     },
     "node_modules/jest-pnp-resolver": {
       "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.3.tgz",
-      "integrity": "sha512-+3NpwQEnRoIBtx4fyhblQDPgJI0H1IEIkX7ShLUjPGA7TtUTvI1oiKi3SR4oBR0hQhQR80l4WAe5RrXBwWMA8w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10714,8 +9276,6 @@
     },
     "node_modules/jest-regex-util": {
       "version": "30.4.0",
-      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-30.4.0.tgz",
-      "integrity": "sha512-mWlvLviKIgIQ8VCuM1xRdD0TWp3zlzionlmDBjuXVBs+VkmXq6FgW9T4Emr7oGz/Rk6feDCGyiugolcQEyp3mg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10724,8 +9284,6 @@
     },
     "node_modules/jest-resolve": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-resolve/-/jest-resolve-30.4.1.tgz",
-      "integrity": "sha512-Zry8Yq/yJcNAZ7dJ5F2heic8AheXvbFZ7XI5V+h28nrYZ7Qoyy4dItq8OodjnYD270mvX+ZudmrNV9cysqhW5Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10744,8 +9302,6 @@
     },
     "node_modules/jest-resolve-dependencies": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/jest-resolve-dependencies/-/jest-resolve-dependencies-30.4.2.tgz",
-      "integrity": "sha512-gDiVh1I+GxYzz9oXlyw+1wv6VOYX1WYxMOfjsA3iGKePV2oxmbHhwxfkALxNxYy1ciw6APWwkW2zZONwP97aEQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10758,8 +9314,6 @@
     },
     "node_modules/jest-resolve/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10768,8 +9322,6 @@
     },
     "node_modules/jest-runner": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/jest-runner/-/jest-runner-30.4.2.tgz",
-      "integrity": "sha512-2dw0PslVYXxffXGpLo+Ejad+KcI1Qkjn7f4X4619gf21oCUmL+SPfjqIa/losUem3yEOvfNZe/F1HWUcNpODcg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10802,8 +9354,6 @@
     },
     "node_modules/jest-runtime": {
       "version": "30.4.2",
-      "resolved": "https://registry.npmjs.org/jest-runtime/-/jest-runtime-30.4.2.tgz",
-      "integrity": "sha512-3/5e8iPz2k/VLqlr8DgTftYyLUv8Su3FkCAO2/Od81UsUTpSxOrS6O5x5KkoQwyUjmpYyDJKeyAvg2T2nvpNkQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10836,15 +9386,11 @@
     },
     "node_modules/jest-runtime/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/jest-runtime/node_modules/brace-expansion": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.1.0.tgz",
-      "integrity": "sha512-TN1kCZAgdgweJhWWpgKYrQaMNHcDULHkWwQIspdtjV4Y5aurRdZpjAqn6yX3FPqTA9ngHCc4hJxMAMgGfve85w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10853,9 +9399,6 @@
     },
     "node_modules/jest-runtime/node_modules/glob": {
       "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -10875,8 +9418,6 @@
     },
     "node_modules/jest-runtime/node_modules/minimatch": {
       "version": "9.0.9",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
-      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -10891,8 +9432,6 @@
     },
     "node_modules/jest-runtime/node_modules/slash": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10901,8 +9440,6 @@
     },
     "node_modules/jest-snapshot": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-snapshot/-/jest-snapshot-30.4.1.tgz",
-      "integrity": "sha512-tEOkkfOMppUyeiHwjZswOQ3lcnoTnws/q5FnGIaeIh/jmoU0ZlgMYRR8sTlTj+nNGCoJ0RDq6SfxGxCsyMTPmw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10934,8 +9471,6 @@
     },
     "node_modules/jest-snapshot/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10947,8 +9482,6 @@
     },
     "node_modules/jest-snapshot/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10963,8 +9496,6 @@
     },
     "node_modules/jest-snapshot/node_modules/semver": {
       "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
-      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -10976,8 +9507,6 @@
     },
     "node_modules/jest-util": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-30.4.1.tgz",
-      "integrity": "sha512-vjQb1sACEiv13DKJMDToJpzVW0joCsIQrmbg0fi7CyOOt+g9jTuQl2A216pWRBYhOVt53XbL/2LbMKg1BECWOw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10994,8 +9523,6 @@
     },
     "node_modules/jest-util/node_modules/picomatch": {
       "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
-      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11007,8 +9534,6 @@
     },
     "node_modules/jest-validate": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-validate/-/jest-validate-30.4.1.tgz",
-      "integrity": "sha512-PDWi4SOwLnwqNDfHZjOcsEFyZ4fc/2W2gVL3DEoyqnB6jCQMLRtfBong8s6omIw3lI0HWOus12xfnFmQtjW3fw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11025,8 +9550,6 @@
     },
     "node_modules/jest-validate/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11038,8 +9561,6 @@
     },
     "node_modules/jest-validate/node_modules/camelcase": {
       "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz",
-      "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11051,8 +9572,6 @@
     },
     "node_modules/jest-validate/node_modules/pretty-format": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.4.1.tgz",
-      "integrity": "sha512-K6KiKMHTL4jjX4u3Kir2EW07nRfcqVTXIImx50wbjHQTcZPgg+gjVeNTIT3l3L1Rd4UefxfogquC9J37SoFyyw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11067,8 +9586,6 @@
     },
     "node_modules/jest-watcher": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-watcher/-/jest-watcher-30.4.1.tgz",
-      "integrity": "sha512-/l9UonmvCwjHH7d2h3iAwIloLc1H0S8mJZ/LNK3i86hqwPAz8otUJjP9MfYtz9Tt77Su5FD2xGjZn8d31IZHlw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11087,8 +9604,6 @@
     },
     "node_modules/jest-worker": {
       "version": "30.4.1",
-      "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-30.4.1.tgz",
-      "integrity": "sha512-SHynN/q/QD++iNyvMdy+WMmbCGk8jIsNcRxycXbWubSOhvo6T+j2afcfUSl+3hYsiBebOTo0cT7c2H7CXugu1g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11104,8 +9619,6 @@
     },
     "node_modules/jest-worker/node_modules/supports-color": {
       "version": "8.1.1",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
-      "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11129,15 +9642,11 @@
     },
     "node_modules/js-tokens": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
-      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/js-yaml": {
       "version": "3.14.2",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.2.tgz",
-      "integrity": "sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11150,8 +9659,6 @@
     },
     "node_modules/jsdom": {
       "version": "29.1.1",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-29.1.1.tgz",
-      "integrity": "sha512-ECi4Fi2f7BdJtUKTflYRTiaMxIB0O6zfR1fX0GXpUrf6flp8QIYn1UT20YQqdSOfk2dfkCwS8LAFoJDEppNK5Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11191,8 +9698,6 @@
     },
     "node_modules/jsdom/node_modules/entities": {
       "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-8.0.0.tgz",
-      "integrity": "sha512-zwfzJecQ/Uej6tusMqwAqU/6KL2XaB2VZ2Jg54Je6ahNBGNH6Ek6g3jjNCF0fG9EWQKGZNddNjU5F1ZQn/sBnA==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -11204,8 +9709,6 @@
     },
     "node_modules/jsdom/node_modules/lru-cache": {
       "version": "11.3.6",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.3.6.tgz",
-      "integrity": "sha512-Gf/KoL3C/MlI7Bt0PGI9I+TeTC/I6r/csU58N4BSNc4lppLBeKsOdFYkK+dX0ABDUMJNfCHTyPpzwwO21Awd3A==",
       "dev": true,
       "license": "BlueOak-1.0.0",
       "engines": {
@@ -11214,8 +9717,6 @@
     },
     "node_modules/jsdom/node_modules/parse5": {
       "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/parse5/-/parse5-8.0.1.tgz",
-      "integrity": "sha512-z1e/HMG90obSGeidlli3hj7cbocou0/wa5HacvI3ASx34PecNjNQeaHNo5WIZpWofN9kgkqV1q5YvXe3F0FoPw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11227,8 +9728,6 @@
     },
     "node_modules/jsesc": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
-      "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -11240,36 +9739,26 @@
     },
     "node_modules/json-buffer": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
-      "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/json-parse-even-better-errors": {
       "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
-      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/json-schema-traverse": {
       "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/json-stable-stringify-without-jsonify": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
-      "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/json5": {
       "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
-      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -11281,8 +9770,6 @@
     },
     "node_modules/jsonld": {
       "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/jsonld/-/jsonld-9.0.0.tgz",
-      "integrity": "sha512-pjMIdkXfC1T2wrX9B9i2uXhGdyCmgec3qgMht+TDj+S0qX3bjWMQUfL7NeqEhuRTi8G5ESzmL9uGlST7nzSEWg==",
       "license": "BSD-3-Clause",
       "dependencies": {
         "@digitalbazaar/http-client": "^4.2.0",
@@ -11296,8 +9783,6 @@
     },
     "node_modules/jsonld/node_modules/lru-cache": {
       "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
       "license": "ISC",
       "dependencies": {
         "yallist": "^4.0.0"
@@ -11308,8 +9793,6 @@
     },
     "node_modules/jsonld/node_modules/yallist": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "license": "ISC"
     },
     "node_modules/jwt-decode": {
@@ -11323,8 +9806,6 @@
     },
     "node_modules/keyv": {
       "version": "4.5.4",
-      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
-      "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11333,8 +9814,6 @@
     },
     "node_modules/kind-of": {
       "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
-      "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11343,8 +9822,6 @@
     },
     "node_modules/ky": {
       "version": "1.14.3",
-      "resolved": "https://registry.npmjs.org/ky/-/ky-1.14.3.tgz",
-      "integrity": "sha512-9zy9lkjac+TR1c2tG+mkNSVlyOpInnWdSMiue4F+kq8TwJSgv6o8jhLRg8Ho6SnZ9wOYUq/yozts9qQCfk7bIw==",
       "license": "MIT",
       "engines": {
         "node": ">=18"
@@ -11355,8 +9832,6 @@
     },
     "node_modules/launch-editor": {
       "version": "2.13.2",
-      "resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.13.2.tgz",
-      "integrity": "sha512-4VVDnbOpLXy/s8rdRCSXb+zfMeFR0WlJWpET1iA9CQdlZDfwyLjUuGQzXU4VeOoey6AicSAluWan7Etga6Kcmg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11366,8 +9841,6 @@
     },
     "node_modules/leven": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz",
-      "integrity": "sha512-qsda+H8jTaUaN/x5vzW2rzc+8Rw4TAQ/4KjB46IwK5VH+IlVeeeje/EoZRpiXvIqjFgK84QffqPztGI3VBLG1A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11376,8 +9849,6 @@
     },
     "node_modules/levn": {
       "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
-      "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11390,8 +9861,6 @@
     },
     "node_modules/limit-it": {
       "version": "3.2.11",
-      "resolved": "https://registry.npmjs.org/limit-it/-/limit-it-3.2.11.tgz",
-      "integrity": "sha512-VdLa1lZYZnzT98oLMeCDl6Lwd9cEYIMQlPg34qL6CYuA+yQKoG7K12tfgI5K6bRC51kRM8v1UX67IhpNsnvo3A==",
       "license": "MIT",
       "dependencies": {
         "typpy": "^2.0.0"
@@ -11399,8 +9868,6 @@
     },
     "node_modules/lines-and-columns": {
       "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
-      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
       "dev": true,
       "license": "MIT"
     },
@@ -11430,8 +9897,6 @@
     },
     "node_modules/lit-html": {
       "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/lit-html/-/lit-html-3.3.3.tgz",
-      "integrity": "sha512-el8M6jK2o3RXBnrSHX3ZKrsN8zEV63pSExTO1wYJz7QndGYZ8353e2a5PPX+qHe2aGayfnchQmkAojaWAREOIA==",
       "license": "BSD-3-Clause",
       "dependencies": {
         "@types/trusted-types": "^2.0.2"
@@ -11439,8 +9904,6 @@
     },
     "node_modules/loader-runner": {
       "version": "4.3.2",
-      "resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-4.3.2.tgz",
-      "integrity": "sha512-DFEqQ3ihfS9blba08cLfYf1NRAIEm+dDjic073DRDc3/JspI/8wYmtDsHwd3+4hwvdxSK7PGaElfTmm0awWJ4w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11453,8 +9916,6 @@
     },
     "node_modules/locate-path": {
       "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
-      "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11469,29 +9930,21 @@
     },
     "node_modules/lodash": {
       "version": "4.18.1",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.18.1.tgz",
-      "integrity": "sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
-      "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/lower-case": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
-      "integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11500,8 +9953,6 @@
     },
     "node_modules/lowercase-keys": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
-      "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -11509,8 +9960,6 @@
     },
     "node_modules/lru-cache": {
       "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
-      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -11519,8 +9968,6 @@
     },
     "node_modules/lz-string": {
       "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
-      "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -11529,8 +9976,6 @@
     },
     "node_modules/make-dir": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
-      "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11543,8 +9988,6 @@
     },
     "node_modules/make-dir/node_modules/semver": {
       "version": "5.7.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
-      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -11553,8 +9996,6 @@
     },
     "node_modules/makeerror": {
       "version": "1.0.12",
-      "resolved": "https://registry.npmjs.org/makeerror/-/makeerror-1.0.12.tgz",
-      "integrity": "sha512-JmqCvUhmt43madlpFzG4BQzG2Z3m6tvQDNKdClZnO3VbIudJYmxsT0FNJMeiB2+JTSlTQTSbU8QdesVmwJcmLg==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -11563,8 +10004,6 @@
     },
     "node_modules/math-intrinsics": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
-      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11573,8 +10012,6 @@
     },
     "node_modules/md5.js": {
       "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
-      "integrity": "sha512-xitP+WxNPcTTOgnTJcrhM0xvdPepipPSf3I8EIpGKeFLjt3PlJLIDG3u8EX53ZIubkb+5U2+3rELYpEhHhzdkg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11585,15 +10022,11 @@
     },
     "node_modules/mdn-data": {
       "version": "2.27.1",
-      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.27.1.tgz",
-      "integrity": "sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==",
       "dev": true,
       "license": "CC0-1.0"
     },
     "node_modules/media-typer": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
-      "integrity": "sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11602,8 +10035,6 @@
     },
     "node_modules/memfs": {
       "version": "4.57.2",
-      "resolved": "https://registry.npmjs.org/memfs/-/memfs-4.57.2.tgz",
-      "integrity": "sha512-2nWzSsJzrukurSDna4Z0WywuScK4Id3tSKejgu74u8KCdW4uNrseKRSIDg75C6Yw5ZRqBe0F0EtMNlTbUq8bAQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -11632,8 +10063,6 @@
     },
     "node_modules/merge-descriptors": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.3.tgz",
-      "integrity": "sha512-gaNvAS7TZ897/rVaZ0nMtAyxNyi/pdbjbAwUpFQpN70GqnVfOiXpeUUMKRBmzXaSQ8DdTX4/0ms62r2K+hE6mQ==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -11642,15 +10071,11 @@
     },
     "node_modules/merge-stream": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
-      "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/methods": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
-      "integrity": "sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11659,8 +10084,6 @@
     },
     "node_modules/micromatch": {
       "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
-      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11673,8 +10096,6 @@
     },
     "node_modules/miller-rabin": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
-      "integrity": "sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11687,15 +10108,11 @@
     },
     "node_modules/miller-rabin/node_modules/bn.js": {
       "version": "4.12.3",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.3.tgz",
-      "integrity": "sha512-fGTi3gxV/23FTYdAoUtLYp6qySe2KE3teyZitipKNRuVYcBkoP/bB3guXN/XVKUe9mxCHXnc9C4ocyz8OmgN0g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/mime": {
       "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
-      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -11707,8 +10124,6 @@
     },
     "node_modules/mime-db": {
       "version": "1.54.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
-      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11717,8 +10132,6 @@
     },
     "node_modules/mime-types": {
       "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.2.tgz",
-      "integrity": "sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11734,8 +10147,6 @@
     },
     "node_modules/mimic-fn": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
-      "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11744,8 +10155,6 @@
     },
     "node_modules/min-indent": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
-      "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11754,22 +10163,16 @@
     },
     "node_modules/minimalistic-assert": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
-      "integrity": "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/minimalistic-crypto-utils": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/minimalistic-crypto-utils/-/minimalistic-crypto-utils-1.0.1.tgz",
-      "integrity": "sha512-JIYlbt6g8i5jKfJ3xz7rF0LXmv2TkDxBLUkiBeZ7bAx4GnnNMr8xFpGnOxn6GhTEHx3SjRrZEoU+j04prX1ktg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/minimatch": {
       "version": "10.2.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.2.5.tgz",
-      "integrity": "sha512-MULkVLfKGYDFYejP07QOurDLLQpcjk7Fw+7jXS2R2czRQzR56yHRveU5NDJEOviH+hETZKSkIk5c+T23GjFUMg==",
       "dev": true,
       "license": "BlueOak-1.0.0",
       "dependencies": {
@@ -11784,8 +10187,6 @@
     },
     "node_modules/minimist": {
       "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
-      "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==",
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -11793,8 +10194,6 @@
     },
     "node_modules/minipass": {
       "version": "7.1.3",
-      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.3.tgz",
-      "integrity": "sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A==",
       "dev": true,
       "license": "BlueOak-1.0.0",
       "engines": {
@@ -11803,15 +10202,11 @@
     },
     "node_modules/ms": {
       "version": "2.1.3",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
-      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/multicast-dns": {
       "version": "7.2.5",
-      "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-7.2.5.tgz",
-      "integrity": "sha512-2eznPJP8z2BFLX50tf0LuODrpINqP1RVIm/CObbTcBRITQgmC/TjcREF1NeTBzIcR5XO/ukWo+YHOjBbFwIupg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11824,8 +10219,6 @@
     },
     "node_modules/n3": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/n3/-/n3-2.0.3.tgz",
-      "integrity": "sha512-um/toGVENTarHBYIK2TdH6ByBhW75WpdKpv8iTYt9wF2QfBk8s8a16iaWZFUAAC1BKfGdb99kfgx6pltdDwfKA==",
       "license": "MIT",
       "dependencies": {
         "buffer": "^6.0.3",
@@ -11837,8 +10230,6 @@
     },
     "node_modules/n3/node_modules/buffer": {
       "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz",
-      "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",
       "funding": [
         {
           "type": "github",
@@ -11861,8 +10252,6 @@
     },
     "node_modules/n3/node_modules/readable-stream": {
       "version": "4.7.0",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-4.7.0.tgz",
-      "integrity": "sha512-oIGGmcpTLwPga8Bn6/Z75SVaH1z5dUut2ibSyAMVhmUggWpmDn2dapB0n7f8nwaSiRtepAsfJyfXIO5DCVAODg==",
       "license": "MIT",
       "dependencies": {
         "abort-controller": "^3.0.0",
@@ -11877,8 +10266,6 @@
     },
     "node_modules/nanoid": {
       "version": "3.3.12",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.12.tgz",
-      "integrity": "sha512-ZB9RH/39qpq5Vu6Y+NmUaFhQR6pp+M2Xt76XBnEwDaGcVAqhlvxrl3B2bKS5D3NH3QR76v3aSrKaF/Kiy7lEtQ==",
       "dev": true,
       "funding": [
         {
@@ -11896,8 +10283,6 @@
     },
     "node_modules/napi-postinstall": {
       "version": "0.3.4",
-      "resolved": "https://registry.npmjs.org/napi-postinstall/-/napi-postinstall-0.3.4.tgz",
-      "integrity": "sha512-PHI5f1O0EP5xJ9gQmFGMS6IZcrVvTjpXjz7Na41gTE7eE2hK11lg04CECCYEEjdc17EV4DO+fkGEtt7TpTaTiQ==",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -11912,15 +10297,11 @@
     },
     "node_modules/natural-compare": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
-      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/negotiator": {
       "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.4.tgz",
-      "integrity": "sha512-myRT3DiWPHqho5PrJaIRyaMv2kgYf0mUVgBNOYMuCH5Ki1yEiQaf/ZJuQ62nvpc44wL5WDbTX7yGJi1Neevw8w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11929,15 +10310,11 @@
     },
     "node_modules/neo-async": {
       "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz",
-      "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/no-case": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz",
-      "integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11947,8 +10324,6 @@
     },
     "node_modules/node-fetch": {
       "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.7.0.tgz",
-      "integrity": "sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==",
       "license": "MIT",
       "dependencies": {
         "whatwg-url": "^5.0.0"
@@ -11967,20 +10342,14 @@
     },
     "node_modules/node-fetch/node_modules/tr46": {
       "version": "0.0.3",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-0.0.3.tgz",
-      "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==",
       "license": "MIT"
     },
     "node_modules/node-fetch/node_modules/webidl-conversions": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
-      "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==",
       "license": "BSD-2-Clause"
     },
     "node_modules/node-fetch/node_modules/whatwg-url": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",
-      "integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
       "license": "MIT",
       "dependencies": {
         "tr46": "~0.0.3",
@@ -11989,15 +10358,11 @@
     },
     "node_modules/node-int64": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/node-int64/-/node-int64-0.4.0.tgz",
-      "integrity": "sha512-O5lz91xSOeoXP6DulyHfllpq+Eg00MWitZIbtPfoSEvqIHdl5gfcY6hYzDWnj0qD5tz52PI08u9qUvSVeUBeHw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/node-polyfill-webpack-plugin": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/node-polyfill-webpack-plugin/-/node-polyfill-webpack-plugin-4.1.0.tgz",
-      "integrity": "sha512-b4ei444EKkOagG/yFqojrD3QTYM5IOU1f8tn9o6uwrG4qL+brI7oVhjPVd0ZL2xy+Z6CP5bu9w8XTvlWgiXHcw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12013,8 +10378,6 @@
     },
     "node_modules/node-polyfill-webpack-plugin/node_modules/type-fest": {
       "version": "4.41.0",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.41.0.tgz",
-      "integrity": "sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA==",
       "dev": true,
       "license": "(MIT OR CC0-1.0)",
       "engines": {
@@ -12026,15 +10389,11 @@
     },
     "node_modules/node-releases": {
       "version": "2.0.44",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.44.tgz",
-      "integrity": "sha512-5WUyunoPMsvvEhS8AxHtRzP+oA8UCkJ7YRxatWKjngndhDGLiqEVAQKWjFAiAiuL8zMRGzGSJxFnLetoa43qGQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/node-status-codes": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz",
-      "integrity": "sha512-1cBMgRxdMWE8KeWCqk2RIOrvUb0XCwYfEsY5/y2NlXyq4Y/RumnOZvTj4Nbr77+Vb2C+kyBoRTdkNOS8L3d/aQ==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -12042,8 +10401,6 @@
     },
     "node_modules/node-stdlib-browser": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/node-stdlib-browser/-/node-stdlib-browser-1.3.1.tgz",
-      "integrity": "sha512-X75ZN8DCLftGM5iKwoYLA3rjnrAEs97MkzvSd4q2746Tgpg8b8XWiBGiBG4ZpgcAqBgtgPHTiAc8ZMCvZuikDw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12081,8 +10438,6 @@
     },
     "node_modules/node-stdlib-browser/node_modules/pkg-dir": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-5.0.0.tgz",
-      "integrity": "sha512-NPE8TDbzl/3YQYY7CSS228s3g2ollTFnc+Qi3tqmqJp9Vg2ovUpixcJEo2HJScN2Ez+kEaal6y70c0ehqJBJeA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12094,14 +10449,10 @@
     },
     "node_modules/noop6": {
       "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/noop6/-/noop6-1.0.10.tgz",
-      "integrity": "sha512-WZvuCILZFZHK+WuqCQwxLBGllkBK1ct8s8Mu9FMDbEsBE6/bqNxyFGbX7Xky+6bYFL8X2Ou4Cis4CJyrwXLvQA==",
       "license": "MIT"
     },
     "node_modules/normalize-package-data": {
       "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz",
-      "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==",
       "license": "BSD-2-Clause",
       "dependencies": {
         "hosted-git-info": "^2.1.4",
@@ -12112,8 +10463,6 @@
     },
     "node_modules/normalize-package-data/node_modules/semver": {
       "version": "5.7.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
-      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
       "license": "ISC",
       "bin": {
         "semver": "bin/semver"
@@ -12121,8 +10470,6 @@
     },
     "node_modules/normalize-path": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
-      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12131,8 +10478,6 @@
     },
     "node_modules/npm-run-path": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz",
-      "integrity": "sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12144,8 +10489,6 @@
     },
     "node_modules/nth-check": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
-      "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -12157,15 +10500,11 @@
     },
     "node_modules/nwsapi": {
       "version": "2.2.23",
-      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.23.tgz",
-      "integrity": "sha512-7wfH4sLbt4M0gCDzGE6vzQBo0bfTKjU7Sfpqy/7gs1qBfYz2vEJH6vXcBKpO3+6Yu1telwd0t9HpyOoLEQQbIQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/oargv": {
       "version": "3.4.11",
-      "resolved": "https://registry.npmjs.org/oargv/-/oargv-3.4.11.tgz",
-      "integrity": "sha512-FGTon9C71936EnOjx/NTsMxlLeWmw8zQQld4KDmgRxRtZ8fH1XpbLLRHmOioeZs/WoURz2OGR4KmDoTaL4ErJQ==",
       "license": "MIT",
       "dependencies": {
         "iterate-object": "^1.1.0",
@@ -12174,8 +10513,6 @@
     },
     "node_modules/obj-def": {
       "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/obj-def/-/obj-def-1.0.10.tgz",
-      "integrity": "sha512-RJpNUkO+1r/rXTBs82iU4scoC9Q1yp9HZbSk0ldpFe8362S6eTjUjSgTmECa1TtOBIe5pn4pwSzxIiWc8+jmWg==",
       "license": "MIT",
       "dependencies": {
         "deffy": "^2.2.2"
@@ -12183,8 +10520,6 @@
     },
     "node_modules/object-assign": {
       "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -12192,8 +10527,6 @@
     },
     "node_modules/object-inspect": {
       "version": "1.13.4",
-      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
-      "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12205,8 +10538,6 @@
     },
     "node_modules/object-is": {
       "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.6.tgz",
-      "integrity": "sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12222,8 +10553,6 @@
     },
     "node_modules/object-keys": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
-      "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12232,8 +10561,6 @@
     },
     "node_modules/object.assign": {
       "version": "4.1.7",
-      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.7.tgz",
-      "integrity": "sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12253,8 +10580,6 @@
     },
     "node_modules/obuf": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
-      "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==",
       "dev": true,
       "license": "MIT"
     },
@@ -12272,8 +10597,6 @@
     },
     "node_modules/on-finished": {
       "version": "2.4.1",
-      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
-      "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12285,8 +10608,6 @@
     },
     "node_modules/on-headers": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/on-headers/-/on-headers-1.1.0.tgz",
-      "integrity": "sha512-737ZY3yNnXy37FHkQxPzt4UZ2UWPWiCZWLvFZ4fu5cueciegX0zGPnrlY6bwRg4FdQOe9YU8MkmJwGhoMybl8A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12295,8 +10616,6 @@
     },
     "node_modules/once": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
-      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -12305,8 +10624,6 @@
     },
     "node_modules/one-by-one": {
       "version": "3.2.9",
-      "resolved": "https://registry.npmjs.org/one-by-one/-/one-by-one-3.2.9.tgz",
-      "integrity": "sha512-H10TAq02LKrkSRTQz1mgvcKb64rRajZ+B5HWHBvkGigYNCPqL0Q/tLIN3vfha/DqZxXeKNfyCmgfEYo2hgFQgA==",
       "license": "MIT",
       "dependencies": {
         "obj-def": "^1.0.0",
@@ -12315,8 +10632,6 @@
     },
     "node_modules/onetime": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.2.tgz",
-      "integrity": "sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12331,8 +10646,6 @@
     },
     "node_modules/open": {
       "version": "10.2.0",
-      "resolved": "https://registry.npmjs.org/open/-/open-10.2.0.tgz",
-      "integrity": "sha512-YgBpdJHPyQ2UE5x+hlSXcnejzAvD0b22U2OuAP+8OnlJT+PjWPxtgmGqKKc+RgTM63U9gN0YzrYc71R2WT/hTA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12350,8 +10663,6 @@
     },
     "node_modules/optionator": {
       "version": "0.9.4",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
-      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12368,15 +10679,11 @@
     },
     "node_modules/os-browserify": {
       "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.3.0.tgz",
-      "integrity": "sha512-gjcpUc3clBf9+210TRaDWbf+rZZZEshZ+DlXMRCeAjp0xhTrnQsKHypIy1J3d5hKdUzj69t708EHtU8P6bUn0A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/os-tmpdir": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
-      "integrity": "sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -12384,8 +10691,6 @@
     },
     "node_modules/p-limit": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
-      "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12400,8 +10705,6 @@
     },
     "node_modules/p-locate": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz",
-      "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12416,8 +10719,6 @@
     },
     "node_modules/p-retry": {
       "version": "6.2.1",
-      "resolved": "https://registry.npmjs.org/p-retry/-/p-retry-6.2.1.tgz",
-      "integrity": "sha512-hEt02O4hUct5wtwg4H4KcWgDdm+l1bOaEy/hWzd8xtXB9BqxTWBBhb+2ImAtH4Cv4rPjV76xN3Zumqk3k3AhhQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12434,8 +10735,6 @@
     },
     "node_modules/p-try": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
-      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
       "license": "MIT",
       "engines": {
         "node": ">=6"
@@ -12443,8 +10742,6 @@
     },
     "node_modules/package-json": {
       "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
-      "integrity": "sha512-PRg65iXMTt/uK8Rfh5zvzkUbfAPitF17YaCY+IbHsYgksiLvtzWWTUildHth3mVaZ7871OJ7gtP4LBRBlmAdXg==",
       "license": "MIT",
       "dependencies": {
         "got": "^5.0.0",
@@ -12458,15 +10755,11 @@
     },
     "node_modules/package-json-from-dist": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
-      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
       "dev": true,
       "license": "BlueOak-1.0.0"
     },
     "node_modules/package-json-path": {
       "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/package-json-path/-/package-json-path-1.0.10.tgz",
-      "integrity": "sha512-DOlmVIfx+qDHHWaaxg573brZ8mH0Nxo4ecYA4SKkrpCOhCP64NXk7VxJtWVKZQ9urfU2Ivl74HeYUO42PLCpLw==",
       "license": "MIT",
       "dependencies": {
         "abs": "^1.2.1"
@@ -12474,23 +10767,16 @@
     },
     "node_modules/package-json/node_modules/semver": {
       "version": "5.7.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
-      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
       "license": "ISC",
       "bin": {
         "semver": "bin/semver"
       }
     },
     "node_modules/package-lock.json": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/package-lock.json/-/package-lock.json-1.0.0.tgz",
-      "integrity": "sha512-+yEXtNdlCs5N0Zy/9uvkifgf/RqnGu0WqP4j9Wu1Us4YReFe1YNBh2Krmf8B1xGxjpYnta63K55QP8bkafnOzA=="
+      "version": "1.0.0"
     },
     "node_modules/package.json": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/package.json/-/package.json-2.0.1.tgz",
-      "integrity": "sha512-pSxZ6XR5yEawRN2ekxx9IKgPN5uNAYco7MCPxtBEWMKO3UKWa1X2CtQMzMgloeGj2g2o6cue3Sb5iPkByIJqlw==",
-      "deprecated": "Use pkg.json instead.",
       "license": "MIT",
       "dependencies": {
         "git-package-json": "^1.4.0",
@@ -12500,8 +10786,6 @@
     },
     "node_modules/pako": {
       "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
-      "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==",
       "dev": true,
       "license": "(MIT AND Zlib)"
     },
@@ -12517,8 +10801,6 @@
     },
     "node_modules/param-case": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz",
-      "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12528,8 +10810,6 @@
     },
     "node_modules/parent-module": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
-      "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12541,8 +10821,6 @@
     },
     "node_modules/parse-asn1": {
       "version": "5.1.9",
-      "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.9.tgz",
-      "integrity": "sha512-fIYNuZ/HastSb80baGOuPRo1O9cf4baWw5WsAp7dBuUzeTD/BoaG8sVTdlPFksBE2lF21dN+A1AnrpIjSWqHHg==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -12558,8 +10836,6 @@
     },
     "node_modules/parse-json": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
-      "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12577,8 +10853,6 @@
     },
     "node_modules/parse-url": {
       "version": "1.3.11",
-      "resolved": "https://registry.npmjs.org/parse-url/-/parse-url-1.3.11.tgz",
-      "integrity": "sha512-1wj9nkgH/5EboDxLwaTMGJh3oH3f+Gue+aGdh631oCqoSBpokzmMmOldvOeBPtB8GJBYJbaF93KPzlkU+Y1ksg==",
       "license": "MIT",
       "dependencies": {
         "is-ssh": "^1.3.0",
@@ -12587,14 +10861,10 @@
     },
     "node_modules/parse-url/node_modules/protocols": {
       "version": "1.4.8",
-      "resolved": "https://registry.npmjs.org/protocols/-/protocols-1.4.8.tgz",
-      "integrity": "sha512-IgjKyaUSjsROSO8/D49Ab7hP8mJgTYcqApOqdPhLoPxAplXmkp+zRvsrSQjFn5by0rhm4VH0GAUELIPpx7B1yg==",
       "license": "MIT"
     },
     "node_modules/parse5": {
       "version": "7.3.0",
-      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.3.0.tgz",
-      "integrity": "sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12606,8 +10876,6 @@
     },
     "node_modules/parseurl": {
       "version": "1.3.3",
-      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
-      "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12616,8 +10884,6 @@
     },
     "node_modules/pascal-case": {
       "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/pascal-case/-/pascal-case-3.1.2.tgz",
-      "integrity": "sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12627,15 +10893,11 @@
     },
     "node_modules/path-browserify": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz",
-      "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/path-exists": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
-      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -12643,15 +10905,11 @@
     },
     "node_modules/path-extra": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/path-extra/-/path-extra-1.0.3.tgz",
-      "integrity": "sha512-vYm3+GCkjUlT1rDvZnDVhNLXIRvwFPaN8ebHAFcuMJM/H0RBOPD7JrcldiNLd9AS3dhAyUHLa4Hny5wp1A+Ffw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/path-is-absolute": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
-      "integrity": "sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12660,8 +10918,6 @@
     },
     "node_modules/path-key": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
-      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12670,14 +10926,10 @@
     },
     "node_modules/path-parse": {
       "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
-      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
       "license": "MIT"
     },
     "node_modules/path-scurry": {
       "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
-      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
       "dev": true,
       "license": "BlueOak-1.0.0",
       "dependencies": {
@@ -12693,22 +10945,16 @@
     },
     "node_modules/path-scurry/node_modules/lru-cache": {
       "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/path-to-regexp": {
       "version": "0.1.13",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.13.tgz",
-      "integrity": "sha512-A/AGNMFN3c8bOlvV9RreMdrv7jsmF9XIfDeCd87+I8RNg6s78BhJxMu69NEMHBSJFxKidViTEdruRwEk/WIKqA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/pbkdf2": {
       "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/pbkdf2/-/pbkdf2-3.1.5.tgz",
-      "integrity": "sha512-Q3CG/cYvCO1ye4QKkuH7EXxs3VC/rI1/trd+qX2+PolbaKG0H+bgcZzrTt96mMyRtejk+JMCiLUn3y29W8qmFQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12725,15 +10971,11 @@
     },
     "node_modules/picocolors": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
-      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/picomatch": {
       "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
-      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12745,8 +10987,6 @@
     },
     "node_modules/pify": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
-      "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12755,8 +10995,6 @@
     },
     "node_modules/pinkie": {
       "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
-      "integrity": "sha512-MnUuEycAemtSaeFSjXKW/aroV7akBbY+Sv+RkyqFjgAe73F+MR0TBWKBRDkmfWq/HiFmdavfZ1G7h4SPZXaCSg==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -12764,8 +11002,6 @@
     },
     "node_modules/pinkie-promise": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
-      "integrity": "sha512-0Gni6D4UcLTbv9c57DfxDGdr41XfgUjqWZu492f0cIGr16zDU06BWP/RAEvOuo7CQ0CNjHaLlM59YJJFm3NWlw==",
       "license": "MIT",
       "dependencies": {
         "pinkie": "^2.0.0"
@@ -12776,8 +11012,6 @@
     },
     "node_modules/pirates": {
       "version": "4.0.7",
-      "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.7.tgz",
-      "integrity": "sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12786,8 +11020,6 @@
     },
     "node_modules/pkg-dir": {
       "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
-      "integrity": "sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12799,8 +11031,6 @@
     },
     "node_modules/pkg-dir/node_modules/find-up": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
-      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12813,8 +11043,6 @@
     },
     "node_modules/pkg-dir/node_modules/locate-path": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
-      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12826,8 +11054,6 @@
     },
     "node_modules/pkg-dir/node_modules/p-limit": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
-      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12842,8 +11068,6 @@
     },
     "node_modules/pkg-dir/node_modules/p-locate": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
-      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12855,8 +11079,6 @@
     },
     "node_modules/pkijs": {
       "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/pkijs/-/pkijs-3.4.0.tgz",
-      "integrity": "sha512-emEcLuomt2j03vxD54giVB4SxTjnsqkU692xZOZXHDVoYyypEm+b3jpiTcc+Cf+myooc+/Ly0z01jqeNHVgJGw==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -12873,8 +11095,6 @@
     },
     "node_modules/pkijs/node_modules/@noble/hashes": {
       "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.4.0.tgz",
-      "integrity": "sha512-V1JJ1WTRUqHHrOSh597hURcMqVKVGL/ea3kv0gSnEdsEZ0/+VyPghM1lMNGc00z7CIQorSvbKpuJkxvuHbvdbg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12886,8 +11106,6 @@
     },
     "node_modules/pngjs": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz",
-      "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==",
       "license": "MIT",
       "engines": {
         "node": ">=10.13.0"
@@ -12895,8 +11113,6 @@
     },
     "node_modules/possible-typed-array-names": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
-      "integrity": "sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -12905,8 +11121,6 @@
     },
     "node_modules/postcss": {
       "version": "8.5.14",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.14.tgz",
-      "integrity": "sha512-SoSL4+OSEtR99LHFZQiJLkT59C5B1amGO1NzTwj7TT1qCUgUO6hxOvzkOYxD+vMrXBM3XJIKzokoERdqQq/Zmg==",
       "dev": true,
       "funding": [
         {
@@ -12934,8 +11148,6 @@
     },
     "node_modules/postcss-modules-extract-imports": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz",
-      "integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -12947,8 +11159,6 @@
     },
     "node_modules/postcss-modules-local-by-default": {
       "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.2.0.tgz",
-      "integrity": "sha512-5kcJm/zk+GJDSfw+V/42fJ5fhjL5YbFDl8nVdXkJPLLW+Vf9mTD5Xe0wqIaDnLuL2U6cDNpTr+UQ+v2HWIBhzw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12965,8 +11175,6 @@
     },
     "node_modules/postcss-modules-scope": {
       "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.2.1.tgz",
-      "integrity": "sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -12981,8 +11189,6 @@
     },
     "node_modules/postcss-modules-values": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz",
-      "integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -12997,8 +11203,6 @@
     },
     "node_modules/postcss-selector-parser": {
       "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.1.tgz",
-      "integrity": "sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13011,15 +11215,11 @@
     },
     "node_modules/postcss-value-parser": {
       "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
-      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/prelude-ls": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
-      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13028,8 +11228,6 @@
     },
     "node_modules/prepend-http": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
-      "integrity": "sha512-PhmXi5XmoyKw1Un4E+opM2KcsJInDvKyuOumcjjw3waw86ZNjHwVUOOWLc4bCzLdcKNaWBH9e99sbWzDQsVaYg==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -13037,8 +11235,6 @@
     },
     "node_modules/pretty-error": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-4.0.0.tgz",
-      "integrity": "sha512-AoJ5YMAcXKYxKhuJGdcvse+Voc6v1RgnsR3nWcYU7q4t6z0Q6T86sv5Zq8VIRbOWWFpvdGE83LtdSMNd+6Y0xw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13048,8 +11244,6 @@
     },
     "node_modules/pretty-format": {
       "version": "27.5.1",
-      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
-      "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13063,8 +11257,6 @@
     },
     "node_modules/pretty-format/node_modules/ansi-styles": {
       "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13076,8 +11268,6 @@
     },
     "node_modules/process": {
       "version": "0.11.10",
-      "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
-      "integrity": "sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==",
       "license": "MIT",
       "engines": {
         "node": ">= 0.6.0"
@@ -13085,27 +11275,19 @@
     },
     "node_modules/process-nextick-args": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
       "license": "MIT"
     },
     "node_modules/promise-polyfill": {
       "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/promise-polyfill/-/promise-polyfill-8.3.0.tgz",
-      "integrity": "sha512-H5oELycFml5yto/atYqmjyigJoAo3+OXwolYiH7OfQuYlAqhxNvTfiNMbV9hsC6Yp83yE5r2KTVmtrG6R9i6Pg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/protocols": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/protocols/-/protocols-2.0.2.tgz",
-      "integrity": "sha512-hHVTzba3wboROl0/aWRRG9dMytgH6ow//STBZh43l/wQgmMhYhOFi0EHWAPtoCz9IAUymsyP0TSBHkhgMEGNnQ==",
       "license": "MIT"
     },
     "node_modules/proxy-addr": {
       "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
-      "integrity": "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13118,8 +11300,6 @@
     },
     "node_modules/proxy-addr/node_modules/ipaddr.js": {
       "version": "1.9.1",
-      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
-      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13128,8 +11308,6 @@
     },
     "node_modules/public-encrypt": {
       "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.3.tgz",
-      "integrity": "sha512-zVpa8oKZSz5bTMTFClc1fQOnyyEzpl5ozpi1B5YcvBrdohMjH2rfsBtyXcuNuwjsDIXmBYlF2N5FlJYhR29t8Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13143,22 +11321,16 @@
     },
     "node_modules/public-encrypt/node_modules/bn.js": {
       "version": "4.12.3",
-      "resolved": "https://registry.npmjs.org/bn.js/-/bn.js-4.12.3.tgz",
-      "integrity": "sha512-fGTi3gxV/23FTYdAoUtLYp6qySe2KE3teyZitipKNRuVYcBkoP/bB3guXN/XVKUe9mxCHXnc9C4ocyz8OmgN0g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/punycode": {
       "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/pure-rand": {
       "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/pure-rand/-/pure-rand-7.0.1.tgz",
-      "integrity": "sha512-oTUZM/NAZS8p7ANR3SHh30kXB+zK2r2BPcEn/awJIbOvq82WoMN4p62AWWp3Hhw50G0xMsw1mhIBLqHw64EcNQ==",
       "dev": true,
       "funding": [
         {
@@ -13174,8 +11346,6 @@
     },
     "node_modules/pvtsutils": {
       "version": "1.3.6",
-      "resolved": "https://registry.npmjs.org/pvtsutils/-/pvtsutils-1.3.6.tgz",
-      "integrity": "sha512-PLgQXQ6H2FWCaeRak8vvk1GW462lMxB5s3Jm673N82zI4vqtVUPuZdffdZbPDFRoU8kAhItWFtPCWiPpp4/EDg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13184,8 +11354,6 @@
     },
     "node_modules/pvutils": {
       "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/pvutils/-/pvutils-1.1.5.tgz",
-      "integrity": "sha512-KTqnxsgGiQ6ZAzZCVlJH5eOjSnvlyEgx1m8bkRJfOhmGRqfo5KLvmAlACQkrjEtOQ4B7wF9TdSLIs9O90MX9xA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13194,8 +11362,6 @@
     },
     "node_modules/qrcode": {
       "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.4.tgz",
-      "integrity": "sha512-1ca71Zgiu6ORjHqFBDpnSMTR2ReToX4l1Au1VFLyVeBTFavzQnv5JxMFr3ukHVKpSrSA2MCk0lNJSykjUfz7Zg==",
       "license": "MIT",
       "dependencies": {
         "dijkstrajs": "^1.0.1",
@@ -13211,8 +11377,6 @@
     },
     "node_modules/qrcode/node_modules/cliui": {
       "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
-      "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
       "license": "ISC",
       "dependencies": {
         "string-width": "^4.2.0",
@@ -13222,8 +11386,6 @@
     },
     "node_modules/qrcode/node_modules/find-up": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
-      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
       "license": "MIT",
       "dependencies": {
         "locate-path": "^5.0.0",
@@ -13235,8 +11397,6 @@
     },
     "node_modules/qrcode/node_modules/locate-path": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
-      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
       "license": "MIT",
       "dependencies": {
         "p-locate": "^4.1.0"
@@ -13247,8 +11407,6 @@
     },
     "node_modules/qrcode/node_modules/p-limit": {
       "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
-      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
       "license": "MIT",
       "dependencies": {
         "p-try": "^2.0.0"
@@ -13262,8 +11420,6 @@
     },
     "node_modules/qrcode/node_modules/p-locate": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
-      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
       "license": "MIT",
       "dependencies": {
         "p-limit": "^2.2.0"
@@ -13274,8 +11430,6 @@
     },
     "node_modules/qrcode/node_modules/wrap-ansi": {
       "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
-      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
       "license": "MIT",
       "dependencies": {
         "ansi-styles": "^4.0.0",
@@ -13288,14 +11442,10 @@
     },
     "node_modules/qrcode/node_modules/y18n": {
       "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
-      "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==",
       "license": "ISC"
     },
     "node_modules/qrcode/node_modules/yargs": {
       "version": "15.4.1",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz",
-      "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==",
       "license": "MIT",
       "dependencies": {
         "cliui": "^6.0.0",
@@ -13316,8 +11466,6 @@
     },
     "node_modules/qrcode/node_modules/yargs-parser": {
       "version": "18.1.3",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
-      "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
       "license": "ISC",
       "dependencies": {
         "camelcase": "^5.0.0",
@@ -13328,9 +11476,7 @@
       }
     },
     "node_modules/qs": {
-      "version": "6.15.2",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.2.tgz",
-      "integrity": "sha512-Rzq0KEyX/w/tEybncDgdkZrJgVUsUMk3xjh3t5bv3S1HTAtg+uOYt72+ZfwiQwKdysThkTBdL/rTi6HDmX9Ddw==",
+      "version": "6.15.1",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -13345,8 +11491,6 @@
     },
     "node_modules/querystring-es3": {
       "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
-      "integrity": "sha512-773xhDQnZBMFobEiztv8LIl70ch5MSF/jUQVlhwFyBILqq96anmoctVIYz+ZRp0qbCKATTn6ev02M3r7Ga5vqA==",
       "dev": true,
       "engines": {
         "node": ">=0.4.x"
@@ -13354,8 +11498,6 @@
     },
     "node_modules/r-json": {
       "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/r-json/-/r-json-1.3.1.tgz",
-      "integrity": "sha512-5nhRFfjVMQdrwKUfUlRpDUCocdKtjSnYZ1R/86mpZDV3MfsZ3dYYNjSGuMX+mPBvFvQBhdzxSqxkuLPLv4uFGg==",
       "license": "MIT",
       "dependencies": {
         "w-json": "1.3.10"
@@ -13363,8 +11505,6 @@
     },
     "node_modules/r-package-json": {
       "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/r-package-json/-/r-package-json-1.0.10.tgz",
-      "integrity": "sha512-g+KLu+aq3tkhW6gzjsfdWAyd+ZkueLTzkX2zpB2GIW7M/lOXal3nB8U36XOrIBGogJsz2H//xWA4mj9uGlcigw==",
       "license": "MIT",
       "dependencies": {
         "package-json-path": "^1.0.0",
@@ -13373,8 +11513,6 @@
     },
     "node_modules/randombytes": {
       "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
-      "integrity": "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13383,8 +11521,6 @@
     },
     "node_modules/randomfill": {
       "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/randomfill/-/randomfill-1.0.4.tgz",
-      "integrity": "sha512-87lcbR8+MhcWcUiQ+9e+Rwx8MyR2P7qnt15ynUlbm3TU/fjbgz4GsvfSUDTemtCCtVCqb4ZcEFlyPNTh9bBTLw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13394,8 +11530,6 @@
     },
     "node_modules/range-parser": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
-      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13404,8 +11538,6 @@
     },
     "node_modules/raw-body": {
       "version": "2.5.3",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.3.tgz",
-      "integrity": "sha512-s4VSOf6yN0rvbRZGxs8Om5CWj6seneMwK3oDb4lWDH0UPhWcxwOWw5+qk24bxq87szX1ydrwylIOp2uG1ojUpA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13420,8 +11552,6 @@
     },
     "node_modules/rc": {
       "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
-      "integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==",
       "license": "(BSD-2-Clause OR MIT OR Apache-2.0)",
       "dependencies": {
         "deep-extend": "^0.6.0",
@@ -13435,8 +11565,6 @@
     },
     "node_modules/rc/node_modules/strip-json-comments": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
-      "integrity": "sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -13444,8 +11572,6 @@
     },
     "node_modules/rdf-canonize": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/rdf-canonize/-/rdf-canonize-5.0.0.tgz",
-      "integrity": "sha512-g8OUrgMXAR9ys/ZuJVfBr05sPPoMA7nHIVs8VEvg9QwM5W4GR2qSFEEHjsyHF1eWlBaf8Ev40WNjQFQ+nJTO3w==",
       "license": "BSD-3-Clause",
       "dependencies": {
         "setimmediate": "^1.0.5"
@@ -13456,8 +11582,6 @@
     },
     "node_modules/rdflib": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/rdflib/-/rdflib-2.3.8.tgz",
-      "integrity": "sha512-moogxjqUHqZt+l6qbb0xZm7Cy+iwBwHhBev0N8/zkrCX+Q1iuMLrflUNxbeJO/f5E0XZ7AhyJjPrQkB9smYqIA==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.29.2",
@@ -13474,8 +11598,6 @@
     },
     "node_modules/rdflib/node_modules/cross-fetch": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-4.1.0.tgz",
-      "integrity": "sha512-uKm5PU+MHTootlWEY+mZ4vvXoCn4fLQxT9dSc1sXVMSFkINTJVN8cAQROpwcKm8bJ/c7rgZVIBWzH5T78sNZZw==",
       "license": "MIT",
       "dependencies": {
         "node-fetch": "^2.7.0"
@@ -13483,31 +11605,23 @@
     },
     "node_modules/react-is": {
       "version": "17.0.2",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
-      "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/react-is-18": {
       "name": "react-is",
       "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
-      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/react-is-19": {
       "name": "react-is",
       "version": "19.2.6",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.2.6.tgz",
-      "integrity": "sha512-XjBR15BhXuylgWGuslhDKqlSayuqvqBX91BP8pauG8kd1zY8kotkNWbXksTCNRarse4kuGbe2kIY05ARtwNIvw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/read-all-stream": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz",
-      "integrity": "sha512-DI1drPHbmBcUDWrJ7ull/F2Qb8HkwBncVx8/RpKYFSIACYaVRQReISYPdZz/mt1y1+qMCOrfReTopERmaxtP6w==",
       "license": "MIT",
       "dependencies": {
         "pinkie-promise": "^2.0.0",
@@ -13519,14 +11633,10 @@
     },
     "node_modules/read-all-stream/node_modules/isarray": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "license": "MIT"
     },
     "node_modules/read-all-stream/node_modules/readable-stream": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
       "license": "MIT",
       "dependencies": {
         "core-util-is": "~1.0.0",
@@ -13540,14 +11650,10 @@
     },
     "node_modules/read-all-stream/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "license": "MIT"
     },
     "node_modules/read-all-stream/node_modules/string_decoder": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "license": "MIT",
       "dependencies": {
         "safe-buffer": "~5.1.0"
@@ -13555,8 +11661,6 @@
     },
     "node_modules/readable-stream": {
       "version": "3.6.2",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
-      "integrity": "sha512-9u/sniCrY3D5WdsERHzHE4G2YCXqoG5FTHUiCC4SIbr6XcLZBY05ya9EKjYek9O5xOAwjGq+1JdGBAS7Q9ScoA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13570,8 +11674,6 @@
     },
     "node_modules/readdirp": {
       "version": "3.6.0",
-      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
-      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13583,8 +11685,6 @@
     },
     "node_modules/rechoir": {
       "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.8.0.tgz",
-      "integrity": "sha512-/vxpCXddiX8NGfGO/mTafwjq4aFa/71pvamip0++IQk3zG8cbCj0fifNPrjjF1XMXUne91jL9OoxmdykoEtifQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13596,8 +11696,6 @@
     },
     "node_modules/redent": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
-      "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13610,22 +11708,16 @@
     },
     "node_modules/reflect-metadata": {
       "version": "0.2.2",
-      "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
-      "integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q==",
       "dev": true,
       "license": "Apache-2.0"
     },
     "node_modules/regenerate": {
       "version": "1.4.2",
-      "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
-      "integrity": "sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/regenerate-unicode-properties": {
       "version": "10.2.2",
-      "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-10.2.2.tgz",
-      "integrity": "sha512-m03P+zhBeQd1RGnYxrGyDAPpWX/epKirLrp8e3qevZdVkKtnCrjjWczIbYc8+xd6vcTStVlqfycTx1KR4LOr0g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13637,8 +11729,6 @@
     },
     "node_modules/regexpu-core": {
       "version": "6.4.0",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-6.4.0.tgz",
-      "integrity": "sha512-0ghuzq67LI9bLXpOX/ISfve/Mq33a4aFRzoQYhnnok1JOFpmE/A2TBGkNVenOGEeSBCjIiWcc6MVOG5HEQv0sA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13655,8 +11745,6 @@
     },
     "node_modules/registry-auth-token": {
       "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-3.4.0.tgz",
-      "integrity": "sha512-4LM6Fw8eBQdwMYcES4yTnn2TqIasbXuwDx3um+QRs7S55aMKCBKBxvPXl2RiUjHwuJLTyYfxSpmfSAjQpcuP+A==",
       "license": "MIT",
       "dependencies": {
         "rc": "^1.1.6",
@@ -13665,8 +11753,6 @@
     },
     "node_modules/registry-url": {
       "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-3.1.0.tgz",
-      "integrity": "sha512-ZbgR5aZEdf4UKZVBPYIgaglBmSF2Hi94s2PcIHhRGFjKYu+chjJdYfHn4rt3hB6eCKLJ8giVIIfgMa1ehDfZKA==",
       "license": "MIT",
       "dependencies": {
         "rc": "^1.0.1"
@@ -13677,15 +11763,11 @@
     },
     "node_modules/regjsgen": {
       "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.8.0.tgz",
-      "integrity": "sha512-RvwtGe3d7LvWiDQXeQw8p5asZUmfU1G/l6WbUXeHta7Y2PEIvBTwH6E2EfmYUK8pxcxEdEmaomqyp0vZZ7C+3Q==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/regjsparser": {
       "version": "0.13.1",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.13.1.tgz",
-      "integrity": "sha512-dLsljMd9sqwRkby8zhO1gSg3PnJIBFid8f4CQj/sXx+7cKx+E7u0PKhZ+U4wmhx7EfmtvnA318oVaIkAB1lRJw==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -13697,8 +11779,6 @@
     },
     "node_modules/relateurl": {
       "version": "0.2.7",
-      "resolved": "https://registry.npmjs.org/relateurl/-/relateurl-0.2.7.tgz",
-      "integrity": "sha512-G08Dxvm4iDN3MLM0EsP62EDV9IuhXPR6blNz6Utcp7zyV3tr4HVNINt6MpaRWbxoOHT3Q7YN2P+jaHX8vUbgog==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13707,8 +11787,6 @@
     },
     "node_modules/renderkid": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-3.0.0.tgz",
-      "integrity": "sha512-q/7VIQA8lmM1hF+jn+sFSPWGlMkSAeNYcPLmDQx2zzuiDfaLrOmumR8iaUKlenFgh0XRPIUeSPlH3A+AW3Z5pg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13721,8 +11799,6 @@
     },
     "node_modules/require-directory": {
       "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
-      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -13730,8 +11806,6 @@
     },
     "node_modules/require-from-string": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
-      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13740,14 +11814,10 @@
     },
     "node_modules/require-main-filename": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
-      "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
       "license": "ISC"
     },
     "node_modules/require-resolve": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/require-resolve/-/require-resolve-0.0.2.tgz",
-      "integrity": "sha512-eafQVaxdQsWUB8HybwognkdcIdKdQdQBwTxH48FuE6WI0owZGKp63QYr1MRp73PoX0AcyB7MDapZThYUY8FD0A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13756,15 +11826,11 @@
     },
     "node_modules/requires-port": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
-      "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/resolve": {
       "version": "1.22.12",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.12.tgz",
-      "integrity": "sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA==",
       "license": "MIT",
       "dependencies": {
         "es-errors": "^1.3.0",
@@ -13784,8 +11850,6 @@
     },
     "node_modules/resolve-cwd": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-cwd/-/resolve-cwd-3.0.0.tgz",
-      "integrity": "sha512-OrZaX2Mb+rJCpH/6CpSqt9xFVpN++x01XnN2ie9g6P5/3xelLAkXWVADpdz1IHD/KFfEXyE6V0U01OQ3UO2rEg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13797,8 +11861,6 @@
     },
     "node_modules/resolve-from": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-5.0.0.tgz",
-      "integrity": "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13807,8 +11869,6 @@
     },
     "node_modules/retry": {
       "version": "0.13.1",
-      "resolved": "https://registry.npmjs.org/retry/-/retry-0.13.1.tgz",
-      "integrity": "sha512-XQBQ3I8W1Cge0Seh+6gjj03LbmRFWuoszgK9ooCpwYIrhhoO80pfq4cUkU5DkknwfOfFteRwlZ56PYOGYyFWdg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13817,8 +11877,6 @@
     },
     "node_modules/ripemd160": {
       "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/ripemd160/-/ripemd160-2.0.3.tgz",
-      "integrity": "sha512-5Di9UC0+8h1L6ZD2d7awM7E/T4uA1fJRlx6zk/NvdCCVEoAnFqvHmCuNeIKoCeIixBX/q8uM+6ycDvF8woqosA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13831,8 +11889,6 @@
     },
     "node_modules/ripemd160/node_modules/hash-base": {
       "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/hash-base/-/hash-base-3.1.2.tgz",
-      "integrity": "sha512-Bb33KbowVTIj5s7Ked1OsqHUeCpz//tPwR+E2zJgJKo9Z5XolZ9b6bdUgjmYlwnWhoOQKoTd1TYToZGn5mAYOg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13847,15 +11903,11 @@
     },
     "node_modules/ripemd160/node_modules/isarray": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/ripemd160/node_modules/readable-stream": {
       "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13870,15 +11922,11 @@
     },
     "node_modules/ripemd160/node_modules/readable-stream/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/ripemd160/node_modules/string_decoder": {
       "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13887,22 +11935,16 @@
     },
     "node_modules/ripemd160/node_modules/string_decoder/node_modules/safe-buffer": {
       "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/rrweb-cssom": {
       "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.8.0.tgz",
-      "integrity": "sha512-guoltQEx+9aMf2gDZ0s62EcV8lsXR+0w8915TC3ITdn2YueuNjdAYh/levpU9nFaoChh9RUS5ZdQMrKfVEN9tw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/run-applescript": {
       "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/run-applescript/-/run-applescript-7.1.0.tgz",
-      "integrity": "sha512-DPe5pVFaAsinSaV6QjQ6gdiedWDcRCbUuiQfQa2wmWV7+xC9bGulGI8+TdRmoFkAPaBXk8CrAbnlY2ISniJ47Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13914,8 +11956,6 @@
     },
     "node_modules/safe-buffer": {
       "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
-      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
       "funding": [
         {
           "type": "github",
@@ -13934,8 +11974,6 @@
     },
     "node_modules/safe-regex-test": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
-      "integrity": "sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13952,15 +11990,11 @@
     },
     "node_modules/safer-buffer": {
       "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
-      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/saxes": {
       "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
-      "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -13972,8 +12006,6 @@
     },
     "node_modules/schema-utils": {
       "version": "4.3.3",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.3.tgz",
-      "integrity": "sha512-eflK8wEtyOE6+hsaRVPxvUKYCpRgzLqDTb8krvAsRIwOGlHoSgYLgBXoubGgLd2fT41/OUYdb48v4k4WWHQurA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13992,8 +12024,6 @@
     },
     "node_modules/schema-utils/node_modules/ajv": {
       "version": "8.20.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.20.0.tgz",
-      "integrity": "sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14009,8 +12039,6 @@
     },
     "node_modules/schema-utils/node_modules/ajv-keywords": {
       "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
-      "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14022,22 +12050,16 @@
     },
     "node_modules/schema-utils/node_modules/json-schema-traverse": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
-      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/select-hose": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
-      "integrity": "sha512-mEugaLK+YfkijB4fx0e6kImuJdCIt2LxCRcbEYPqRGCs4F2ogyfZU5IAZRdjCP8JPq2AtdNoC/Dux63d9Kiryg==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/selfsigned": {
       "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/selfsigned/-/selfsigned-5.5.0.tgz",
-      "integrity": "sha512-ftnu3TW4+3eBfLRFnDEkzGxSF/10BJBkaLJuBHZX0kiPS7bRdlpZGu6YGt4KngMkdTwJE6MbjavFpqHvqVt+Ew==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14050,8 +12072,6 @@
     },
     "node_modules/semver": {
       "version": "6.3.1",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
-      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -14060,8 +12080,6 @@
     },
     "node_modules/send": {
       "version": "0.19.2",
-      "resolved": "https://registry.npmjs.org/send/-/send-0.19.2.tgz",
-      "integrity": "sha512-VMbMxbDeehAxpOtWJXlcUS5E8iXh6QmN+BkRX1GARS3wRaXEEgzCcB10gTQazO42tpNIya8xIyNx8fll1OFPrg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14085,8 +12103,6 @@
     },
     "node_modules/send/node_modules/debug": {
       "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14095,15 +12111,11 @@
     },
     "node_modules/send/node_modules/debug/node_modules/ms": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/serialize-javascript": {
       "version": "7.0.5",
-      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-7.0.5.tgz",
-      "integrity": "sha512-F4LcB0UqUl1zErq+1nYEEzSHJnIwb3AF2XWB94b+afhrekOUijwooAYqFyRbjYkm2PAKBabx6oYv/xDxNi8IBw==",
       "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
@@ -14112,8 +12124,6 @@
     },
     "node_modules/serve-index": {
       "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.2.tgz",
-      "integrity": "sha512-KDj11HScOaLmrPxl70KYNW1PksP4Nb/CLL2yvC+Qd2kHMPEEpfc4Re2e4FOay+bC/+XQl/7zAcWON3JVo5v3KQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14135,8 +12145,6 @@
     },
     "node_modules/serve-index/node_modules/debug": {
       "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14145,8 +12153,6 @@
     },
     "node_modules/serve-index/node_modules/depd": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
-      "integrity": "sha512-7emPTl6Dpo6JRXOXjLRxck+FlLRX5847cLKEn00PLAgc3g2hTZZgr+e4c2v6QpSmLeFP3n5yUo7ft6avBK/5jQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14155,8 +12161,6 @@
     },
     "node_modules/serve-index/node_modules/http-errors": {
       "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.8.1.tgz",
-      "integrity": "sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14172,8 +12176,6 @@
     },
     "node_modules/serve-index/node_modules/mime-db": {
       "version": "1.52.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
-      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14182,8 +12184,6 @@
     },
     "node_modules/serve-index/node_modules/mime-types": {
       "version": "2.1.35",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
-      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14195,15 +12195,11 @@
     },
     "node_modules/serve-index/node_modules/ms": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/serve-index/node_modules/statuses": {
       "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
-      "integrity": "sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14212,8 +12208,6 @@
     },
     "node_modules/serve-static": {
       "version": "1.16.3",
-      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-1.16.3.tgz",
-      "integrity": "sha512-x0RTqQel6g5SY7Lg6ZreMmsOzncHFU7nhnRWkKgWuMTu5NN0DR5oruckMqRvacAN9d5w6ARnRBXl9xhDCgfMeA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14228,14 +12222,10 @@
     },
     "node_modules/set-blocking": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
-      "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==",
       "license": "ISC"
     },
     "node_modules/set-function-length": {
       "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
-      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14252,21 +12242,15 @@
     },
     "node_modules/setimmediate": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz",
-      "integrity": "sha512-MATJdZp8sLqDl/68LfQmbP8zKPLQNV6BIZoIgrscFDQ+RsvK/BxeDQOgyxKKoh0y/8h3BqVFnCqQ/gd+reiIXA==",
       "license": "MIT"
     },
     "node_modules/setprototypeof": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
-      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/sha.js": {
       "version": "2.4.12",
-      "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.12.tgz",
-      "integrity": "sha512-8LzC5+bvI45BjpfXU8V5fdU2mfeKiQe1D1gIMn7XUlF3OTUrpdJpPPH4EMAnF0DsHHdSZqCdSss5qCmJKuiO3w==",
       "dev": true,
       "license": "(MIT AND BSD-3-Clause)",
       "dependencies": {
@@ -14286,8 +12270,6 @@
     },
     "node_modules/shallow-clone": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz",
-      "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14299,8 +12281,6 @@
     },
     "node_modules/shebang-command": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
-      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14312,8 +12292,6 @@
     },
     "node_modules/shebang-regex": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
-      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14322,8 +12300,6 @@
     },
     "node_modules/shell-quote": {
       "version": "1.8.3",
-      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.3.tgz",
-      "integrity": "sha512-ObmnIF4hXNg1BqhnHmgbDETF8dLPCggZWBjkQfhZpbszZnYur5DUljTcCHii5LC3J5E0yeO/1LIMyH+UvHQgyw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14333,10 +12309,18 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/short-unique-id": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/short-unique-id/-/short-unique-id-5.3.2.tgz",
+      "integrity": "sha512-KRT/hufMSxXKEDSQujfVE0Faa/kZ51ihUcZQAcmP04t00DvPj7Ox5anHke1sJYUtzSuiT/Y5uyzg/W7bBEGhCg==",
+      "license": "Apache-2.0",
+      "bin": {
+        "short-unique-id": "bin/short-unique-id",
+        "suid": "bin/short-unique-id"
+      }
+    },
     "node_modules/side-channel": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
-      "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14355,8 +12339,6 @@
     },
     "node_modules/side-channel-list": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.1.tgz",
-      "integrity": "sha512-mjn/0bi/oUURjc5Xl7IaWi/OJJJumuoJFQJfDDyO46+hBWsfaVM65TBHq2eoZBhzl9EchxOijpkbRC8SVBQU0w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14372,8 +12354,6 @@
     },
     "node_modules/side-channel-map": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
-      "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14391,8 +12371,6 @@
     },
     "node_modules/side-channel-weakmap": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
-      "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14411,15 +12389,11 @@
     },
     "node_modules/signal-exit": {
       "version": "3.0.7",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz",
-      "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/slash": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
-      "integrity": "sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14428,15 +12402,10 @@
     },
     "node_modules/sliced": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/sliced/-/sliced-1.0.1.tgz",
-      "integrity": "sha512-VZBmZP8WU3sMOZm1bdgTadsQbcscK0UM8oKxKVBs4XAhUo2Xxzm/OFMGBkPusxw9xL3Uy8LrzEqGqJhclsr0yA==",
-      "deprecated": "Unsupported",
       "license": "MIT"
     },
     "node_modules/sockjs": {
       "version": "0.3.24",
-      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
-      "integrity": "sha512-GJgLTZ7vYb/JtPSSZ10hsOYIvEYsjbNU+zPdIHcUaWVNUEPivzxku31865sSSud0Da0W4lEeOPlmw93zLQchuQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14447,9 +12416,6 @@
     },
     "node_modules/sockjs/node_modules/uuid": {
       "version": "8.3.2",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
-      "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
-      "deprecated": "uuid@10 and below is no longer supported.  For ESM codebases, update to uuid@latest.  For CommonJS codebases, use uuid@11 (but be aware this version will likely be deprecated in 2028).",
       "dev": true,
       "license": "MIT",
       "bin": {
@@ -14474,8 +12440,6 @@
     },
     "node_modules/solid-namespace": {
       "version": "0.5.4",
-      "resolved": "https://registry.npmjs.org/solid-namespace/-/solid-namespace-0.5.4.tgz",
-      "integrity": "sha512-oPAv8xIg2MOLz069JRdvsSbYCpQN+umPJJ9LBFPzCrYuSw+dW4TMUOTDxTWS5xy+B3XN4+Fx3iIS5Jm8abm4Mg==",
       "license": "MIT"
     },
     "node_modules/solid-ui": {
@@ -14518,8 +12482,6 @@
     },
     "node_modules/source-map": {
       "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
       "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
@@ -14528,8 +12490,6 @@
     },
     "node_modules/source-map-js": {
       "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
-      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
       "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
@@ -14538,8 +12498,6 @@
     },
     "node_modules/source-map-support": {
       "version": "0.5.13",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.13.tgz",
-      "integrity": "sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14549,8 +12507,6 @@
     },
     "node_modules/spdx-correct": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.2.0.tgz",
-      "integrity": "sha512-kN9dJbvnySHULIluDHy32WHRUu3Og7B9sbY7tsFLctQkIqnMh3hErYgdMjTYuqmcXX+lK5T1lnUt3G7zNswmZA==",
       "license": "Apache-2.0",
       "dependencies": {
         "spdx-expression-parse": "^3.0.0",
@@ -14559,14 +12515,10 @@
     },
     "node_modules/spdx-exceptions": {
       "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
-      "integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
       "license": "CC-BY-3.0"
     },
     "node_modules/spdx-expression-parse": {
       "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-3.0.1.tgz",
-      "integrity": "sha512-cbqHunsQWnJNE6KhVSMsMeH5H/L9EpymbzqTQ3uLwNCLZ1Q481oWaofqH7nO6V07xlXwY6PhQdQ2IedWx/ZK4Q==",
       "license": "MIT",
       "dependencies": {
         "spdx-exceptions": "^2.1.0",
@@ -14575,14 +12527,10 @@
     },
     "node_modules/spdx-license-ids": {
       "version": "3.0.23",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.23.tgz",
-      "integrity": "sha512-CWLcCCH7VLu13TgOH+r8p1O/Znwhqv/dbb6lqWy67G+pT1kHmeD/+V36AVb/vq8QMIQwVShJ6Ssl5FPh0fuSdw==",
       "license": "CC0-1.0"
     },
     "node_modules/spdy": {
       "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/spdy/-/spdy-4.0.2.tgz",
-      "integrity": "sha512-r46gZQZQV+Kl9oItvl1JZZqJKGr+oEkB08A6BzkiR7593/7IbtuncXHd2YoYeTsG4157ZssMu9KYvUHLcjcDoA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14598,8 +12546,6 @@
     },
     "node_modules/spdy-transport": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-3.0.0.tgz",
-      "integrity": "sha512-hsLVFE5SjA6TCisWeJXFKniGGOpBgMLmerfO2aCyCU5s7nJ/rpAepqmFifv/GCbSbueEeAJJnmSQ2rKC/g8Fcw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14613,15 +12559,11 @@
     },
     "node_modules/sprintf-js": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
-      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
       "dev": true,
       "license": "BSD-3-Clause"
     },
     "node_modules/stack-utils": {
       "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/stack-utils/-/stack-utils-2.0.6.tgz",
-      "integrity": "sha512-XlkWvfIm6RmsWtNJx+uqtKLS8eqFbxUg0ZzLXqY0caEy9l7hruX8IpiDnjsLavoBgqCCR71TqWO8MaXYheJ3RQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14633,8 +12575,6 @@
     },
     "node_modules/stack-utils/node_modules/escape-string-regexp": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz",
-      "integrity": "sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14643,8 +12583,6 @@
     },
     "node_modules/statuses": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
-      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14653,8 +12591,6 @@
     },
     "node_modules/stream-browserify": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/stream-browserify/-/stream-browserify-3.0.0.tgz",
-      "integrity": "sha512-H73RAHsVBapbim0tU2JwwOiXUj+fikfiaoYAKHF3VJfA0pe2BCzkhAHBlLG6REzE+2WNZcxOXjK7lkso+9euLA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14664,8 +12600,6 @@
     },
     "node_modules/stream-http": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/stream-http/-/stream-http-3.2.0.tgz",
-      "integrity": "sha512-Oq1bLqisTyK3TSCXpPbT4sdeYNdmyZJv1LxpEm2vu1ZhK89kSE5YXwZc3cWk0MagGaKriBh9mCFbVGtO+vY29A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14677,8 +12611,6 @@
     },
     "node_modules/string_decoder": {
       "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
-      "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
       "license": "MIT",
       "dependencies": {
         "safe-buffer": "~5.2.0"
@@ -14686,8 +12618,6 @@
     },
     "node_modules/string-length": {
       "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/string-length/-/string-length-4.0.2.tgz",
-      "integrity": "sha512-+l6rNN5fYHNhZZy41RXsYptCjA2Igmq4EG7kZAYFQI1E1VTXarr6ZPXBg6eq7Y6eK4FEhY6AJlyuFIb/v/S0VQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14700,8 +12630,6 @@
     },
     "node_modules/string-width": {
       "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
       "license": "MIT",
       "dependencies": {
         "emoji-regex": "^8.0.0",
@@ -14715,8 +12643,6 @@
     "node_modules/string-width-cjs": {
       "name": "string-width",
       "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
-      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14730,8 +12656,6 @@
     },
     "node_modules/strip-ansi": {
       "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^5.0.1"
@@ -14743,8 +12667,6 @@
     "node_modules/strip-ansi-cjs": {
       "name": "strip-ansi",
       "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
-      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14756,8 +12678,6 @@
     },
     "node_modules/strip-bom": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-4.0.0.tgz",
-      "integrity": "sha512-3xurFv5tEgii33Zi8Jtp55wEIILR9eh34FAW00PZf+JnSsTmV/ioewSgQl97JHvgjoRGwPShsWm+IdrxB35d0w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14766,8 +12686,6 @@
     },
     "node_modules/strip-final-newline": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/strip-final-newline/-/strip-final-newline-2.0.0.tgz",
-      "integrity": "sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14776,8 +12694,6 @@
     },
     "node_modules/strip-indent": {
       "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
-      "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14789,8 +12705,6 @@
     },
     "node_modules/strip-json-comments": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
-      "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14802,8 +12716,6 @@
     },
     "node_modules/style-loader": {
       "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-4.0.0.tgz",
-      "integrity": "sha512-1V4WqhhZZgjVAVJyt7TdDPZoPBPNHbekX4fWnCJL1yQukhCeZhJySUL+gL9y6sNdN95uEOS83Y55SqHcP7MzLA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14819,8 +12731,6 @@
     },
     "node_modules/supports-color": {
       "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14832,8 +12742,6 @@
     },
     "node_modules/supports-preserve-symlinks-flag": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
-      "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
       "license": "MIT",
       "engines": {
         "node": ">= 0.4"
@@ -14844,15 +12752,11 @@
     },
     "node_modules/symbol-tree": {
       "version": "3.2.4",
-      "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
-      "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/synckit": {
       "version": "0.11.12",
-      "resolved": "https://registry.npmjs.org/synckit/-/synckit-0.11.12.tgz",
-      "integrity": "sha512-Bh7QjT8/SuKUIfObSXNHNSK6WHo6J1tHCqJsuaFDP7gP0fkzSfTxI8y85JrppZ0h8l0maIgc2tfuZQ6/t3GtnQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14867,8 +12771,6 @@
     },
     "node_modules/tapable": {
       "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.3.tgz",
-      "integrity": "sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14881,8 +12783,6 @@
     },
     "node_modules/terser": {
       "version": "5.47.1",
-      "resolved": "https://registry.npmjs.org/terser/-/terser-5.47.1.tgz",
-      "integrity": "sha512-tPbLXTI6ohPASb/1YViL428oEHu6/qv1OxqYnfaonVCFHqx4+wCd95pHrQWsL5X4pl90CTyW9piSAsS2L0VoMw==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -14900,8 +12800,6 @@
     },
     "node_modules/terser-webpack-plugin": {
       "version": "5.6.0",
-      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.6.0.tgz",
-      "integrity": "sha512-Eum+5ajkaOhf5KbM26osvv21kLD7BaGqQ1UA4Ami4arYwylmGUQTgHFpHDdmJod1q4QXa66p0to/FBKID+J1vA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14961,8 +12859,6 @@
     },
     "node_modules/terser-webpack-plugin/node_modules/jest-worker": {
       "version": "27.5.1",
-      "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-27.5.1.tgz",
-      "integrity": "sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14976,8 +12872,6 @@
     },
     "node_modules/terser-webpack-plugin/node_modules/supports-color": {
       "version": "8.1.1",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
-      "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -14992,15 +12886,11 @@
     },
     "node_modules/terser/node_modules/commander": {
       "version": "2.20.3",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
-      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/terser/node_modules/source-map-support": {
       "version": "0.5.21",
-      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
-      "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15010,8 +12900,6 @@
     },
     "node_modules/test-exclude": {
       "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/test-exclude/-/test-exclude-6.0.0.tgz",
-      "integrity": "sha512-cAGWPIyOHU6zlmg88jwm7VRyXnMN7iV68OGAbYDk/Mh/xC/pzVPlQtY6ngoIH/5/tciuhGfvESU8GrHrcxD56w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -15025,15 +12913,11 @@
     },
     "node_modules/test-exclude/node_modules/balanced-match": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/test-exclude/node_modules/brace-expansion": {
       "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.14.tgz",
-      "integrity": "sha512-MWPGfDxnyzKU7rNOW9SP/c50vi3xrmrua/+6hfPbCS2ABNWfx24vPidzvC7krjU/RTo235sV776ymlsMtGKj8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15043,8 +12927,6 @@
     },
     "node_modules/test-exclude/node_modules/minimatch": {
       "version": "3.1.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
-      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -15056,8 +12938,6 @@
     },
     "node_modules/thingies": {
       "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/thingies/-/thingies-2.6.0.tgz",
-      "integrity": "sha512-rMHRjmlFLM1R96UYPvpmnc3LYtdFrT33JIB7L9hetGue1qAPfn1N2LJeEjxUSidu1Iku+haLZXDuEXUHNGO/lg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15073,15 +12953,11 @@
     },
     "node_modules/thunky": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz",
-      "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/timed-out": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-2.0.0.tgz",
-      "integrity": "sha512-pqqJOi1rF5zNs/ps4vmbE4SFCrM4iR7LW+GHAsHqO/EumqbIWceioevYLM5xZRgQSH6gFgL9J/uB7EcJhQ9niQ==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
@@ -15089,8 +12965,6 @@
     },
     "node_modules/timers-browserify": {
       "version": "2.0.12",
-      "resolved": "https://registry.npmjs.org/timers-browserify/-/timers-browserify-2.0.12.tgz",
-      "integrity": "sha512-9phl76Cqm6FhSX9Xe1ZUAMLtm1BLkKj2Qd5ApyWkXzsMRaA7dgr81kf4wJmQf/hAvg8EEyJxDo3du/0KlhPiKQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15102,8 +12976,6 @@
     },
     "node_modules/tinyglobby": {
       "version": "0.2.16",
-      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.16.tgz",
-      "integrity": "sha512-pn99VhoACYR8nFHhxqix+uvsbXineAasWm5ojXoN8xEwK5Kd3/TrhNn1wByuD52UxWRLy8pu+kRMniEi6Eq9Zg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15119,8 +12991,6 @@
     },
     "node_modules/tinyglobby/node_modules/fdir": {
       "version": "6.5.0",
-      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
-      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15137,8 +13007,6 @@
     },
     "node_modules/tinyglobby/node_modules/picomatch": {
       "version": "4.0.4",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
-      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15150,8 +13018,6 @@
     },
     "node_modules/tldts": {
       "version": "7.0.30",
-      "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.30.tgz",
-      "integrity": "sha512-ELrFxuqsDdHUwoh0XxDbxuLD3Wnz49Z57IFvTtvWy1hJdcMZjXLIuonjilCiWHlT2GbE4Wlv1wKVTzDFnXH1aw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15163,15 +13029,11 @@
     },
     "node_modules/tldts-core": {
       "version": "7.0.30",
-      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.30.tgz",
-      "integrity": "sha512-uiHN8PIB1VmWyS98eZYja4xzlYqeFZVjb4OuYlJQnZAuJhMw4PbKQOKgHKhBdJR3FE/t5mUQ1Kd80++B+qhD1Q==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/tmp": {
       "version": "0.0.28",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.28.tgz",
-      "integrity": "sha512-c2mmfiBmND6SOVxzogm1oda0OJ1HZVIk/5n26N59dDTh80MUeavpiCls4PGAdkX1PFkKokLpcf7prSjCeXLsJg==",
       "license": "MIT",
       "dependencies": {
         "os-tmpdir": "~1.0.1"
@@ -15182,15 +13044,11 @@
     },
     "node_modules/tmpl": {
       "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.5.tgz",
-      "integrity": "sha512-3f0uOEAQwIqGuWW2MVzYg8fV/QNnc/IpuJNG837rLuczAaLVHslWHZQj4IGiEl5Hs3kkbhwL9Ab7Hrsmuj+Smw==",
       "dev": true,
       "license": "BSD-3-Clause"
     },
     "node_modules/to-buffer": {
       "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/to-buffer/-/to-buffer-1.2.2.tgz",
-      "integrity": "sha512-db0E3UJjcFhpDhAF4tLo03oli3pwl3dbnzXOUIlRKrp+ldk/VUxzpWYZENsw2SZiuBjHAk7DfB0VU7NKdpb6sw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15204,8 +13062,6 @@
     },
     "node_modules/to-regex-range": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
-      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15217,8 +13073,6 @@
     },
     "node_modules/toidentifier": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
-      "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15227,8 +13081,6 @@
     },
     "node_modules/tough-cookie": {
       "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.1.tgz",
-      "integrity": "sha512-LktZQb3IeoUWB9lqR5EWTHgW/VTITCXg4D21M+lvybRVdylLrRMnqaIONLVb5mav8vM19m44HIcGq4qASeu2Qw==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -15240,8 +13092,6 @@
     },
     "node_modules/tr46": {
       "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-6.0.0.tgz",
-      "integrity": "sha512-bLVMLPtstlZ4iMQHpFHTR7GAGj2jxi8Dg0s2h2MafAE4uSWF98FC/3MomU51iQAMf8/qDUbKWf5GxuvvVcXEhw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15253,8 +13103,6 @@
     },
     "node_modules/tr46/node_modules/punycode": {
       "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
-      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15263,8 +13111,6 @@
     },
     "node_modules/tree-dump": {
       "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/tree-dump/-/tree-dump-1.1.0.tgz",
-      "integrity": "sha512-rMuvhU4MCDbcbnleZTFezWsaZXRFemSqAM+7jPnzUl1fo9w3YEKOxAeui0fz3OI4EU4hf23iyA7uQRVko+UaBA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -15280,8 +13126,6 @@
     },
     "node_modules/ts-api-utils": {
       "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.5.0.tgz",
-      "integrity": "sha512-OJ/ibxhPlqrMM0UiNHJ/0CKQkoKF243/AEmplt3qpRgkW8VG7IfOS41h7V8TjITqdByHzrjcS/2si+y4lIh8NA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15293,8 +13137,6 @@
     },
     "node_modules/ts-loader": {
       "version": "9.5.7",
-      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-9.5.7.tgz",
-      "integrity": "sha512-/ZNrKgA3K3PtpMYOC71EeMWIloGw3IYEa5/t1cyz2r5/PyUwTXGzYJvcD3kfUvmhlfpz1rhV8B2O6IVTQ0avsg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15314,8 +13156,6 @@
     },
     "node_modules/ts-loader/node_modules/semver": {
       "version": "7.8.0",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
-      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -15327,8 +13167,6 @@
     },
     "node_modules/ts-loader/node_modules/source-map": {
       "version": "0.7.6",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.6.tgz",
-      "integrity": "sha512-i5uvt8C3ikiWeNZSVZNWcfZPItFQOsYTUAOkcUPGd8DqDy1uOUikjt5dG+uRlwyvR108Fb9DOd4GvXfT0N2/uQ==",
       "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
@@ -15337,15 +13175,11 @@
     },
     "node_modules/tslib": {
       "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
-      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
       "dev": true,
       "license": "0BSD"
     },
     "node_modules/tsyringe": {
       "version": "4.10.0",
-      "resolved": "https://registry.npmjs.org/tsyringe/-/tsyringe-4.10.0.tgz",
-      "integrity": "sha512-axr3IdNuVIxnaK5XGEUFTu3YmAQ6lllgrvqfEoR16g/HGnYY/6We4oWENtAnzK6/LpJ2ur9PAb80RBt7/U4ugw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15357,22 +13191,16 @@
     },
     "node_modules/tsyringe/node_modules/tslib": {
       "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
-      "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
       "dev": true,
       "license": "0BSD"
     },
     "node_modules/tty-browserify": {
       "version": "0.0.1",
-      "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.1.tgz",
-      "integrity": "sha512-C3TaO7K81YvjCgQH9Q1S3R3P3BtN3RIM8n+OvX4il1K1zgE8ZhI0op7kClgkxtutIE8hQrcrHBXvIheqKUUCxw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/type-check": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
-      "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15384,8 +13212,6 @@
     },
     "node_modules/type-detect": {
       "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz",
-      "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15394,8 +13220,6 @@
     },
     "node_modules/type-fest": {
       "version": "0.21.3",
-      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
-      "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
       "dev": true,
       "license": "(MIT OR CC0-1.0)",
       "engines": {
@@ -15407,8 +13231,6 @@
     },
     "node_modules/type-is": {
       "version": "1.6.18",
-      "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
-      "integrity": "sha512-TkRKr9sUTxEH8MdfuCSP7VizJyzRNMjj2J2do2Jr3Kym598JVdEksuzPQCnlFPW4ky9Q+iA+ma9BGm06XQBy8g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15421,8 +13243,6 @@
     },
     "node_modules/type-is/node_modules/mime-db": {
       "version": "1.52.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
-      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15431,8 +13251,6 @@
     },
     "node_modules/type-is/node_modules/mime-types": {
       "version": "2.1.35",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
-      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15444,8 +13262,6 @@
     },
     "node_modules/typed-array-buffer": {
       "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
-      "integrity": "sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15459,8 +13275,6 @@
     },
     "node_modules/typescript": {
       "version": "6.0.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-6.0.3.tgz",
-      "integrity": "sha512-y2TvuxSZPDyQakkFRPZHKFm+KKVqIisdg9/CZwm9ftvKXLP8NRWj38/ODjNbr43SsoXqNuAisEf1GdCxqWcdBw==",
       "dev": true,
       "license": "Apache-2.0",
       "bin": {
@@ -15473,8 +13287,6 @@
     },
     "node_modules/typpy": {
       "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/typpy/-/typpy-2.4.0.tgz",
-      "integrity": "sha512-a16Uv5doNtvHzaG4wZCHmXN+l9xxmTMpyODtPz7B3DSTsDVNXilTSJGuNw68sUh0Un4bf+ghRMbEcJCI6r06mQ==",
       "license": "MIT",
       "dependencies": {
         "function.name": "^1.0.3"
@@ -15482,8 +13294,6 @@
     },
     "node_modules/ul": {
       "version": "5.2.16",
-      "resolved": "https://registry.npmjs.org/ul/-/ul-5.2.16.tgz",
-      "integrity": "sha512-v1YrSEsJZpJsywzF/MKgsQwMdOwBlwwmNiUOJh/yX6FHrq7dYjeua1YOhLV0q0KioqEFZC4P7MsKmpEsGdZz3w==",
       "license": "MIT",
       "dependencies": {
         "deffy": "^2.2.2",
@@ -15492,8 +13302,6 @@
     },
     "node_modules/undici": {
       "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-7.25.0.tgz",
-      "integrity": "sha512-xXnp4kTyor2Zq+J1FfPI6Eq3ew5h6Vl0F/8d9XU5zZQf1tX9s2Su1/3PiMmUANFULpmksxkClamIZcaUqryHsQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15502,14 +13310,10 @@
     },
     "node_modules/undici-types": {
       "version": "7.24.6",
-      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.24.6.tgz",
-      "integrity": "sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg==",
       "license": "MIT"
     },
     "node_modules/unicode-canonical-property-names-ecmascript": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.1.tgz",
-      "integrity": "sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15518,8 +13322,6 @@
     },
     "node_modules/unicode-match-property-ecmascript": {
       "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz",
-      "integrity": "sha512-5kaZCrbp5mmbz5ulBkDkbY0SsPOjKqVS35VpL9ulMPfSl0J0Xsm+9Evphv9CoIZFwre7aJoa94AY6seMKGVN5Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15532,8 +13334,6 @@
     },
     "node_modules/unicode-match-property-value-ecmascript": {
       "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.2.1.tgz",
-      "integrity": "sha512-JQ84qTuMg4nVkx8ga4A16a1epI9H6uTXAknqxkGF/aFfRLw1xC/Bp24HNLaZhHSkWd3+84t8iXnp1J0kYcZHhg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15542,8 +13342,6 @@
     },
     "node_modules/unicode-property-aliases-ecmascript": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.2.0.tgz",
-      "integrity": "sha512-hpbDzxUY9BFwX+UeBnxv3Sh1q7HFxj48DTmXchNgRa46lO8uj3/1iEn3MiNUYTg1g9ctIqXCCERn8gYZhHC5lQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15552,8 +13350,6 @@
     },
     "node_modules/unpipe": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
-      "integrity": "sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15562,8 +13358,6 @@
     },
     "node_modules/unrs-resolver": {
       "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/unrs-resolver/-/unrs-resolver-1.11.1.tgz",
-      "integrity": "sha512-bSjt9pjaEBnNiGgc9rUiHGKv5l4/TGzDmYw3RhnkJGtLhbnnA/5qJj7x3dNDCRx/PJxu774LlH8lCOlB4hEfKg==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -15597,8 +13391,6 @@
     },
     "node_modules/unzip-response": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/unzip-response/-/unzip-response-1.0.2.tgz",
-      "integrity": "sha512-pwCcjjhEcpW45JZIySExBHYv5Y9EeL2OIGEfrSKp2dMUFGFv4CpvZkwJbVge8OvGH2BNNtJBx67DuKuJhf+N5Q==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10"
@@ -15606,8 +13398,6 @@
     },
     "node_modules/update-browserslist-db": {
       "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz",
-      "integrity": "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==",
       "dev": true,
       "funding": [
         {
@@ -15637,8 +13427,6 @@
     },
     "node_modules/uri-js": {
       "version": "4.4.1",
-      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
-      "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -15647,8 +13435,6 @@
     },
     "node_modules/uri-js/node_modules/punycode": {
       "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
-      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15657,8 +13443,6 @@
     },
     "node_modules/url": {
       "version": "0.11.4",
-      "resolved": "https://registry.npmjs.org/url/-/url-0.11.4.tgz",
-      "integrity": "sha512-oCwdVC7mTuWiPyjLUz/COz5TLk6wgp0RCsN+wHZ2Ekneac9w8uuV0njcbbie2ME+Vs+d6duwmYuR3HgQXs1fOg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15671,8 +13455,6 @@
     },
     "node_modules/url-parse-lax": {
       "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-1.0.0.tgz",
-      "integrity": "sha512-BVA4lR5PIviy2PMseNd2jbFQ+jwSwQGdJejf5ctd1rEXt0Ypd7yanUK9+lYechVlN5VaTJGsu2U/3MDDu6KgBA==",
       "license": "MIT",
       "dependencies": {
         "prepend-http": "^1.0.1"
@@ -15683,8 +13465,6 @@
     },
     "node_modules/util": {
       "version": "0.12.5",
-      "resolved": "https://registry.npmjs.org/util/-/util-0.12.5.tgz",
-      "integrity": "sha512-kZf/K6hEIrWHI6XqOFUiiMa+79wE/D8Q+NCNAWclkyg3b4d2k7s0QGepNjiABc+aR3N1PAyHL7p6UcLY6LmrnA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15697,21 +13477,15 @@
     },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
       "license": "MIT"
     },
     "node_modules/utila": {
       "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/utila/-/utila-0.4.0.tgz",
-      "integrity": "sha512-Z0DbgELS9/L/75wZbro8xAnT50pBVFQZ+hUEueGDU5FN51YSCYM+jdxsfCiHjwNP/4LCDD0i/graKpeBnOXKRA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/utils-merge": {
       "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/utils-merge/-/utils-merge-1.0.1.tgz",
-      "integrity": "sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15733,8 +13507,6 @@
     },
     "node_modules/v8-to-istanbul": {
       "version": "9.3.0",
-      "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.3.0.tgz",
-      "integrity": "sha512-kiGUalWN+rgBJ/1OHZsBtU4rXZOfj/7rKQxULKlIzwzQSvMJUUNgPwJEEh7gU6xEVxC0ahoOBvN2YI8GH6FNgA==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -15748,14 +13520,10 @@
     },
     "node_modules/validate-color": {
       "version": "2.2.4",
-      "resolved": "https://registry.npmjs.org/validate-color/-/validate-color-2.2.4.tgz",
-      "integrity": "sha512-Znolz+b6CwW6eBXYld7MFM3O7funcdyRfjKC/X9hqYV/0VcC5LB/L45mff7m3dIn9wdGdNOAQ/fybNuD5P/HDw==",
       "license": "MIT"
     },
     "node_modules/validate-npm-package-license": {
       "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
-      "integrity": "sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==",
       "license": "Apache-2.0",
       "dependencies": {
         "spdx-correct": "^3.0.0",
@@ -15764,8 +13532,6 @@
     },
     "node_modules/vary": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
-      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15774,21 +13540,15 @@
     },
     "node_modules/vm-browserify": {
       "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
-      "integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/w-json": {
       "version": "1.3.10",
-      "resolved": "https://registry.npmjs.org/w-json/-/w-json-1.3.10.tgz",
-      "integrity": "sha512-XadVyw0xE+oZ5FGApXsdswv96rOhStzKqL53uSe5UaTadABGkWIg1+DTx8kiZ/VqTZTBneoL0l65RcPe4W3ecw==",
       "license": "MIT"
     },
     "node_modules/w3c-xmlserializer": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
-      "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15800,8 +13560,6 @@
     },
     "node_modules/walker": {
       "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.8.tgz",
-      "integrity": "sha512-ts/8E8l5b7kY0vlWLewOkDXMmPdLcVV4GmOQLyxuSswIJsweeFZtAsMF7k1Nszz+TYBQrlYRmzOnr398y1JemQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -15810,8 +13568,6 @@
     },
     "node_modules/watchpack": {
       "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.5.1.tgz",
-      "integrity": "sha512-Zn5uXdcFNIA1+1Ei5McRd+iRzfhENPCe7LeABkJtNulSxjma+l7ltNx55BWZkRlwRnpOgHqxnjyaDgJnNXnqzg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15824,8 +13580,6 @@
     },
     "node_modules/wbuf": {
       "version": "1.7.3",
-      "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz",
-      "integrity": "sha512-O84QOnr0icsbFGLS0O3bI5FswxzRr8/gHwWkDlQFskhSPryQXvrTMxjxGP4+iWYoauLoBvfDpkrOauZ+0iZpDA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15834,8 +13588,6 @@
     },
     "node_modules/webidl-conversions": {
       "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-8.0.1.tgz",
-      "integrity": "sha512-BMhLD/Sw+GbJC21C/UgyaZX41nPt8bUTg+jWyDeg7e7YN4xOM05YPSIXceACnXVtqyEw/LMClUQMtMZ+PGGpqQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -15844,8 +13596,6 @@
     },
     "node_modules/webpack": {
       "version": "5.106.2",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.106.2.tgz",
-      "integrity": "sha512-wGN3qcrBQIFmQ/c0AiOAQBvrZ5lmY8vbbMv4Mxfgzqd/B6+9pXtLo73WuS1dSGXM5QYY3hZnIbvx+K1xxe6FyA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15892,8 +13642,6 @@
     },
     "node_modules/webpack-cli": {
       "version": "7.0.2",
-      "resolved": "https://registry.npmjs.org/webpack-cli/-/webpack-cli-7.0.2.tgz",
-      "integrity": "sha512-dB0R4T+C/8YuvM+fabdvil6QE44/ChDXikV5lOOkrUeCkW5hTJv2pGLE3keh+D5hjYw8icBaJkZzpFoaHV4T+g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15933,8 +13681,6 @@
     },
     "node_modules/webpack-cli/node_modules/commander": {
       "version": "14.0.3",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-14.0.3.tgz",
-      "integrity": "sha512-H+y0Jo/T1RZ9qPP4Eh1pkcQcLRglraJaSLoyOtHxu6AapkjWVCy2Sit1QQ4x3Dng8qDlSsZEet7g5Pq06MvTgw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -15943,8 +13689,6 @@
     },
     "node_modules/webpack-dev-middleware": {
       "version": "7.4.5",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-7.4.5.tgz",
-      "integrity": "sha512-uxQ6YqGdE4hgDKNf7hUiPXOdtkXvBJXrfEGYSx7P7LC8hnUYGK70X6xQXUvXeNyBDDcsiQXpG2m3G9vxowaEuA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -15973,8 +13717,6 @@
     },
     "node_modules/webpack-dev-server": {
       "version": "5.2.4",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-5.2.4.tgz",
-      "integrity": "sha512-GqDPGZN9bRqKBTkp4aWkobDDHMsrXKoGSdOH56smIri8qR0JG8gfL8/v/f/OZR3/OKXjG8uwJbFVhKm/FNU/UA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16031,8 +13773,6 @@
     },
     "node_modules/webpack-merge": {
       "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-6.0.1.tgz",
-      "integrity": "sha512-hXXvrjtx2PLYx4qruKl+kyRSLc52V+cCvMxRjmKwoA+CBbbF5GfIBtR6kCvl0fYGqTUPKB+1ktVmTHqMOzgCBg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16046,8 +13786,6 @@
     },
     "node_modules/webpack-sources": {
       "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.4.1.tgz",
-      "integrity": "sha512-eACpxRN02yaawnt+uUNIF7Qje6A9zArxBbcAJjK1PK3S9Ycg5jIuJ8pW4q8EMnwNZCEGltcjkRx1QzOxOkKD8A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -16056,8 +13794,6 @@
     },
     "node_modules/webpack/node_modules/eslint-scope": {
       "version": "5.1.1",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
-      "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -16070,8 +13806,6 @@
     },
     "node_modules/webpack/node_modules/estraverse": {
       "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
-      "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
@@ -16080,8 +13814,6 @@
     },
     "node_modules/websocket-driver": {
       "version": "0.7.4",
-      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
-      "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -16095,8 +13827,6 @@
     },
     "node_modules/websocket-extensions": {
       "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
-      "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -16105,9 +13835,6 @@
     },
     "node_modules/whatwg-encoding": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
-      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
-      "deprecated": "Use @exodus/bytes instead for a more spec-conformant and faster implementation",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16119,8 +13846,6 @@
     },
     "node_modules/whatwg-encoding/node_modules/iconv-lite": {
       "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
-      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16132,8 +13857,6 @@
     },
     "node_modules/whatwg-mimetype": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-5.0.0.tgz",
-      "integrity": "sha512-sXcNcHOC51uPGF0P/D4NVtrkjSU2fNsm9iog4ZvZJsL3rjoDAzXZhkm2MWt1y+PUdggKAYVoMAIYcs78wJ51Cw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -16142,8 +13865,6 @@
     },
     "node_modules/whatwg-url": {
       "version": "16.0.1",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-16.0.1.tgz",
-      "integrity": "sha512-1to4zXBxmXHV3IiSSEInrreIlu02vUOvrhxJJH5vcxYTBDAx51cqZiKdyTxlecdKNSjj8EcxGBxNf6Vg+945gw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16157,8 +13878,6 @@
     },
     "node_modules/which": {
       "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
-      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -16173,14 +13892,10 @@
     },
     "node_modules/which-module": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.1.tgz",
-      "integrity": "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ==",
       "license": "ISC"
     },
     "node_modules/which-typed-array": {
       "version": "1.1.20",
-      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.20.tgz",
-      "integrity": "sha512-LYfpUkmqwl0h9A2HL09Mms427Q1RZWuOHsukfVcKRq9q95iQxdw0ix1JQrqbcDR9PH1QDwf5Qo8OZb5lksZ8Xg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16201,15 +13916,11 @@
     },
     "node_modules/wildcard": {
       "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-2.0.1.tgz",
-      "integrity": "sha512-CC1bOL87PIWSBhDcTrdeLo6eGT7mCFtrg0uIJtqJUFyK+eJnzl8A1niH56uu7KMa5XFrtiV+AQuHO3n7DsHnLQ==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/word-wrap": {
       "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
-      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -16218,8 +13929,6 @@
     },
     "node_modules/wrap-ansi": {
       "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16237,8 +13946,6 @@
     "node_modules/wrap-ansi-cjs": {
       "name": "wrap-ansi",
       "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
-      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16255,15 +13962,11 @@
     },
     "node_modules/wrappy": {
       "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
-      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/write-file-atomic": {
       "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-5.0.1.tgz",
-      "integrity": "sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -16276,8 +13979,6 @@
     },
     "node_modules/write-file-atomic/node_modules/signal-exit": {
       "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
-      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -16289,8 +13990,6 @@
     },
     "node_modules/ws": {
       "version": "8.20.1",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.20.1.tgz",
-      "integrity": "sha512-It4dO0K5v//JtTXuPkfEOaI3uUN87iYPnqo/ZzqCoG3g8uhA66QUMs/SrM0YK7/NAu+r4LMh/9dq2A7k+rHs+w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -16311,8 +14010,6 @@
     },
     "node_modules/wsl-utils": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/wsl-utils/-/wsl-utils-0.1.0.tgz",
-      "integrity": "sha512-h3Fbisa2nKGPxCpm89Hk33lBLsnaGBvctQopaBSOW/uIs6FTe1ATyAnKFJrzVs9vpGdsTe73WF3V4lIsk4Gacw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16327,8 +14024,6 @@
     },
     "node_modules/x-path": {
       "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/x-path/-/x-path-0.0.2.tgz",
-      "integrity": "sha512-zQ4WFI0XfJN1uEkkrB19Y4TuXOlHqKSxUJo0Yt+axPjRm8tCG6SJ6+Wo3/+Kjg4c2c8IvBXuJ0uYoshxNn4qMw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16337,8 +14032,6 @@
     },
     "node_modules/xml-name-validator": {
       "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
-      "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -16347,15 +14040,11 @@
     },
     "node_modules/xmlchars": {
       "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
-      "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/xtend": {
       "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
-      "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -16364,8 +14053,6 @@
     },
     "node_modules/y18n": {
       "version": "5.0.8",
-      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
-      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -16374,15 +14061,11 @@
     },
     "node_modules/yallist": {
       "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
-      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/yargs": {
       "version": "17.7.2",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
-      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -16400,8 +14083,6 @@
     },
     "node_modules/yargs-parser": {
       "version": "21.1.1",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
-      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -16410,8 +14091,6 @@
     },
     "node_modules/yocto-queue": {
       "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
-      "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==",
       "dev": true,
       "license": "MIT",
       "engines": {
diff --git a/package.json b/package.json
index 850808ec..e4e9ebea 100644
--- a/package.json
+++ b/package.json
@@ -20,9 +20,14 @@
   "scripts": {
     "clean": "rm -rf lib",
     "build": "npm run clean && npm run typecheck && npm run build-dist && npm run build-js",
-    "build-js": "babel src --out-dir lib --extensions '.ts' && tsc --emitDeclarationOnly",
+    "build-js": "babel src --out-dir lib --extensions '.ts' --copy-files && tsc --emitDeclarationOnly",
     "build-dist": "webpack --progress",
-    "watch-js": "babel src --out-dir lib --extensions '.ts' --watch",
+    "dev": "sh -c 'npm run watch & npm run start'",
+    "watch": "sh -c 'npm run watch:solid-ui & npm run watch-js & npm run watch-styles & npm run watch-dist & wait'",
+    "watch:workspace": "sh -c 'npm run watch-js & npm run watch-styles & npm run watch-dist & wait'",
+    "watch:solid-ui": "sh -c 'cd ../solid-ui && npm run watch'",
+    "watch-js": "babel src --out-dir lib --extensions '.ts' --copy-files --watch",
+    "watch-styles": "node scripts/watch-styles.mjs",
     "watch-dist": "webpack --watch",
     "lint": "eslint",
     "lint-fix": "eslint --fix",
@@ -30,6 +35,7 @@
     "test-coverage": "jest --coverage",
     "typecheck": "tsc --noEmit",
     "typecheck-test": "tsc --noEmit -p tsconfig.test.json",
+    "prepush": "npm test && npm run lint-fix && npm run typecheck && npm run typecheck-test",
     "prepublishOnly": "npm run test && npm run build",
     "preversion": "npm run lint && npm run typecheck && npm test",
     "postpublish": "git push origin main --follow-tags",
@@ -49,6 +55,7 @@
   },
   "license": "MIT",
   "dependencies": {
+    "@solid-data-modules/contacts-rdflib": "^0.7.1",
     "lit-html": "^3.3.3",
     "pane-registry": "^3.1.1",
     "qrcode": "^1.5.4",
diff --git a/src/ChatWithMe.ts b/src/ChatWithMe.ts
deleted file mode 100644
index 84a6e4e2..00000000
--- a/src/ChatWithMe.ts
+++ /dev/null
@@ -1,107 +0,0 @@
-import { html, TemplateResult } from 'lit-html'
-import { DataBrowserContext } from 'pane-registry'
-import { NamedNode } from 'rdflib'
-import { widgets } from 'solid-ui'
-import { authn } from 'solid-logic'
-import { asyncReplace } from 'lit-html/directives/async-replace.js'
-import { chatWithMeButtonText, logInToChatWithMeButtonText, loadingMessage } from './texts'
-import { checkIfAnyUserLoggedIn, complain } from './buttonsHelper'
-import { ViewerMode } from './types'
-import './styles/ChatWithMe.css'
-
-
-export const ChatWithMe = (
-  subject: NamedNode,
-  context: DataBrowserContext,
-  viewerMode: ViewerMode
-): TemplateResult => {
-  const logic = context.session.logic
-  const longChatPane = context.session.paneRegistry.byName('long chat')
-
-  async function* chatContainer() {
-    const chatContainer = context.dom.createElement('section') as HTMLDivElement
-    chatContainer.setAttribute('class', 'chatSection section-centered')
-    chatContainer.setAttribute('aria-labelledby', 'chat-section-title')
-    chatContainer.setAttribute('role', 'region')
-    chatContainer.setAttribute('data-testid', 'chat')
-
-    // Add hidden title for screen readers
-    const title = context.dom.createElement('h3')
-    title.id = 'chat-section-title'
-    title.className = 'sr-only'
-    title.textContent = 'Communication'
-    chatContainer.appendChild(title)
-
-    let exists
-    try {
-      yield html`
-      <div class="buttonSubSection">
-        <div class="profile__action-button loading-text center" role="status" aria-live="polite">
-          ${loadingMessage.toUpperCase()}
-        </div>
-      </div>
-      `
-      exists = await logic.chat.getChat(subject, false)
-    } catch (e) {
-      exists = false
-    }
-    
-    if (exists) {
-      const chatArea = context.dom.createElement('div')
-      chatArea.setAttribute('role', 'log')
-      chatArea.setAttribute('aria-label', 'Chat conversation')
-      chatArea.appendChild(longChatPane.render(exists, context, {}))
-      chatContainer.appendChild(chatArea)
-      yield chatContainer
-    } else {
-      const me = authn.currentUser()
-      let label = checkIfAnyUserLoggedIn(me) ? chatWithMeButtonText.toUpperCase() : logInToChatWithMeButtonText.toUpperCase()
-      const button = widgets.button(
-        context.dom,
-        undefined,
-        label,
-        setButtonHandler,
-        { needsBorder: true }
-      )
-
-      async function setButtonHandler(event) {
-        event.preventDefault()
-        try {
-            const chat: NamedNode = await logic.chat.getChat(subject, true)
-            chatContainer.innerHTML = ''
-            chatContainer.appendChild(longChatPane.render(chat, context, {}))
-        } catch (error) {
-            complain(chatContainer, context, error)
-        }
-      }
-
-      button.refresh = refreshButton()
-
-      function refreshButton() {
-        const me = authn.currentUser()
-    
-        if (checkIfAnyUserLoggedIn(me)) {
-          button.innerHTML = chatWithMeButtonText.toUpperCase()
-        } else {
-          //not logged in
-          button.innerHTML = logInToChatWithMeButtonText.toUpperCase()
-        }
-      }
-
-      button.setAttribute('type', 'button')
-      button.setAttribute('aria-describedby', 'chat-button-description')
-      
-      const description = context.dom.createElement('span')
-      description.id = 'chat-button-description'
-      description.className = 'sr-only'
-      description.textContent = 'Start a new conversation or sign in to continue existing chat'
-      
-      button.classList.add('profile__action-button', 'btn-primary', 'action-button-focus')
-      chatContainer.appendChild(button)
-      chatContainer.appendChild(description)
-      yield chatContainer
-    }
-  }
-
-  return html` ${asyncReplace(chatContainer())} `
-}
\ No newline at end of file
diff --git a/src/ProfileView.css b/src/ProfileView.css
new file mode 100644
index 00000000..a25c490b
--- /dev/null
+++ b/src/ProfileView.css
@@ -0,0 +1,1075 @@
+/* Profile layout styles. */
+
+/* Shell */
+:root {
+  --profile-image-size: 3rem;
+  --profile-interactive-cursor: pointer;
+}
+
+.profile-pane-host {
+  display: block;
+  width: 100%;
+  min-width: 100%;
+  max-width: none;
+  box-sizing: border-box;
+}
+
+.profile-pane-root {
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  container-name: profile-pane;
+  container-type: inline-size;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-input-mode='touch'] {
+  --profile-interactive-cursor: auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-input-mode='pointer'] {
+  --profile-interactive-cursor: pointer;
+}
+
+td.obj .profile-pane-root {
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+}
+
+/* Shared controls */
+.profile__section-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--spacing-xs, 0.75rem);
+  width: 100%;
+}
+
+.profile__section-header:not(.profile-edit-dialog__contact-section-header) h2,
+.profile__section-header:not(.profile-edit-dialog__contact-section-header) h3,
+.profile__section-header:not(.profile-edit-dialog__contact-section-header) h4 {
+  margin: 0;
+  font-size: var(--font-size-xl, 1.375rem);
+  font-weight: var(--font-weight-md, 500);
+}
+
+.profile__action-button,
+solid-ui-button.profile__action-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  min-width: 11.25rem;
+  max-width: 20rem;
+  box-sizing: border-box;
+}
+
+.profile__add-more-content,
+.profile__action-icon {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--spacing-xxs, 0.3125rem);
+}
+
+.profile__add-more-icon {
+  display: inline-block;
+  width: var(--icon-xxxs, 0.75rem);
+  height: var(--icon-xxxs, 0.75rem);
+  margin-right: 0;
+  line-height: 0;
+  position: relative;
+  top: 0;
+  transform: translateY(0);
+}
+
+.profile__add-more-icon svg {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+.profile__btn-friends,
+.profile__btn-contacts,
+solid-ui-button.profile__btn-friends,
+solid-ui-button.profile__btn-contacts {
+  width: auto;
+  min-width: 0;
+  max-width: none;
+}
+
+.profile__btn-friends,
+.profile__btn-contacts {
+  gap: var(--spacing-xxs, 0.3125rem);
+}
+
+solid-ui-button.profile__btn-friends,
+solid-ui-button.profile__btn-contacts {
+  width: auto;
+  --button-padding-sm: 0.375rem var(--spacing-xs, 0.75rem);
+  --button-border-radius: var(--border-radius-md, 0.5rem);
+  --button-padding-x-sm: var(--spacing-xs, 0.75rem);
+}
+
+solid-ui-button.profile__btn-friends {
+  --button-background: transparent;
+  --button-text: var(--color-primary, #7C4DFF);
+  --button-border: var(--color-primary, #7C4DFF);
+  --button-hover-background: rgba(124, 77, 255, 0.08);
+  --button-hover-border: var(--color-primary, #7C4DFF);
+  --button-hover-text: var(--color-primary, #7C4DFF);
+}
+
+solid-ui-button.profile__btn-contacts {
+  --button-background: var(--profile-contacts-button-background, transparent);
+  --button-text: var(--profile-contacts-button-color, var(--color-primary, #7C4DFF));
+  --button-border: var(--profile-contacts-button-border, var(--color-primary, #7C4DFF));
+  --button-hover-background: rgba(124, 77, 255, 0.08);
+  --button-hover-border: var(--profile-contacts-button-border, var(--color-primary, #7C4DFF));
+  --button-hover-text: var(--profile-contacts-button-color, var(--color-primary, #7C4DFF));
+}
+
+.profile-action-text {
+  width: auto;
+  min-width: 0;
+  max-width: none;
+  padding: var(--spacing-xxs, 0.3125rem);
+  border: none;
+  background: none;
+  color: var(--color-primary, #7C4DFF);
+  cursor: var(--profile-interactive-cursor, pointer);
+  font-size: var(--font-size-sm, 0.875rem);
+}
+
+solid-ui-button.profile-action-text {
+  width: auto;
+  min-width: 0;
+  max-width: none;
+  --button-height-sm: 0;
+  --button-padding-sm: var(--spacing-xxs, 0.3125rem);
+  --button-font-size-sm: var(--font-size-sm, 0.875rem);
+  --button-font-weight: var(--font-weight-regular, 400);
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--color-primary, #7C4DFF);
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary, #7C4DFF);
+}
+
+.profile-action-text:hover {
+  text-decoration: underline;
+}
+
+solid-ui-button.profile-action-text:hover::part(button),
+solid-ui-button.profile-action-text:focus-visible::part(button) {
+  text-decoration: underline;
+}
+
+/* Base grid layout */
+.profile-grid {
+  --profile-main-section-min-width: 37.5rem;
+  --profile-sidebar-min-width: 18.75rem;
+  --profile-sidebar-width: clamp(var(--profile-sidebar-min-width), 33.333%, 21.875rem);
+  --profile-sidebar-section-padding: var(--spacing-lg, 1.5625rem);
+  --profile-mobile-section-padding: var(--spacing-sm, 0.9375rem);
+  --profile-stacked-section-gap: var(--spacing-sm, 0.9375rem);
+  font-size: inherit;
+  display: grid;
+  grid-template-columns:
+    minmax(var(--profile-main-section-min-width), 1fr)
+    minmax(var(--profile-sidebar-min-width), var(--profile-sidebar-width));
+  align-items: start;
+  column-gap: var(--spacing-xxs, 0.3125rem);
+  row-gap: var(--spacing-md, 1.25rem);
+}
+
+/* Grid columns and wrappers */
+.profile-grid .profile__main,
+.profile-grid .profile__intro-main,
+.profile-grid .profile__intro-sidebar,
+.profile-grid .profile__sidebar,
+.profile-grid .profile__section,
+.profile-grid .profile__section--empty {
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.profile-grid .profile__main {
+  grid-column: 1;
+  grid-row: 2;
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md, 1.25rem);
+  margin-bottom: 0;
+  overflow-wrap: anywhere;
+  align-items: flex-start;
+}
+
+.profile-grid .profile__intro-main,
+.profile-grid .profile__intro-sidebar {
+  display: flex;
+  flex-direction: column;
+}
+
+.profile-grid .profile__intro-main {
+  grid-column: 1;
+  grid-row: 1;
+  align-self: stretch;
+}
+
+.profile-grid .profile__intro-sidebar {
+  grid-column: 2;
+  grid-row: 1;
+  align-self: stretch;
+  min-width: var(--profile-sidebar-min-width);
+  padding-block: 0;
+  padding-inline: var(--spacing-sm, 0.938rem);
+  background: transparent;
+  border-radius: 0;
+}
+
+.profile-grid > .profile__sidebar:not(.profile__intro-sidebar) {
+  grid-row: 2;
+}
+
+.profile-grid .profile__intro-sidebar > .profile__section,
+.profile-grid .profile__intro-sidebar > .profile__section--empty {
+  flex: 1 1 auto;
+  height: 100%;
+}
+
+.profile-grid .profile__intro-sidebar > [data-profile-section='social'] {
+  display: flex;
+  flex-direction: column;
+  min-height: 100%;
+  box-sizing: border-box;
+}
+
+.profile-grid .profile__intro-sidebar > [data-profile-section='social'] > .profile-section-collapsible__content {
+  flex: 1 1 auto;
+}
+
+.profile-grid .profile__sidebar:not(.profile__intro-sidebar) {
+  grid-column: 2;
+  display: flex;
+  flex-direction: column;
+  min-width: var(--profile-sidebar-min-width);
+  padding: var(--spacing-sm, 0.938rem);
+  align-items: stretch;
+  text-align: left;
+  border-radius: var(--border-radius-base);
+  background: var(--color-background, #F8F9FB);
+  overflow-x: clip;
+}
+
+.profile-grid .profile__sidebar-content {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md, 1.25rem);
+  min-width: var(--profile-sidebar-min-width);
+}
+
+.profile-grid .profile__intro-sidebar > .profile__section,
+.profile-grid .profile__intro-sidebar > .profile__section--empty,
+.profile-grid .profile__sidebar-content > .profile__section,
+.profile-grid .profile__sidebar-content > .profile__section--empty {
+  min-width: var(--profile-sidebar-min-width);
+}
+
+.profile-grid .profile__intro-main > .profile__section,
+.profile-grid .profile__intro-main > .profile__section--empty,
+.profile-grid .profile__main > .profile__section,
+.profile-grid .profile__main > .profile__section--empty {
+  min-width: var(--profile-main-section-min-width);
+}
+
+.profile-grid > .profile__sidebar:not(.profile__intro-sidebar) {
+  padding-top: 0;
+}
+
+/* Section cards */
+.profile-grid .profile__section,
+.profile-grid .profile__section--empty {
+  background: var(--color-card-bg, #FFF);
+  border: var(--border-width-thin, 0.1rem) solid var(--color-border-lighter, #E2E8F0);
+  overflow-x: clip;
+}
+
+.profile-grid .profile__section {
+  padding: var(--spacing-lg, 1.5625rem);
+  border-radius: var(--border-radius-base);
+}
+
+.profile-grid .profile__section.profile-section-collapsible {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-lg, 1.5625rem);
+}
+
+.profile-grid .profile__section--empty {
+  padding: var(--spacing-1xl, 2.5rem) var(--spacing-lg, 1.5625rem);
+}
+
+.profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section,
+.profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section--empty,
+.profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section,
+.profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section--empty,
+.profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section,
+.profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section--empty,
+.profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section,
+.profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section--empty {
+  padding: var(--profile-sidebar-section-padding);
+}
+
+/* Empty states */
+.profile-grid solid-ui-button.profile__action-button--empty {
+  width: fit-content;
+  min-width: fit-content;
+  max-width: fit-content;
+  --button-font-size-sm: var(--font-size-sm, 0.875rem);
+  --button-font-weight: var(--font-weight-medium, 500);
+  --button-line-height: var(--line-height-tight, 1.4);
+  --button-background: var(--color-card-bg, #FFF);
+  --button-text: var(--color-text-primary, #314158);
+  --button-border: var(--color-border-darker, #4A5565);
+  --button-hover-background: var(--color-primary, #7C4DFF);
+  --button-hover-text: var(--color-text-on-action, var(--white, #FFF));
+  --button-hover-border: var(--color-primary, #7C4DFF);
+}
+
+.profile-grid solid-ui-button.profile__action-button--empty:hover .profile__action-icon svg path,
+.profile-grid solid-ui-button.profile__action-button--empty:focus-visible .profile__action-icon svg path,
+.profile-grid solid-ui-button.profile__action-button--empty:focus-within .profile__action-icon svg path {
+  stroke: var(--color-text-on-action, var(--white, #FFF));
+  fill: var(--color-text-on-action, var(--white, #FFF));
+}
+
+.profile-grid .profile__empty-state-message {
+  color: var(--color-text-empty-state, var(--gray-400, #99A1AF));
+  text-align: center;
+  font-size: var(--font-size-xs, 0.813rem);
+  font-weight: var(--font-weight-normal, 400);
+  line-height: var(--line-height-tight, 1.4);
+  margin-bottom: var(--spacing-md, 1.25rem);
+}
+
+.profile-grid .profile__empty-state-content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+.profile-grid .profile__intro-main > .profile__section--empty.profile__section--empty-main,
+.profile-grid .profile__main > .profile__section--empty.profile__section--empty-main {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--spacing-lg, 1.5625rem);
+}
+
+.profile-grid .profile__intro-sidebar > .profile__section--empty.profile__section--empty-sidebar,
+.profile-grid .profile__sidebar-content > .profile__section--empty.profile__section--empty-sidebar {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.profile-grid .profile__empty-state-content > h2,
+.profile-grid .profile__empty-state-content > p {
+  margin: 0;
+}
+
+.profile-grid .profile__empty-state-content > h2 {
+  font-size: var(--font-size-xl, 1.375rem);
+  font-weight: var(--font-weight-md, 500);
+}
+
+.profile-grid .profile__section--empty.profile__section--empty-main .profile__empty-state-message {
+  margin-bottom: 0;
+}
+
+.profile-grid .profile__section--empty .profile-section-collapsible__content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.profile-grid .profile__section--empty.profile__section--empty-main .profile-section-collapsible__content {
+  gap: var(--spacing-lg, 1.5625rem);
+}
+
+.profile-grid [data-profile-section='projects'].profile__section--empty > .profile-section-collapsible__header,
+.profile-grid [data-profile-section='resume'].profile__section--empty > .profile-section-collapsible__header {
+  display: none;
+}
+
+.profile-grid .profile__section--empty.profile__section--empty-main > .profile-section-collapsible__content > .profile__empty-state-content {
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+.profile-grid [data-profile-section='projects'].profile__section--empty > .profile-section-collapsible__content,
+.profile-grid [data-profile-section='resume'].profile__section--empty > .profile-section-collapsible__content {
+  margin-top: 0;
+}
+
+/* Theme */
+.profile-pane-host[data-theme='dark'] .profile-grid .profile__section,
+.profile-pane-host[data-theme='dark'] .profile-grid .profile__section--empty {
+  border: var(--border-width-thin, 1px) solid var(--color-border, #444);
+}
+
+/* App-driven mobile layout, independent of viewport width. */
+.profile-pane-host[data-layout='mobile'] .profile-grid {
+  font-size: clamp(0.9rem, 1.1vw + 0.65rem, 1rem);
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: var(--profile-stacked-section-gap);
+  width: 100%;
+  max-width: 100%;
+  box-sizing: border-box;
+  margin: 0 auto;
+  padding-inline: var(--spacing-xxs, 0.3125rem);
+  overflow-x: clip;
+}
+
+/* App-driven mobile: flatten wrappers */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-main,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-sidebar,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__main,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content {
+  display: contents;
+}
+
+/* App-driven mobile: section ordering */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='heading'] { order: 1; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='bio'] { order: 2; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='skills'] { order: 3; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='languages'] { order: 4; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='resume'] { order: 5; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='projects'] { order: 6; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='social'] { order: 7; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='contact-info'] { order: 8; }
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='qr-code'] { order: 9; }
+
+/* App-driven mobile: interaction and typography */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__action-button {
+  min-height: calc(var(--min-touch-target, 44px) + 0.5rem) !important;
+  font-size: clamp(0.9rem, 2.1vw, 1rem) !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section-header:not(.profile-edit-dialog__contact-section-header) h2,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section-header:not(.profile-edit-dialog__contact-section-header) h3,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section-header:not(.profile-edit-dialog__contact-section-header) h4 {
+  font-size: var(--profile-mobile-section-heading-size, var(--font-size-lg, 1.125rem)) !important;
+  line-height: 1.2 !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .friends-pane__header-name {
+  font-size: 1.5rem !important;
+  line-height: 1.15 !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .friends-pane__header-pronouns,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .friends-pane__friends-pronouns {
+  font-size: 0.6875rem !important;
+  line-height: 1.1 !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__empty-state-content > h2,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .resume-card__section h3 {
+  font-size: var(--profile-mobile-section-heading-size, var(--font-size-lg, 1.125rem)) !important;
+  line-height: 1.2 !important;
+}
+
+/* App-driven mobile: cards and sidebar */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section--empty {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  /* Keep all mobile section cards at 15px padding across layout, media, and container fallbacks. */
+  padding: var(--profile-mobile-section-padding);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  border: var(--border-width-thin, 0.1rem) solid var(--color-border-subtle, var(--gray-100, #F3F4F6));
+  background: var(--color-card-bg, var(--white, #FFF));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar {
+  padding: 0 !important;
+  min-width: 0;
+  border-radius: 0;
+  background: transparent;
+  align-self: stretch;
+}
+
+/* App-driven mobile: width and sidebar padding overrides */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-sidebar > .profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-sidebar > .profile__section--empty,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-main > .profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-main > .profile__section--empty,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__main > .profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__main > .profile__section--empty,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > .profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > .profile__section--empty {
+  min-width: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-sidebar > .profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__intro-sidebar > .profile__section--empty,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section--empty,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section--empty,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section--empty,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section--empty {
+  padding: var(--profile-mobile-section-padding);
+}
+
+/* App-driven mobile: empty-state presentation */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section.profile-section-collapsible {
+  gap: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section--empty.profile-section-collapsible {
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='projects'].profile__section--empty > .profile-section-collapsible__header,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='resume'].profile__section--empty > .profile-section-collapsible__header {
+  display: flex;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='projects'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid [data-profile-section='resume'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2 {
+  display: none;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section--empty .profile__action-button--empty {
+  align-self: center;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section--empty .profile__empty-state-content {
+  align-items: center;
+  text-align: center;
+  width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section--empty .profile__empty-state-content > h2,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__section--empty .profile__empty-state-content > p {
+  text-align: center;
+  width: 100%;
+}
+
+/* App-driven mobile: profile header and bio actions */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__name {
+  font-size: var(--profile-mobile-header-name-size, var(--font-size-xl, 1.375rem)) !important;
+  line-height: 1.15 !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__role-org {
+  font-size: var(--profile-mobile-header-job-title-size, var(--font-size-md, 1rem)) !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__details {
+  font-size: var(--profile-mobile-header-detail-size, var(--font-size-xxs, 0.75rem)) !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-grid .profile__pronouns {
+  font-size: var(--profile-mobile-header-pronouns-size, 0.6875rem) !important;
+  line-height: 1.1 !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section--empty .profile-section-collapsible__actions > .profile-section-collapsible__edit-button {
+  order: 2;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section--empty .profile-section-collapsible__edit-label {
+  display: none !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] [data-profile-section='bio'].profile__section--empty .profile-section-collapsible__actions {
+  --profile-section-collapsible-action-button-text: var(--color-text-primary, #314158);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section--empty .profile-section-collapsible__edit-icon {
+  display: inline !important;
+}
+
+/* Container width guard for embedded panes */
+@container profile-pane (max-width: 56.5625rem) {
+  #main-content.profile-grid {
+    width: 100%;
+    max-width: 100%;
+    box-sizing: border-box;
+    margin-inline: auto !important;
+  }
+}
+
+/* Viewport fallback only when layout state is unavailable. */
+@media (max-width: 56.5625rem) {
+  /* Viewport stacked: layout shell */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid {
+    font-size: clamp(0.9rem, 1.1vw + 0.65rem, 1rem);
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: var(--profile-stacked-section-gap);
+    width: 100%;
+    max-width: 100%;
+    box-sizing: border-box;
+    margin: 0 auto;
+    padding-inline: var(--spacing-xxs, 0.3125rem);
+    overflow-x: clip;
+  }
+
+  /* Viewport stacked: interaction and wrappers */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__action-button {
+    min-height: calc(var(--min-touch-target, 44px) + 0.5rem) !important;
+    font-size: clamp(0.9rem, 2.1vw, 1rem) !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-main,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-sidebar,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__main,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content {
+    display: contents;
+    min-width: 0;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar:not(.profile__intro-sidebar) {
+    padding: 0 !important;
+    display: contents;
+    border-radius: 0;
+    background: transparent;
+    align-self: stretch;
+  }
+
+  /* Viewport stacked: section ordering */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='heading'] { order: 1; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='bio'] { order: 2; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='skills'] { order: 3; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='languages'] { order: 4; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='resume'] { order: 5; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='projects'] { order: 6; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='social'] { order: 7; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='contact-info'] { order: 8; }
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='qr-code'] { order: 9; }
+
+  /* Viewport stacked: typography */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile__section-header:not(.profile-edit-dialog__contact-section-header) h2,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile__section-header:not(.profile-edit-dialog__contact-section-header) h3,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile__section-header:not(.profile-edit-dialog__contact-section-header) h4 {
+    font-size: var(--profile-mobile-section-heading-size, var(--font-size-lg, 1.125rem)) !important;
+    line-height: 1.2 !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .friends-pane__header-name {
+    font-size: 1.5rem !important;
+    line-height: 1.15 !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .friends-pane__header-pronouns,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .friends-pane__friends-pronouns {
+    font-size: 0.6875rem !important;
+    line-height: 1.1 !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section--empty {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding: var(--profile-mobile-section-padding);
+    border-radius: var(--border-radius-base, 0.3125rem);
+    border: var(--border-width-thin, 0.1rem) solid var(--color-border-subtle, var(--gray-100, #F3F4F6));
+    background: var(--color-card-bg, var(--white, #FFF));
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='bio'].profile__section--empty .profile-section-collapsible__actions {
+    --profile-section-collapsible-action-button-text: var(--color-text-primary, #314158);
+  }
+
+  /* Viewport stacked: width and sidebar padding overrides */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-sidebar > .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-sidebar > .profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-main > .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-main > .profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__main > .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__main > .profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > .profile__section--empty {
+    min-width: 0;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-sidebar > .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-sidebar > .profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section--empty {
+    padding: var(--profile-mobile-section-padding);
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section.profile-section-collapsible {
+    gap: 0;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section--empty.profile-section-collapsible {
+    gap: var(--spacing-2xs, 0.625rem);
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='projects'].profile__section--empty > .profile-section-collapsible__header,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='resume'].profile__section--empty > .profile-section-collapsible__header {
+    display: flex;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='projects'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='resume'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2 {
+    display: none;
+  }
+}
+
+/* Container-driven stacked layout */
+@container profile-pane (max-width: 56.5625rem) {
+  /* Container stacked: layout shell */
+  .profile-grid {
+    font-size: clamp(0.9rem, 1.1vw + 0.65rem, 1rem);
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: var(--profile-stacked-section-gap);
+    width: 100%;
+    max-width: 100%;
+    box-sizing: border-box;
+    margin: 0 auto;
+    overflow-x: clip;
+  }
+
+  /* Container stacked: interaction and wrappers */
+  .profile-grid .profile__action-button {
+    min-height: calc(var(--min-touch-target, 44px) + 0.5rem) !important;
+    font-size: clamp(0.9rem, 2.1vw, 1rem) !important;
+  }
+
+  .profile-grid .profile__intro-main,
+  .profile-grid .profile__intro-sidebar,
+  .profile-grid .profile__main,
+  .profile-grid .profile__sidebar,
+  .profile-grid .profile__sidebar-content {
+    display: contents;
+    min-width: 0;
+  }
+
+  .profile-grid .profile__sidebar:not(.profile__intro-sidebar) {
+    padding: 0 !important;
+    display: contents;
+    border-radius: 0;
+    background: transparent;
+    align-self: stretch;
+  }
+
+  /* Container stacked: section ordering */
+  .profile-grid [data-profile-section='heading'] { order: 1; }
+  .profile-grid [data-profile-section='bio'] { order: 2; }
+  .profile-grid [data-profile-section='skills'] { order: 3; }
+  .profile-grid [data-profile-section='languages'] { order: 4; }
+  .profile-grid [data-profile-section='resume'] { order: 5; }
+  .profile-grid [data-profile-section='projects'] { order: 6; }
+  .profile-grid [data-profile-section='social'] { order: 7; }
+  .profile-grid [data-profile-section='contact-info'] { order: 8; }
+  .profile-grid [data-profile-section='qr-code'] { order: 9; }
+
+  /* Container stacked: typography */
+  .profile__section-header:not(.profile-edit-dialog__contact-section-header) h2,
+  .profile__section-header:not(.profile-edit-dialog__contact-section-header) h3,
+  .profile__section-header:not(.profile-edit-dialog__contact-section-header) h4 {
+    font-size: var(--profile-mobile-section-heading-size, var(--font-size-lg, 1.125rem)) !important;
+    line-height: 1.2 !important;
+  }
+
+  .profile-grid .friends-pane__header-name {
+    font-size: 1.5rem !important;
+    line-height: 1.15 !important;
+  }
+
+  .profile-grid .friends-pane__header-pronouns,
+  .profile-grid .friends-pane__friends-pronouns {
+    font-size: 0.6875rem !important;
+    line-height: 1.1 !important;
+  }
+
+  .profile-grid .profile__section,
+  .profile-grid .profile__section--empty {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding: var(--profile-mobile-section-padding);
+    border-radius: var(--border-radius-base, 0.3125rem);
+    border: var(--border-width-thin, 0.1rem) solid var(--color-border-subtle, var(--gray-100, #F3F4F6));
+    background: var(--color-card-bg, var(--white, #FFF));
+  }
+
+  .profile-grid [data-profile-section='bio'].profile__section--empty .profile-section-collapsible__actions {
+    --profile-section-collapsible-action-button-text: var(--color-text-primary, #314158);
+  }
+
+  /* Container stacked: width and sidebar padding overrides */
+  .profile-grid .profile__intro-sidebar > .profile__section,
+  .profile-grid .profile__intro-sidebar > .profile__section--empty,
+  .profile-grid .profile__intro-main > .profile__section,
+  .profile-grid .profile__intro-main > .profile__section--empty,
+  .profile-grid .profile__main > .profile__section,
+  .profile-grid .profile__main > .profile__section--empty,
+  .profile-grid .profile__sidebar-content > .profile__section,
+  .profile-grid .profile__sidebar-content > .profile__section--empty {
+    min-width: 0;
+  }
+
+  .profile-grid .profile__intro-sidebar > .profile__section,
+  .profile-grid .profile__intro-sidebar > .profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section--empty {
+    padding: var(--profile-mobile-section-padding);
+  }
+
+  .profile-grid .profile__section.profile-section-collapsible {
+    gap: 0;
+  }
+
+  .profile-grid .profile__section--empty.profile-section-collapsible {
+    gap: var(--spacing-2xs, 0.625rem);
+  }
+
+  .profile-grid [data-profile-section='projects'].profile__section--empty > .profile-section-collapsible__header,
+  .profile-grid [data-profile-section='resume'].profile__section--empty > .profile-section-collapsible__header {
+    display: flex;
+  }
+
+  .profile-grid [data-profile-section='projects'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2,
+  .profile-grid [data-profile-section='resume'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2 {
+    display: none;
+  }
+}
+
+/* Narrow-phone fallback once the layout is already stacked. */
+@media (max-width: 576px) {
+  /* Narrow viewport: cards and sidebar */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar:not(.profile__intro-sidebar) {
+    padding: 0 !important;
+    display: contents;
+    border-radius: 0;
+    background: transparent;
+    align-self: stretch;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section--empty {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding: var(--profile-mobile-section-padding);
+    border-radius: var(--border-radius-base, 0.3125rem);
+    border: var(--border-width-thin, 0.1rem) solid var(--color-border-subtle, var(--gray-100, #F3F4F6));
+    background: var(--color-card-bg, var(--white, #FFF));
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-sidebar > .profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__intro-sidebar > .profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section--empty,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section--empty {
+    padding: var(--profile-mobile-section-padding);
+  }
+
+  /* Narrow viewport: empty states */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='projects'].profile__section--empty > .profile-section-collapsible__header,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='resume'].profile__section--empty > .profile-section-collapsible__header {
+    display: flex;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='projects'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid [data-profile-section='resume'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2 {
+    display: none;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section--empty .profile__action-button--empty {
+    align-self: center;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section--empty .profile__empty-state-content {
+    align-items: center;
+    text-align: center;
+    width: 100%;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section--empty .profile__empty-state-content > h2,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__section--empty .profile__empty-state-content > p {
+    text-align: center;
+    width: 100%;
+  }
+
+  /* Narrow viewport: typography */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__empty-state-content > h2,
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .resume-card__section h3 {
+    font-size: var(--profile-mobile-section-heading-size, var(--font-size-lg, 1.125rem)) !important;
+    line-height: 1.2 !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__name {
+    font-size: var(--profile-mobile-header-name-size, var(--font-size-xl, 1.375rem)) !important;
+    line-height: 1.15 !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__role-org {
+    font-size: var(--profile-mobile-header-job-title-size, var(--font-size-md, 1rem)) !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__details {
+    font-size: var(--profile-mobile-header-detail-size, var(--font-size-xxs, 0.75rem)) !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile-grid .profile__pronouns {
+    font-size: var(--profile-mobile-header-pronouns-size, 0.6875rem) !important;
+    line-height: 1.1 !important;
+  }
+
+  /* Narrow viewport: empty-state edit actions */
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile__section--empty .profile-section-collapsible__actions > .profile-section-collapsible__edit-button {
+    order: 2;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile__section--empty .profile-section-collapsible__edit-label {
+    display: none !important;
+  }
+
+  :is(.profile-pane-host, .profile-pane-root):not([data-layout]) .profile__section--empty .profile-section-collapsible__edit-icon {
+    display: inline !important;
+  }
+}
+
+/* Narrow container fallback */
+@container profile-pane (max-width: 576px) {
+  /* Narrow container: cards and sidebar */
+  .profile-grid .profile__sidebar:not(.profile__intro-sidebar) {
+    padding: 0 !important;
+    display: contents;
+    border-radius: 0;
+    background: transparent;
+    align-self: stretch;
+  }
+
+  .profile-grid .profile__section,
+  .profile-grid .profile__section--empty {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding: var(--profile-mobile-section-padding);
+    border-radius: var(--border-radius-base, 0.3125rem);
+    border: var(--border-width-thin, 0.1rem) solid var(--color-border-subtle, var(--gray-100, #F3F4F6));
+    background: var(--color-card-bg, var(--white, #FFF));
+  }
+
+  .profile-grid .profile__intro-sidebar > .profile__section,
+  .profile-grid .profile__intro-sidebar > .profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='social'].profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='skills'].profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='languages'].profile__section--empty,
+  .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section,
+  .profile-grid .profile__sidebar-content > [data-profile-section='contact-info'].profile__section--empty {
+    padding: var(--profile-mobile-section-padding);
+  }
+
+  /* Narrow container: empty states */
+  .profile-grid [data-profile-section='projects'].profile__section--empty > .profile-section-collapsible__header,
+  .profile-grid [data-profile-section='resume'].profile__section--empty > .profile-section-collapsible__header {
+    display: flex;
+  }
+
+  .profile-grid [data-profile-section='projects'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2,
+  .profile-grid [data-profile-section='resume'].profile__section--empty .profile-section-collapsible__content .profile__empty-state-content > h2 {
+    display: none;
+  }
+
+  .profile-grid .profile__section--empty .profile__action-button--empty {
+    align-self: center;
+  }
+
+  .profile-grid .profile__section--empty .profile__empty-state-content {
+    align-items: center;
+    text-align: center;
+    width: 100%;
+  }
+
+  .profile-grid .profile__section--empty .profile__empty-state-content > h2,
+  .profile-grid .profile__section--empty .profile__empty-state-content > p {
+    text-align: center;
+    width: 100%;
+  }
+
+  /* Narrow container: typography */
+  .profile-grid .profile__empty-state-content > h2,
+  .profile-grid .resume-card__section h3 {
+    font-size: var(--profile-mobile-section-heading-size, var(--font-size-lg, 1.125rem)) !important;
+    line-height: 1.2 !important;
+  }
+
+  .profile-grid .profile__name {
+    font-size: var(--profile-mobile-header-name-size, var(--font-size-xl, 1.375rem)) !important;
+    line-height: 1.15 !important;
+  }
+
+  .profile-grid .profile__role-org {
+    font-size: var(--profile-mobile-header-job-title-size, var(--font-size-md, 1rem)) !important;
+  }
+
+  .profile-grid .profile__details {
+    font-size: var(--profile-mobile-header-detail-size, var(--font-size-xxs, 0.75rem)) !important;
+  }
+
+  .profile-grid .profile__pronouns {
+    font-size: var(--profile-mobile-header-pronouns-size, 0.6875rem) !important;
+    line-height: 1.1 !important;
+  }
+
+  /* Narrow container: empty-state edit actions */
+  .profile__section--empty .profile-section-collapsible__actions > .profile-section-collapsible__edit-button {
+    order: 2;
+  }
+
+  .profile__section--empty .profile-section-collapsible__edit-label {
+    display: none !important;
+  }
+
+  .profile__section--empty .profile-section-collapsible__edit-icon {
+    display: inline !important;
+  }
+}
diff --git a/src/ProfileView.ts b/src/ProfileView.ts
index d7a38cc5..34e6bb84 100644
--- a/src/ProfileView.ts
+++ b/src/ProfileView.ts
@@ -2,8 +2,8 @@ import { html, TemplateResult } from 'lit-html'
 import { DataBrowserContext } from 'pane-registry'
 import { NamedNode, LiveStore } from 'rdflib'
 import { authn } from 'solid-logic'
-import './styles/ProfileView.css'
-import { QRCodeCard } from './QRCodeCard'
+import './ProfileView.css'
+import './styles/CollapsibleSection.css'
 import { ViewerMode } from './types'
 import { presentProfileViewModel } from './ProfileViewModelPresenter'
 import { renderContactInfoSection } from './sections/contactInfo/ContactInfoSection'
@@ -16,10 +16,8 @@ import { renderCVSection } from './sections/resume/ResumeSection'
 import { renderProjectSection } from './sections/projects/ProjectSection'
 import { renderHeadingSection } from './sections/heading/HeadingSection'
 import { renderBioSection } from './sections/bio/BioSection'
-import { renderSocialAccounts } from './sections/social/SocialSection'
-
-type ProfileViewModelData = Awaited<ReturnType<typeof presentProfileViewModel>>
-type SocialAccounts = ProfileViewModelData['social']
+import { renderSocialSection } from './sections/social/SocialSection'
+import { renderQRCodeSection } from './sections/qrcode/QRCodeSection'
 
 function getViewerMode(subject: NamedNode): ViewerMode {
   let mode: ViewerMode = 'anonymous'
@@ -31,7 +29,7 @@ function getViewerMode(subject: NamedNode): ViewerMode {
 function renderSidebar(
   store: LiveStore,
   subject: NamedNode,
-  accounts: SocialAccounts,
+  accounts,
   skills: SkillDetails[],
   languages: LanguageDetails[],
   contactInfo: ContactInfo,
@@ -39,30 +37,19 @@ function renderSidebar(
   onSaved?: () => Promise<void> | void
 ) {
   return html`
-    <aside 
-      aria-labelledby="sidebar-heading" 
-      class="profile__sidebar p-sm" 
+    <div
+      aria-labelledby="sidebar-heading"
+      class="profile__sidebar"
     >
       <h2 id="sidebar-heading" class="sr-only">Sidebar</h2>
-      <div aria-label="Sidebar Content" class="flex-column gap-md">
-        ${renderSocialAccounts(store, subject, accounts, viewerMode, onSaved)}
+      <div class="profile__sidebar-content">
+        ${renderSocialSection(store, subject, accounts, viewerMode, onSaved)}
         ${renderSkillsSection(store, subject, skills, viewerMode, onSaved)}
         ${renderLanguageSection(store, subject, languages, viewerMode, onSaved)}
         ${renderContactInfoSection(store, subject, contactInfo, viewerMode, onSaved)}
-        ${renderQRCode(subject, store)}
+        ${renderQRCodeSection(subject, store)}
       </div>
-    </aside>
-  `
-}
-
-function renderQRCode(subject: NamedNode, store: LiveStore) {
-  return html`
-      <section class="profile__section border-lighter profile__qr-code" aria-labelledby="qr-heading" tabindex="-1">
-        <h2 id="qr-heading" class="sr-only">QR code</h2>
-        <div class="qrcode-card__frame flex-center">
-          ${QRCodeCard(subject, store)}
-        </div>
-      </section>
+    </div>
   `
 }
 
@@ -73,6 +60,9 @@ export async function ProfileView (
 ): Promise <TemplateResult> {
   const store = context.session.store as LiveStore
   const viewerMode = getViewerMode(subject)
+  const layout = context.environment?.layout ?? 'desktop'
+  const theme = context.environment?.theme ?? 'light'
+  const inputMode = context.environment?.inputMode ?? 'pointer'
 
   const viewModel = await presentProfileViewModel(subject, store)
   const profileDetails = viewModel.profileDetails
@@ -83,29 +73,66 @@ export async function ProfileView (
   const bioDetails = viewModel.bioDetails
   const accounts = viewModel.social
   const contactInfo = viewModel.contactInfo
-  
-  return html` 
-    <div class="profile-pane-root">
-      <main
+
+  const headingSection = await renderHeadingSection(context, subject, profileDetails, viewerMode, onSaved)
+  const bioSection = renderBioSection(store, subject, bioDetails, viewerMode, onSaved)
+  const skillsSection = renderSkillsSection(store, subject, skills, viewerMode, onSaved)
+  const languageSection = renderLanguageSection(store, subject, languages, viewerMode, onSaved)
+  const cvSection = renderCVSection(store, subject, rolesByType, viewerMode, onSaved)
+  const projectSection = renderProjectSection(store, subject, projects, viewerMode, onSaved)
+  const socialSection = renderSocialSection(store, subject, accounts, viewerMode, onSaved)
+  const contactInfoSection = renderContactInfoSection(store, subject, contactInfo, viewerMode, onSaved)
+  const qrCodeSection = renderQRCodeSection(subject, store)
+
+  if (layout === 'mobile') {
+    return html`
+      <div
+        class="profile-pane-root"
+        data-layout=${layout}
+        data-theme=${theme}
+        data-input-mode=${inputMode}
+      >
+        <main
+          id="main-content"
+          class="profile-grid"
+          tabindex="-1"
+        >
+          ${headingSection}
+          ${bioSection}
+          ${skillsSection}
+          ${languageSection}
+          ${cvSection}
+          ${projectSection}
+          ${socialSection}
+          ${contactInfoSection}
+          ${qrCodeSection}
+        </main>
+      </div>
+    `
+  }
+
+  return html`
+    <div
+      class="profile-pane-root"
+      data-layout=${layout}
+      data-theme=${theme}
+      data-input-mode=${inputMode}
+    >
+      <div
         id="main-content"
         class="profile-grid"
         tabindex="-1"
-      > 
-        <h1 id="profile-content-heading" class="sr-only">Profile for ${profileDetails.name}</h1>
+      >
 
-        <section
-          class="profile__main flex-column gap-md p-sm"
-          >
-          <h2 id="profile-main-heading" class="sr-only">Main Profile Content</h2>
+        <section class="profile__main">
+          ${headingSection}
+          ${bioSection}
+          ${cvSection}
+          ${projectSection}
 
-          ${renderHeadingSection(context, subject, profileDetails, viewerMode, onSaved)}
-          ${renderBioSection(store, subject, bioDetails, viewerMode, onSaved)}
-          ${renderCVSection(store, subject, rolesByType, viewerMode, onSaved)}
-          ${renderProjectSection(store, subject, projects, viewerMode, onSaved)}
-          
         </section>
         ${renderSidebar(store, subject, accounts, skills, languages, contactInfo, viewerMode, onSaved)}
-      </main>
+      </div>
     </div>
   `
 }
diff --git a/src/buttonsHelper.ts b/src/buttonsHelper.ts
index f9d63853..c5c8d8eb 100644
--- a/src/buttonsHelper.ts
+++ b/src/buttonsHelper.ts
@@ -1,13 +1,14 @@
 import { DataBrowserContext } from 'pane-registry'
 import { widgets } from 'solid-ui'
 import { NamedNode } from 'rdflib'
+import { formatDisplayError } from './utils/errorDisplay'
 
 function complain(
   buttonContainer: HTMLDivElement,
   context: DataBrowserContext,
-  error: string
+  error: unknown
 ): void {
-  const errorBlock = widgets.errorMessageBlock(context.dom, error)
+  const errorBlock = widgets.errorMessageBlock(context.dom, formatDisplayError(error))
   errorBlock.setAttribute('role', 'alert')
   errorBlock.setAttribute('aria-live', 'assertive')
   errorBlock.setAttribute('tabindex', '0')
diff --git a/src/editProfilePane/EditCommunitiesCard.ts b/src/editProfilePane/EditCommunitiesCard.ts
index 1a51af8f..14a8b802 100644
--- a/src/editProfilePane/EditCommunitiesCard.ts
+++ b/src/editProfilePane/EditCommunitiesCard.ts
@@ -8,7 +8,7 @@ import '../styles/editProfile.css'
 import {
   clearPreviousMessage, complain
 } from '../buttonsHelper'
-import { saveNewThing } from '../addMeToYourFriends'
+import { saveNewThing } from '../specialButtons/addMeToYourFriends'
 import { isAWebID, refresh } from './editProfilePresenter'
 
 const GREEN_PLUS = icons.iconBase + 'noun_34653_green.svg'
diff --git a/src/editProfilePane/EditFriendsCard.ts b/src/editProfilePane/EditFriendsCard.ts
index 1ac43fb2..6cfa95c0 100644
--- a/src/editProfilePane/EditFriendsCard.ts
+++ b/src/editProfilePane/EditFriendsCard.ts
@@ -3,7 +3,7 @@ import { DataBrowserContext } from 'pane-registry'
 import { NamedNode } from 'rdflib'
 import { ns, widgets, icons } from 'solid-ui'
 import { friendsHeadingText } from '../texts'
-import { saveNewThing } from '../addMeToYourFriends'
+import { saveNewThing } from '../specialButtons/addMeToYourFriends'
 import '../styles/editProfile.css'
 import { store } from 'solid-logic'
 import {
diff --git a/src/editProfilePane/EditProfileView.ts b/src/editProfilePane/EditProfileView.ts
index 4aaca65b..e30bd3d9 100644
--- a/src/editProfilePane/EditProfileView.ts
+++ b/src/editProfilePane/EditProfileView.ts
@@ -16,7 +16,7 @@ import { EditContactsSection } from './EditContactsCard'
 import { EditFriendsSection } from './EditFriendsCard'
 import { EditSocialSection } from './EditSocialCard'
 import { EditProfileCommunitiesSection } from './EditCommunitiesCard'
-import '../styles/utilities.css'
+import '../ProfileView.css'
 import { EditCVSection } from './EditCVCard'
 import { EditOtherPreferencesSection } from './EditOtherPreferences'
 import { skipLabelsFromTabbing } from '../rdfFormsHelper'
@@ -30,8 +30,7 @@ const editProfileView: PaneDefinition = {
 
   label: () => null, // don't use this in the normal solid-panes dispatching
 
-  render: function (subject, context) {
-    //console.log('@@@ render edit profile pane:  subject, context', subject, context)
+  render: function (_subject, context) {
     const dom = context.dom
     const store = context.session.store as Store
 
@@ -42,8 +41,8 @@ const editProfileView: PaneDefinition = {
     div.setAttribute('aria-label', 'Edit your profile')
     let editableProfile: NamedNode | null
 
-    // Use <main> for the main content area, styled as a grid like ProfileView
-    const main = dom.createElement('main')
+    // Pane root content. The page-level <main> landmark is on the shell's #MainContent.
+    const main = dom.createElement('div')
     main.setAttribute('id', 'profile-edit-main-content')
     main.setAttribute('aria-busy', 'true')
     main.setAttribute('tabindex', '-1')
diff --git a/src/editProfilePane/editProfilePresenter.ts b/src/editProfilePane/editProfilePresenter.ts
index 3d8b48fd..6325f480 100644
--- a/src/editProfilePane/editProfilePresenter.ts
+++ b/src/editProfilePane/editProfilePresenter.ts
@@ -2,6 +2,7 @@
 import { NamedNode, sym } from 'rdflib'
 import { store } from 'solid-logic'
 import { ns, utils, widgets, icons } from 'solid-ui'
+import { error as debugError, warn as debugWarn } from '../utils/debug'
 
 const DEFAULT_ICON_URI = icons.iconBase + 'noun_10636_grey.svg' // grey disc
 
@@ -65,7 +66,7 @@ async function deleteAttachment(dom: Document, attachmentTable: HTMLTableElement
     const statementsToDelete = store.statementsMatching(me, predicate, target, null)
 
     if (!statementsToDelete.length) {
-        console.warn('No matching statement found to delete for', target.value)
+        debugWarn('No matching statement found to delete for', target.value)
         refresh(dom, attachmentTable, me, editableProfile, predicate)
         return
     }
@@ -79,7 +80,7 @@ async function deleteAttachment(dom: Document, attachmentTable: HTMLTableElement
             if (stillThere) {
                 try {
                 store.removeStatements(statementsToDelete)
-                } catch (e) {
+                } catch (_error) {
                 // Ignore if already gone
                 }
             }
@@ -89,13 +90,13 @@ async function deleteAttachment(dom: Document, attachmentTable: HTMLTableElement
         if (store.fetcher) await store.fetcher.load(me.doc())
         refresh(dom, attachmentTable, me, editableProfile, predicate)
     } catch (error) {
-        console.error('Error deleting:', error)
+        debugError('Error deleting:', error)
 
         // If update failed, try to keep UI in sync anyway
         if (typeof store.removeStatements === 'function') {
             try {
                 store.removeStatements(statementsToDelete)
-            } catch (e) {
+            } catch (_error) {
                 /* ignore */
             }
         }
diff --git a/src/icons-svg/profileIcons.ts b/src/icons-svg/profileIcons.ts
index 953431e4..c65bed7b 100644
--- a/src/icons-svg/profileIcons.ts
+++ b/src/icons-svg/profileIcons.ts
@@ -79,19 +79,6 @@ export const plusIcon = html`
     </defs>
   </svg>
 `
-export const searchIcon = html`
-  <svg xmlns="http://www.w3.org/2000/svg" 
-    width="13" 
-    height="13" 
-    viewBox="0 0 13 13" 
-    fill="none"
-    aria-hidden="true"
-    focusable="false"
-  >
-    <circle cx="5.5" cy="5.5" r="4.5" stroke="#99A1AF" stroke-width="1.2" fill="none"/>
-    <path d="M9.1 9.1L12 12" stroke="#99A1AF" stroke-width="1.2" stroke-linecap="round"/>
-  </svg>
-`
 export const trashIcon = html`
   <svg xmlns="http://www.w3.org/2000/svg" 
     width="20" 
@@ -157,6 +144,12 @@ export const addIcon = html`
     </defs>
   </svg>
 `
+
+export const chevronDownIcon = html`
+  <svg xmlns="http://www.w3.org/2000/svg" width="12" height="7" viewBox="0 0 12 7" fill="none" aria-hidden="true" focusable="false">
+    <path d="M10.1831 0.183058C10.4271 -0.061018 10.8228 -0.061015 11.0668 0.183058C11.3109 0.427136 11.3109 0.82277 11.0668 1.06685L6.06685 6.06685C5.82277 6.31093 5.42714 6.31093 5.18306 6.06685L0.183058 1.06685C-0.0610194 0.82277 -0.0610194 0.427136 0.183058 0.183058C0.427136 -0.0610194 0.82277 -0.0610194 1.06685 0.183058L5.62495 4.74116L10.1831 0.183058Z" fill="#6A7282"/>
+  </svg>
+`
 export const personInCircleIcon = html`
   <svg xmlns="http://www.w3.org/2000/svg" 
     width="64" 
@@ -256,9 +249,9 @@ export const closeIcon = html`
 
 export const editIcon = html`
   <svg xmlns="http://www.w3.org/2000/svg" 
-    width="20" 
-    height="20" 
-    viewBox="0 0 20 20" 
+    width="14" 
+    height="14" 
+    viewBox="3 3 14 14" 
     fill="none"
     aria-hidden="true" 
     focusable="false"
diff --git a/src/index.ts b/src/index.ts
index 307f9eaf..31a683ba 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,22 +1,15 @@
 import { DataBrowserContext } from 'pane-registry'
-import './styles/CVCard.css'
-import './styles/ChatWithMe.css'
-import './styles/ProfileCard.css'
-import './styles/ProfileView.css'
-import './styles/QRCodeCard.css'
-import './styles/SocialCard.css'
-import './styles/utilities.css'
 import { NamedNode, LiveStore } from 'rdflib'
 import { render } from 'lit-html'
 import { ProfileView } from './ProfileView'
 import { icons, ns } from 'solid-ui'
-import * as qrcode from 'qrcode'
+import { hydrateQRCodes } from './sections/qrcode/QRCodeCard'
 export {
   addMeToYourFriendsDiv,
   createAddMeToYourFriendsButton,
   saveNewThing,
   checkIfThingExists
-} from './addMeToYourFriends'
+} from './specialButtons/addMeToYourFriends'
 
 async function loadExtendedProfile(store: LiveStore, subject: NamedNode) {
   const otherProfiles = store.each(
@@ -30,6 +23,93 @@ async function loadExtendedProfile(store: LiveStore, subject: NamedNode) {
   }
 }
 
+const HEADING_SECTION_SELECTOR = '[data-profile-section="heading"]'
+const SOCIAL_SECTION_SELECTOR = '[data-profile-section="social"]'
+
+function syncSocialSectionHeight(root: HTMLElement): () => void {
+  let animationFrameId = 0
+
+  const updateHeight = () => {
+    animationFrameId = 0
+
+    const grid = root.querySelector('.profile-grid') as HTMLElement | null
+    const headingSection = root.querySelector(HEADING_SECTION_SELECTOR) as HTMLElement | null
+    const socialSection = root.querySelector(SOCIAL_SECTION_SELECTOR) as HTMLElement | null
+
+    if (!grid || !headingSection || !socialSection) {
+      return
+    }
+
+    const isDesktopGrid = root.dataset.layout !== 'mobile' && getComputedStyle(grid).display === 'grid'
+    if (!isDesktopGrid) {
+      socialSection.style.removeProperty('min-height')
+      return
+    }
+
+    const nextMinHeight = `${Math.ceil(headingSection.getBoundingClientRect().height)}px`
+    if (socialSection.style.minHeight !== nextMinHeight) {
+      socialSection.style.minHeight = nextMinHeight
+    }
+  }
+
+  const scheduleUpdate = () => {
+    if (animationFrameId !== 0) {
+      return
+    }
+
+    animationFrameId = window.requestAnimationFrame(updateHeight)
+  }
+
+  updateHeight()
+
+  if (typeof ResizeObserver === 'undefined') {
+    window.addEventListener('resize', scheduleUpdate)
+
+    return () => {
+      if (animationFrameId !== 0) {
+        window.cancelAnimationFrame(animationFrameId)
+      }
+
+      window.removeEventListener('resize', scheduleUpdate)
+    }
+  }
+
+  const resizeObserver = new ResizeObserver(scheduleUpdate)
+  resizeObserver.observe(root)
+
+  const headingSection = root.querySelector(HEADING_SECTION_SELECTOR) as HTMLElement | null
+  const socialSection = root.querySelector(SOCIAL_SECTION_SELECTOR) as HTMLElement | null
+
+  if (headingSection) {
+    resizeObserver.observe(headingSection)
+  }
+
+  if (socialSection) {
+    resizeObserver.observe(socialSection)
+  }
+
+  return () => {
+    if (animationFrameId !== 0) {
+      window.cancelAnimationFrame(animationFrameId)
+    }
+
+    resizeObserver.disconnect()
+  }
+}
+
+function applyEnvironmentAttributes(
+  element: HTMLElement,
+  context: DataBrowserContext
+): void {
+  const layout = context.environment?.layout ?? 'desktop'
+  const theme = context.environment?.theme ?? 'light'
+  const inputMode = context.environment?.inputMode ?? 'pointer'
+
+  element.classList.add('profile-pane-host')
+  element.dataset.layout = layout
+  element.dataset.theme = theme
+  element.dataset.inputMode = inputMode
+}
 
 const Pane = {
   global: false,
@@ -52,39 +132,16 @@ const Pane = {
   render: (subject: NamedNode, context: DataBrowserContext): HTMLElement => {
     const target = context.dom.createElement('div')
     const store = context.session.store
+    let cleanupSocialSectionHeightSync: (() => void) | null = null
+
+    applyEnvironmentAttributes(target, context)
 
     const renderWithData = async () => {
+      applyEnvironmentAttributes(target, context)
       render(await ProfileView(subject, context, renderWithData), target)
-      const QRCodeEles = Array.from(target.getElementsByClassName('qrcode-card'))
-      if (!QRCodeEles.length) return console.error('QRCode Ele missing')
-      for (const QRCodeElement of QRCodeEles as HTMLElement[]) {
-        const value = QRCodeElement.getAttribute('data-value')
-        if (!value) return console.error('QRCode data-value missing')
-
-        const options = {
-          type: 'svg',
-          color: {
-            dark: '#000000',
-            light: '#ffffff'
-          }
-        }
-
-        qrcode.toString(value, options, function (error, svg) {
-          if (error) {
-            console.error('QRcode error!', error)
-          } else {
-            const imageContainer = QRCodeElement.querySelector('div[role="img"]') as HTMLElement | null
-            if (!imageContainer) {
-              console.error('QRCode image container missing')
-              return
-            }
-            imageContainer.innerHTML = svg
-            imageContainer.style.width = '100%'
-            imageContainer.style.height = '100%'
-            imageContainer.style.margin = '0'
-          }
-        })
-      }
+      cleanupSocialSectionHeightSync?.()
+      cleanupSocialSectionHeightSync = syncSocialSectionHeight(target)
+      await hydrateQRCodes(target)
     }
 
     loadExtendedProfile(store, subject).then(async () => {
diff --git a/src/ontology/resumeForm.ttl b/src/ontology/resumeForm.ttl
index 3deb648e..45d8362a 100644
--- a/src/ontology/resumeForm.ttl
+++ b/src/ontology/resumeForm.ttl
@@ -75,7 +75,7 @@ org:member owl:inverse [ ui:label "Work experience" ]. # timelimited involvement
         schema:name "ESCO";
         ui:targetClass schema:Occupation ;
         schema:logo <https://ec.europa.eu/esco/portal/static_resource2/images/logo/logo_en.gif>;
-        ui:searchByNameURI "https://ec.europa.eu/esco/api/search?language=$(language)&type=occupation&text=$(name)".
+        ui:searchByNameURI "https://ec.europa.eu/esco/api/search?language=$(language)&type=occupation&text=$(name)&selectedVersion=v1.2.0".
 
 :orgField a ui:Choice; 
     ui:label "For organization"@en, "Pour l'organisation"@fr;
@@ -311,7 +311,7 @@ schema:ResearchOrganization a rdfs:Class;
         schema:name "ESCO skill";
         ui:targetClass esco:Skill ;
         schema:logo <https://ec.europa.eu/esco/portal/static_resource2/images/logo/logo_en.gif>;
-        ui:searchByNameURI "https://ec.europa.eu/esco/api/search?language=$(language)&limit=$(limit)&type=skill&text=$(name)".
+        ui:searchByNameURI "https://ec.europa.eu/esco/api/search?language=$(language)&limit=$(limit)&type=skill&text=$(name)&selectedVersion=v1.2.0".
 
 #################### Languages
 
diff --git a/src/rdfFormsHelper.ts b/src/rdfFormsHelper.ts
index 8be173e3..c13bd5f4 100644
--- a/src/rdfFormsHelper.ts
+++ b/src/rdfFormsHelper.ts
@@ -1,4 +1,16 @@
-/** Project-local: currently unused component. Keep temporarily; do not add new usage. */
+/**
+ * Solid-UI form bridge used by the edit-profile flows and by shared helpers that
+ * need ontology/form documents loaded into an RDF store.
+ *
+ * This file is intentionally kept in src because it is still active production
+ * code, even though the main form rendering path is currently concentrated in
+ * editProfilePane. In particular:
+ * - editProfilePane imports renderForm and skipLabelsFromTabbing
+ * - social helpers import loadDocument for ontology-backed option loading
+ *
+ * If forms are reworked later, this module is the current integration boundary
+ * to replace rather than dormant legacy code to remove blindly.
+ */
 import { NamedNode, Store, Namespace, sym, parse } from 'rdflib'
 import { widgets } from 'solid-ui'
 
diff --git a/src/sections/bio/BioEditDialog.ts b/src/sections/bio/BioEditDialog.ts
index 7fdb9bbe..7440a046 100644
--- a/src/sections/bio/BioEditDialog.ts
+++ b/src/sections/bio/BioEditDialog.ts
@@ -10,8 +10,9 @@ import { hasNonEmptyText, sanitizeTextValue, toText } from '../../textUtils'
 import {
   dialogCancelLabelText,
   dialogSubmitLabelText,
+  editBioDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveBioUpdatesFailedPrefixText
+  saveBioUpdatesFailedMessageText
 } from '../../texts'
 
 type BioFormState = {
@@ -87,7 +88,7 @@ function renderBioEditTemplate(form: HTMLFormElement, formState: BioFormState, v
 
 function createBioEditForm(bioData: BioDetails, viewerMode: ViewerMode) {
   const form = document.createElement('form')
-  form.classList.add('profile__edit-form')
+  form.classList.add('profile__edit-form', 'profile__edit-form--bio')
 
   const formState = toFormState(bioData)
   renderBioEditTemplate(form, formState, viewerMode)
@@ -107,20 +108,21 @@ export async function createBioEditDialog(
   const { form, formState } = createBioEditForm(bioData, viewerMode)
 
   const result = await openInputDialog({
-    title: 'Edit Bio',
+    title: editBioDialogTitleText,
     dom,
     form,
     headerAction: { type: 'none' },
     submitLabel: dialogSubmitLabelText,
     cancelLabel: dialogCancelLabelText,
+    shouldCloseWithoutSave: () => {
+      const bioOps = summarizeRowOps([formState.bio], rowHasContent)
+      return bioOps.create.length === 0 && bioOps.update.length === 0 && bioOps.remove.length === 0
+    },
     validate: () => {
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
       }
 
-      const bioOps = summarizeRowOps([formState.bio], rowHasContent)
-      const hasChanges = bioOps.create.length > 0 || bioOps.update.length > 0 || bioOps.remove.length > 0
-      if (!hasChanges) return 'No bio changes detected.'
       return null
     },
     onSave: async () => {
@@ -128,8 +130,7 @@ export async function createBioEditDialog(
       await processBioMutations(store, subject, bioOps)
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveBioUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveBioUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/bio/BioSection.css b/src/sections/bio/BioSection.css
new file mode 100644
index 00000000..44e7baaa
--- /dev/null
+++ b/src/sections/bio/BioSection.css
@@ -0,0 +1,164 @@
+.bio-card,
+.bio-card__section {
+	width: 100%;
+	max-width: 100%;
+	min-width: 0;
+	box-sizing: border-box;
+}
+
+.bio-card__description-wrap {
+	margin: 0;
+	position: relative;
+	isolation: isolate;
+	--bio-description-toggle-top: calc(100% - 1.5em + 0.28em - 11px);
+	--bio-description-toggle-transform: translateY(7px);
+}
+
+.bio-section__edit-button,
+solid-ui-button.bio-section__edit-button {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.bio-section--empty {
+	border-radius: var(--border-radius-md, 0.5rem);
+	gap: var(--spacing-lg, 1.5625rem);
+}
+
+.bio-card__description-text {
+	margin: 0;
+	width: 100%;
+	max-width: none;
+	display: -webkit-box;
+	-webkit-box-orient: vertical;
+	-webkit-line-clamp: 2;
+	line-clamp: 2;
+	line-height: var(--line-height-base, 1.5);
+	overflow: hidden;
+}
+
+.bio-card__description-text--overflowing {
+	padding-right: 4.5rem;
+}
+
+.bio-card__description-text--expanded {
+	display: block;
+	-webkit-line-clamp: unset;
+	line-clamp: unset;
+	padding-right: 0;
+	overflow: visible;
+}
+
+.bio-card__description-toggle,
+solid-ui-button.bio-card__description-toggle {
+	margin: 0;
+	padding: 0;
+	position: absolute;
+	right: 0;
+	bottom: 0;
+	background-color: var(--color-card-bg, #FFFFFF);
+	white-space: nowrap;
+	z-index: 0;
+}
+
+.bio-card__description-toggle {
+	border: 0;
+	background: none;
+	color: var(--color-primary, #7C4DFF);
+	cursor: var(--profile-interactive-cursor, pointer);
+	font: inherit;
+	font-size: var(--font-size-sm, 0.875rem);
+	line-height: var(--line-height-base, 1.5);
+	min-height: auto;
+	min-width: auto;
+	padding-left: 0;
+	padding-right: 0;
+	padding-top: 0;
+	padding-bottom: 0;
+	margin-left: 0;
+	margin-right: 0;
+}
+
+solid-ui-button.bio-card__description-toggle {
+	min-height: 0;
+	min-width: 0;
+	--button-height-sm: 0;
+	--button-padding-sm: 0;
+	--button-font-size-sm: var(--font-size-sm, 0.875rem);
+	--button-line-height: var(--line-height-base, 1.5);
+	--button-background: none;
+	--button-border-width: 0;
+	--button-border: transparent;
+	--button-text: var(--color-primary, #7C4DFF);
+	--button-hover-background: none;
+	--button-hover-border: transparent;
+	--button-hover-text: var(--color-primary, #7C4DFF);
+}
+
+.bio-card__description-wrap .bio-card__description-text:not(.bio-card__description-text--expanded) + .bio-card__description-toggle {
+	top: var(--bio-description-toggle-top);
+	bottom: auto;
+	transform: var(--bio-description-toggle-transform);
+}
+
+.bio-card__description-text--expanded + .bio-card__description-toggle,
+.bio-card__description-text--expanded + solid-ui-button.bio-card__description-toggle {
+	position: static;
+	display: block;
+	width: fit-content;
+	margin-left: auto;
+	padding-left: 0;
+	top: auto;
+	bottom: auto;
+	transform: none;
+}
+
+.bio-card__description-text--expanded + solid-ui-button.bio-card__description-toggle::part(button) {
+	position: static;
+	display: inline-flex;
+	padding-left: 0;
+	top: auto;
+	bottom: auto;
+	transform: none;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .bio-card__description-text {
+	font-size: var(--font-size-sm, 0.875rem);
+	line-height: var(--line-height-base, 1.5);
+	-webkit-line-clamp: 2;
+	line-clamp: 2;
+}
+
+@container profile-pane (max-width: 576px) {
+	.bio-card__description-text {
+		font-size: var(--font-size-sm, 0.875rem);
+		line-height: var(--line-height-base, 1.5);
+		-webkit-line-clamp: 2;
+		line-clamp: 2;
+	}
+
+	.bio-card__description-wrap {
+		--bio-description-toggle-top: calc(100% - 1.5em);
+		--bio-description-toggle-transform: none;
+	}
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .bio-card__description-wrap {
+	--bio-description-toggle-top: calc(100% - 1.5em);
+	--bio-description-toggle-transform: none;
+}
+
+@media (max-width: 576px) {
+	.bio-card__description-text {
+		font-size: var(--font-size-sm, 0.875rem);
+		line-height: var(--line-height-base, 1.5);
+		-webkit-line-clamp: 2;
+		line-clamp: 2;
+	}
+
+	.bio-card__description-wrap {
+		--bio-description-toggle-top: calc(100% - 1.5em);
+		--bio-description-toggle-transform: none;
+	}
+}
diff --git a/src/sections/bio/BioSection.ts b/src/sections/bio/BioSection.ts
index ed9b5561..f0036298 100644
--- a/src/sections/bio/BioSection.ts
+++ b/src/sections/bio/BioSection.ts
@@ -1,7 +1,8 @@
 import { html } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { BioDetails } from './types'
 import { ViewerMode } from '../../types'
-import '../../styles/BioSection.css'
+import './BioSection.css'
 import { bioHeadingText } from '../../texts'
 import { LiveStore, NamedNode } from 'rdflib'
 import {
@@ -18,18 +19,21 @@ function renderBio(bioData: BioDetails) {
 
   return html`
       ${bioData.description ? html`
-        <div class="bioDescriptionWrap">
-          <p class="bioDescriptionText" id=${bioDescriptionId}>${bioData.description}</p>
-          <button
+        <div class="bio-card__description-wrap">
+          <p class="bio-card__description-text" id=${bioDescriptionId}>${bioData.description}</p>
+          <solid-ui-button
             type="button"
-            class="bioDescriptionToggle"
+            variant="secondary"
+            size="sm"
+            label="...more"
+            class="bio-card__description-toggle"
             aria-controls=${bioDescriptionId}
             aria-expanded="false"
             hidden
             @click=${toggleDescription}
           >
             ...more
-          </button>
+          </solid-ui-button>
         </div>
       ` : ''}
   `
@@ -41,14 +45,11 @@ function hasBioContent(bioData: BioDetails): boolean {
 
 
 export const BioCard = (
-  bioData: BioDetails,
-  viewerMode: ViewerMode
+  bioData: BioDetails
 ) => {
-  void viewerMode
-
   return html`
-    <article class="bioCard" aria-label="Bio" data-testid="bio-card">
-      <section class="bioSection">
+    <article class="bio-card" aria-label="Bio" data-testid="bio-card">
+      <section class="bio-card__section">
         ${renderBio(bioData)}
       </section>
     </article>
@@ -62,7 +63,7 @@ function renderBioSectionContent(
   viewerMode: ViewerMode,
   onSaved?: () => Promise<void> | void
 ) {
-  const bio = BioCard(bioData, viewerMode)
+  const bio = BioCard(bioData)
   const bioDetails: BioDetails = bioData
   const isOwner = viewerMode === 'owner'
   
@@ -70,9 +71,11 @@ function renderBioSectionContent(
     <header class="profile__section-header profile-section-collapsible__header">
       <h2 id="bio-heading" tabindex="-1">${bioHeadingText}</h2>
       ${isOwner ? html`
-        <button
+        <solid-ui-button
           type="button"
-          class="profile__action-button profile-action-text flex-center"
+          variant="secondary"
+          size="sm"
+          class="profile__action-button profile-action-text bio-section__edit-button profile-section-collapsible__edit-button"
           aria-label="Edit bio details"
           @click=${(event: Event) => {
             return createBioEditDialog(
@@ -87,7 +90,7 @@ function renderBioSectionContent(
         >
           <span class="profile-section-collapsible__edit-label profile__action-icon">${editIcon} Edit</span>
           <span class="profile-section-collapsible__edit-icon profile__action-icon" aria-hidden="true">${editIcon}</span>
-        </button>
+        </solid-ui-button>
       ` : html``}
     </header>
     <div class="profile-section-collapsible__content">
@@ -107,7 +110,7 @@ function renderBioSectionDefault(
     <section 
       aria-labelledby="bio-heading" 
       data-profile-section="bio"
-      class="profile__section border-lighter" 
+      class="profile__section" 
       role="region"
       tabindex="-1"
     >
@@ -126,14 +129,16 @@ function renderOwnerEmptyBioContent(
   const bioDetails: BioDetails = bioData
 
   return html`
-    <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty bio section">
+    <div class="profile__empty-state-content" role="group" aria-label="Empty bio section">
       <h2 id="bio-heading" tabindex="-1">${bioHeadingText}</h2>
       <p class="profile__empty-state-message">
         You haven't added any professional experience yet. Adding work history can boost your Bio.
       </p>
     </div>
-    <button
+    <solid-ui-button
       type="button"
+      variant="secondary"
+      size="sm"
       class="profile__action-button--empty"
       aria-label="Add bio details"
       @click=${(event: Event) => {
@@ -148,7 +153,7 @@ function renderOwnerEmptyBioContent(
       }}
     >
       <span class="profile__action-icon" aria-hidden="true">${plusDarkIcon} Add Bio</span>
-    </button>
+    </solid-ui-button>
 
   `
 }
@@ -164,7 +169,7 @@ function renderOwnerEmptyBioSection(
     <section 
       aria-labelledby="bio-heading" 
       data-profile-section="bio"
-      class="profile__section--empty border-lighter flex-column-center rounded-md gap-lg" 
+      class="profile__section--empty profile__section--empty-main bio-section--empty" 
       role="region"
       tabindex="-1"
     >
diff --git a/src/sections/bio/mutations.ts b/src/sections/bio/mutations.ts
index 4be363c4..54038267 100644
--- a/src/sections/bio/mutations.ts
+++ b/src/sections/bio/mutations.ts
@@ -3,7 +3,8 @@ import { ns } from 'solid-ui'
 import { BioMutationPlan, BioRow } from './types'
 import { MutationOps } from '../shared/types'
 import { applyUpdaterPatch, replacePredicateStatements } from '../shared/rdfMutationHelpers'
-import { saveBioUpdatesFailedPrefixText} from '../../texts'
+import { bioMutationSaveFailedDebugText, saveBioUpdatesFailedMessageText } from '../../texts'
+import { error as debugError } from '../../utils/debug'
 // Need to find out if this is really how we should store the data
 async function mutateBioEntry(store: LiveStore, subject: NamedNode, bioOps: MutationOps<BioRow>) {
   const doc = subject.doc()
@@ -42,7 +43,8 @@ export async function processBioMutations(store: LiveStore, subject: NamedNode,
   try {
     await mutateBioEntry(store, subject, mutationPlan)
   } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`${saveBioUpdatesFailedPrefixText} ${message}`)
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(bioMutationSaveFailedDebugText, rootError)
+    throw new Error(saveBioUpdatesFailedMessageText, { cause: rootError })
   }
 } 
diff --git a/src/sections/contactInfo/ContactInfoEditDialog.css b/src/sections/contactInfo/ContactInfoEditDialog.css
new file mode 100644
index 00000000..d0dee101
--- /dev/null
+++ b/src/sections/contactInfo/ContactInfoEditDialog.css
@@ -0,0 +1,396 @@
+.profile__edit-form--contact-info .profile-edit-dialog__section {
+  --contact-info-dialog-contact-point-row-gap: var(--spacing-sm, 0.9375rem);
+  --contact-info-dialog-contact-point-row-align: flex-start;
+  --contact-info-dialog-contact-point-row-direction: row;
+  --contact-info-dialog-contact-point-row-wrap: wrap;
+  --contact-info-dialog-contact-point-field-flex: 1 1 auto;
+  --contact-info-dialog-contact-point-type-width: 6.5rem;
+  --contact-info-dialog-contact-point-type-max-width: none;
+  --contact-info-dialog-contact-point-actions-flex: 0 1 auto;
+  --contact-info-dialog-contact-point-actions-margin-left: auto;
+  --contact-info-dialog-contact-point-actions-justify: flex-start;
+  --contact-info-dialog-contact-point-select-font-size: inherit;
+  --contact-info-dialog-contact-point-select-line-height: inherit;
+  gap: 0;
+}
+
+.profile__edit-form--contact-info .profile-edit-dialog__section + .profile-edit-dialog__section {
+  border-top: var(--border-width-sm, 0.1rem) solid var(--color-border-lighter, var(--slate-200, #E2E8F0));
+  padding-top: var(--spacing-xs, 0.75rem);
+}
+
+.profile__edit-form--contact-info .profile-edit-dialog__contact-section-header {
+  padding: 0;
+  gap: 1.875rem;
+  margin-bottom: 0;
+}
+
+.profile__edit-form--contact-info .profile-edit-dialog__section fieldset {
+  margin-top: 0.25rem;
+  gap: var(--spacing-xs, 0.75rem);
+}
+
+.profile__edit-form--contact-info .profile-edit-dialog__section-heading {
+  margin: 0;
+  color: var(--gray-700, #364153);
+  font-size: var(--font-size-md, 1rem); /* 16px */
+  font-weight: var(--font-weight-md, 500);
+  line-height: normal;
+}
+
+.profile__edit-form--contact-info .profile-edit-dialog__section-title-icon {
+  display: inline-flex;
+  width: 0.8333rem;
+  height: 0.8333rem;
+  flex: 0 0 0.8333rem;
+  flex-shrink: 0;
+  aspect-ratio: 1 / 1;
+}
+
+.profile__edit-form--contact-info .profile-edit-dialog__section-title-icon svg {
+  width: 100%;
+  height: 100%;
+}
+
+.profile-edit-dialog__row--contact-point {
+  max-width: 100%;
+  width: 100%;
+  border: 0;
+  outline: 0;
+  box-shadow: none;
+  flex-direction: var(--contact-info-dialog-contact-point-row-direction);
+  align-items: var(--contact-info-dialog-contact-point-row-align);
+  flex-wrap: var(--contact-info-dialog-contact-point-row-wrap);
+  gap: var(--contact-info-dialog-contact-point-row-gap);
+}
+
+.profile-edit-dialog__section fieldset > .profile-edit-dialog__row--contact-point {
+  margin-bottom: var(--spacing-xs, 0.75rem);
+}
+
+.profile-edit-dialog__section fieldset > .profile-edit-dialog__row--contact-point:last-child {
+  margin-bottom: var(--spacing-sm, 0.9375rem);
+}
+
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field,
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type,
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field > .label {
+  border: 0;
+  outline: 0;
+  box-shadow: none;
+  background: transparent;
+}
+
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field {
+  flex: var(--contact-info-dialog-contact-point-field-flex);
+  min-width: 0;
+}
+
+.profile-edit-dialog__row--contact-point > label.profile-edit-dialog__field {
+  display: block;
+  width: auto;
+  min-width: 0;
+}
+
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field > .label {
+  display: block;
+  width: 100%;
+}
+
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row {
+  flex: 0 0 var(--contact-info-dialog-contact-point-type-width);
+  width: var(--contact-info-dialog-contact-point-type-width);
+  min-width: var(--contact-info-dialog-contact-point-type-width);
+  max-width: var(--contact-info-dialog-contact-point-type-max-width);
+}
+
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.emailTypeRow {
+  flex: 0 0 var(--contact-info-dialog-contact-point-type-width);
+  width: var(--contact-info-dialog-contact-point-type-width);
+  min-width: var(--contact-info-dialog-contact-point-type-width);
+  max-width: var(--contact-info-dialog-contact-point-type-max-width);
+}
+
+.profile-edit-dialog__row--contact-point > .profile-edit-dialog__actions {
+  flex: var(--contact-info-dialog-contact-point-actions-flex);
+  margin-left: var(--contact-info-dialog-contact-point-actions-margin-left);
+  justify-content: var(--contact-info-dialog-contact-point-actions-justify);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point {
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field {
+  flex: 1 1 0;
+  min-width: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.emailTypeRow {
+  flex: 0 0 5.5rem;
+  width: 5.5rem;
+  min-width: 5.5rem;
+  max-width: 5.5rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__actions {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-left: 0;
+}
+
+.profile__edit-form--contact-info .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row > select,
+.profile__edit-form--contact-info .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row > solid-ui-select,
+.profile__edit-form--contact-info .profile-edit-dialog__field-type.emailTypeRow > select,
+.profile__edit-form--contact-info .profile-edit-dialog__field-type.emailTypeRow > solid-ui-select {
+  font-size: var(--contact-info-dialog-contact-point-select-font-size);
+  line-height: var(--contact-info-dialog-contact-point-select-line-height);
+}
+
+.profile-edit-dialog__row--address-header.profile-edit-dialog__row--full {
+  max-width: 100%;
+  width: 100%;
+  align-items: center;
+}
+
+.profile-edit-dialog__row--address-header.profile-edit-dialog__row--full .profile-edit-dialog__actions {
+  align-self: center;
+}
+
+.profile-edit-dialog__row--address-header.profile-edit-dialog__row--full .profile-edit-dialog__delete-button {
+  min-height: 1.75rem;
+  min-width: 1.75rem;
+}
+
+.profile-edit-dialog__address-title {
+  margin: 0;
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-medium, 500);
+  line-height: var(--line-height-base, 1.5);
+}
+
+/* layout = mobile */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__edit-form--contact-info .profile-edit-dialog__section {
+  --contact-info-dialog-contact-point-row-gap: var(--spacing-2xs, 0.625rem);
+  --contact-info-dialog-contact-point-row-align: center;
+  --contact-info-dialog-contact-point-row-direction: row;
+  --contact-info-dialog-contact-point-row-wrap: nowrap;
+  --contact-info-dialog-contact-point-field-flex: 1 1 0;
+  --contact-info-dialog-contact-point-type-width: 5.5rem;
+  --contact-info-dialog-contact-point-type-max-width: 5.5rem;
+  --contact-info-dialog-contact-point-actions-flex: 0 0 auto;
+  --contact-info-dialog-contact-point-actions-margin-left: 0;
+  --contact-info-dialog-contact-point-actions-justify: flex-end;
+  --contact-info-dialog-contact-point-select-font-size: var(--font-size-xxs, 0.75rem);
+  --contact-info-dialog-contact-point-select-line-height: var(--line-height-base, 1.5);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header {
+  padding: 0;
+  gap: 0.625rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile-edit-dialog__section-heading {
+  font-size: var(--font-size-md, 1rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile-edit-dialog__section-title-icon {
+  width: 0.8333rem;
+  height: 0.8333rem;
+  flex-basis: 0.8333rem;
+  flex-shrink: 0;
+  aspect-ratio: 1 / 1;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-content {
+  font-size: var(--font-size-sm, 0.875rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-icon {
+  display: inline-flex;
+  width: var(--font-size-xxs, 0.75rem);
+  height: var(--font-size-xxs, 0.75rem);
+  flex-shrink: 0;
+  aspect-ratio: 1 / 1;
+  padding: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-icon svg {
+  width: 100%;
+  height: 100%;
+}
+
+@media (max-width: 576px) {
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point {
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-items: center;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field {
+    flex: 1 1 0;
+    min-width: 0;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row,
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.emailTypeRow {
+    flex: 0 0 5.5rem;
+    width: 5.5rem;
+    min-width: 5.5rem;
+    max-width: 5.5rem;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__actions {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    margin-left: 0;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__section {
+    --contact-info-dialog-contact-point-row-gap: var(--spacing-2xs, 0.625rem);
+    --contact-info-dialog-contact-point-row-align: center;
+    --contact-info-dialog-contact-point-row-direction: row;
+    --contact-info-dialog-contact-point-row-wrap: nowrap;
+    --contact-info-dialog-contact-point-field-flex: 1 1 0;
+    --contact-info-dialog-contact-point-type-width: 5.5rem;
+    --contact-info-dialog-contact-point-type-max-width: 5.5rem;
+    --contact-info-dialog-contact-point-actions-flex: 0 0 auto;
+    --contact-info-dialog-contact-point-actions-margin-left: 0;
+    --contact-info-dialog-contact-point-actions-justify: flex-end;
+    --contact-info-dialog-contact-point-select-font-size: var(--font-size-xxs, 0.75rem);
+    --contact-info-dialog-contact-point-select-line-height: var(--line-height-base, 1.5);
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header {
+    padding: 0;
+    gap: 1.875rem;
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile-edit-dialog__section-heading {
+    font-size: var(--font-size-md, 1rem);
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile-edit-dialog__section-title-icon {
+    width: 0.8333rem;
+    height: 0.8333rem;
+    flex-basis: 0.8333rem;
+    flex-shrink: 0;
+    aspect-ratio: 1 / 1;
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-content {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-icon {
+    display: inline-flex;
+    width: var(--font-size-xxs, 0.75rem);
+    height: var(--font-size-xxs, 0.75rem);
+    flex-shrink: 0;
+    aspect-ratio: 1 / 1;
+    padding: 0;
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-icon svg {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point {
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-items: center;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field {
+    flex: 1 1 0;
+    min-width: 0;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row,
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.emailTypeRow {
+    flex: 0 0 5.5rem;
+    width: 5.5rem;
+    min-width: 5.5rem;
+    max-width: 5.5rem;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__row--contact-point > .profile-edit-dialog__actions {
+    flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    margin-left: 0;
+  }
+
+  .profile__edit-form--contact-info .profile-edit-dialog__section {
+    --contact-info-dialog-contact-point-row-gap: var(--spacing-2xs, 0.625rem);
+    --contact-info-dialog-contact-point-row-align: center;
+    --contact-info-dialog-contact-point-row-direction: row;
+    --contact-info-dialog-contact-point-row-wrap: nowrap;
+    --contact-info-dialog-contact-point-field-flex: 1 1 0;
+    --contact-info-dialog-contact-point-type-width: 5.5rem;
+    --contact-info-dialog-contact-point-type-max-width: 5.5rem;
+    --contact-info-dialog-contact-point-actions-flex: 0 0 auto;
+    --contact-info-dialog-contact-point-actions-margin-left: 0;
+    --contact-info-dialog-contact-point-actions-justify: flex-end;
+    --contact-info-dialog-contact-point-select-font-size: var(--font-size-xxs, 0.75rem);
+    --contact-info-dialog-contact-point-select-line-height: var(--line-height-base, 1.5);
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header {
+    padding: 0;
+    gap: 1.875rem;
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile-edit-dialog__section-heading {
+    font-size: var(--font-size-md, 1rem);
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile-edit-dialog__section-title-icon {
+    width: 0.8333rem;
+    height: 0.8333rem;
+    flex-basis: 0.8333rem;
+    flex-shrink: 0;
+    aspect-ratio: 1 / 1;
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-content {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-icon {
+    display: inline-flex;
+    width: var(--font-size-xxs, 0.75rem);
+    height: var(--font-size-xxs, 0.75rem);
+    flex-shrink: 0;
+    aspect-ratio: 1 / 1;
+    padding: 0;
+  }
+
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header .profile__add-more-icon svg {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+@media (max-width: 320px) {
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header {
+    gap: 0.625rem;
+  }
+}
+
+@container profile-pane (max-width: 320px) {
+  #profile-modal .modal .profile__edit-form--contact-info .profile-edit-dialog__contact-section-header {
+    gap: 0.625rem;
+  }
+}
diff --git a/src/sections/contactInfo/ContactInfoEditDialog.ts b/src/sections/contactInfo/ContactInfoEditDialog.ts
index 864f29b8..792c1f4a 100644
--- a/src/sections/contactInfo/ContactInfoEditDialog.ts
+++ b/src/sections/contactInfo/ContactInfoEditDialog.ts
@@ -1,8 +1,10 @@
 import { openInputDialog } from '../../ui/dialog'
 import { html, render } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import 'solid-ui/components/forms/select'
 import { ContactAddressRow, ContactInfo, ContactMutationPlan, ContactPointRow } from './types'
 import '../../styles/EditDialogs.css'
-import '../../styles/ContactInfoEditDialog.css'
+import './ContactInfoEditDialog.css'
 import { LiveStore, NamedNode } from 'rdflib'
 import { processContactInfoMutations } from './mutations'
 import { ViewerMode } from '../../types'
@@ -19,7 +21,7 @@ import {
   dialogSubmitLabelText,
   editContactInfoDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveContactUpdatesFailedPrefixText
+  saveContactUpdatesFailedMessageText
 } from '../../texts'
 import { sanitizeAddressFieldValue, sanitizeEmailValue, sanitizePhoneLocalValue } from '../shared/sanitizeUtils'
 import { addIcon, locationIcon, trashIcon } from '../../icons-svg/profileIcons'
@@ -42,6 +44,81 @@ type ContactInfoRerenderOptions = {
   focusSelector?: string
 }
 
+type ContactTypeSelectOption = {
+  label: string
+  value: string
+}
+
+type ContactTypeSelectKind = 'phone' | 'email'
+
+type ContactTypeSelectElement = HTMLElement & {
+  options?: ContactTypeSelectOption[]
+  value?: string
+  label?: string
+}
+
+const PHONE_TYPE_OPTIONS: ContactTypeSelectOption[] = [
+  { label: 'Mobile', value: 'Cell' },
+  { label: 'Home', value: 'Home' },
+  { label: 'Work', value: 'Work' }
+]
+
+const EMAIL_TYPE_OPTIONS: ContactTypeSelectOption[] = [
+  { label: 'Personal', value: 'Home' },
+  { label: 'Office', value: 'Office' }
+]
+
+function normalizeContactTypeValue(value: string, options: ContactTypeSelectOption[]): string {
+  return options.some((option) => option.value === value) ? value : options[0]?.value || ''
+}
+
+function readContactTypeChange(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
+
+  const target = event.target as HTMLSelectElement | HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
+
+function getContactTypeOptions(kind: ContactTypeSelectKind): ContactTypeSelectOption[] {
+  return kind === 'phone' ? PHONE_TYPE_OPTIONS : EMAIL_TYPE_OPTIONS
+}
+
+function getContactTypeValue(
+  kind: ContactTypeSelectKind,
+  formState: ContactInfoFormState,
+  rowIndex: number
+): string {
+  const row = kind === 'phone' ? formState.phones[rowIndex] : formState.emails[rowIndex]
+  return normalizeContactTypeValue(row?.type || '', getContactTypeOptions(kind))
+}
+
+function withDefaultContactType(
+  row: ContactPointRow,
+  kind: ContactTypeSelectKind
+): ContactPointRow {
+  return {
+    ...row,
+    type: normalizeContactTypeValue(row.type || '', getContactTypeOptions(kind))
+  }
+}
+
+function initializeContactTypeSelects(form: HTMLFormElement, formState: ContactInfoFormState): void {
+  const selectElements = form.querySelectorAll('solid-ui-select[data-contact-type-kind]') as NodeListOf<ContactTypeSelectElement>
+
+  selectElements.forEach((selectElement) => {
+    const kind = selectElement.dataset.contactTypeKind as ContactTypeSelectKind | undefined
+    const rowIndex = Number(selectElement.dataset.rowIndex)
+    if (!kind || Number.isNaN(rowIndex)) return
+
+    selectElement.options = getContactTypeOptions(kind)
+    selectElement.value = getContactTypeValue(kind, formState, rowIndex)
+    selectElement.label = ''
+  })
+}
+
 function isContactPointRow(row: ContactPointRow | ContactAddressRow): row is ContactPointRow {
   return 'value' in row
 }
@@ -64,7 +141,7 @@ function toFormState(contactInfo: ContactInfo): ContactInfoFormState {
   const emails = (contactInfo.emails || [])
     .map((email) => ({
       value: sanitizeEmailValue(toText(email.valueNode).replace(/^mailto:/i, '')),
-      type: normalizeEmailTypeForContactInfoEdit(email.type),
+      type: normalizeContactTypeValue(normalizeEmailTypeForContactInfoEdit(email.type), EMAIL_TYPE_OPTIONS),
       entryNode: toText(email.entryNode),
       status: toText(email.entryNode) ? 'existing' as const : 'new' as const
     }))
@@ -73,7 +150,7 @@ function toFormState(contactInfo: ContactInfo): ContactInfoFormState {
   const phones = (contactInfo.phones || [])
     .map((phone) => ({
       value: sanitizeTextValue(toText(phone.valueNode).replace(/^tel:/i, '')),
-      type: normalizePhoneTypeForContactInfoEdit(phone.type),
+      type: normalizeContactTypeValue(normalizePhoneTypeForContactInfoEdit(phone.type), PHONE_TYPE_OPTIONS),
       entryNode: toText(phone.entryNode),
       status: 'existing' as const
     }))
@@ -92,8 +169,8 @@ function toFormState(contactInfo: ContactInfo): ContactInfoFormState {
     .filter((address) => rowHasContent(address) || Boolean(address.entryNode || address.type))
 
   return {
-    emails: emails.length ? emails : [{ value: '', type: '', entryNode: '', status: 'new' }],
-    phones: phones.length ? phones : [{ value: '', type: '', entryNode: '', status: 'new' }],
+    emails: emails.length ? emails : [{ value: '', type: EMAIL_TYPE_OPTIONS[0].value, entryNode: '', status: 'new' }],
+    phones: phones.length ? phones : [{ value: '', type: PHONE_TYPE_OPTIONS[0].value, entryNode: '', status: 'new' }],
     addresses: addresses.length
       ? addresses
       : [{ streetAddress: '', locality: '', region: '', postalCode: '', countryName: '', type: '', entryNode: '', status: 'new' }]
@@ -127,25 +204,6 @@ type ContactAddressInputRowProps = {
   displayIndex: number
   onDelete: () => void
 }
-/* not needed for now
-function renderCountryPrefixSelect(
-  name: string,
-  value: string,
-  label: string,
-  onChange: (event: Event) => void
-) {
-  return html`
-    <label class="label profile-edit-dialog__phone-prefix-field" aria-label=${label}>
-      <select class="phonePrefixSelect" name=${name} .value=${value} @change=${onChange}>
-        ${COUNTRY_PREFIX_OPTIONS.map((option) => html`
-          <option value=${option.dialCode}>
-            ${countryCodeToFlag(option.iso2)} ${option.dialCode}
-          </option>
-        `)}
-      </select>
-    </label>
-  `
-} */
 
 function renderContactPhoneInputRow({
   phones,
@@ -155,11 +213,8 @@ function renderContactPhoneInputRow({
 }: ContactPhoneInputRowProps) {
   const phoneRow = phones[index]
   const label = `Phone Number ${displayIndex + 1}`
-  // const countryCodeLabel = `Country Calling Code ${displayIndex + 1}`
   const typeLabel = `Phone Type ${displayIndex + 1}`
-  // const prefixInputName = `phone-prefix-${index}`
   const inputName = `phone-value-${index}`
-  const typeInputName = `phone-type-${index}`
   const splitValue = splitPhoneValue(phoneRow?.value || '')
   let selectedDialCode = splitValue.dialCode
 
@@ -170,20 +225,9 @@ function renderContactPhoneInputRow({
       applyRowFieldChange(phones[index], 'value', combinePhoneValue(selectedDialCode, nextValue), rowHasContent)
     }
   }
-/* Not needed for now
-  const handleCountryCodeInput = (e: Event) => {
-    const target = e.target as HTMLSelectElement
-    selectedDialCode = target.value
-
-    if (phones[index]) {
-      const localNumber = splitPhoneValue(phones[index].value).localNumber
-      applyRowFieldChange(phones[index], 'value', combinePhoneValue(selectedDialCode, localNumber), rowHasContent)
-    }
-  } */
 
   const handleTypeInput = (e: Event) => {
-    const target = e.target as HTMLSelectElement
-    const nextType = target.value
+    const nextType = readContactTypeChange(e)
     if (phones[index]) {
       applyRowSelectChange(phones[index], 'type', nextType)
     }
@@ -207,7 +251,7 @@ function renderContactPhoneInputRow({
             data-contact-field="value"
             data-entry-node=${phoneRow?.entryNode || ''}
             data-row-status=${phoneRow?.status || 'n/a'}
-            placeholder="Phone Number"
+            placeholder=${label}
             autocomplete="tel-national"
             inputmode="tel"
             @input=${handleValueInput}
@@ -215,22 +259,30 @@ function renderContactPhoneInputRow({
         </label>
       </div>
       <label aria-label=${typeLabel} class="label profile-edit-dialog__field-type profile-edit-dialog__phone-type-row">
-        <select name=${typeInputName} id="phone-type-select-${inputName}" @change=${handleTypeInput} .value=${phoneRow?.type || ''}>
-          <option value="Cell">Mobile</option>
-          <option value="Home">Home</option>
-          <option value="Work">Work</option>
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__type-select"
+          id=${`phone-type-select-${inputName}`}
+          data-contact-type-kind="phone"
+          data-row-index=${String(index)}
+          aria-label=${typeLabel}
+          .label=${''}
+          .options=${PHONE_TYPE_OPTIONS}
+          .value=${normalizeContactTypeValue(phoneRow?.type || '', PHONE_TYPE_OPTIONS)}
+          @change=${handleTypeInput}
+        ></solid-ui-select>
       </label>
       <div class="profile-edit-dialog__actions">
-        <button
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete phone number ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
   `
@@ -239,7 +291,7 @@ function renderContactPhoneInputRow({
 function renderContactInfoPhoneSection(phones: ContactPointRow[], onAddRow: (options?: ContactInfoRerenderOptions) => void) {
   const createNewRow = (event: Event) => {
     event.preventDefault()
-    phones.unshift({ value: '', type: '', entryNode: '', status: 'new' })
+    phones.unshift({ value: '', type: PHONE_TYPE_OPTIONS[0].value, entryNode: '', status: 'new' })
     onAddRow({ focusSelector: '[name="phone-value-0"]' })
   }
 
@@ -251,22 +303,24 @@ function renderContactInfoPhoneSection(phones: ContactPointRow[], onAddRow: (opt
     <section 
       aria-labelledby="phone-numbers-heading" 
       class="profile-edit-dialog__section">
-      <header class="profile__section-header">
+      <header class="profile__section-header profile-edit-dialog__contact-section-header">
         <h3 id="phone-numbers-heading" class="profile-edit-dialog__section-heading">
-          <span class="sectionTitleIcon" aria-hidden="true">${phoneIcon}</span>
+          <span class="profile-edit-dialog__section-title-icon" aria-hidden="true">${phoneIcon}</span>
           Phone Numbers
         </h3>
-        <button
+        <solid-ui-button
           type="button"
-          class="profile__action-button profile-action-text flex-center"
+          variant="secondary"
+          size="sm"
+          class="profile__action-button profile-action-text profile-edit-dialog__add-button"
           aria-label="Add another phone number"
           @click=${createNewRow}
         >
-          <span class="profile__add-more-content inline-flex-row">
-            <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-            Add More
+          <span class="profile__add-more-content">
+            <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+            <span>Add More</span>
           </span>
-        </button>
+        </solid-ui-button>
       </header>
       <fieldset>
         <legend class="sr-only">Phone number entries</legend>
@@ -294,7 +348,6 @@ function renderContactEmailInputRow({
   const label = `Email Address ${displayIndex + 1}`
   const typeLabel = `Email Type ${displayIndex + 1}`
   const inputName = `email-value-${index}`
-  const typeInputName = `email-type-${index}`
 
   const handleValueInput = (e: Event) => {
     const target = e.target as HTMLInputElement
@@ -305,8 +358,7 @@ function renderContactEmailInputRow({
   }
 
   const handleTypeInput = (e: Event) => {
-    const target = e.target as HTMLSelectElement
-    const nextType = target.value
+    const nextType = readContactTypeChange(e)
     if (emails[index]) {
       applyRowSelectChange(emails[index], 'type', nextType)
     }
@@ -336,21 +388,30 @@ function renderContactEmailInputRow({
         />
       </label>
       <label aria-label=${typeLabel} class="label profile-edit-dialog__field-type emailTypeRow">
-        <select name=${typeInputName} id="email-type-select-${inputName}" @change=${handleTypeInput} .value=${emailRow?.type || ''}>
-          <option value="Home">Personal</option>
-          <option value="Office">Office</option>
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__type-select"
+          id=${`email-type-select-${inputName}`}
+          data-contact-type-kind="email"
+          data-row-index=${String(index)}
+          aria-label=${typeLabel}
+          .label=${''}
+          .options=${EMAIL_TYPE_OPTIONS}
+          .value=${normalizeContactTypeValue(emailRow?.type || '', EMAIL_TYPE_OPTIONS)}
+          @change=${handleTypeInput}
+        ></solid-ui-select>
       </label>
       <div class="profile-edit-dialog__actions">
-        <button
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete email address ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
   `
@@ -359,7 +420,7 @@ function renderContactEmailInputRow({
 function renderContactInfoEmailSection(emails: ContactPointRow[], onAddRow: (options?: ContactInfoRerenderOptions) => void) {
   const createNewRow = (event: Event) => {
     event.preventDefault()
-    emails.unshift({ value: '', type: '', entryNode: '', status: 'new' })
+    emails.unshift({ value: '', type: EMAIL_TYPE_OPTIONS[0].value, entryNode: '', status: 'new' })
     onAddRow({ focusSelector: '[name="email-value-0"]' })
   }
 
@@ -371,22 +432,24 @@ function renderContactInfoEmailSection(emails: ContactPointRow[], onAddRow: (opt
     <section 
       aria-labelledby="email-addresses-heading" 
       class="profile-edit-dialog__section">
-      <header class="profile__section-header">
+      <header class="profile__section-header profile-edit-dialog__contact-section-header">
         <h3 id="email-addresses-heading" class="profile-edit-dialog__section-heading">
-          <span class="sectionTitleIcon" aria-hidden="true">${emailIcon}</span>
+          <span class="profile-edit-dialog__section-title-icon" aria-hidden="true">${emailIcon}</span>
           Email Addresses
         </h3>
-        <button
+        <solid-ui-button
           type="button"
-          class="profile__action-button profile-action-text flex-center"
+          variant="secondary"
+          size="sm"
+          class="profile__action-button profile-action-text profile-edit-dialog__add-button"
           aria-label="Add another email address"
           @click=${createNewRow}
         >
-          <span class="profile__add-more-content inline-flex-row">
-            <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-            Add More
+          <span class="profile__add-more-content">
+            <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+            <span>Add More</span>
           </span>
-        </button>
+        </solid-ui-button>
       </header>
       <fieldset>
         <legend class="sr-only">Email address entries</legend>
@@ -453,15 +516,17 @@ function renderContactAddressInputRow({
         </select>
       </label>
       <div class="profile-edit-dialog__actions profile-edit-dialog__actions--edge">
-        <button
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete address ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
     <div class="profile-edit-dialog__row profile-edit-dialog__row--full">
@@ -579,22 +644,24 @@ function renderContactInfoAddressSection(addresses: ContactAddressRow[], onAddRo
     <section 
       aria-labelledby="address-heading" 
       class="profile-edit-dialog__section">
-      <header class="profile__section-header">
+      <header class="profile__section-header profile-edit-dialog__contact-section-header">
         <h3 id="address-heading" class="profile-edit-dialog__section-heading">
-          <span class="sectionTitleIcon" aria-hidden="true">${locationIcon}</span>
+          <span class="profile-edit-dialog__section-title-icon" aria-hidden="true">${locationIcon}</span>
           Addresses
         </h3>
-        <button
+        <solid-ui-button
           type="button"
-          class="profile__action-button profile-action-text flex-center"
+          variant="secondary"
+          size="sm"
+          class="profile__action-button profile-action-text profile-edit-dialog__add-button"
           aria-label="Add another address"
           @click=${createNewRow}
         >
-          <span class="profile__add-more-content inline-flex-row">
-            <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-            Add More
+          <span class="profile__add-more-content">
+            <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+            <span>Add More</span>
           </span>
-        </button>
+        </solid-ui-button>
       </header>
       <fieldset>
         <legend class="sr-only">Address entries</legend>
@@ -641,6 +708,8 @@ function renderContactInfoEditTemplate(
       : null}
   `, form)
 
+  initializeContactTypeSelects(form, formState)
+
   if (options.focusSelector) {
     focusContactInfoField(form, options.focusSelector)
   }
@@ -657,16 +726,34 @@ function createContactInfoEditForm(contactInfo: ContactInfo, viewerMode: ViewerM
   return { form, formState }
 }
 
+function isValidEmailAddress(value: string): boolean {
+  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)
+}
+
+function isValidPhoneNumber(value: string): boolean {
+  return /^\d+$/.test(value)
+}
+
 function validateContactInfoBeforeSave(formState: ContactInfoFormState): string | null {
-  const phoneOps = summarizeRowOps(formState.phones, rowHasContent)
-  const emailOps = summarizeRowOps(formState.emails, rowHasContent)
-  const addressOps = summarizeRowOps(formState.addresses, rowHasContent)
-  const hasChanges =
-    phoneOps.create.length > 0 || phoneOps.update.length > 0 || phoneOps.remove.length > 0 ||
-    emailOps.create.length > 0 || emailOps.update.length > 0 || emailOps.remove.length > 0 ||
-    addressOps.create.length > 0 || addressOps.update.length > 0 || addressOps.remove.length > 0
-
-  if (!hasChanges) return 'No contact info changes detected.'
+  const visiblePhones = formState.phones.filter((phone) => phone.status !== 'deleted')
+  for (const [index, phone] of visiblePhones.entries()) {
+    if (!rowHasContent(phone)) continue
+
+    const { localNumber } = splitPhoneValue(phone.value || '')
+    if (!isValidPhoneNumber(localNumber)) {
+      return `Phone Number ${index + 1} should contain only numbers.`
+    }
+  }
+
+  const visibleEmails = formState.emails.filter((email) => email.status !== 'deleted')
+  for (const [index, email] of visibleEmails.entries()) {
+    if (!rowHasContent(email)) continue
+
+    if (!isValidEmailAddress(email.value || '')) {
+      return `Email address ${index + 1} must be a valid email address.`
+    }
+  }
+
   return null
 }
 
@@ -689,6 +776,17 @@ export async function createContactInfoEditDialog(
     headerAction: { type: 'close' },
     submitLabel: dialogSubmitLabelText,
     cancelLabel: dialogCancelLabelText,
+    shouldCloseWithoutSave: () => {
+      const phoneOps = summarizeRowOps(formState.phones, rowHasContent)
+      const emailOps = summarizeRowOps(formState.emails, rowHasContent)
+      const addressOps = summarizeRowOps(formState.addresses, rowHasContent)
+
+      return (
+        phoneOps.create.length === 0 && phoneOps.update.length === 0 && phoneOps.remove.length === 0 &&
+        emailOps.create.length === 0 && emailOps.update.length === 0 && emailOps.remove.length === 0 &&
+        addressOps.create.length === 0 && addressOps.update.length === 0 && addressOps.remove.length === 0
+      )
+    },
     validate: () => {
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
@@ -696,16 +794,26 @@ export async function createContactInfoEditDialog(
       return validateContactInfoBeforeSave(formState)
     },
     onSave: async () => {
+      const phoneOps = summarizeRowOps(formState.phones, rowHasContent)
+      const emailOps = summarizeRowOps(formState.emails, rowHasContent)
+
       const plan: ContactMutationPlan = {
-        phoneOps: summarizeRowOps(formState.phones, rowHasContent),
-        emailOps: summarizeRowOps(formState.emails, rowHasContent),
+        phoneOps: {
+          create: phoneOps.create.map((row) => withDefaultContactType(row, 'phone')),
+          update: phoneOps.update.map((row) => withDefaultContactType(row, 'phone')),
+          remove: phoneOps.remove
+        },
+        emailOps: {
+          create: emailOps.create.map((row) => withDefaultContactType(row, 'email')),
+          update: emailOps.update.map((row) => withDefaultContactType(row, 'email')),
+          remove: emailOps.remove
+        },
         addressOps: summarizeRowOps(formState.addresses, rowHasContent)
       }
       await processContactInfoMutations(store, subject, plan)
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveContactUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveContactUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/contactInfo/ContactInfoSection.css b/src/sections/contactInfo/ContactInfoSection.css
new file mode 100644
index 00000000..25770429
--- /dev/null
+++ b/src/sections/contactInfo/ContactInfoSection.css
@@ -0,0 +1,135 @@
+.profile__section[data-profile-section='contact-info'],
+.profile__section--empty[data-profile-section='contact-info'] {
+  --contact-info-icon-padding-inline: 0.575rem;
+  --contact-info-icon-size: var(--icon-xxs, 1rem);
+  --contact-info-contact-point-value-size: var(--font-size-sm, 0.875rem);
+  --contact-info-contact-point-type-size: var(--font-size-xxs, 0.75rem);
+}
+
+/* Contact rows */
+.contact-info__icon-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 2.25rem;
+  height: 2.25rem;
+  padding: 0 var(--contact-info-icon-padding-inline, 0.575rem);
+  flex-shrink: 0;
+}
+
+.contact-info__item {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--spacing-2xs, 0.625rem);
+  margin-inline-start: 0;
+}
+
+.contact-info__item-body {
+  display: flex;
+  flex-direction: column;
+}
+
+.contact-info__icon {
+  width: var(--contact-info-icon-size, var(--icon-xxs, 1rem));
+  height: var(--contact-info-icon-size, var(--icon-xxs, 1rem));
+  flex-shrink: 0;
+  stroke-width: 1.333px;
+  stroke: var(--color-icon-muted, var(--slate-400, #90A1B9));
+}
+
+.contact-info__contact-point-value,
+.contact-info__address {
+  color: var(--color-text-strong-secondary, var(--slate-800, #1D293D));
+  font-size: var(--contact-info-contact-point-value-size, var(--font-size-sm, 0.875rem));
+  font-weight: var(--font-weight-bold, 600);
+}
+
+.contact-info__contact-point-value {
+  white-space: normal !important;
+  overflow-wrap: anywhere;
+  word-break: break-word;
+}
+
+.contact-info__contact-point-type {
+  color: var(--color-text-detail, var(--slate-500, #62748E));
+  font-size: var(--contact-info-contact-point-type-size, var(--font-size-xxs, 0.75rem));
+  font-weight: var(--font-weight-md, 500);
+}
+
+/* Lists */
+.contact-info__list {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+  list-style: none;
+  margin: 0;
+  padding: 0 0 var(--spacing-2xs, 0.625rem) 0;
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+.contact-info__list:last-of-type {
+  padding-bottom: 0;
+}
+
+.contact-info__list + .contact-info__list {
+  margin-top: var(--spacing-2xs, 0.625rem);
+}
+
+/* Empty state */
+.contact-info__empty-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.contact-info__empty-icon svg {
+  width: var(--icon-md, 2.5rem);
+  height: var(--icon-md, 2.5rem);
+  display: block;
+}
+
+.contact-info__empty-icon svg path {
+  stroke-width: 0.25rem;
+  stroke: var(--color-border, #E5E7EB);
+}
+
+.contact-info__empty-message {
+  text-align: center;
+  font-size: var(--font-size-xs, 0.813rem);
+  font-weight: var(--font-weight-normal, 400);
+  line-height: var(--line-height-tight, 1.4);
+}
+
+.contact-info__empty-icon-wrapper {
+  width: 3rem;
+  flex: 1 0 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contact-info__icon-wrapper {
+  --contact-info-icon-padding-inline: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section[data-profile-section='contact-info'],
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section--empty[data-profile-section='contact-info'] {
+  --contact-info-icon-padding-inline: 0;
+  --contact-info-icon-size: 0.8295rem;
+}
+
+@media (max-width: 576px) {
+  .profile__section[data-profile-section='contact-info'],
+  .profile__section--empty[data-profile-section='contact-info'] {
+    --contact-info-icon-padding-inline: 0;
+    --contact-info-icon-size: 0.8295rem;
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .profile__section[data-profile-section='contact-info'],
+  .profile__section--empty[data-profile-section='contact-info'] {
+    --contact-info-icon-padding-inline: 0;
+    --contact-info-icon-size: 0.8295rem;
+  }
+}
diff --git a/src/sections/contactInfo/ContactInfoSection.ts b/src/sections/contactInfo/ContactInfoSection.ts
index 5b890037..3c3605a5 100644
--- a/src/sections/contactInfo/ContactInfoSection.ts
+++ b/src/sections/contactInfo/ContactInfoSection.ts
@@ -1,13 +1,16 @@
 import { html } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { ViewerMode } from '../../types'
 import { createContactInfoEditDialog } from './ContactInfoEditDialog'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ns } from 'solid-ui'
+import './ContactInfoSection.css'
 import { contactInfoEmptyHeadingText, contactInfoHeadingText } from '../../texts'
 import { toggleCollapsibleSection } from '../shared/collapsibleSection'
 import { ContactInfo } from './types'
+import { splitPhoneValue } from '../shared/phoneCountries'
 import { normalizeEmailTypeForEdit, normalizePhoneTypeForEdit } from '../shared/contactTypeUtils'
-import { addIcon, editIcon, envelopeIcon, locationIcon, plusIcon } from '../../icons-svg/profileIcons'
+import { addIcon, chevronDownIcon, editIcon, envelopeIcon, locationIcon } from '../../icons-svg/profileIcons'
 import { emailIcon, phoneIcon } from '../../icons-svg/contactIcons'
 
 function toText(value: unknown): string {
@@ -21,9 +24,13 @@ function toText(value: unknown): string {
 }
 function normalizeContactValue(rawValue: string, kind: 'email' | 'phone'): string {
   if (!rawValue) return ''
-  return kind === 'email'
-    ? rawValue.replace(/^mailto:/i, '')
-    : rawValue.replace(/^tel:/i, '')
+  if (kind === 'email') {
+    return rawValue.replace(/^mailto:/i, '')
+  }
+
+  const normalizedPhone = rawValue.replace(/^tel:/i, '')
+  const { localNumber } = splitPhoneValue(normalizedPhone)
+  return localNumber || normalizedPhone
 }
 
 function resolveContactValue(store: LiveStore, point: any, kind: 'email' | 'phone'): string {
@@ -54,11 +61,11 @@ function renderPhone(phone, store: LiveStore) {
   const phoneValue = resolveContactValue(store, phone, 'phone')
   const phoneType = normalizePhoneTypeForEdit(phone.type)
 
-  return html`<li class="contact-info__item flex gap-2xs" role="listitem">
-        <div class="contact-info__icon-wrapper flex-center">
+  return html`<li class="contact-info__item" role="listitem">
+        <div class="contact-info__icon-wrapper">
           <span class="contact-info__icon" aria-hidden="true">${phoneIcon}</span>
         </div>
-        <div class="flex-column">
+        <div class="contact-info__item-body">
           <span class="contact-info__contact-point-value">${phoneValue}</span>
           ${phoneType ? html`<span class="contact-info__contact-point-type"> ${phoneType}</span>` : html``}
         </div>
@@ -75,11 +82,11 @@ function renderEmail(email, store: LiveStore) {
   const emailValue = resolveContactValue(store, email, 'email')
   const emailType = normalizeEmailTypeForEdit(email.type)
 
-  return html`<li class="contact-info__item flex gap-2xs" role="listitem">
-        <div class="contact-info__icon-wrapper flex-center">
+  return html`<li class="contact-info__item" role="listitem">
+        <div class="contact-info__icon-wrapper">
           <span class="contact-info__icon" aria-hidden="true">${emailIcon}</span>
         </div>
-        <div class="flex-column">
+        <div class="contact-info__item-body">
           <span class="contact-info__contact-point-value">${emailValue}</span>
           ${emailType ? html`<span class="contact-info__contact-point-type">${emailType}</span>` : html``}
         </div>
@@ -103,8 +110,8 @@ function renderAddress(address) {
   const localityRegionPostal = [localityRegion, postalCode].filter(Boolean).join(' ')
 
   return html`
-        <li class="contact-info__item flex gap-2xs" role="listitem">
-          <div class="contact-info__icon-wrapper flex-center">
+        <li class="contact-info__item" role="listitem">
+          <div class="contact-info__icon-wrapper">
             <span class="contact-info__icon" aria-hidden="true">${locationIcon}</span>
           </div>
           <span class="contact-info__address">
@@ -135,18 +142,21 @@ function renderContactInfoSectionDefault(
   return html`
     <section
       aria-labelledby="contact-details-heading"
-      class="profile__section border-lighter profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+      data-profile-section="contact-info"
+      class="profile__section profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
-        <h2 id="contact-details-heading" tabindex="-1">${contactInfoHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
+        <h3 id="contact-details-heading" tabindex="-1">${contactInfoHeadingText}</h3>
+        <div class="profile-section-collapsible__actions">
           ${isOwner ? html`
-            <button 
-              type="button" 
-              class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button" 
+            <solid-ui-button
+              type="button"
+              variant="secondary"
+              size="sm"
+              class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
               aria-label="Edit contact information"
               @click=${(event: Event) => {
                 return createContactInfoEditDialog(
@@ -157,41 +167,47 @@ function renderContactInfoSectionDefault(
                   viewerMode,
                   onSaved
                 )
-              }}>
-              <span class="profile-section-collapsible__edit-label">${editIcon} Edit</span>
+              }}
+            >
+              <span class="profile-section-collapsible__edit-label profile__add-more-content">
+                <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+                <span>Add More</span>
+              </span>
               <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-            </button>
+            </solid-ui-button>
           ` : html``}
-          <button
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle contact information section"
             aria-controls="contact-details-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="contact-details-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="contact-details-panel" class="profile-section-collapsible__content">
         ${contactInfo.phones.length > 0
           ? html`
-              <ul class="contact-info__list flex-column" role="list" aria-label="Phone numbers">
+              <ul class="contact-info__list" role="list" aria-label="Phone numbers">
                 ${renderPhones(contactInfo.phones, store)}
               </ul>
             `
           : html``}
         ${contactInfo.emails.length > 0
           ? html`
-              <ul class="contact-info__list flex-column" role="list" aria-label="Email addresses">
+              <ul class="contact-info__list" role="list" aria-label="Email addresses">
                 ${renderEmails(contactInfo.emails, store)}
               </ul>
             `
           : html``}
         ${contactInfo.addresses.length > 0
           ? html`
-              <ul class="contact-info__list flex-column" role="list" aria-label="Postal addresses">
+              <ul class="contact-info__list" role="list" aria-label="Postal addresses">
                 ${renderAddresses(contactInfo.addresses)}
               </ul>
             `
@@ -210,9 +226,9 @@ function renderOwnerEmptyContactInfoContent(
   _onSaved?: () => Promise<void> | void
 ) {
   return html`
-      <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty contact information section">    
+      <div class="profile__empty-state-content" role="group" aria-label="Empty contact information section">    
         <div class="contact-info__empty-icon-wrapper">
-          <span class="contact-info__empty-icon inline-flex-row">${envelopeIcon}</span>
+          <span class="contact-info__empty-icon">${envelopeIcon}</span>
         </div>
         <p class="profile__empty-state-message contact-info__empty-message">
             No additional contact info added yet.
@@ -232,17 +248,19 @@ function renderOwnerEmptyContactInfoSection(
     <section 
       aria-labelledby="contact-details-heading" 
       data-profile-section="contact-info"
-      class="profile__section--empty border-lighter rounded-md gap-lg profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
+      class="profile__section--empty profile__section--empty-sidebar profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
-        <h2 id="contact-details-heading" tabindex="-1">${contactInfoEmptyHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
-          <button
+        <h3 id="contact-details-heading" tabindex="-1">${contactInfoEmptyHeadingText}</h3>
+        <div class="profile-section-collapsible__actions">
+          <solid-ui-button
             type="button"
-            class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+            variant="secondary"
+            size="sm"
+            class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
             aria-label="Add contact information"
             @click=${(event: Event) => {
               return createContactInfoEditDialog(
@@ -255,22 +273,24 @@ function renderOwnerEmptyContactInfoSection(
               )
             }}
           >
-            <span class="profile-section-collapsible__edit-label">${addIcon} Add Contact</span>
-            <span class="profile-section-collapsible__edit-icon profile-section-collapsible__edit-icon--add" aria-hidden="true">${plusIcon}</span>
-          </button>
-          <button
+            <span class="profile-section-collapsible__edit-label">${addIcon} Add More</span>
+            <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
+          </solid-ui-button>
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle contact information section"
             aria-controls="contact-details-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="contact-details-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="contact-details-panel" class="profile-section-collapsible__content">
         ${renderOwnerEmptyContactInfoContent(store, subject, contactInfo, viewerMode, onSaved)}
       </div>
     </section>
diff --git a/src/sections/contactInfo/mutations.ts b/src/sections/contactInfo/mutations.ts
index 1fe932dd..09938649 100644
--- a/src/sections/contactInfo/mutations.ts
+++ b/src/sections/contactInfo/mutations.ts
@@ -1,10 +1,11 @@
-import { LiveStore, NamedNode, Node, st, sym } from 'rdflib'
+import { LiveStore, NamedNode, Node, literal, st, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { ContactAddressRow, ContactMutationPlan, ContactPointRow } from './types'
 import { MutationOps } from '../shared/types'
 import { applyUpdaterPatch, collectLinkedNodeStatements, collectNodeStatements, findExistingNode } from '../shared/rdfMutationHelpers'
 import { createIdNode } from '../shared/idNodeFactory'
-import { mutationSaveContactInfoFailedPrefixText } from '../../texts'
+import { contactInfoMutationSaveFailedDebugText, saveContactUpdatesFailedMessageText } from '../../texts'
+import { error as debugError } from '../../utils/debug'
 
 function buildPhoneStatements(subject: NamedNode, doc: NamedNode, node: Node, phone: ContactPointRow) {
   const normalizedValue = phone.value.startsWith('tel:') ? phone.value : `tel:${phone.value}`
@@ -40,11 +41,11 @@ function buildAddressStatements(subject: NamedNode, doc: NamedNode, node: Node,
   const inserts = [st(subject, ns.vcard('hasAddress'), node as any, doc)]
 
   if (address.type) inserts.push(st(node as any, ns.rdf('type'), ns.vcard(address.type), doc))
-  if (address.streetAddress) inserts.push(st(node as any, ns.vcard('street-address'), address.streetAddress as any, doc))
-  if (address.locality) inserts.push(st(node as any, ns.vcard('locality'), address.locality as any, doc))
-  if (address.region) inserts.push(st(node as any, ns.vcard('region'), address.region as any, doc))
-  if (address.postalCode) inserts.push(st(node as any, ns.vcard('postal-code'), address.postalCode as any, doc))
-  if (address.countryName) inserts.push(st(node as any, ns.vcard('country-name'), address.countryName as any, doc))
+  if (address.streetAddress) inserts.push(st(node as any, ns.vcard('street-address'), literal(address.streetAddress), doc))
+  if (address.locality) inserts.push(st(node as any, ns.vcard('locality'), literal(address.locality), doc))
+  if (address.region) inserts.push(st(node as any, ns.vcard('region'), literal(address.region), doc))
+  if (address.postalCode) inserts.push(st(node as any, ns.vcard('postal-code'), literal(address.postalCode), doc))
+  if (address.countryName) inserts.push(st(node as any, ns.vcard('country-name'), literal(address.countryName), doc))
 
   return inserts
 }
@@ -171,7 +172,8 @@ export async function processContactInfoMutations(store: LiveStore, subject: Nam
     await mutateEmailEntries(store, subject, mutationPlan.emailOps)
     await mutateAddressEntries(store, subject, mutationPlan.addressOps)
   } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`${mutationSaveContactInfoFailedPrefixText} ${message}`)
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(contactInfoMutationSaveFailedDebugText, rootError)
+    throw new Error(saveContactUpdatesFailedMessageText, { cause: rootError })
   }
 } 
diff --git a/src/sections/education/EducationEditDialog.ts b/src/sections/education/EducationEditDialog.ts
index ff419560..d56c4f6d 100644
--- a/src/sections/education/EducationEditDialog.ts
+++ b/src/sections/education/EducationEditDialog.ts
@@ -1,8 +1,10 @@
 import { alertDialog, openInputDialog } from '../../ui/dialog'
 import { html, render } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import 'solid-ui/components/forms/select'
 import { EducationRow, EducationDetails } from './types'
 import '../../styles/EditDialogs.css'
-import '../../styles/ContactInfoEditDialog.css'
+import '../contactInfo/ContactInfoEditDialog.css'
 import { LiveStore, NamedNode } from 'rdflib'
 import { processEducationMutations } from './mutations'
 import { ViewerMode } from '../../types'
@@ -16,7 +18,7 @@ import {
   dialogSubmitLabelText,
   editEducationDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveEducationUpdatesFailedPrefixText,
+  saveEducationUpdatesFailedMessageText,
 } from '../../texts'
 
 type EducationFormState = {
@@ -28,10 +30,89 @@ type EducationValidationResult = {
   message?: string
 }
 
+type EducationSelectOption = {
+  label: string
+  value: string
+}
+
+type EducationDateSelectKind = 'start-month' | 'start-year' | 'end-month' | 'end-year'
+
+type EducationSelectElement = HTMLElement & {
+  options?: EducationSelectOption[]
+  value?: string
+  label?: string
+}
+
+const EDUCATION_MONTH_OPTIONS: EducationSelectOption[] = [
+  { value: '01', label: 'January' },
+  { value: '02', label: 'February' },
+  { value: '03', label: 'March' },
+  { value: '04', label: 'April' },
+  { value: '05', label: 'May' },
+  { value: '06', label: 'June' },
+  { value: '07', label: 'July' },
+  { value: '08', label: 'August' },
+  { value: '09', label: 'September' },
+  { value: '10', label: 'October' },
+  { value: '11', label: 'November' },
+  { value: '12', label: 'December' }
+]
+
 function sanitizeEducationFieldValue(value: string): string {
   return sanitizeTextValue(value)
 }
 
+function readEducationSelectChange(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
+
+  const target = event.target as HTMLSelectElement | HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
+
+function getEducationYearOptions(selectedYears: string[]): EducationSelectOption[] {
+  const currentYear = new Date().getFullYear()
+  const baseYearOptions = Array.from({ length: 120 }, (_, i) => String(currentYear - i))
+  const yearOptions = Array.from(new Set([
+    ...baseYearOptions,
+    ...selectedYears
+  ].filter(Boolean))).sort((a, b) => Number(b) - Number(a))
+
+  return yearOptions.map((year) => ({ label: year, value: year }))
+}
+
+function getEducationDateSelectOptions(kind: EducationDateSelectKind, selectedYears: string[]): EducationSelectOption[] {
+  if (kind === 'start-month' || kind === 'end-month') {
+    return EDUCATION_MONTH_OPTIONS
+  }
+
+  return getEducationYearOptions(selectedYears)
+}
+
+function getEducationDateSelectValue(kind: EducationDateSelectKind, row: EducationRow): string {
+  const startDateParts = parseYearMonthFromDateText(toText(row?.startDate))
+  const endDateParts = parseYearMonthFromDateText(toText(row?.endDate))
+
+  switch (kind) {
+    case 'start-month':
+      return startDateParts.month
+    case 'start-year':
+      return startDateParts.year
+    case 'end-month':
+      return endDateParts.month
+    case 'end-year':
+      return endDateParts.year
+    default:
+      return ''
+  }
+}
+
+function getEducationDateSelectLabel(kind: EducationDateSelectKind): string {
+  return kind === 'start-month' || kind === 'end-month' ? 'Select Month' : 'Select Year'
+}
+
 function parseYearMonthFromDateText(dateText: string): { year: string, month: string } {
   const normalized = (dateText || '').trim()
   if (!normalized) return { year: '', month: '' }
@@ -118,6 +199,27 @@ type EducationRowProps = {
   onChange: () => void
 }
 
+function initializeEducationDateSelects(form: HTMLFormElement, educationData: EducationRow[]): void {
+  const selectElements = form.querySelectorAll('solid-ui-select[data-education-date-kind]') as NodeListOf<EducationSelectElement>
+
+  selectElements.forEach((selectElement) => {
+    const kind = selectElement.dataset.educationDateKind as EducationDateSelectKind | undefined
+    const rowIndex = Number(selectElement.dataset.educationRowIndex)
+    if (!kind || Number.isNaN(rowIndex)) return
+
+    const educationRow = educationData[rowIndex]
+    if (!educationRow) return
+
+    const startDateParts = parseYearMonthFromDateText(toText(educationRow.startDate))
+    const endDateParts = parseYearMonthFromDateText(toText(educationRow.endDate))
+    const selectedYears = [startDateParts.year, endDateParts.year]
+
+    selectElement.options = getEducationDateSelectOptions(kind, selectedYears)
+    selectElement.value = getEducationDateSelectValue(kind, educationRow)
+    selectElement.label = getEducationDateSelectLabel(kind)
+  })
+}
+
 function renderEducationInputRow({
   educationData,
   index,
@@ -158,41 +260,7 @@ function renderEducationInputRow({
   const endYearParsedText = endDateParts.year
 
   const currentYear = new Date().getFullYear()
-  const baseYearOptions = Array.from({ length: 120 }, (_, i) => String(currentYear - i))
-  const yearOptions = Array.from(new Set([
-    ...baseYearOptions,
-    startYearText,
-    endYearParsedText
-  ].filter(Boolean))).sort((a, b) => Number(b) - Number(a))
-
-  const monthOptions = [
-    { value: '01', label: 'January' },
-    { value: '02', label: 'February' },
-    { value: '03', label: 'March' },
-    { value: '04', label: 'April' },
-    { value: '05', label: 'May' },
-    { value: '06', label: 'June' },
-    { value: '07', label: 'July' },
-    { value: '08', label: 'August' },
-    { value: '09', label: 'September' },
-    { value: '10', label: 'October' },
-    { value: '11', label: 'November' },
-    { value: '12', label: 'December' }
-  ]
-
-  const renderMonthOptions = (selectedMonth: string) => html`
-    <option value="" ?selected=${!selectedMonth}>Select month</option>
-    ${monthOptions.map((month) => html`
-      <option value=${month.value} ?selected=${month.value === selectedMonth}>${month.label}</option>
-    `)}
-  `
-
-  const renderYearOptions = (selectedYear: string) => html`
-    <option value="" ?selected=${!selectedYear}>Select year</option>
-    ${yearOptions.map((year) => html`
-      <option value=${year} ?selected=${year === selectedYear}>${year}</option>
-    `)}
-  `
+  const selectedYears = [startYearText, endYearParsedText]
   
   const handleEducationInput = (field: EducationEditableField) => (e: Event) => {
     const target = e.target as HTMLInputElement
@@ -214,8 +282,7 @@ function renderEducationInputRow({
   }
 
   const handleStartMonthChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const month = target.value
+    const month = readEducationSelectChange(event)
     const year = parseYearMonthFromDateText(toText(educationData[index]?.startDate)).year || String(currentYear)
     const nextStartDate = buildDateLiteral(month, year)
     if (educationData[index]) {
@@ -225,8 +292,7 @@ function renderEducationInputRow({
   }
 
   const handleStartYearChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const year = target.value
+    const year = readEducationSelectChange(event)
     const month = parseYearMonthFromDateText(toText(educationData[index]?.startDate)).month || '01'
     const nextStartDate = buildDateLiteral(month, year)
     if (educationData[index]) {
@@ -236,8 +302,7 @@ function renderEducationInputRow({
   }
 
   const handleEndMonthChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const month = target.value
+    const month = readEducationSelectChange(event)
     const year = parseYearMonthFromDateText(toText(educationData[index]?.endDate)).year || String(currentYear)
     const nextEndDate = buildDateLiteral(month, year)
     if (educationData[index]) {
@@ -247,8 +312,7 @@ function renderEducationInputRow({
   }
 
   const handleEndYearChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const year = target.value
+    const year = readEducationSelectChange(event)
     const month = parseYearMonthFromDateText(toText(educationData[index]?.endDate)).month || '01'
     const nextEndDate = buildDateLiteral(month, year)
     if (educationData[index]) {
@@ -270,15 +334,17 @@ function renderEducationInputRow({
     <div class="profile-edit-dialog__row" role="group" aria-labelledby=${educationHeadingId}>
       <h4 id=${educationHeadingId} class="profile-edit-dialog__entry-heading">${label}</h4>
       <div class="profile-edit-dialog__actions profile-edit-dialog__actions--edge">
-        <button
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete education ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
     <label aria-label=${`${label} School/College`} class="label profile-edit-dialog__field">
@@ -319,27 +385,59 @@ function renderEducationInputRow({
     <div class="profile-edit-dialog__row">
       <label aria-label=${startMonthLabel} class="label profile-edit-dialog__field-type">
         Start Month
-        <select name=${startMonthInputName} id=${startMonthSelectId} @change=${handleStartMonthChange}>
-          ${renderMonthOptions(startMonthValue)}
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__education-date-select"
+          name=${startMonthInputName}
+          id=${startMonthSelectId}
+          data-education-date-kind="start-month"
+          data-education-row-index=${String(index)}
+          .options=${getEducationDateSelectOptions('start-month', selectedYears)}
+          .value=${startMonthValue}
+          .label=${getEducationDateSelectLabel('start-month')}
+          @change=${handleStartMonthChange}
+        ></solid-ui-select>
       </label>
       <label aria-label=${startYearLabel} class="label profile-edit-dialog__field-type">
         Start Year
-        <select name=${startYearInputName} id=${startYearSelectId} @change=${handleStartYearChange}>
-          ${renderYearOptions(startYearText)}
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__education-date-select"
+          name=${startYearInputName}
+          id=${startYearSelectId}
+          data-education-date-kind="start-year"
+          data-education-row-index=${String(index)}
+          .options=${getEducationDateSelectOptions('start-year', selectedYears)}
+          .value=${startYearText}
+          .label=${getEducationDateSelectLabel('start-year')}
+          @change=${handleStartYearChange}
+        ></solid-ui-select>
       </label>
       <label aria-label=${endMonthLabel} class="label profile-edit-dialog__field-type">
         End Month
-        <select name=${endMonthInputName} id=${endMonthSelectId} @change=${handleEndMonthChange}>
-          ${renderMonthOptions(endMonthValue)}
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__education-date-select"
+          name=${endMonthInputName}
+          id=${endMonthSelectId}
+          data-education-date-kind="end-month"
+          data-education-row-index=${String(index)}
+          .options=${getEducationDateSelectOptions('end-month', selectedYears)}
+          .value=${endMonthValue}
+          .label=${getEducationDateSelectLabel('end-month')}
+          @change=${handleEndMonthChange}
+        ></solid-ui-select>
       </label>
       <label aria-label=${endYearLabel} class="label profile-edit-dialog__field-type">
         End Year
-        <select name=${endYearInputName} id=${endYearSelectId} @change=${handleEndYearChange}>
-          ${renderYearOptions(endYearParsedText)}
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__education-date-select"
+          name=${endYearInputName}
+          id=${endYearSelectId}
+          data-education-date-kind="end-year"
+          data-education-row-index=${String(index)}
+          .options=${getEducationDateSelectOptions('end-year', selectedYears)}
+          .value=${endYearParsedText}
+          .label=${getEducationDateSelectLabel('end-year')}
+          @change=${handleEndYearChange}
+        ></solid-ui-select>
       </label>
     </div>
     <label aria-label=${`${label} Description`} class="label profile-edit-dialog__field profile-edit-dialog__field--full profile-edit-dialog__field--stack">
@@ -387,24 +485,26 @@ function renderEducationSection(educationData: EducationRow[], onAddRow: () => v
   return html`
     <section 
       aria-labelledby="education-heading" 
-      class="educationEditSection section-bg">
+      class="profile-edit-dialog__section--education section-bg">
       <header class="profile__section-header">
         <h3 id="education-heading" class="profile-edit-dialog__section-heading">
-          <span class="sectionTitleIcon" aria-hidden="true">&#9993;</span>
+          <span class="profile-edit-dialog__section-title-icon" aria-hidden="true">&#9993;</span>
           Education
         </h3>
-        <button
+        <solid-ui-button
           type="button"
-          class="profile__action-button profile-action-text flex-center"
+          variant="secondary"
+          size="sm"
+          class="profile__action-button profile-action-text profile-edit-dialog__add-button"
           data-dialog-add-more="true"
           aria-label="Add another education entry"
           @click=${createNewRow}
         >
-          <span class="profile__add-more-content inline-flex-row">
-            <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-            Add More
+          <span class="profile__add-more-content">
+            <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+            <span>Add More</span>
           </span>
-        </button>
+        </solid-ui-button>
       </header>
       <fieldset>
         <legend class="sr-only">Education entries</legend>
@@ -435,6 +535,8 @@ function renderEducationEditTemplate(
       ? html`<p class="profile-edit-dialog__login-message">${ownerLoginRequiredDialogMessageText}</p>`
       : null}
   `, form)
+
+  initializeEducationDateSelects(form, formState.educationData)
 }
 
 function createEducationEditForm(educationData: EducationDetails[], viewerMode: ViewerMode) {
@@ -468,6 +570,10 @@ export async function createEducationEditDialog(
     title: editEducationDialogTitleText,
     dom,
     form,
+    shouldCloseWithoutSave: () => {
+      const plan: MutationOps<EducationRow> = summarizeRowOps(formState.educationData, rowHasContent)
+      return plan.create.length === 0 && plan.update.length === 0 && plan.remove.length === 0
+    },
     headerAction: {
       type: 'button',
       label: 'Add More',
@@ -481,12 +587,6 @@ export async function createEducationEditDialog(
         return ownerLoginRequiredDialogMessageText
       }
 
-      const plan: MutationOps<EducationRow> = summarizeRowOps(formState.educationData, rowHasContent)
-      const hasChanges = plan.create.length > 0 || plan.update.length > 0 || plan.remove.length > 0
-      if (!hasChanges) {
-        return 'No education changes detected.'
-      }
-
       const validation = validateEducationBeforeSave(formState.educationData)
       if (!validation.ok) {
         return validation.message || 'Please complete the required education fields.'
@@ -500,8 +600,7 @@ export async function createEducationEditDialog(
       rerender()
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveEducationUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveEducationUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/education/EducationSection.css b/src/sections/education/EducationSection.css
new file mode 100644
index 00000000..e50530a4
--- /dev/null
+++ b/src/sections/education/EducationSection.css
@@ -0,0 +1,133 @@
+/* Education section styles. */
+
+.education-card {
+  width: 100%;
+}
+
+.education-card__item {
+  margin: var(--spacing-xs) 0;
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+}
+
+.education-card__item + .education-card__item {
+  margin-top: var(--spacing-sm);
+}
+
+.education-card__header {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: baseline;
+  gap: var(--spacing-sm);
+}
+
+.education-card__header h4,
+.education-card__header time,
+.education-card__header p {
+  margin: 0;
+}
+
+.education-card__period {
+  margin: 0;
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-tight);
+}
+
+.education-card__organization {
+  font-weight: 600;
+  color: var(--color-primary);
+  margin: 0;
+}
+
+.education-card__description-wrap {
+  margin: 0;
+  position: relative;
+}
+
+.education-card__description-text {
+  margin: 0;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  line-height: var(--line-height-base);
+  overflow: hidden;
+}
+
+.education-card__description-text--overflowing {
+  padding-right: 4.5em;
+}
+
+.education-card__description-text--expanded {
+  display: block;
+  -webkit-line-clamp: unset;
+  line-clamp: unset;
+  padding-right: 0;
+  overflow: visible;
+}
+
+.education-card__description-toggle {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  background: none;
+  color: var(--color-primary);
+  cursor: var(--profile-interactive-cursor, pointer);
+  font: inherit;
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-tight);
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  background-color: var(--color-card-bg);
+  padding-left: 0.25em;
+}
+
+solid-ui-button.education-card__description-toggle {
+  --button-height-sm: 0;
+  --button-padding-sm: 0 0 0 0.25em;
+  --button-font-size-sm: var(--font-size-sm);
+  --button-line-height: var(--line-height-tight);
+  --button-background: none;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--color-primary);
+  --button-hover-background: none;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary);
+}
+
+solid-ui-button.education-card__description-toggle::part(button) {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  background-color: var(--color-card-bg);
+}
+
+.education-card__description-text--expanded + .education-card__description-toggle {
+  position: static;
+  display: inline;
+  padding-left: 0;
+}
+
+.education-card__description-text--expanded + solid-ui-button.education-card__description-toggle::part(button) {
+  position: static;
+  display: inline;
+  padding-left: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .education-card__header {
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+@media (max-width: 576px) {
+  .education-card__header {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+}
\ No newline at end of file
diff --git a/src/sections/education/EducationSection.ts b/src/sections/education/EducationSection.ts
index c4da2814..1e39e00a 100644
--- a/src/sections/education/EducationSection.ts
+++ b/src/sections/education/EducationSection.ts
@@ -1,7 +1,8 @@
 import { html } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { EducationDetails } from './types'
 import { ViewerMode } from '../../types'
-import '../../styles/EducationCard.css'
+import './EducationSection.css'
 import { educationHeadingText } from '../../texts'
 import { LiveStore, NamedNode } from 'rdflib'
 import { createEducationEditDialog } from './EducationEditDialog'
@@ -11,7 +12,7 @@ import {
   toggleDescription,
 } from '../shared/sectionCardHelpers'
 import { toggleCollapsibleSection } from '../shared/collapsibleSection'
-import { editIcon } from '../../icons-svg/profileIcons'
+import { chevronDownIcon, editIcon } from '../../icons-svg/profileIcons'
 
 function formatEducationMonthYearFull(date?: string): string {
   if (!date) return ''
@@ -40,31 +41,34 @@ function renderEducationEntry(educationEntry: EducationDetails, index: number) {
     : `${educationPeriodId} ${educationOrgId}`
 
   return html`
-    <li class="education" role="listitem" aria-labelledby=${schoolId} aria-describedby=${ariaDescribedBy}>
-      <div class="educationHeader">
+    <li class="education-card__item" role="listitem" aria-labelledby=${schoolId} aria-describedby=${ariaDescribedBy}>
+      <div class="education-card__header">
         <h4 id=${schoolId}>${educationEntry.school}</h4>
-        <p id=${educationPeriodId} class="educationPeriod">
+        <p id=${educationPeriodId} class="education-card__period">
           ${educationEntry.endDate
             ? html`<time datetime=${toMonthDateTime(educationEntry.endDate)}>${formatEducationMonthYearFull(educationEntry.endDate)}</time>`
             : html`<span>End date unknown</span>`}
         </p>
       </div>
-      <p class="educationOrg" id=${educationOrgId}>
+      <p class="education-card__organization" id=${educationOrgId}>
         <strong>${educationEntry.degree}</strong>${educationEntry.location ? html` | ${educationEntry.location}` : ''}
       </p>
       ${educationEntry.description ? html`
-        <div class="cvDescriptionWrap">
-          <p class="cvDescriptionText" id=${educationDescriptionId}>${educationEntry.description}</p>
-          <button
+        <div class="education-card__description-wrap">
+          <p class="education-card__description-text" id=${educationDescriptionId}>${educationEntry.description}</p>
+          <solid-ui-button
             type="button"
-            class="cvDescriptionToggle"
+            variant="secondary"
+            size="sm"
+            label="...more"
+            class="education-card__description-toggle"
             aria-controls=${educationDescriptionId}
             aria-expanded="false"
             hidden
             @click=${toggleDescription}
           >
             ...more
-          </button>
+          </solid-ui-button>
         </div>
       ` : ''}
     </li>
@@ -77,16 +81,14 @@ function renderEducation(educationData: EducationDetails[]) {
 }
 
 export const EducationCard = (
-  educationData: EducationDetails[],
-  viewerMode: ViewerMode
+  educationData: EducationDetails[]
 ) => {
-  void viewerMode
   const hasEducation = Array.isArray(educationData) && educationData.length > 0
   if (!hasEducation) return html``
 
   return html`
-    <article class="educationCard" aria-label="Education" data-testid="education">
-      <section class="educationSection">
+    <article class="education-card" aria-label="Education" data-testid="education">
+      <section class="education-card__section">
         <ul role="list" aria-label="Education in chronological order">
           ${renderEducation(educationData)}
         </ul>
@@ -104,7 +106,7 @@ export function renderEducationSection(
 ) {
   scheduleDescriptionOverflowCheck()
 
-  const educationCard = EducationCard(educationData, viewerMode)
+  const educationCard = EducationCard(educationData)
   const educationDetails: EducationDetails[] = educationData || []
   const hasEducation = educationDetails && educationDetails.length > 0
   const showSection = true
@@ -113,38 +115,42 @@ export function renderEducationSection(
   return showSection ? html`
     <section 
       aria-labelledby="education-heading" 
-      class="profile-section-collapsible section-bg" 
+      class="profile__section profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
         <h2 id="education-heading" tabindex="-1">${educationHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
+        <div class="profile-section-collapsible__actions">
           ${isOwner ? html`
-            <button
+            <solid-ui-button
               type="button"
-              class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+              variant="secondary"
+              size="sm"
+              class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
               aria-label="Edit education details"
               @click=${(event: Event) => createEducationEditDialog(event, store, subject, educationDetails, viewerMode, onSaved)}
             >
               <span class="profile-section-collapsible__edit-label">${editIcon} Edit</span>
               <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-            </button>
+            </solid-ui-button>
           ` : html``}
-          <button
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle education section"
             aria-controls="education-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="education-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="education-panel" class="profile-section-collapsible__content">
         ${hasEducation ? educationCard : html`<p>No education details added yet.</p>`}
       </div>
     </section>
diff --git a/src/sections/education/mutations.ts b/src/sections/education/mutations.ts
index 72ca7324..7d00c04c 100644
--- a/src/sections/education/mutations.ts
+++ b/src/sections/education/mutations.ts
@@ -3,7 +3,8 @@ import { ns } from 'solid-ui'
 import { EducationMutationPlan, EducationRow } from './types'
 import { MutationOps } from '../shared/types'
 import { applyUpdaterPatch, collectNodeStatements, findExistingNode } from '../shared/rdfMutationHelpers'
-import { mutationEducationFailedPrefixText } from '../../texts'
+import { educationMutationSaveFailedDebugText, saveEducationUpdatesFailedMessageText } from '../../texts'
+import { error as debugError } from '../../utils/debug'
 
 const educationMembershipType = ns.schema('EducationalOccupationalCredential')
 
@@ -68,7 +69,8 @@ export async function processEducationMutations(store: LiveStore, subject: Named
   try {
     await mutateEducationEntries(store, subject, mutationPlan)
   } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`${mutationEducationFailedPrefixText} ${message}`)
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(educationMutationSaveFailedDebugText, rootError)
+    throw new Error(saveEducationUpdatesFailedMessageText, { cause: rootError })
   }
 } 
diff --git a/src/sections/heading/HeadingEditDialog.ts b/src/sections/heading/HeadingEditDialog.ts
index 964e47d6..66f2ce57 100644
--- a/src/sections/heading/HeadingEditDialog.ts
+++ b/src/sections/heading/HeadingEditDialog.ts
@@ -1,9 +1,12 @@
 import { openInputDialog } from '../../ui/dialog'
 import { html, render, TemplateResult } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import 'solid-ui/components/forms/select'
+import 'solid-ui/components/media/photo-capture'
 import { ProfileDetails, HeadingMutationPlan, ProfileBasicRow } from './types'
 import { Image } from './HeadingSection'
 import '../../styles/EditDialogs.css'
-import { LiveStore, NamedNode, sym } from 'rdflib'
+import { LiveStore, NamedNode } from 'rdflib'
 import { processHeadingMutations } from './mutations'
 import { ViewerMode } from '../../types'
 import {
@@ -23,26 +26,90 @@ import {
   dialogSubmitLabelText,
   editHeadingDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveHeadingUpdatesFailedPrefixText
+  saveHeadingUpdatesFailedMessageText
 } from '../../texts'
+import { error as debugError, warn as debugWarn } from '../../utils/debug'
 import { cameraIcon } from '../../icons-svg/profileIcons'
 import { ContactAddressRow, ContactPointRow } from '../contactInfo/types'
 import { sanitizeAddressFieldValue, sanitizeBasicInputFieldValue, sanitizeEmailValue, sanitizePhoneLocalValue } from '../shared/sanitizeUtils'
 import { toStorageDateISO } from './dateHelpers'
-import { deletePhotoFile, uploadPhotoFile } from './imageHelpers'
-import { cameraCaptureControl } from './camera'
+import { deletePhotoFile, resolvePhotoDisplaySrc, uploadPhotoFile } from './imageHelpers'
 /* Note: new design - has address type in More Edit Contacts for now we will leave
          out Address Type, but a ticket will be created to add type later
          so I will keep the code and just comment it out for now. 
          new design - has country code, will comment out code for now and create a ticket to add later. */
 
+type HeadingPhotoCaptureElement = HTMLElement & {
+  heading: string
+  captureLabel: string
+  confirmLabel: string
+  retakeLabel: string
+  cancelLabel: string
+  presentation: 'inline' | 'dialog'
+  showTrigger: boolean
+  showCancelButton: boolean
+  autoCloseOnCapture: boolean
+  fileNamePrefix: string
+  facingMode: string
+  open: boolean
+}
+
+type HeadingPhotoCapturedDetail = {
+  file: File
+}
+
 type HeadingFormState = {
   basicInfo: ProfileBasicRow
   email: ContactPointRow
   phone: ContactPointRow
   address: ContactAddressRow
+  emailTypeWasMissing: boolean
+  phoneTypeWasMissing: boolean
+  imagePreviewSrc: string
+  clearImagePreview: () => void
+}
+
+type HeadingContactTypeOption = {
+  label: string
+  value: string
+}
+
+type HeadingPronounsOption = {
+  label: string
+  value: string
+}
+
+type HeadingContactTypeKind = 'phone' | 'email'
+
+type HeadingContactTypeSelectElement = HTMLElement & {
+  options?: HeadingContactTypeOption[]
+  value?: string
+  label?: string
+}
+
+type HeadingPronounsSelectElement = HTMLElement & {
+  options?: HeadingPronounsOption[]
+  value?: string
+  label?: string
 }
 
+const HEADING_PHONE_TYPE_OPTIONS: HeadingContactTypeOption[] = [
+  { label: 'Mobile', value: 'Mobile' },
+  { label: 'Home', value: 'Home' },
+  { label: 'Work', value: 'Work' }
+]
+
+const HEADING_EMAIL_TYPE_OPTIONS: HeadingContactTypeOption[] = [
+  { label: 'Personal', value: 'Personal' },
+  { label: 'Office', value: 'Office' }
+]
+
+const HEADING_PRONOUN_OPTIONS: HeadingPronounsOption[] = [
+  { label: 'He/Him', value: 'He/Him' },
+  { label: 'She/Her', value: 'She/Her' },
+  { label: 'They/Them', value: 'They/Them' }
+]
+
 type Row = ProfileBasicRow | ContactPointRow | ContactAddressRow
 
 function isContactPointRow(row: Row): row is ContactPointRow {
@@ -57,6 +124,64 @@ function isProfileBasicRow(row: Row): row is ProfileBasicRow {
   return 'name' in row
 }
 
+function normalizeHeadingContactTypeValue(value: string, options: HeadingContactTypeOption[]): string {
+  return options.some((option) => option.value === value) ? value : options[0]?.value || ''
+}
+
+function readHeadingContactTypeChange(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
+
+  const target = event.target as HTMLSelectElement | HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
+
+function getHeadingContactTypeOptions(kind: HeadingContactTypeKind): HeadingContactTypeOption[] {
+  return kind === 'phone' ? HEADING_PHONE_TYPE_OPTIONS : HEADING_EMAIL_TYPE_OPTIONS
+}
+
+function getHeadingContactTypeValue(
+  kind: HeadingContactTypeKind,
+  formState: HeadingFormState
+): string {
+  const row = kind === 'phone' ? formState.phone : formState.email
+  return normalizeHeadingContactTypeValue(row?.type || '', getHeadingContactTypeOptions(kind))
+}
+
+function withDefaultHeadingContactType(
+  row: ContactPointRow,
+  kind: HeadingContactTypeKind
+): ContactPointRow {
+  return {
+    ...row,
+    type: normalizeHeadingContactTypeValue(row.type || '', getHeadingContactTypeOptions(kind))
+  }
+}
+
+function initializeHeadingContactTypeSelects(form: HTMLFormElement, formState: HeadingFormState): void {
+  const selectElements = form.querySelectorAll('solid-ui-select[data-heading-contact-type-kind]') as NodeListOf<HeadingContactTypeSelectElement>
+
+  selectElements.forEach((selectElement) => {
+    const kind = selectElement.dataset.headingContactTypeKind as HeadingContactTypeKind | undefined
+    if (!kind) return
+
+    selectElement.options = getHeadingContactTypeOptions(kind)
+    selectElement.value = getHeadingContactTypeValue(kind, formState)
+    selectElement.label = ''
+  })
+}
+
+function initializeHeadingPronounsSelect(form: HTMLFormElement, formState: HeadingFormState): void {
+  const selectElement = form.querySelector('solid-ui-select[data-heading-basic-field="pronouns"]') as HeadingPronounsSelectElement | null
+  if (!selectElement) return
+
+  selectElement.options = HEADING_PRONOUN_OPTIONS
+  selectElement.value = normalizePronounsValue(formState.basicInfo?.pronouns || '')
+  selectElement.label = ''
+}
+
 
 function rowHasContent(row: Row): boolean {
   if (isContactPointRow(row)) {
@@ -111,6 +236,8 @@ function toFormState(profileData: ProfileDetails): HeadingFormState {
   const primaryEmail = profileData.primaryEmail
   const primaryPhone = profileData.primaryPhone
   const primaryAddress = profileData.primaryAddress
+  const emailTypeWasMissing = !normalizeEmailTypeForEdit(primaryEmail?.type)
+  const phoneTypeWasMissing = !normalizePhoneTypeForEdit(primaryPhone?.type)
 
   const normalizedEmailType = normalizeEmailTypeForEdit(primaryEmail?.type)
   const normalizedPhoneType = normalizePhoneTypeForEdit(primaryPhone?.type)
@@ -144,8 +271,54 @@ function toFormState(profileData: ProfileDetails): HeadingFormState {
       basicInfo: (basicInfo) ? basicInfo : { name: '', nickname: '', imageSrc: '', location: '', pronouns: '', dateOfBirth: '', jobTitle: '', orgName: '', entryNode: '', status: 'new' },
       email: (email) ? email : { value: '', type: '', entryNode: '', status: 'new' },
       phone: (phone) ? phone : { value: '', type: '', entryNode: '', status: 'new' },
-      address: (address) ? address : { streetAddress: '', locality: '', region: '', postalCode: '', countryName: '', type: '', entryNode: '', status: 'new' }
+      address: (address) ? address : { streetAddress: '', locality: '', region: '', postalCode: '', countryName: '', type: '', entryNode: '', status: 'new' },
+      emailTypeWasMissing,
+      phoneTypeWasMissing,
+      imagePreviewSrc: '',
+      clearImagePreview: () => undefined
+    }
+}
+
+function setHeadingImagePreview(formState: HeadingFormState, file: File) {
+  formState.clearImagePreview()
+
+  if (typeof URL.createObjectURL !== 'function') {
+    formState.imagePreviewSrc = ''
+    formState.clearImagePreview = () => undefined
+    return
+  }
+
+  const previewUrl = URL.createObjectURL(file)
+  formState.imagePreviewSrc = previewUrl
+  formState.clearImagePreview = () => {
+    URL.revokeObjectURL(previewUrl)
+    formState.imagePreviewSrc = ''
+    formState.clearImagePreview = () => undefined
+  }
+}
+
+function setResolvedHeadingPreview(formState: HeadingFormState, resolvedImageSrc?: string) {
+  formState.clearImagePreview()
+
+  if (!resolvedImageSrc) {
+    return
+  }
+
+  formState.imagePreviewSrc = resolvedImageSrc
+
+  if (resolvedImageSrc.startsWith('blob:') && typeof URL.revokeObjectURL === 'function') {
+    formState.clearImagePreview = () => {
+      URL.revokeObjectURL(resolvedImageSrc)
+      formState.imagePreviewSrc = ''
+      formState.clearImagePreview = () => undefined
     }
+    return
+  }
+
+  formState.clearImagePreview = () => {
+    formState.imagePreviewSrc = ''
+    formState.clearImagePreview = () => undefined
+  }
 }
 
 type ProfileBasicEditableField =
@@ -178,8 +351,8 @@ type ContactAddressInputRowProps = {
 
 function mapEmailOpsForSave(ops: { create: ContactPointRow[], update: ContactPointRow[], remove: ContactPointRow[] }) {
   const mapRow = (row: ContactPointRow): ContactPointRow => ({
-    ...row,
-    type: toSavedHeadingEmailType(row.type)
+    ...withDefaultHeadingContactType(row, 'email'),
+    type: toSavedHeadingEmailType(withDefaultHeadingContactType(row, 'email').type)
   })
 
   return {
@@ -191,8 +364,8 @@ function mapEmailOpsForSave(ops: { create: ContactPointRow[], update: ContactPoi
 
 function mapPhoneOpsForSave(ops: { create: ContactPointRow[], update: ContactPointRow[], remove: ContactPointRow[] }) {
   const mapRow = (row: ContactPointRow): ContactPointRow => ({
-    ...row,
-    type: toSavedHeadingPhoneType(row.type)
+    ...withDefaultHeadingContactType(row, 'phone'),
+    type: toSavedHeadingPhoneType(withDefaultHeadingContactType(row, 'phone').type)
   })
 
   return {
@@ -202,34 +375,38 @@ function mapPhoneOpsForSave(ops: { create: ContactPointRow[], update: ContactPoi
   }
 }
 
-/* Will use later function renderCountryPrefixSelect(
-  name: string,
-  value: string,
-  label: string,
-  onChange: (event: Event) => void
+function summarizeHeadingContactOps(
+  row: ContactPointRow,
+  kind: HeadingContactTypeKind,
+  typeWasMissing: boolean
 ) {
-  return html`
-    <label class="label profile-edit-dialog__phone-prefix-field" aria-label=${label}>
-      <select class="phonePrefixSelect" name=${name} .value=${value} @change=${onChange}>
-        ${COUNTRY_PREFIX_OPTIONS.map((option) => html`
-          <option value=${option.dialCode}>
-            ${countryCodeToFlag(option.iso2)} ${option.dialCode}
-          </option>
-        `)}
-      </select>
-    </label>
-  `
-} */
+  const ops = summarizeRowOps([row], rowHasContent)
+
+  if (
+    typeWasMissing &&
+    row.entryNode &&
+    row.status === 'existing' &&
+    rowHasContent(row) &&
+    ops.create.length === 0 &&
+    ops.update.length === 0 &&
+    ops.remove.length === 0
+  ) {
+    return {
+      create: ops.create,
+      update: [withDefaultHeadingContactType({ ...row, status: 'modified' }, kind)],
+      remove: ops.remove
+    }
+  }
+
+  return ops
+}
 
 function renderContactPhoneInput({
   phone
 }: ContactPhoneInputRowProps) {
-  const label = 'Phone Number'
-  /* const countryCodeLabel = 'Country Calling Code' */
-  /* const prefixInputName = 'phone-prefix' */
-  const typeLabel = 'Phone Type'
+  const label = 'Phone Number 1'
+  const typeLabel = 'Phone Type 1'
   const inputName = 'phone-value'
-  const typeInputName = 'phone-type'
   const splitValue = splitPhoneValue(phone?.value || '')
   let selectedDialCode = splitValue.dialCode
 
@@ -240,20 +417,9 @@ function renderContactPhoneInput({
       applyRowFieldChange(phone, 'value', combinePhoneValue(selectedDialCode, nextValue), rowHasContent)
     }
   }
- /* Leaving here for when we add country code back in
-  const handleCountryCodeInput = (e: Event) => {
-    const target = e.target as HTMLSelectElement
-    selectedDialCode = target.value
-
-    if (phone) {
-      const localNumber = splitPhoneValue(phone.value).localNumber
-      applyRowFieldChange(phone, 'value', combinePhoneValue(selectedDialCode, localNumber), rowHasContent)
-    }
-  } */
 
   const handleTypeInput = (e: Event) => {
-    const target = e.target as HTMLInputElement
-    const nextType = target.value
+    const nextType = readHeadingContactTypeChange(e)
     if (phone) {
       applyRowSelectChange(phone, 'type', nextType)
     }
@@ -272,7 +438,7 @@ function renderContactPhoneInput({
             data-contact-field="value"
             data-entry-node=${phone?.entryNode || ''}
             data-row-status=${phone?.status || 'n/a'}
-            placeholder="Phone Number"
+            placeholder=${label}
             autocomplete="tel-national"
             inputmode="tel"
             @input=${handleValueInput}
@@ -280,11 +446,16 @@ function renderContactPhoneInput({
         </label>
       </div>
       <label aria-label=${typeLabel} class="label profile-edit-dialog__field-type profile-edit-dialog__field-type--contact-point">
-        <select class="input" name=${typeInputName} id="phone-type-select-${inputName}" @change=${handleTypeInput} .value=${phone?.type || ''}>
-          <option value="Mobile">Mobile</option>
-          <option value="Home">Home</option>
-          <option value="Work">Work</option>
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__type-select"
+          id=${`phone-type-select-${inputName}`}
+          data-heading-contact-type-kind="phone"
+          aria-label=${typeLabel}
+          .label=${''}
+          .options=${HEADING_PHONE_TYPE_OPTIONS}
+          .value=${normalizeHeadingContactTypeValue(phone?.type || '', HEADING_PHONE_TYPE_OPTIONS)}
+          @change=${handleTypeInput}
+        ></solid-ui-select>
       </label>
     </div>
   `
@@ -296,7 +467,6 @@ function renderContactEmailInputRow({
   const label = 'Email Address'
   const typeLabel = 'Email Type'
   const inputName = 'email-value'
-  const typeInputName = 'email-type'
 
   const handleValueInput = (e: Event) => {
     const target = e.target as HTMLInputElement
@@ -307,8 +477,7 @@ function renderContactEmailInputRow({
   }
 
   const handleTypeInput = (e: Event) => {
-    const target = e.target as HTMLInputElement
-    const nextType = target.value
+    const nextType = readHeadingContactTypeChange(e)
     if (email) {
       applyRowSelectChange(email, 'type', nextType)
     }
@@ -333,10 +502,16 @@ function renderContactEmailInputRow({
         />
       </label>
       <label aria-label=${typeLabel} class="label profile-edit-dialog__field-type profile-edit-dialog__field-type--contact-point">
-        <select class="input" name=${typeInputName} id="email-type-select-${inputName}" @change=${handleTypeInput} .value=${email?.type || ''}>
-          <option value="Personal">Personal</option>
-          <option value="Office">Office</option>
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__type-select"
+          id=${`email-type-select-${inputName}`}
+          data-heading-contact-type-kind="email"
+          aria-label=${typeLabel}
+          .label=${''}
+          .options=${HEADING_EMAIL_TYPE_OPTIONS}
+          .value=${normalizeHeadingContactTypeValue(email?.type || '', HEADING_EMAIL_TYPE_OPTIONS)}
+          @change=${handleTypeInput}
+        ></solid-ui-select>
       </label>
     </div>
   `
@@ -465,11 +640,10 @@ function renderContactAddressInput({
 function renderHeadingInfoInput(
   store: LiveStore,
   subject: NamedNode,
-  basicInfo: ProfileBasicRow,
-  phone: ContactPointRow,
-  email: ContactPointRow,
+  formState: HeadingFormState,
   rerender: () => void
 ): TemplateResult {
+  const { basicInfo, phone, email, imagePreviewSrc } = formState
   const imageSrcLabel = 'Profile Photo'
   const recommendedImageToLoad = 'Recommended: Square JPG, PNG. Max 2MB.'
   const nameLabel = 'Full Name'
@@ -494,11 +668,10 @@ function renderHeadingInfoInput(
       applyRowFieldChange(basicInfo, 'dateOfBirth', toStorageDateISO(nextValue), rowHasContent)
     }
   }
-   const handlePronounsInput = (e: Event) => {
-    const target = e.target as HTMLSelectElement
-    const nextType = target.value
+  const handlePronounsInput = (e: Event) => {
+    const nextValue = normalizePronounsValue(readHeadingContactTypeChange(e))
     if (basicInfo) {
-      applyRowSelectChange(basicInfo, 'pronouns', nextType)
+      applyRowSelectChange(basicInfo, 'pronouns', nextValue)
     }
   }
 
@@ -508,30 +681,34 @@ function renderHeadingInfoInput(
     const fileInput = dom.createElement('input')
     fileInput.type = 'file'
     fileInput.accept = 'image/*'
+    fileInput.hidden = true
+
+    const cleanupFileInput = () => {
+      fileInput.remove()
+    }
 
     fileInput.addEventListener('change', async () => {
       const file = fileInput.files?.[0]
+      cleanupFileInput()
       if (!file || !basicInfo) return
 
       try {
         const uploadedUri = await uploadPhotoFile(store, subject, file)
+        setHeadingImagePreview(formState, file)
         applyRowFieldChange(basicInfo, 'imageSrc', uploadedUri, rowHasContent)
         rerender()
       } catch (error) {
-        console.error('Profile image upload failed', error)
+        debugError('Profile image upload failed', error)
       }
-    })
+    }, { once: true })
 
+    dom.body.appendChild(fileInput)
     fileInput.click()
   }
 
-  /* The handleCameraClick function was generated by AI Model: GPT-5.3-Codex */
-  /* Prompt: Write a function handleCameraClick that uses the cameraCaptureControl to
-      capture an image and update the profile photo in the heading section. */
   const handleCameraClick = async (e: Event) => {
     e.preventDefault()
     const button = e.currentTarget as HTMLElement | null
-    const dom = button?.ownerDocument || document
     const headingPhotoRow = button?.closest('.profile-edit-dialog__row--heading-photo') as HTMLElement | null
     const hostRow = headingPhotoRow?.nextElementSibling as HTMLElement | null
     const frame = hostRow?.querySelector('.profile-edit-dialog__image-camera-capture-frame') as HTMLDivElement | null
@@ -541,58 +718,79 @@ function renderHeadingInfoInput(
     frame.dataset.active = 'true'
     frame.replaceChildren()
 
-    const getImageDoc = () => {
-      const docUri = subject.doc().uri
-      const lastSlash = docUri.lastIndexOf('/')
-      const directoryUri = lastSlash >= 0 ? docUri.slice(0, lastSlash + 1) : docUri
-      const randomSuffix =
-        typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function'
-          ? crypto.randomUUID()
-          : `${Date.now()}_${Math.floor(Math.random() * 1e9)}`
-      return sym(`${directoryUri}camera_${randomSuffix}.png`)
-    }
-
-    const onCameraDone = async (imageDoc: NamedNode | null) => {
+    const closeCameraFrame = () => {
       frame.replaceChildren()
       frame.hidden = true
       frame.dataset.active = 'false'
-      if (imageDoc?.uri && basicInfo) {
-        applyRowFieldChange(basicInfo, 'imageSrc', imageDoc.uri, rowHasContent)
-        rerender()
-      }
     }
 
     try {
-      const control = cameraCaptureControl(dom, store as any, getImageDoc, onCameraDone)
-      frame.appendChild(control)
+      const photoCapture = document.createElement('solid-ui-photo-capture') as HeadingPhotoCaptureElement
+      photoCapture.classList.add('profile-edit-dialog__photo-capture')
+      photoCapture.heading = ''
+      photoCapture.captureLabel = 'Take Photo'
+      photoCapture.confirmLabel = 'Use Photo'
+      photoCapture.retakeLabel = 'Retake'
+      photoCapture.cancelLabel = 'Close camera'
+      photoCapture.presentation = 'inline'
+      photoCapture.showTrigger = false
+      photoCapture.showCancelButton = true
+      photoCapture.autoCloseOnCapture = false
+      photoCapture.fileNamePrefix = 'camera'
+      photoCapture.facingMode = 'environment'
+      photoCapture.open = true
+
+      photoCapture.addEventListener('cancel', (event) => {
+        event.preventDefault()
+        event.stopPropagation()
+        closeCameraFrame()
+      })
+
+      photoCapture.addEventListener('photo-captured', async (event: Event) => {
+        const detail = (event as CustomEvent<HeadingPhotoCapturedDetail>).detail
+        if (!detail?.file || !basicInfo) return
+
+        try {
+          const uploadedUri = await uploadPhotoFile(store, subject, detail.file)
+          closeCameraFrame()
+          setHeadingImagePreview(formState, detail.file)
+          applyRowFieldChange(basicInfo, 'imageSrc', uploadedUri, rowHasContent)
+          rerender()
+        } catch (error) {
+          debugError('Profile camera upload failed', error)
+        }
+      })
+
+      frame.appendChild(photoCapture)
     } catch (error) {
-      frame.hidden = true
-      frame.dataset.active = 'false'
-      frame.replaceChildren()
-      console.error('Camera control failed to initialize', error)
+      closeCameraFrame()
+      debugError('Camera control failed to initialize', error)
     }
   }
 
   const handleDelete = async (_e: Event) => {
     if (!basicInfo) return
+    formState.clearImagePreview()
     applyRowFieldChange(basicInfo, 'imageSrc', '', rowHasContent)
     rerender()
   }
 
   return html`
     <div class="profile-edit-dialog__row profile-edit-dialog__row--heading-photo">
-      <header class="mb-md" aria-label="Profile Image">
+      <header class="profile-edit-dialog__image-preview-header" aria-label="Profile Image">
         <div class="profile-edit-dialog__image-frame">
-          ${Image(basicInfo.imageSrc, basicInfo.name)}
-          <button
+          ${Image(imagePreviewSrc || basicInfo.imageSrc, basicInfo.name)}
+          <solid-ui-button
             type="button"
-            class="profile-edit-dialog__image-camera-button flex-center"
+            class="profile-edit-dialog__image-camera-button"
+            variant="icon"
+            size="md"
             aria-label="Take a photo"
             title="Take a photo"
             @click=${handleCameraClick}
           >
-            ${cameraIcon}
-          </button>
+            <span slot="icon" aria-hidden="true">${cameraIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
 
@@ -601,31 +799,37 @@ function renderHeadingInfoInput(
         <p class="profile-edit-dialog__image-preview-description">${recommendedImageToLoad}</p>
 
         <div class="profile-edit-dialog__image-preview-actions">
-          <button
+          <solid-ui-button
             type="button"
-            class="profile-edit-dialog__image-button profile-edit-dialog__image-upload-button flex-center"
+            variant="secondary"
+            size="md"
+            label="Upload New"
+            class="profile-edit-dialog__image-button profile-edit-dialog__image-upload-button"
             aria-label="Upload new profile photo"
             title="Upload New"
             @click=${handleUpload}
           >
             Upload New
-          </button>
-          <button
+          </solid-ui-button>
+          <solid-ui-button
             type="button"
-            class="profile-edit-dialog__image-button profile-edit-dialog__image-remove-button flex-center"
+            variant="secondary"
+            size="md"
+            label="Remove"
+            class="profile-edit-dialog__image-button profile-edit-dialog__image-remove-button"
             aria-label="Delete profile photo"
             title="Remove"
             @click=${handleDelete}
           >
             Remove
-          </button>
+          </solid-ui-button>
         </div>
       </div>
     </div>
     <div class="profile-edit-dialog__image-camera-capture-row">
       <div class="profile-edit-dialog__image-camera-capture-frame" hidden></div>
     </div>
-    <div class="profile-edit flex-column gap-lg">
+    <div class="profile-edit">
       <div class="profile-edit-dialog__row profile-edit-dialog__row--equal">
         <label aria-label=${nameLabel} class="label profile-edit-dialog__field">
           ${nameLabel}
@@ -664,11 +868,17 @@ function renderHeadingInfoInput(
       <div class="profile-edit-dialog__row profile-edit-dialog__row--equal">
         <label aria-label=${pronounsLabel} class="label profile-edit-dialog__field-type profile-edit-dialog__field--stack">
           ${pronounsLabel}
-          <select class="input" name="pronouns" @change=${handlePronounsInput} .value=${basicInfo?.pronouns || ''}>
-            <option value="He/Him">He/Him</option>
-            <option value="She/Her">She/Her</option>
-            <option value="They/Them">They/Them</option>
-          </select>
+          <solid-ui-select
+            class="profile-edit-dialog__type-select"
+            id="heading-pronouns-select"
+            name="pronouns"
+            data-heading-basic-field="pronouns"
+            aria-label=${pronounsLabel}
+            .label=${''}
+            .options=${HEADING_PRONOUN_OPTIONS}
+            .value=${normalizePronounsValue(basicInfo?.pronouns || '')}
+            @change=${handlePronounsInput}
+          ></solid-ui-select>
         </label>
         <label aria-label=${dateOfBirthLabel} class="label profile-edit-dialog__field">
           ${dateOfBirthLabel}
@@ -744,12 +954,15 @@ function renderHeadingEditTemplate(
   const rerender = () => renderHeadingEditTemplate(form, formState, store, subject, viewerMode)
  
   render(html`
-    ${renderHeadingInfoInput(store, subject, formState.basicInfo, formState.phone, formState.email, rerender)}
+    ${renderHeadingInfoInput(store, subject, formState, rerender)}
     ${renderContactAddressInput({ address: formState.address })}
     ${viewerMode !== 'owner'
       ? html`<p class="profile-edit-dialog__login-message">${ownerLoginRequiredDialogMessageText}</p>`
       : null}
   `, form)
+
+  initializeHeadingContactTypeSelects(form, formState)
+  initializeHeadingPronounsSelect(form, formState)
 }
 
 function createHeadingEditForm(
@@ -759,7 +972,7 @@ function createHeadingEditForm(
   viewerMode: ViewerMode
 ) {
   const form = document.createElement('form')
-  form.classList.add('profile__edit-form', 'profile-edit-dialog--heading', 'flex-column', 'gap-sm')
+  form.classList.add('profile__edit-form', 'profile__edit-form--heading', 'profile-edit-dialog--heading')
   form.autocomplete = 'off'
   form.setAttribute('data-lpignore', 'true')
   form.setAttribute('data-1p-ignore', 'true')
@@ -771,24 +984,30 @@ function createHeadingEditForm(
   return { form, formState }
 }
 
+function isValidHeadingEmailAddress(value: string): boolean {
+  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)
+}
+
+function isValidHeadingPhoneNumber(value: string): boolean {
+  return /^\d+$/.test(value)
+}
+
 function validateHeadingDataBeforeSave(formState: HeadingFormState): string | null {
-  const basicInfoOps = summarizeRowOps([formState.basicInfo], rowHasContent)
-  const phoneOps = summarizeRowOps([formState.phone], rowHasContent)
-  const emailOps = summarizeRowOps([formState.email], rowHasContent)
-  const addressOps = summarizeRowOps([formState.address], rowHasContent)
-  const hasChanges =
-    basicInfoOps.create.length > 0 || basicInfoOps.update.length > 0 || basicInfoOps.remove.length > 0 ||
-    phoneOps.create.length > 0 || phoneOps.update.length > 0 || phoneOps.remove.length > 0 ||
-    emailOps.create.length > 0 || emailOps.update.length > 0 || emailOps.remove.length > 0 ||
-    addressOps.create.length > 0 || addressOps.update.length > 0 || addressOps.remove.length > 0
-
-  if (!hasChanges) return 'No intro changes detected.'
+  const { localNumber } = splitPhoneValue(formState.phone?.value || '')
+  if (rowHasContent(formState.phone) && !isValidHeadingPhoneNumber(localNumber)) {
+    return 'Phone Number 1 should contain only numbers.'
+  }
+
+  if (rowHasContent(formState.email) && !isValidHeadingEmailAddress(formState.email?.value || '')) {
+    return 'Email address must be a valid email address.'
+  }
+
   return null
 }
 
 
 export async function createHeadingEditDialog(
-  event: Event,
+  _event: Event,
   store: LiveStore,
   subject: NamedNode,
   profileData: ProfileDetails,
@@ -799,13 +1018,34 @@ export async function createHeadingEditDialog(
   const originalPhotoUri = sanitizeTextValue(toText(profileData.imageSrc || ''))
   const { form, formState } = createHeadingEditForm(store, subject, profileData, viewerMode)
 
+  if (formState.basicInfo.imageSrc) {
+    const resolvedImageSrc = await resolvePhotoDisplaySrc(store, formState.basicInfo.imageSrc)
+    if (resolvedImageSrc && resolvedImageSrc !== formState.basicInfo.imageSrc) {
+      setResolvedHeadingPreview(formState, resolvedImageSrc)
+      renderHeadingEditTemplate(form, formState, store, subject, viewerMode)
+    }
+  }
+
   const result = await openInputDialog({
     title: editHeadingDialogTitleText,
     dom,
     form,
-    headerAction: { type: 'close' },
+    headerAction: { type: 'none' },
     submitLabel: dialogSubmitLabelText,
     cancelLabel: dialogCancelLabelText,
+    shouldCloseWithoutSave: () => {
+      const basicInfoOps = summarizeRowOps([formState.basicInfo], rowHasContent)
+      const phoneOps = summarizeHeadingContactOps(formState.phone, 'phone', formState.phoneTypeWasMissing)
+      const emailOps = summarizeHeadingContactOps(formState.email, 'email', formState.emailTypeWasMissing)
+      const addressOps = summarizeRowOps([formState.address], rowHasContent)
+
+      return (
+        basicInfoOps.create.length === 0 && basicInfoOps.update.length === 0 && basicInfoOps.remove.length === 0 &&
+        phoneOps.create.length === 0 && phoneOps.update.length === 0 && phoneOps.remove.length === 0 &&
+        emailOps.create.length === 0 && emailOps.update.length === 0 && emailOps.remove.length === 0 &&
+        addressOps.create.length === 0 && addressOps.update.length === 0 && addressOps.remove.length === 0
+      )
+    },
     validate: () => {
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
@@ -813,8 +1053,8 @@ export async function createHeadingEditDialog(
       return validateHeadingDataBeforeSave(formState)
     },
     onSave: async () => {
-      const phoneOps = summarizeRowOps([formState.phone], rowHasContent)
-      const emailOps = summarizeRowOps([formState.email], rowHasContent)
+      const phoneOps = summarizeHeadingContactOps(formState.phone, 'phone', formState.phoneTypeWasMissing)
+      const emailOps = summarizeHeadingContactOps(formState.email, 'email', formState.emailTypeWasMissing)
       const plan: HeadingMutationPlan = {
         basicOps: summarizeRowOps([formState.basicInfo], rowHasContent),
         phoneOps: mapPhoneOpsForSave(phoneOps),
@@ -828,13 +1068,12 @@ export async function createHeadingEditDialog(
         try {
           await deletePhotoFile(store, subject, originalPhotoUri)
         } catch (error) {
-          console.warn('Profile image file delete failed', error)
+          debugWarn('Profile image file delete failed', error)
         }
       }
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveHeadingUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveHeadingUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/heading/HeadingSection.css b/src/sections/heading/HeadingSection.css
new file mode 100644
index 00000000..21654662
--- /dev/null
+++ b/src/sections/heading/HeadingSection.css
@@ -0,0 +1,826 @@
+.profile__avatar {
+  flex: 0 0 auto;
+  grid-area: avatar;
+}
+
+/* Header grid */
+.profile__heading-top {
+  --profile-heading-header-bar-gap: 0.125rem;
+  --profile-heading-desktop-details-offset: var(--spacing-lg, 1.5625rem);
+  --profile-heading-desktop-detail-row-gap: var(--spacing-xxs, 0.3125rem);
+  --profile-heading-identity-inline-gap: 0.4375rem;
+  --profile-heading-name-offset-x: -4px;
+  --profile-heading-detail-column-gap: 2rem;
+  --profile-heading-detail-grid-column-gap: clamp(0.75rem, 2vw, 1.5rem);
+  --profile-heading-detail-grid-max-width: 34rem;
+  --profile-heading-detail-icon-size: var(--icon-xxs, 1rem);
+  --profile-heading-prefix-icon-gap: 0.125rem;
+  --profile-heading-action-item-flex: 0 0 auto;
+  --profile-heading-action-label-font-size: inherit;
+  --profile-heading-action-label-white-space: normal;
+  --profile-heading-action-contact-icon-size: var(--icon-xxs, 1rem);
+  --profile-heading-action-contact-icon-gap: var(--spacing-xxs, 0.3125rem);
+  --profile-heading-action-full-label-display: inline;
+  --profile-heading-action-short-label-display: none;
+  --profile-heading-medium-column-gap: var(--spacing-sm, 0.75rem);
+  --profile-heading-hero-size: 8.75rem;
+  --profile-heading-hero-alt-padding-inline: 2.275rem;
+  --profile-heading-medium-hero-size: 6.5rem;
+  --profile-heading-medium-hero-alt-padding-inline: 1.6875rem;
+  --profile-heading-medium-action-gap: 0.25rem;
+  --profile-heading-medium-button-padding: 0.3125rem 0.5625rem;
+  --profile-heading-medium-button-padding-x: 0.5625rem;
+  --profile-heading-medium-button-font-size: var(--font-size-xs, 0.8125rem);
+  --profile-heading-medium-contact-icon-size: 0.6875rem;
+  --profile-heading-medium-contact-icon-gap: 0.25rem;
+  --profile-heading-medium-actions-max-inline-size: 10.5rem;
+  --profile-heading-narrow-column-gap: 0.5rem;
+  --profile-heading-narrow-action-gap: 0.25rem;
+  --profile-heading-narrow-actions-justify-self: center;
+  --profile-heading-narrow-actions-margin-left: auto;
+  --profile-heading-narrow-actions-margin-right: auto;
+  --profile-heading-narrow-actions-justify-content: center;
+  --profile-heading-compact-column-gap: 0.5rem;
+  --profile-heading-compact-row-gap: var(--spacing-sm, 0.75rem);
+  --profile-heading-compact-action-gap: 0.25rem;
+  --profile-heading-compact-actions-justify-self: start;
+  --profile-heading-compact-actions-margin-left: 0;
+  --profile-heading-compact-actions-margin-right: auto;
+  --profile-heading-compact-actions-justify-content: flex-start;
+  --profile-heading-secondary-edit-justify-self: end;
+  --profile-heading-secondary-edit-align-self: flex-start;
+  --profile-heading-secondary-edit-margin-left: auto;
+  --profile-heading-secondary-edit-margin-right: 0;
+  --profile-heading-secondary-edit-justify-content: flex-end;
+  --profile-heading-compact-button-padding: 0.25rem 0.3125rem;
+  --profile-heading-compact-button-padding-x: 0.3125rem;
+  --profile-heading-compact-button-font-size: var(--font-size-xxs, 0.75rem);
+  --profile-heading-compact-contact-icon-size: 0.625rem;
+  --profile-heading-compact-contact-icon-gap: 0.1875rem;
+  --profile-heading-compact-button-hover-background: var(--color-primary, #7C4DFF);
+  --profile-heading-compact-button-hover-border: var(--color-primary, #7C4DFF);
+  --profile-heading-compact-button-hover-text: var(--color-text-on-action, var(--white, #FFF));
+  --profile-heading-compact-detail-column-gap: 0.25rem;
+  --profile-heading-compact-detail-size: var(--profile-mobile-header-detail-size, var(--font-size-xxs, 0.75rem));
+  --profile-heading-compact-details-gap: var(--spacing-xs, 0.5rem);
+  --profile-heading-compact-identity-gap: 0.125rem;
+  --profile-heading-compact-hero-icon-size: 3rem;
+  --profile-heading-compact-image-size: var(--profile-mobile-header-image-size, 4.375rem);
+  --profile-heading-compact-name-size: var(--profile-mobile-header-name-size, var(--font-size-xl, 1.375rem));
+  --profile-heading-compact-name-line-height: 1.15;
+  --profile-heading-compact-pronouns-size: var(--profile-mobile-header-pronouns-size, var(--font-size-2xs, 0.6875rem));
+  --profile-heading-compact-pronouns-line-height: 1.1;
+  --profile-heading-compact-role-size: var(--profile-mobile-header-job-title-size, var(--font-size-md, 1rem));
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr) auto auto;
+  grid-template-areas:
+    "avatar info actions edit"
+    "avatar details details details";
+  column-gap: var(--spacing-md, 1.25rem);
+  row-gap: var(--profile-heading-desktop-details-offset, var(--spacing-lg, 1.5625rem));
+  align-items: start;
+  width: 100%;
+}
+
+.profile__name {
+  display: block;
+  color: var(--color-text-heading, #000);
+  font-size: var(--font-size-xxl, 1.75rem); /* 28px */
+  font-weight: var(--font-weight-bold, 600);
+  margin: 0;
+  padding: 0;
+  text-indent: 0;
+  line-height: 1.2;
+  text-align: left;
+  overflow-wrap: anywhere;
+  transform: translateX(var(--profile-heading-name-offset-x, -4px));
+}
+
+.profile__info {
+  display: flex;
+  flex-direction: column;
+  grid-area: info;
+  flex: 1 1 auto;
+  min-width: 0;
+  align-items: flex-start;
+}
+
+.profile__details {
+  grid-area: details;
+  color: var(--color-text-secondary, #4A5565);
+  font-size: var(--font-size-sm, 0.875rem); /* 14px */
+  display: flex;
+  width: 100%;
+  align-content: flex-start;
+  align-items: flex-start;
+  flex-wrap: wrap;
+  gap: var(--profile-heading-desktop-detail-row-gap, var(--spacing-xxs, 0.3125rem)) var(--profile-heading-detail-column-gap, 2rem);
+}
+
+.profile__info > .profile__header-bar {
+  margin-left: 0;
+  padding-left: 0;
+  align-self: stretch;
+}
+
+.profile__header-bar {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: var(--profile-heading-header-bar-gap, 0.125rem);
+  width: 100%;
+  margin: 0;
+  padding: 0;
+}
+
+.profile__actions {
+  color: var(--color-text-secondary, #4A5565);
+  font-size: var(--font-size-base, 1rem);
+  margin-bottom: var(--spacing-xs, 0.75rem);
+}
+
+.profile__heading-actions {
+  grid-area: actions;
+  margin-left: auto;
+  margin-bottom: 0;
+  align-self: flex-start;
+  justify-self: end;
+  display: flex;
+  align-items: flex-start;
+  gap: var(--spacing-xs, 0.5rem);
+  flex-wrap: wrap;
+}
+
+.profile__heading-actions .profile__btn-friends-label,
+.profile__heading-actions #add-to-contacts-button-container .profile__btn-contacts-label {
+  font-size: var(--profile-heading-action-label-font-size, inherit);
+  white-space: var(--profile-heading-action-label-white-space, normal);
+}
+
+.profile__heading-actions #add-to-contacts-button-container .profile__btn-contacts-icon,
+.profile__heading-actions #add-to-contacts-button-container .profile__btn-contacts-icon svg {
+  width: var(--profile-heading-action-contact-icon-size, var(--icon-xxs, 1rem));
+  height: var(--profile-heading-action-contact-icon-size, var(--icon-xxs, 1rem));
+}
+
+.profile__heading-actions #add-to-contacts-button-container .profile__btn-contacts-icon {
+  margin-right: var(--profile-heading-action-contact-icon-gap, var(--spacing-xxs, 0.3125rem));
+}
+
+.profile__heading-actions solid-ui-button.profile__btn-friends[data-friends-short-label='true'] .profile__btn-friends-label--full {
+  display: var(--profile-heading-action-full-label-display, inline);
+}
+
+.profile__heading-actions solid-ui-button.profile__btn-friends[data-friends-short-label='true'] .profile__btn-friends-label--short {
+  display: var(--profile-heading-action-short-label-display, none);
+}
+
+.profile__heading-edit-action {
+  grid-area: edit;
+  margin-left: auto;
+  margin-right: var(--profile-heading-secondary-edit-margin-right, 0);
+  margin-bottom: 0;
+  align-self: flex-start;
+  justify-self: end;
+  display: flex;
+  justify-content: var(--profile-heading-secondary-edit-justify-content, flex-end);
+  align-items: flex-start;
+  padding: 0;
+}
+
+.profile__heading-actions > .profile-friends-button__section,
+.profile__heading-actions > #add-to-contacts-button-container {
+  width: auto;
+  min-width: 0;
+  flex: var(--profile-heading-action-item-flex, 0 0 auto);
+}
+
+.profile__heading-actions > #add-to-contacts-button-container {
+  display: none !important;
+}
+
+.profile__heading-actions > .profile-friends-button__section > solid-ui-button.profile__btn-friends,
+.profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+  width: auto;
+  max-width: 100%;
+}
+
+.profile__heading-action-button {
+  position: static;
+  min-width: 0;
+  width: auto;
+  max-width: none;
+  padding: 0;
+  --button-padding-sm: 0;
+}
+
+.profile__heading-edit-action > solid-ui-button.profile__heading-action-button::part(button) {
+  padding: 0;
+}
+
+/* Identity details */
+.profile__identity {
+  display: flex;
+  flex-direction: row;
+  align-items: baseline;
+  gap: var(--profile-heading-identity-inline-gap, 0.4375rem);
+  justify-content: flex-start;
+  width: 100%;
+  flex-wrap: nowrap;
+}
+
+.profile__pronouns {
+  color: var(--color-text-secondary, #4A5565);
+  font-size: var(--font-size-sm, 0.875rem); /* 14px */
+  font-weight: var(--font-weight-regular, 400);
+  line-height: 1.2;
+}
+
+.profile__role-org {
+  margin: 0;
+  width: 100%;
+  white-space: normal;
+  color: var(--color-text-subheading, #101828);
+  font-size: var(--font-size-lg, 1.125rem);
+  font-weight: var(--font-weight-md, 500);
+  line-height: 1.25;
+  text-align: left;
+}
+
+.profile__meta-row,
+.profile__contact-row {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  justify-content: flex-start;
+  column-gap: var(--profile-heading-detail-grid-column-gap, clamp(0.75rem, 2vw, 1.5rem));
+  row-gap: var(--spacing-xs, 0.5rem);
+  align-items: start;
+  margin: 0;
+  padding: 0;
+  width: min(100%, var(--profile-heading-detail-grid-max-width, 34rem));
+  max-width: 100%;
+}
+
+.profile__meta-row .profile__item,
+.profile__contact-row .profile__item {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-2xs, 0.625rem);
+  min-width: 0;
+}
+
+.profile__meta-row .profile__value,
+.profile__contact-row .profile__value,
+.profile__meta-row .profile__value-text,
+.profile__contact-row .profile__value-text {
+  min-width: 0;
+  white-space: normal !important;
+  overflow-wrap: anywhere;
+  word-break: break-word;
+}
+
+.profile__meta-row .profile__value,
+.profile__contact-row .profile__value {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--spacing-xxs, 0.3125rem);
+}
+
+.profile__prefix-icon {
+  display: inline-flex;
+  align-items: center;
+  margin-right: var(--profile-heading-prefix-icon-gap, 0.125rem);
+}
+
+.profile__detail-icon {
+  display: block;
+  width: var(--profile-heading-detail-icon-size, var(--icon-xxs, 1rem));
+  height: var(--profile-heading-detail-icon-size, var(--icon-xxs, 1rem));
+}
+
+.profile__hero,
+.profile__hero-alt {
+  width: var(--profile-heading-hero-size, 8.75rem);
+  height: var(--profile-heading-hero-size, 8.75rem);
+  border-radius: var(--border-radius-full, 0.625rem); /* 10px */
+}
+
+.profile__image-frame:not(.profile__image-frame--fallback) .profile__hero-alt {
+  display: none;
+}
+
+.profile__image-frame--fallback .profile__hero {
+  display: none;
+}
+
+/* Profile image */
+.profile__hero {
+  border: var(--border-width-sm, 0.1rem) solid var(--color-primary, #7C4DFF);
+  background: var(--color-surface-placeholder, var(--gray-300, #D1D5DC)) 50% / cover no-repeat;
+  background-position: 50%;
+  object-fit: cover;
+  object-position: center;
+}
+
+.profile__hero-alt {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 var(--profile-heading-hero-alt-padding-inline, 2.275rem);
+  border: var(--border-width-sm, 0.1rem) dashed var(--color-border-lighter, var(--slate-200, #E2E8F0));
+  background: var(--color-surface-overlay-header, #F8FAFC);
+  box-sizing: border-box;
+}
+
+/* Counteracts mashlib alignment so the placeholder icon stays centered. */
+.profile__hero-alt .profile__hero-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  line-height: 0;
+}
+
+.profile__hero-alt .profile__hero-icon svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+/* Responsive: medium widths */
+@media (max-width: 1200px) {
+  .profile__heading-top {
+    column-gap: var(--profile-heading-medium-column-gap, var(--spacing-sm, 0.75rem));
+  }
+
+  .profile__hero,
+  .profile__hero-alt {
+    width: var(--profile-heading-medium-hero-size, 6.5rem);
+    height: var(--profile-heading-medium-hero-size, 6.5rem);
+  }
+
+  .profile__hero-alt {
+    padding: 0 var(--profile-heading-medium-hero-alt-padding-inline, 1.6875rem);
+  }
+
+  .profile__heading-actions {
+    --profile-heading-action-item-flex: 0 1 auto;
+    --profile-heading-action-label-font-size: var(--profile-heading-medium-button-font-size);
+    --profile-heading-action-contact-icon-size: var(--profile-heading-medium-contact-icon-size);
+    --profile-heading-action-contact-icon-gap: var(--profile-heading-medium-contact-icon-gap);
+    justify-self: end;
+    margin-bottom: 0;
+    max-inline-size: var(--profile-heading-medium-actions-max-inline-size, 10.5rem);
+    justify-content: flex-end;
+    align-items: flex-start;
+    align-content: flex-end;
+    gap: var(--profile-heading-medium-action-gap, 0.25rem);
+  }
+  .profile__heading-actions > .profile-friends-button__section > solid-ui-button.profile__btn-friends,
+  .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+    --button-padding-sm: var(--profile-heading-medium-button-padding, 0.3125rem 0.5625rem);
+    --button-padding-x-sm: var(--profile-heading-medium-button-padding-x, 0.5625rem);
+    --button-font-size-sm: var(--profile-heading-medium-button-font-size, var(--font-size-xs, 0.8125rem));
+  }
+
+}
+
+@container profile-pane (max-width: 1200px) {
+  .profile__heading-top {
+    column-gap: var(--profile-heading-medium-column-gap, var(--spacing-sm, 0.75rem));
+  }
+
+  .profile__hero,
+  .profile__hero-alt {
+    width: var(--profile-heading-medium-hero-size, 6.5rem);
+    height: var(--profile-heading-medium-hero-size, 6.5rem);
+  }
+
+  .profile__hero-alt {
+    padding: 0 var(--profile-heading-medium-hero-alt-padding-inline, 1.6875rem);
+  }
+
+  .profile__heading-actions {
+    --profile-heading-action-item-flex: 0 1 auto;
+    --profile-heading-action-label-font-size: var(--profile-heading-medium-button-font-size);
+    --profile-heading-action-contact-icon-size: var(--profile-heading-medium-contact-icon-size);
+    --profile-heading-action-contact-icon-gap: var(--profile-heading-medium-contact-icon-gap);
+    justify-self: end;
+    margin-bottom: 0;
+    max-inline-size: var(--profile-heading-medium-actions-max-inline-size, 10.5rem);
+    justify-content: flex-end;
+    align-items: flex-start;
+    align-content: flex-end;
+    gap: var(--profile-heading-medium-action-gap, 0.25rem);
+  }
+  .profile__heading-actions > .profile-friends-button__section > solid-ui-button.profile__btn-friends,
+  .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+    --button-padding-sm: var(--profile-heading-medium-button-padding, 0.3125rem 0.5625rem);
+    --button-padding-x-sm: var(--profile-heading-medium-button-padding-x, 0.5625rem);
+    --button-font-size-sm: var(--profile-heading-medium-button-font-size, var(--font-size-xs, 0.8125rem));
+  }
+
+}
+
+@media (max-width: 768px) {
+  .profile__heading-top {
+    grid-template-columns: auto minmax(0, 1fr) auto;
+    grid-template-areas:
+      "avatar info edit"
+      "details details details"
+      "actions actions actions";
+    column-gap: var(--profile-heading-narrow-column-gap, 0.5rem);
+    row-gap: var(--spacing-sm, 0.75rem);
+  }
+
+  .profile__heading-actions {
+    justify-self: var(--profile-heading-narrow-actions-justify-self, center);
+    margin-left: var(--profile-heading-narrow-actions-margin-left, auto);
+    margin-right: var(--profile-heading-narrow-actions-margin-right, auto);
+    max-inline-size: none;
+    justify-content: var(--profile-heading-narrow-actions-justify-content, center);
+    align-items: center;
+    align-content: center;
+    gap: var(--profile-heading-narrow-action-gap, 0.25rem);
+    flex-wrap: nowrap;
+  }
+
+}
+
+@container profile-pane (max-width: 768px) {
+  .profile__heading-top {
+    grid-template-columns: auto minmax(0, 1fr) auto;
+    grid-template-areas:
+      "avatar info edit"
+      "details details details"
+      "actions actions actions";
+    column-gap: var(--profile-heading-narrow-column-gap, 0.5rem);
+    row-gap: var(--spacing-sm, 0.75rem);
+  }
+
+  .profile__heading-actions {
+    justify-self: var(--profile-heading-narrow-actions-justify-self, center);
+    margin-left: var(--profile-heading-narrow-actions-margin-left, auto);
+    margin-right: var(--profile-heading-narrow-actions-margin-right, auto);
+    max-inline-size: none;
+    justify-content: var(--profile-heading-narrow-actions-justify-content, center);
+    align-items: center;
+    align-content: center;
+    gap: var(--profile-heading-narrow-action-gap, 0.25rem);
+    flex-wrap: nowrap;
+  }
+
+}
+/* Responsive: compact widths */
+/* layout = mobile */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__heading-top {
+  grid-template-columns: auto minmax(0, 1fr) auto;
+  grid-template-areas:
+    "avatar info edit"
+    "details details details"
+    "actions actions actions";
+  column-gap: var(--profile-heading-compact-column-gap, 0.5rem);
+  row-gap: var(--profile-heading-compact-row-gap, var(--spacing-sm, 0.75rem));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__info {
+  grid-column: 2 / -1;
+  align-self: stretch;
+  justify-content: flex-end;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__avatar {
+  align-self: flex-end;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__heading-actions {
+  --profile-heading-action-item-flex: 0 1 auto;
+  --profile-heading-action-label-font-size: var(--profile-heading-compact-button-font-size);
+  --profile-heading-action-label-white-space: nowrap;
+  --profile-heading-action-contact-icon-size: var(--profile-heading-compact-contact-icon-size);
+  --profile-heading-action-contact-icon-gap: var(--profile-heading-compact-contact-icon-gap);
+  --profile-heading-action-full-label-display: none;
+  --profile-heading-action-short-label-display: inline;
+  justify-self: var(--profile-heading-compact-actions-justify-self, start);
+  margin-left: var(--profile-heading-compact-actions-margin-left, 0);
+  margin-right: var(--profile-heading-compact-actions-margin-right, auto);
+  max-inline-size: none;
+  justify-content: var(--profile-heading-compact-actions-justify-content, flex-start);
+  align-items: center;
+  align-content: center;
+  gap: var(--profile-heading-compact-action-gap, 0.25rem);
+  flex-wrap: nowrap;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__heading-edit-action > solid-ui-button.profile__heading-action-button {
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--color-text, #1A1A1A);
+  --button-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff));
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-text, #1A1A1A);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__heading-actions > .profile-friends-button__section > solid-ui-button.profile__btn-friends,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+  min-width: 0;
+  inline-size: auto;
+  min-height: var(--button-height-sm, 1.75rem);
+  --button-padding-sm: var(--profile-heading-compact-button-padding, 0.25rem 0.3125rem);
+  --button-padding-x-sm: var(--profile-heading-compact-button-padding-x, 0.3125rem);
+  --button-font-size-sm: var(--profile-heading-compact-button-font-size, var(--font-size-xxs, 0.75rem));
+  --button-hover-background: var(--profile-heading-compact-button-hover-background, var(--color-primary, #7C4DFF));
+  --button-hover-border: var(--profile-heading-compact-button-hover-border, var(--color-primary, #7C4DFF));
+  --button-hover-text: var(--profile-heading-compact-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+  --button-hover-background: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+  --button-hover-border: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+  --button-hover-text: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__name {
+  display: inline;
+  font-size: var(--profile-heading-compact-name-size, var(--profile-mobile-header-name-size, var(--font-size-xl, 1.375rem)));
+  line-height: var(--profile-heading-compact-name-line-height, 1.15);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__identity {
+  display: flow-root;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__identity::before {
+  content: '';
+  float: right;
+  width: calc(var(--profile-heading-mobile-edit-rail-width, 2.75rem) + var(--profile-heading-mobile-edit-rail-gap, var(--spacing-xxs, 0.3125rem)));
+  height: var(--profile-heading-mobile-identity-rail-height, 2rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__pronouns {
+  font-size: var(--profile-heading-compact-pronouns-size, var(--profile-mobile-header-pronouns-size, 0.6875rem));
+  line-height: var(--profile-heading-compact-pronouns-line-height, 1.1);
+  margin-left: var(--profile-heading-compact-identity-gap, 0.125rem);
+  white-space: nowrap;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__role-org {
+  font-size: var(--profile-heading-compact-role-size, var(--profile-mobile-header-job-title-size, var(--font-size-md, 1rem)));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__hero,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__hero-alt {
+  width: var(--profile-heading-compact-image-size, var(--profile-mobile-header-image-size, 4.375rem));
+  height: var(--profile-heading-compact-image-size, var(--profile-mobile-header-image-size, 4.375rem));
+  aspect-ratio: 1 / 1;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__hero-alt {
+  padding: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__image-frame--fallback .profile__hero-alt {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__hero-icon {
+  display: block;
+  margin: 0 auto;
+  width: var(--profile-heading-compact-hero-icon-size, 3rem);
+  height: var(--profile-heading-compact-hero-icon-size, 3rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__details {
+  font-size: var(--profile-heading-compact-detail-size, var(--profile-mobile-header-detail-size, var(--font-size-xxs, 0.75rem)));
+  gap: var(--profile-heading-compact-details-gap, var(--spacing-xs, 0.5rem));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__meta-row,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__contact-row {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  column-gap: var(--profile-heading-compact-detail-column-gap, 0.25rem);
+}
+
+@media (max-width: 576px) {
+  .profile__heading-top {
+    grid-template-columns: auto minmax(0, 1fr) auto;
+    grid-template-areas:
+      "avatar info edit"
+      "details details details"
+      "actions actions actions";
+    column-gap: var(--profile-heading-compact-column-gap, 0.5rem);
+    row-gap: var(--profile-heading-compact-row-gap, var(--spacing-sm, 0.75rem));
+  }
+
+  .profile__info {
+    grid-column: 2 / -1;
+    align-self: stretch;
+    justify-content: flex-end;
+  }
+
+  .profile__avatar {
+    align-self: flex-end;
+  }
+
+  .profile__heading-actions {
+    --profile-heading-action-item-flex: 0 1 auto;
+    --profile-heading-action-label-font-size: var(--profile-heading-compact-button-font-size);
+    --profile-heading-action-label-white-space: nowrap;
+    --profile-heading-action-contact-icon-size: var(--profile-heading-compact-contact-icon-size);
+    --profile-heading-action-contact-icon-gap: var(--profile-heading-compact-contact-icon-gap);
+    --profile-heading-action-full-label-display: none;
+    --profile-heading-action-short-label-display: inline;
+    justify-self: var(--profile-heading-compact-actions-justify-self, start);
+    margin-left: var(--profile-heading-compact-actions-margin-left, 0);
+    margin-right: var(--profile-heading-compact-actions-margin-right, auto);
+    max-inline-size: none;
+    justify-content: var(--profile-heading-compact-actions-justify-content, flex-start);
+    align-items: center;
+    align-content: center;
+    gap: var(--profile-heading-compact-action-gap, 0.25rem);
+    flex-wrap: nowrap;
+  }
+
+  .profile__heading-edit-action > solid-ui-button.profile__heading-action-button {
+    --button-background: transparent;
+    --button-border-width: 0;
+    --button-border: transparent;
+    --button-text: var(--color-text, #1A1A1A);
+    --button-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff));
+    --button-hover-border: transparent;
+    --button-hover-text: var(--color-text, #1A1A1A);
+  }
+  .profile__heading-actions > .profile-friends-button__section > solid-ui-button.profile__btn-friends,
+  .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+    min-width: 0;
+    inline-size: auto;
+    min-height: var(--button-height-sm, 1.75rem);
+    --button-padding-sm: var(--profile-heading-compact-button-padding, 0.25rem 0.3125rem);
+    --button-padding-x-sm: var(--profile-heading-compact-button-padding-x, 0.3125rem);
+    --button-font-size-sm: var(--profile-heading-compact-button-font-size, var(--font-size-xxs, 0.75rem));
+    --button-hover-background: var(--profile-heading-compact-button-hover-background, var(--color-primary, #7C4DFF));
+    --button-hover-border: var(--profile-heading-compact-button-hover-border, var(--color-primary, #7C4DFF));
+    --button-hover-text: var(--profile-heading-compact-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  }
+
+  .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+    --button-hover-background: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+    --button-hover-border: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+    --button-hover-text: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  }
+
+  .profile__name {
+    display: inline;
+    font-size: var(--profile-heading-compact-name-size, var(--profile-mobile-header-name-size, var(--font-size-xl, 1.375rem)));
+    line-height: var(--profile-heading-compact-name-line-height, 1.15);
+  }
+
+  .profile__identity {
+    display: flow-root;
+  }
+
+  .profile__role-org {
+    font-size: var(--profile-heading-compact-role-size, var(--profile-mobile-header-job-title-size, var(--font-size-md, 1rem)));
+  }
+
+  .profile__hero-alt {
+    padding: 0;
+  }
+
+  .profile__image-frame--fallback .profile__hero-alt {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .profile__hero-icon {
+    display: block;
+    margin: 0 auto;
+    width: var(--profile-heading-compact-hero-icon-size, 3rem);
+    height: var(--profile-heading-compact-hero-icon-size, 3rem);
+  }
+
+  .profile__details {
+    font-size: var(--profile-heading-compact-detail-size, var(--profile-mobile-header-detail-size, var(--font-size-xxs, 0.75rem)));
+    gap: var(--profile-heading-compact-details-gap, var(--spacing-xs, 0.5rem));
+  }
+
+  .profile__meta-row,
+  .profile__contact-row {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    column-gap: var(--profile-heading-compact-detail-column-gap, 0.25rem);
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .profile__heading-top {
+    grid-template-columns: auto minmax(0, 1fr) auto;
+    grid-template-areas:
+      "avatar info edit"
+      "details details details"
+      "actions actions actions";
+    column-gap: var(--profile-heading-compact-column-gap, 0.5rem);
+    row-gap: var(--profile-heading-compact-row-gap, var(--spacing-sm, 0.75rem));
+  }
+
+  .profile__info {
+    grid-column: 2 / -1;
+    align-self: stretch;
+    justify-content: flex-end;
+  }
+
+  .profile__avatar {
+    align-self: flex-end;
+  }
+
+  .profile__heading-actions {
+    --profile-heading-action-item-flex: 0 1 auto;
+    --profile-heading-action-label-font-size: var(--profile-heading-compact-button-font-size);
+    --profile-heading-action-label-white-space: nowrap;
+    --profile-heading-action-contact-icon-size: var(--profile-heading-compact-contact-icon-size);
+    --profile-heading-action-contact-icon-gap: var(--profile-heading-compact-contact-icon-gap);
+    --profile-heading-action-full-label-display: none;
+    --profile-heading-action-short-label-display: inline;
+    justify-self: var(--profile-heading-compact-actions-justify-self, start);
+    margin-left: var(--profile-heading-compact-actions-margin-left, 0);
+    margin-right: var(--profile-heading-compact-actions-margin-right, auto);
+    max-inline-size: none;
+    justify-content: var(--profile-heading-compact-actions-justify-content, flex-start);
+    align-items: center;
+    align-content: center;
+    gap: var(--profile-heading-compact-action-gap, 0.25rem);
+    flex-wrap: nowrap;
+  }
+
+  .profile__heading-edit-action > solid-ui-button.profile__heading-action-button {
+    --button-background: transparent;
+    --button-border-width: 0;
+    --button-border: transparent;
+    --button-text: var(--color-text, #1A1A1A);
+    --button-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff));
+    --button-hover-border: transparent;
+    --button-hover-text: var(--color-text, #1A1A1A);
+  }
+  .profile__heading-actions > .profile-friends-button__section > solid-ui-button.profile__btn-friends,
+  .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+    min-width: 0;
+    inline-size: auto;
+    min-height: var(--button-height-sm, 1.75rem);
+    --button-padding-sm: var(--profile-heading-compact-button-padding, 0.25rem 0.3125rem);
+    --button-padding-x-sm: var(--profile-heading-compact-button-padding-x, 0.3125rem);
+    --button-font-size-sm: var(--profile-heading-compact-button-font-size, var(--font-size-xxs, 0.75rem));
+    --button-hover-background: var(--profile-heading-compact-button-hover-background, var(--color-primary, #7C4DFF));
+    --button-hover-border: var(--profile-heading-compact-button-hover-border, var(--color-primary, #7C4DFF));
+    --button-hover-text: var(--profile-heading-compact-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  }
+
+  .profile__heading-actions > #add-to-contacts-button-container > solid-ui-button.profile__btn-contacts {
+    --button-hover-background: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+    --button-hover-border: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+    --button-hover-text: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  }
+
+  .profile__name {
+    display: inline;
+    font-size: var(--profile-heading-compact-name-size, var(--profile-mobile-header-name-size, var(--font-size-xl, 1.375rem)));
+    line-height: var(--profile-heading-compact-name-line-height, 1.15);
+  }
+
+  .profile__identity {
+    display: flow-root;
+  }
+
+  .profile__role-org {
+    font-size: var(--profile-heading-compact-role-size, var(--profile-mobile-header-job-title-size, var(--font-size-md, 1rem)));
+  }
+
+  .profile__hero-alt {
+    padding: 0;
+  }
+
+  .profile__image-frame--fallback .profile__hero-alt {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .profile__hero-icon {
+    display: block;
+    margin: 0 auto;
+    width: var(--profile-heading-compact-hero-icon-size, 3rem);
+    height: var(--profile-heading-compact-hero-icon-size, 3rem);
+  }
+
+  .profile__details {
+    font-size: var(--profile-heading-compact-detail-size, var(--profile-mobile-header-detail-size, var(--font-size-xxs, 0.75rem)));
+    gap: var(--profile-heading-compact-details-gap, var(--spacing-xs, 0.5rem));
+  }
+
+  .profile__meta-row,
+  .profile__contact-row {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    column-gap: var(--profile-heading-compact-detail-column-gap, 0.25rem);
+  }
+}
diff --git a/src/sections/heading/HeadingSection.ts b/src/sections/heading/HeadingSection.ts
index dee9ede3..8f5017ff 100644
--- a/src/sections/heading/HeadingSection.ts
+++ b/src/sections/heading/HeadingSection.ts
@@ -1,5 +1,6 @@
 import { html, nothing, TemplateResult } from 'lit-html'
-import '../../styles/HeadingSection.css'
+import 'solid-ui/components/actions/button'
+import './HeadingSection.css'
 import { ProfileDetails } from './types'
 import { DataBrowserContext } from 'pane-registry'
 import { NamedNode } from 'rdflib'
@@ -9,8 +10,22 @@ import { toText } from '../../textUtils'
 import { toDisplayDateDMY } from './dateHelpers'
 import { birthdayIcon, editIcon, locationIcon, personInCircleIcon } from '../../icons-svg/profileIcons'
 import { emailIcon, phoneIcon } from '../../icons-svg/contactIcons'
+import { addMeToYourFriendsDiv } from '../../specialButtons/addMeToYourFriends'
+import { addMeToYourContactsDiv } from '../../specialButtons/addContact/addMeToYourContacts'
+import { resolvePhotoDisplaySrc } from './imageHelpers'
 
-export const renderHeadingSection = (
+const showHeadingImageFallback = (event: Event) => {
+  const image = event.currentTarget as HTMLImageElement | null
+  const frame = image?.parentElement
+  if (!image || !frame) {
+    return
+  }
+
+  image.hidden = true
+  frame.classList.add('profile__image-frame--fallback')
+}
+
+export const renderHeadingSection = async (
   context: DataBrowserContext,
   subject: NamedNode,
   profileData: ProfileDetails,
@@ -18,20 +33,24 @@ export const renderHeadingSection = (
   onSaved?: () => Promise<void> | void
 ) => {
   const { name, pronouns, jobTitle, dateOfBirth, location, primaryPhone, primaryEmail, imageSrc } = profileData
+  const resolvedImageSrc = await resolvePhotoDisplaySrc(context.session.store, imageSrc)
   const isOwner = viewerMode === 'owner'
+  const isAuthenticatedViewer = viewerMode === 'authenticated'
+  const contactsButton = isAuthenticatedViewer ? await addMeToYourContactsDiv(subject, context) : nothing
+  const friendsButton = isAuthenticatedViewer ? addMeToYourFriendsDiv(subject, context, viewerMode) : nothing
   
   const phoneValue = toText(primaryPhone?.valueNode).replace(/^tel:/i, '')
   const emailValue = toText(primaryEmail?.valueNode).replace(/^mailto:/i, '')
-  const dateOfBirthDisplay = toDisplayDateDMY(toText(dateOfBirth), 'DD-MM-YYYY')
+  const dateOfBirthDisplay = toDisplayDateDMY(toText(dateOfBirth), '')
  
   return html`
-      <section class="profile__section border-lighter" aria-labelledby="profile-name">
+      <section class="profile__section" data-profile-section="heading" aria-labelledby="profile-name">
         <div class="profile__heading-top">
           <div class="profile__avatar">
-            ${Image(imageSrc, name)}
+            ${Image(resolvedImageSrc, name)}
           </div>
           <div class="profile__info">
-            <header class="profile__header-bar mb-md">
+            <header class="profile__header-bar">
               <div class="profile__identity" role="group" aria-label="Name and pronouns">
                 <h1 id="profile-name" class="profile__name">${name}</h1>
                 <span class="profile__pronouns">${pronouns ? `(${pronouns})` : ''}</span>
@@ -39,27 +58,37 @@ export const renderHeadingSection = (
               ${jobTitle ? html`<div class="profile__role-org">${jobTitle}</div>` : nothing}
             </header>
           </div>
-          ${isOwner ? html`
-              <div class="profile__actions profile__heading-actions" aria-label="Profile actions">
-                <button
-                  type="button"
-                  class="profile__action-button profile__heading-action-button profile-action-text flex-center"
-                  aria-label="Add or edit heading information"
-                  @click=${(event: Event) => {
-                    return createHeadingEditDialog(
-                      event,
-                      context.session.store,
-                      subject,
-                      profileData,
-                      viewerMode,
-                      onSaved
-                    )
-                  }}
-                >
-                  <span class="profile-section-collapsible__edit-label">${editIcon} Edit</span>
-                  <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-                </button>
-              </div>
+          ${isOwner || isAuthenticatedViewer ? html`
+                ${isAuthenticatedViewer ? html`
+                  <div class="profile__actions profile__heading-actions">
+                    ${contactsButton}
+                    ${friendsButton}
+                  </div>
+                ` : nothing}
+                ${isOwner ? html`
+                  <div class="profile__actions profile__heading-edit-action">
+                    <solid-ui-button
+                      type="button"
+                      variant="secondary"
+                      size="sm"
+                      class="profile__action-button profile__heading-action-button profile-action-text profile-section-collapsible__edit-button"
+                      aria-label="Add or edit heading information"
+                      @click=${(event: Event) => {
+                        return createHeadingEditDialog(
+                          event,
+                          context.session.store,
+                          subject,
+                          profileData,
+                          viewerMode,
+                          onSaved
+                        )
+                      }}
+                    >
+                    <span class="profile-section-collapsible__edit-label">${editIcon} Edit</span>
+                    <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
+                  </solid-ui-button>
+                </div>
+                ` : nothing}
             ` : nothing}
           <div class="profile__details">
             <div class="profile__meta-row" role="group" aria-label="Additional profile information">
@@ -87,20 +116,23 @@ const Line = (value, prefix: TemplateResult | symbol | string = nothing, label:
     </div>
   ` : nothing
 
-export const Image = (src, alt) =>
-  src
-    ? html`
-        <img
-          class="profile__hero"
-          src=${src}
-          alt="${alt}"
-          width="140"
-          height="140"
-          loading="eager"
-        />
-      `
-    : html`
-        <div class="profile__hero-alt flex-center" role="img" aria-label="${alt}" tabindex="0">
-          <span class="profile__hero-icon">${personInCircleIcon}</span>
-        </div>
-      `
+export const Image = (src, alt) => html`
+  <div class=${src ? 'profile__image-frame' : 'profile__image-frame profile__image-frame--fallback'}>
+    ${src
+      ? html`
+          <img
+            class="profile__hero"
+            src=${src}
+            alt="${alt}"
+            width="140"
+            height="140"
+            loading="eager"
+            @error=${showHeadingImageFallback}
+          />
+        `
+      : nothing}
+    <div class="profile__hero-alt" role="img" aria-label="${alt}">
+      <span class="profile__hero-icon">${personInCircleIcon}</span>
+    </div>
+  </div>
+`
diff --git a/src/sections/heading/camera.ts b/src/sections/heading/camera.ts
deleted file mode 100644
index 72a0e429..00000000
--- a/src/sections/heading/camera.ts
+++ /dev/null
@@ -1,229 +0,0 @@
-//
-//   Media input widget
-//
-//
-// Workflow:
-// The HTML5 functionality (on mobile) is to prompt for either
-// a realtime camera capture, OR a selection from images already on the device
-// (eg camera roll).
-//
-// The solid alternative is to either take a photo
-// or access camera roll (etc) OR to access solid cloud storage of favorite photo albums.
-// (Especially latest taken ones)
-//
-
-// Copied from solid-ui needed to change somethings, have made a PR in solid-ui 
-import { widgets, icons, style } from 'solid-ui'
-import { IndexedFormula, NamedNode } from 'rdflib'
-import { render } from 'lit-html'
-import { closeIcon } from '../../icons-svg/profileIcons'
-
-const cameraIcon = icons.iconBase + 'noun_Camera_1618446_000000.svg' // Get it from github
-const retakeIcon = icons.iconBase + 'noun_479395.svg' // Get it from github
-
-const contentType = 'image/png'
-
-/** A control to capture a picture using camera
- * @param {Docuemnt} dom - The Document object
- * @param {IndexedForumla} store - The quadstore to store data in
- * @param {NamedNode} getImageDoc() - NN of the image file to be created
- * @param {function} doneCallback - Called when a picture has been taken
- */
-export function cameraCaptureControl (
-  dom: HTMLDocument,
-  store: IndexedFormula,
-  getImageDoc: () => NamedNode,
-  doneCallback: (imageDoc: NamedNode | null) => Promise<void>
-) {
-  const div = dom.createElement('div')
-  div.className = 'profile-edit-dialog__camera-control flex-column-center'
-  let destination, imageBlob, player, canvas
-
-  const setButtonVisible = (button: HTMLElement, visible: boolean) => {
-    button.style.display = visible ? 'inline-flex' : 'none'
-  }
-
-  const table = div.appendChild(dom.createElement('table'))
-  const mainTR = table.appendChild(dom.createElement('tr'))
-  const main = mainTR.appendChild(dom.createElement('td'))
-  main.setAttribute('colspan', '4')
-  main.style.textAlign = 'center'
-
-  const actionBar = div.appendChild(dom.createElement('div'))
-  actionBar.className = 'profile-edit-dialog__camera-control-actions'
-
-  /* Had to move away from widgets.button because of styling */
-  const cancelButton = div.appendChild(dom.createElement('button'))
-  cancelButton.type = 'button'
-  cancelButton.classList.add('profile-edit-dialog__camera-control-cancel')
-  cancelButton.setAttribute('aria-label', 'Close camera')
-  cancelButton.setAttribute('title', 'Close')
-  render(closeIcon, cancelButton)
-  cancelButton.addEventListener('click', _event => {
-    stopVideo()
-    doneCallback(null)
-  })
-
-  const retakeButton = actionBar.appendChild(widgets.button(dom, retakeIcon, 'Retake'))
-  retakeButton.classList.add('profile-edit-dialog__camera-control-action')
-  retakeButton.addEventListener('click', _event => {
-    retake()
-  })
-  retakeButton.textContent = 'Retake'
-  setButtonVisible(retakeButton, false)
-
-  const shutterButton = actionBar.appendChild(
-    widgets.button(dom, icons.iconBase + 'noun_10636.svg', 'Snap')
-  )
-  shutterButton.classList.add('profile-edit-dialog__camera-control-action')
-  shutterButton.addEventListener('click', grabCanvas)
-  shutterButton.textContent = 'Take Photo'
-  setButtonVisible(shutterButton, false)
-
-  const sendButton = actionBar.appendChild(widgets.continueButton(dom))
-  sendButton.classList.add('profile-edit-dialog__camera-control-action')
-  sendButton.addEventListener('click', _event => {
-    saveBlob(imageBlob, destination)
-  })
-  sendButton.textContent = 'Use Photo'
-  setButtonVisible(sendButton, false)
-
-  function displayPlayer () {
-    player = main.appendChild(dom.createElement('video'))
-    player.setAttribute('controls', '1')
-    player.setAttribute('autoplay', '1')
-    player.setAttribute('style', style.controlStyle)
-    if (!navigator.mediaDevices) {
-      throw new Error('navigator.mediaDevices not available')
-    }
-    navigator.mediaDevices.getUserMedia(constraints).then(stream => {
-      player.srcObject = stream
-      setButtonVisible(shutterButton, true)
-      setButtonVisible(sendButton, false)
-      setButtonVisible(retakeButton, false)
-    }).catch(err => {
-      console.error('Unable to start camera preview', err)
-      doneCallback(null)
-    })
-  }
-
-  const constraints = {
-    video: {
-      facingMode: { ideal: 'environment' }
-    }
-  }
-
-  function retake () {
-    main.removeChild(canvas)
-    displayPlayer() // Make new one as old one is stuck black
-  }
-
-  function grabCanvas () {
-    // Draw the video frame to the canvas.
-    canvas = dom.createElement('canvas')
-    canvas.setAttribute('width', style.canvasWidth)
-    canvas.setAttribute('height', style.canvasHeight)
-    canvas.setAttribute('style', style.controlStyle)
-    main.appendChild(canvas)
-
-    const context = canvas.getContext('2d')
-    if (!context) {
-      throw new Error('Could not get canvas context for camera snapshot')
-    }
-    context.drawImage(player, 0, 0, canvas.width, canvas.height)
-    stopVideo()
-
-    player.parentNode.removeChild(player)
-
-    canvas.toBlob(blob => {
-      if (!blob) {
-        throw new Error('Camera snapshot failed: no image blob produced')
-      }
-      const msg = `got blob type ${blob.type} size ${blob.size}`
-      console.debug(msg)
-      destination = getImageDoc()
-      imageBlob = blob // save for review
-      reviewImage()
-      // alert(msg)
-    }, contentType) // toBlob
-  }
-
-  function reviewImage () {
-    setButtonVisible(sendButton, true)
-    setButtonVisible(retakeButton, true)
-    setButtonVisible(shutterButton, false)
-  }
-
-  function stopVideo () {
-    if (player && player.srcObject) {
-      player.srcObject.getVideoTracks().forEach(track => track.stop())
-    }
-  }
-  function saveBlob (blob, destination) {
-    if (!blob || !destination) return
-    const contentType = blob.type
-    // if (!confirm('Save picture to ' + destination + ' ?')) return
-    console.debug(
-      'Putting ' + blob.size + ' bytes of ' + contentType + ' to ' + destination
-    )
-    // @@ TODO Remove casting
-    ;(store as any).fetcher
-      .webOperation('PUT', destination.uri, {
-        data: blob,
-        contentType
-      })
-      .then(
-        _resp => {
-          console.debug('ok saved ' + destination)
-          stopVideo()
-          doneCallback(destination)
-        },
-        err => {
-          stopVideo()
-          alert(err)
-        }
-      )
-  }
-
-  // Attach the video stream to the video element and autoplay.
-  displayPlayer()
-  return div
-}
-
-/** A button to capture a picture using camera
- * @param {Docuemnt} dom - The Document object
- * @param {IndexedForumla} store - The quadstore to store data in
- * @param {fuunction} getImageDoc - returns NN of the image file to be created
- * @param {function<Node>} doneCallback - called with the image taken
- * @returns {DomElement} - A div element with the button in it
- *
- * This expands the button to a large control when it is pressed
- */
-
-export function cameraButton (
-  dom: HTMLDocument,
-  store: IndexedFormula,
-  getImageDoc: () => NamedNode,
-  doneCallback: (imageDoc: NamedNode | null) => Promise<void>
-): HTMLElement {
-  const div = dom.createElement('div')
-  const but = widgets.button(dom, cameraIcon, 'Take picture')
-  let control
-  async function restoreButton (imageDoc: NamedNode | null) {
-    div.removeChild(control)
-    div.appendChild(but)
-    await doneCallback(imageDoc)
-  }
-  div.appendChild(but)
-  but.addEventListener('click', _event => {
-    div.removeChild(but)
-    control = cameraCaptureControl(
-      dom,
-      store,
-      getImageDoc,
-      restoreButton
-    )
-    div.appendChild(control)
-  })
-  return div
-}
diff --git a/src/sections/heading/imageHelpers.ts b/src/sections/heading/imageHelpers.ts
index eb21634c..77c44080 100644
--- a/src/sections/heading/imageHelpers.ts
+++ b/src/sections/heading/imageHelpers.ts
@@ -1,5 +1,9 @@
 import { LiveStore, NamedNode, sym } from 'rdflib'
 import { ns } from 'solid-ui'
+import { authn, solidLogicSingleton } from 'solid-logic'
+import { error as debugError } from '../../utils/debug'
+
+const resolvedHeadingImageCache = new Map<string, string>()
 /* Code copied from contact-pane/src/mugshotGallery and modified to fit the needs of the new design */
 const mimeMap: Record<string, string> = {
   'image/png': 'png',
@@ -34,6 +38,36 @@ function subjectDirectoryUri(subject: NamedNode): string {
   return lastSlash >= 0 ? docUri.slice(0, lastSlash + 1) : docUri
 }
 
+export async function resolvePhotoDisplaySrc(store: LiveStore, imageSrc?: string): Promise<string | undefined> {
+  if (!imageSrc || imageSrc.startsWith('blob:') || imageSrc.startsWith('data:')) {
+    return imageSrc
+  }
+
+  const cachedImageSrc = resolvedHeadingImageCache.get(imageSrc)
+  if (cachedImageSrc) {
+    return cachedImageSrc
+  }
+
+  const fetcher = store.fetcher as { _fetch?: (url: string) => Promise<Response> } | undefined
+  if (!fetcher?._fetch || typeof URL.createObjectURL !== 'function') {
+    return imageSrc
+  }
+
+  try {
+    const response = await fetcher._fetch(imageSrc)
+    if (!response.ok) {
+      return imageSrc
+    }
+
+    const imageBlob = await response.blob()
+    const resolvedImageSrc = URL.createObjectURL(imageBlob)
+    resolvedHeadingImageCache.set(imageSrc, resolvedImageSrc)
+    return resolvedImageSrc
+  } catch {
+    return imageSrc
+  }
+}
+
 export async function uploadPhotoFile(store: LiveStore, subject: NamedNode, file: File): Promise<string> {
   if (!store.fetcher) {
     throw new Error('Store has no fetcher.')
@@ -70,6 +104,17 @@ export async function uploadPhotoFile(store: LiveStore, subject: NamedNode, file
   } catch (error) {
     throw new Error(`Error uploading picture: ${error}`)
   }
+
+  const currentUser = authn.currentUser()
+  if (currentUser) {
+    try {
+      await solidLogicSingleton.acl.setACLUserPublic(candidateUri, currentUser, {
+        public: ['Read'] as unknown as []
+      })
+    } catch (error) {
+      debugError(`Error setting uploaded picture permissions: ${error}`)
+    }
+  }
   
   return candidateUri
 }
@@ -82,7 +127,7 @@ export async function deletePhotoFile(store: LiveStore, subject: NamedNode, phot
     try {
       await store.fetcher.webOperation('DELETE', photoUri)
     } catch (error) {
-      console.error(`Error deleting picture: ${error}`)
+      debugError(`Error deleting picture: ${error}`)
     }
     
   }
diff --git a/src/sections/heading/mutations.ts b/src/sections/heading/mutations.ts
index 8217cbac..9739d776 100644
--- a/src/sections/heading/mutations.ts
+++ b/src/sections/heading/mutations.ts
@@ -4,8 +4,20 @@ import { ProfileBasicRow, HeadingMutationPlan } from './types'
 import { MutationOps } from '../shared/types'
 import { applyUpdaterPatch, collectLinkedNodeStatements, collectNodeStatements, findExistingNode, replacePredicateStatements } from '../shared/rdfMutationHelpers'
 import { createIdNode } from '../shared/idNodeFactory'
-import { saveHeadingUpdatesFailedPrefixText } from '../../texts'
 import { ContactAddressRow, ContactPointRow } from '../contactInfo/types'
+import { headingMutationSaveFailedDebugText, saveHeadingUpdatesFailedMessageText } from '../../texts'
+import { error as debugError } from '../../utils/debug'
+
+function splitPronouns(value?: string): { subjectPronoun?: string, objectPronoun?: string } {
+  const normalized = (value || '').trim()
+  if (!normalized) return {}
+
+  const [subjectPronounRaw, objectPronounRaw] = normalized.split('/').map((part) => part.trim())
+  const subjectPronoun = subjectPronounRaw || undefined
+  const objectPronoun = objectPronounRaw || undefined
+
+  return { subjectPronoun, objectPronoun }
+}
 
 function buildPhoneStatements(subject: NamedNode, doc: NamedNode, node: Node, phone: ContactPointRow) {
   const normalizedValue = phone.value.startsWith('tel:') ? phone.value : `tel:${phone.value}`
@@ -41,11 +53,11 @@ function buildAddressStatements(subject: NamedNode, doc: NamedNode, node: Node,
   const inserts = [st(subject, ns.vcard('hasAddress'), node as any, doc)]
 
   if (address.type) inserts.push(st(node as any, ns.rdf('type'), ns.vcard(address.type), doc))
-  if (address.streetAddress) inserts.push(st(node as any, ns.vcard('street-address'), address.streetAddress as any, doc))
-  if (address.locality) inserts.push(st(node as any, ns.vcard('locality'), address.locality as any, doc))
-  if (address.region) inserts.push(st(node as any, ns.vcard('region'), address.region as any, doc))
-  if (address.postalCode) inserts.push(st(node as any, ns.vcard('postal-code'), address.postalCode as any, doc))
-  if (address.countryName) inserts.push(st(node as any, ns.vcard('country-name'), address.countryName as any, doc))
+  if (address.streetAddress) inserts.push(st(node as any, ns.vcard('street-address'), literal(address.streetAddress), doc))
+  if (address.locality) inserts.push(st(node as any, ns.vcard('locality'), literal(address.locality), doc))
+  if (address.region) inserts.push(st(node as any, ns.vcard('region'), literal(address.region), doc))
+  if (address.postalCode) inserts.push(st(node as any, ns.vcard('postal-code'), literal(address.postalCode), doc))
+  if (address.countryName) inserts.push(st(node as any, ns.vcard('country-name'), literal(address.countryName), doc))
 
   return inserts
 }
@@ -190,11 +202,44 @@ async function mutateBasicProfileEntry(store: LiveStore, subject: NamedNode, bas
     replacePredicateStatements(store, subject, ns.vcard('hasPhoto'), doc, deletions, insertions, nextObject)
   }
 
+  const replacePronounFields = (value?: string) => {
+    const { subjectPronoun, objectPronoun } = splitPronouns(value)
+
+    replacePredicateStatements(
+      store,
+      subject,
+      ns.solid('preferredSubjectPronoun'),
+      doc,
+      deletions,
+      insertions,
+      subjectPronoun ? literal(subjectPronoun) : null
+    )
+    replacePredicateStatements(
+      store,
+      subject,
+      ns.solid('preferredObjectPronoun'),
+      doc,
+      deletions,
+      insertions,
+      objectPronoun ? literal(objectPronoun) : null
+    )
+    replacePredicateStatements(
+      store,
+      subject,
+      ns.solid('preferredRelativePronoun'),
+      doc,
+      deletions,
+      insertions,
+      null
+    )
+  }
+
   const applyBasics = (basic: ProfileBasicRow, clearAll = false) => {
     const data = clearAll
       ? {
           name: '',
           nickname: '',
+          pronouns: '',
           dateOfBirth: '',
           jobTitle: '',
           orgName: '',
@@ -209,6 +254,7 @@ async function mutateBasicProfileEntry(store: LiveStore, subject: NamedNode, bas
     replaceLiteralField(ns.vcard('bday'), data.dateOfBirth)
     replaceLiteralField(ns.vcard('role'), data.jobTitle)
     replaceLiteralField(ns.vcard('organization-name'), data.orgName)
+    replacePronounFields(data.pronouns)
     replacePhotoField(data.imageSrc)
   }
 
@@ -231,7 +277,8 @@ export async function processHeadingMutations(store: LiveStore, subject: NamedNo
     await mutateEmailEntry(store, subject, mutationPlan.emailOps)
     await mutateAddressEntry(store, subject, mutationPlan.addressOps)
   } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`${saveHeadingUpdatesFailedPrefixText} ${message}`)
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(headingMutationSaveFailedDebugText, rootError)
+    throw new Error(saveHeadingUpdatesFailedMessageText, { cause: rootError })
   }
 } 
diff --git a/src/sections/languages/LanguageEditDialog.ts b/src/sections/languages/LanguageEditDialog.ts
index 50078953..277f85cc 100644
--- a/src/sections/languages/LanguageEditDialog.ts
+++ b/src/sections/languages/LanguageEditDialog.ts
@@ -1,8 +1,10 @@
-import { openInputDialog } from '../../ui/dialog'
+import { getSharedDialogSaveButton, openInputDialog } from '../../ui/dialog'
 import { html, render } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import 'solid-ui/components/forms/combobox'
 import { LanguageDetails, LanguageRow } from './types'
 import '../../styles/EditDialogs.css'
-import '../../styles/ContactInfoEditDialog.css'
+import '../contactInfo/ContactInfoEditDialog.css'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ViewerMode } from '../../types'
 import { applyRowFieldChange, applyRowSelectChange, deleteRow, summarizeRowOps } from '../shared/rowState'
@@ -16,7 +18,7 @@ import {
   dialogSubmitLabelText,
   editLanguagesDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveLanguageUpdatesFailedPrefixText,
+  saveLanguageUpdatesFailedMessageText,
 } from '../../texts'
 
 type LanguageFormState = {
@@ -30,6 +32,22 @@ type LanguageSuggestion = {
   code: string
 }
 
+type LanguageComboboxOption = {
+  label: string
+  value: string
+  publicId?: string
+  meta?: Record<string, unknown>
+}
+
+type LanguageComboboxElement = HTMLElement & {
+  suggestionProvider?: (query: string) => Promise<LanguageComboboxOption[]>
+  options?: LanguageComboboxOption[]
+  value?: string
+  inputValue?: string
+  label?: string
+  placeholder?: string
+}
+
 const WIKIDATA_LANGUAGE_ENDPOINT = 'https://query.wikidata.org/sparql'
 const LANGUAGE_OBJECT_URI_BASE = 'https://www.w3.org/ns/iana/language-code/'
 
@@ -55,15 +73,6 @@ function normalizeLanguageCode(value: string): string {
   return (value || '').trim().toLowerCase()
 }
 
-function normalizeSuggestionKey(value: string): string {
-  return sanitizeLanguageFieldValue(value)
-    .toLowerCase()
-    .replace(/\(.*?\)/g, ' ')
-    .replace(/[^a-z\s-]/g, ' ')
-    .replace(/\s+/g, ' ')
-    .trim()
-}
-
 function escapeSparqlRegex(value: string): string {
   return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
 }
@@ -131,17 +140,73 @@ async function fetchLanguageSuggestions(term: string): Promise<LanguageSuggestio
   }
 }
 
-function matchLanguageSuggestion(suggestions: LanguageSuggestion[], value: string): LanguageSuggestion | null {
-  const normalized = sanitizeLanguageFieldValue(value).toLowerCase()
-  if (!normalized) return null
+function toLanguageComboboxOption(suggestion: LanguageSuggestion): LanguageComboboxOption {
+  return {
+    label: suggestion.name,
+    value: suggestion.publicId,
+    publicId: suggestion.publicId,
+    meta: { code: suggestion.code }
+  }
+}
+
+function readLanguageComboboxInputValue(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
 
-  const exact = suggestions.find((suggestion) => suggestion.name.toLowerCase() === normalized)
-  if (exact) return exact
+  const target = event.target as HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
+
+function readLanguageComboboxChange(event: Event): LanguageComboboxOption | null {
+  const customEvent = event as CustomEvent<{
+    value?: string
+    label?: string
+    option?: LanguageComboboxOption
+  }>
 
-  const normalizedKey = normalizeSuggestionKey(value)
-  if (!normalizedKey) return null
+  if (customEvent.detail?.option) {
+    return customEvent.detail.option
+  }
 
-  return suggestions.find((suggestion) => normalizeSuggestionKey(suggestion.name) === normalizedKey) || null
+  if (typeof customEvent.detail?.value === 'string') {
+    return {
+      label: typeof customEvent.detail?.label === 'string' ? customEvent.detail.label : '',
+      value: customEvent.detail.value,
+      publicId: customEvent.detail.value
+    }
+  }
+
+  return null
+}
+
+function createLanguageSuggestionProvider(): (query: string) => Promise<LanguageComboboxOption[]> {
+  return async (query: string) => {
+    const suggestions = await fetchLanguageSuggestions(query)
+    return suggestions.map(toLanguageComboboxOption)
+  }
+}
+
+function initializeLanguageComboboxes(form: HTMLFormElement, rows: LanguageRow[]): void {
+  const comboboxElements = form.querySelectorAll('solid-ui-combobox[data-language-row-index]') as NodeListOf<LanguageComboboxElement>
+
+  comboboxElements.forEach((comboboxElement) => {
+    const rowIndex = Number(comboboxElement.dataset.languageRowIndex)
+    if (Number.isNaN(rowIndex)) return
+
+    const row = rows[rowIndex]
+    const options = row?.publicId && row?.name
+      ? [{ label: row.name, value: row.publicId, publicId: row.publicId }]
+      : []
+
+    comboboxElement.suggestionProvider = createLanguageSuggestionProvider()
+    comboboxElement.options = options
+    comboboxElement.value = row?.publicId || ''
+    comboboxElement.inputValue = row?.name || ''
+    comboboxElement.label = ''
+    comboboxElement.placeholder = 'Language'
+  })
 }
 
 function toFormState(details: LanguageDetails[]): LanguageFormState {
@@ -176,12 +241,7 @@ function hasOrderChanged(rows: LanguageRow[], initialExistingOrder: string[]): b
   return false
 }
 
-function validateLanguagesBeforeSave(rows: LanguageRow[], initialExistingOrder: string[]): string | null {
-  const ops = summarizeRowOps(rows, rowHasContent)
-  const hasChanges = ops.create.length > 0 || ops.update.length > 0 || ops.remove.length > 0
-  const orderChanged = hasOrderChanged(rows, initialExistingOrder)
-  if (!hasChanges && !orderChanged) return 'No language changes detected.'
-
+function validateLanguagesBeforeSave(rows: LanguageRow[]): string | null {
   for (let i = 0; i < rows.length; i++) {
     const row = rows[i]
     if (!row || row.status === 'deleted') continue
@@ -203,7 +263,7 @@ function hasInvalidLanguageSelection(rows: LanguageRow[]): boolean {
 }
 
 function updateLanguagesSubmitEnabled(rows: LanguageRow[]): void {
-  const submitButton = document.querySelector('#profile-modal #modal-buttons button.btn-primary') as HTMLButtonElement | null
+  const submitButton = getSharedDialogSaveButton(document)
   if (!submitButton) return
   submitButton.disabled = hasInvalidLanguageSelection(rows)
 }
@@ -212,10 +272,30 @@ function focusLanguageField(form: HTMLFormElement, selector: string): void {
   const nextField = form.querySelector(selector) as HTMLElement | null
   if (!nextField || typeof nextField.focus !== 'function') return
 
-  nextField.scrollIntoView({ block: 'start', behavior: 'auto' })
-  nextField.focus()
-  if (nextField instanceof HTMLInputElement || nextField instanceof HTMLTextAreaElement) {
-    nextField.select()
+  if (typeof nextField.scrollIntoView === 'function') {
+    nextField.scrollIntoView({ block: 'start', behavior: 'auto' })
+  }
+  const comboboxHost = nextField.tagName === 'SOLID-UI-COMBOBOX'
+    ? (nextField as HTMLElement & { _closePopup?: () => void })
+    : null
+  const comboboxInput = comboboxHost
+    ? comboboxHost.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    : null
+  const focusTarget = comboboxInput || nextField
+  focusTarget.focus()
+  if (focusTarget instanceof HTMLInputElement) {
+    const caretPosition = 0
+    focusTarget.setSelectionRange(caretPosition, caretPosition)
+    focusTarget.scrollLeft = 0
+    requestAnimationFrame(() => {
+      focusTarget.scrollLeft = 0
+    })
+  }
+
+  if (comboboxHost?._closePopup) {
+    requestAnimationFrame(() => {
+      comboboxHost._closePopup?.()
+    })
   }
 }
 
@@ -224,9 +304,6 @@ type ContactLanguageInputRowProps = {
   index: number
   displayIndex: number
   onDelete: () => void
-  onChange: () => void
-  onSearch: (index: number, term: string) => void
-  suggestions: LanguageSuggestion[]
   onDragStart: (index: number) => void
   onDragOver: (event: DragEvent) => void
   onDrop: (index: number) => void
@@ -239,9 +316,6 @@ function renderLanguageInputRow({
   index,
   displayIndex,
   onDelete,
-  onChange,
-  onSearch,
-  suggestions,
   onDragStart,
   onDragOver,
   onDrop,
@@ -251,29 +325,26 @@ function renderLanguageInputRow({
   const row = rows[index]
   const label = `Language ${displayIndex + 1}`
   const proficiencyLabel = `Language Proficiency ${displayIndex + 1}`
-  const languageName = `language-${index}`
   const proficiencyInputName = `proficiency-${index}`
   const proficiencySelectId = `proficiency-${index}`
-  const datalistId = `language-suggestions-${index}`
   const hasSelectionIssue = Boolean(row && row.status !== 'deleted' && hasNonEmptyText(row.name) && !hasNonEmptyText(row.publicId))
 
   const handleLanguageInput = (field: LanguageEditableField) => (e: Event) => {
-    const target = e.target as HTMLInputElement
-    const nextValue = sanitizeLanguageFieldValue(target.value)
+    const nextValue = sanitizeLanguageFieldValue(readLanguageComboboxInputValue(e))
     if (rows[index]) {
       applyRowFieldChange(rows[index], field, nextValue, rowHasContent)
-      const matchedSuggestion = matchLanguageSuggestion(suggestions, nextValue)
-      rows[index].publicId = matchedSuggestion?.publicId || ''
-      if (matchedSuggestion) {
-        rows[index].name = sanitizeLanguageFieldValue(matchedSuggestion.name)
-      }
-      onSearch(index, nextValue)
-      onChange()
+      rows[index].publicId = ''
+      updateLanguagesSubmitEnabled(rows)
     }
   }
 
   const handleLanguageChange = (field: LanguageEditableField) => (e: Event) => {
-    handleLanguageInput(field)(e)
+    const selectedOption = readLanguageComboboxChange(e)
+    if (!rows[index] || !selectedOption) return
+
+    applyRowFieldChange(rows[index], field, sanitizeLanguageFieldValue(selectedOption.label), rowHasContent)
+    rows[index].publicId = selectedOption.publicId || selectedOption.value || ''
+    updateLanguagesSubmitEnabled(rows)
   }
 
   const handleProficiencyInput = (e: Event) => {
@@ -281,7 +352,7 @@ function renderLanguageInputRow({
     const nextType = target.value
     if (rows[index]) {
       applyRowSelectChange(rows[index], 'proficiency', nextType)
-      onChange()
+      updateLanguagesSubmitEnabled(rows)
     }
   }
 
@@ -296,38 +367,27 @@ function renderLanguageInputRow({
       @dragover=${(event: DragEvent) => onDragOver(event)}
       @drop=${() => onDrop(index)}
     >
-      <button
+      <solid-ui-button
         type="button"
         class="profile-edit-dialog__drag-handle"
+        variant="icon"
+        size="md"
         aria-label=${`Reorder language ${displayIndex + 1}`}
         title="Drag to reorder"
         draggable="true"
         @dragstart=${() => onDragStart(index)}
         @dragend=${() => onDragEnd()}
       >
-        ${bentoIcon}
-      </button>
-      <label aria-label=${`${label} Language`} class="label profile-edit-dialog__field">
-        <input
-          class="input"
-          type="text"
-          name=${languageName}
-          .value=${row?.name || ''}
-          required
-          data-contact-field="name"
-          data-entry-node=${row?.entryNode || ''}
-          data-row-status=${row?.status || 'n/a'}
-          placeholder="Language"
-          autocomplete="off"
-          list=${datalistId}
-          inputmode="text"
+        <span slot="icon" aria-hidden="true">${bentoIcon}</span>
+      </solid-ui-button>
+      <label aria-label=${`${label} Language`} class="label profile-edit-dialog__field profile-edit-dialog__field--language-name">
+        <solid-ui-combobox
+          aria-label=${`${label} Language`}
+          data-language-row-index=${String(index)}
           aria-invalid=${hasSelectionIssue ? 'true' : 'false'}
           @input=${handleLanguageInput('name')}
           @change=${handleLanguageChange('name')}
-        />
-        <datalist id=${datalistId}>
-          ${suggestions.map((suggestion) => html`<option value=${suggestion.name}></option>`)}
-        </datalist>
+        ></solid-ui-combobox>
         <small class="profile-edit-dialog__input-help-text">Type to search and select one language suggestion.</small>
       </label>
       <label aria-label=${proficiencyLabel} class="label" hidden>
@@ -337,16 +397,18 @@ function renderLanguageInputRow({
           <option value="Fluent">Fluent</option>
         </select>
       </label>
-      <div class="profile-edit-dialog__actions profile-edit-dialog__actions--edge">
-        <button
+      <div class="profile-edit-dialog__actions profile-edit-dialog__actions--edge profile-edit-dialog__actions--language">
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete language ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
   `
@@ -354,9 +416,7 @@ function renderLanguageInputRow({
 
 function renderLanguageSection(
   rows: LanguageRow[],
-  onAddRow: (options?: LanguageRerenderOptions) => void,
-  suggestionByIndex: Record<number, LanguageSuggestion[]>,
-  onSearch: (index: number, term: string) => void
+  onAddRow: (options?: LanguageRerenderOptions) => void
 ) {
   let dragSourceIndex: number | null = null
   let dropTargetIndex: number | null = null
@@ -367,10 +427,6 @@ function renderLanguageSection(
     if (!row) return
     rows.splice(from, 1)
     rows.splice(to, 0, row)
-
-    Object.keys(suggestionByIndex).forEach((key) => {
-      delete suggestionByIndex[Number(key)]
-    })
   }
 
   const handleDragStart = (index: number) => {
@@ -410,9 +466,6 @@ function renderLanguageSection(
           rows,
           index,
           displayIndex,
-          onChange: onAddRow,
-          onSearch,
-          suggestions: suggestionByIndex[index] || [],
           onDragStart: handleDragStart,
           onDragOver: handleDragOver,
           onDrop: handleDrop,
@@ -420,7 +473,6 @@ function renderLanguageSection(
           isDropTarget: dropTargetIndex === index,
           onDelete: () => {
             deleteRow(rows, index)
-            delete suggestionByIndex[index]
             onAddRow()
           }
         }))}
@@ -435,55 +487,16 @@ function renderLanguageEditTemplate(
   viewerMode: ViewerMode,
   options: LanguageRerenderOptions = {}
 ) {
-  const formStateWithSearch = formState as LanguageFormState & {
-    suggestionByIndex?: Record<number, LanguageSuggestion[]>
-    searchSeqByIndex?: Record<number, number>
-    searchTimerByIndex?: Record<number, ReturnType<typeof setTimeout>>
-  }
-
-  const suggestionByIndex = formStateWithSearch.suggestionByIndex || (formStateWithSearch.suggestionByIndex = {})
-  const searchSeqByIndex = formStateWithSearch.searchSeqByIndex || (formStateWithSearch.searchSeqByIndex = {})
-  const searchTimerByIndex = formStateWithSearch.searchTimerByIndex || (formStateWithSearch.searchTimerByIndex = {})
-
   const rerender = (nextOptions: LanguageRerenderOptions = {}) => renderLanguageEditTemplate(form, formState, viewerMode, nextOptions)
-  const onSearch = (index: number, term: string) => {
-    if (searchTimerByIndex[index]) {
-      clearTimeout(searchTimerByIndex[index])
-    }
-
-    const normalized = sanitizeLanguageFieldValue(term)
-    if (normalized.length < 2) {
-      suggestionByIndex[index] = []
-      rerender()
-      return
-    }
-
-    const seq = (searchSeqByIndex[index] || 0) + 1
-    searchSeqByIndex[index] = seq
-
-    searchTimerByIndex[index] = setTimeout(async () => {
-      const suggestions = await fetchLanguageSuggestions(normalized)
-      if (searchSeqByIndex[index] !== seq) return
-      suggestionByIndex[index] = suggestions
-
-      const row = formState.languages[index]
-      if (row) {
-        const matchedSuggestion = matchLanguageSuggestion(suggestions, row.name)
-        row.publicId = matchedSuggestion?.publicId || row.publicId
-      }
-
-      rerender()
-    }, 220)
-  }
-
 
   render(html`
-    ${renderLanguageSection(formState.languages, rerender, suggestionByIndex, onSearch)}
+    ${renderLanguageSection(formState.languages, rerender)}
     ${viewerMode !== 'owner'
       ? html`<p class="profile-edit-dialog__login-message">${ownerLoginRequiredDialogMessageText}</p>`
       : null}
   `, form)
 
+  initializeLanguageComboboxes(form, formState.languages)
   updateLanguagesSubmitEnabled(formState.languages)
 
   if (options.focusSelector) {
@@ -509,15 +522,7 @@ function createLanguageEditForm(details: LanguageDetails[], viewerMode: ViewerMo
       entryNode: '',
       status: 'new'
     })
-    const formStateWithSearch = formState as LanguageFormState & {
-      suggestionByIndex?: Record<number, LanguageSuggestion[]>
-      searchSeqByIndex?: Record<number, number>
-      searchTimerByIndex?: Record<number, ReturnType<typeof setTimeout>>
-    }
-    formStateWithSearch.suggestionByIndex = {}
-    formStateWithSearch.searchSeqByIndex = {}
-    formStateWithSearch.searchTimerByIndex = {}
-    renderLanguageEditTemplate(form, formState, viewerMode, { focusSelector: '[name="language-0"]' })
+    renderLanguageEditTemplate(form, formState, viewerMode, { focusSelector: '[data-language-row-index="0"]' })
   }
 
   return { form, formState, addRow }
@@ -539,6 +544,12 @@ export async function createLanguageEditDialog(
     title: editLanguagesDialogTitleText,
     dom,
     form,
+    onOpen: () => focusLanguageField(form, '[data-language-row-index="0"]'),
+    shouldCloseWithoutSave: () => {
+      const ops = summarizeRowOps(formState.languages, rowHasContent)
+      const orderChanged = hasOrderChanged(formState.languages, formState.initialExistingOrder)
+      return ops.create.length === 0 && ops.update.length === 0 && ops.remove.length === 0 && !orderChanged
+    },
     headerAction: {
       type: 'button',
       label: '+ Add More',
@@ -551,7 +562,7 @@ export async function createLanguageEditDialog(
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
       }
-      return validateLanguagesBeforeSave(formState.languages, formState.initialExistingOrder)
+      return validateLanguagesBeforeSave(formState.languages)
     },
     onSave: async () => {
       const languageOps = summarizeRowOps(formState.languages, rowHasContent)
@@ -563,8 +574,7 @@ export async function createLanguageEditDialog(
       await processLanguageMutations(store, subject, plan, formState.languages)
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveLanguageUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveLanguageUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/languages/LanguageSection.css b/src/sections/languages/LanguageSection.css
new file mode 100644
index 00000000..63cce2e8
--- /dev/null
+++ b/src/sections/languages/LanguageSection.css
@@ -0,0 +1,53 @@
+/* Languages list */
+.languages__list {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  align-items: flex-start;
+  gap: var(--spacing-sm, 0.9375rem);
+  align-self: stretch;
+}
+
+.languages__item-label {
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  font-size: var(--font-size-md, 1rem);
+  font-weight: var(--font-weight-md, 500);
+}
+
+/* Empty state */
+.languages__empty-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--icon-xs, 1.5rem);
+  height: var(--icon-xs, 1.5rem);
+  flex-shrink: 0;
+}
+
+.languages__empty-icon svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .languages__item-label {
+  font-size: var(--font-size-sm, 0.875rem);
+}
+
+@media (max-width: 576px) {
+  .languages__item-label {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .languages__item-label {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+}
diff --git a/src/sections/languages/LanguageSection.ts b/src/sections/languages/LanguageSection.ts
index 536abaad..0b50c0d1 100644
--- a/src/sections/languages/LanguageSection.ts
+++ b/src/sections/languages/LanguageSection.ts
@@ -1,10 +1,12 @@
 import { html } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ns } from 'solid-ui'
 import { ViewerMode } from '../../types'
+import './LanguageSection.css'
 import { createLanguageEditDialog } from './LanguageEditDialog'
 import { LanguageDetails } from './types'
-import { addIcon, commentIcon, editIcon, plusIcon } from '../../icons-svg/profileIcons'
+import { addIcon, chevronDownIcon, commentIcon, editIcon } from '../../icons-svg/profileIcons'
 import { languagesHeadingText } from '../../texts'
 import { toggleCollapsibleSection } from '../shared/collapsibleSection'
 
@@ -27,42 +29,47 @@ function renderLanguagesSectionDefault(store: LiveStore, subject: NamedNode, lan
   const isOwner = viewerMode === 'owner'
   return html`
     <section
-      class="profile__section border-lighter profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+      class="profile__section profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+      data-profile-section="languages"
       aria-labelledby="languages-heading"
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
-        <h2 id="languages-heading">${languagesHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
+        <h3 id="languages-heading">${languagesHeadingText}</h3>
+        <div class="profile-section-collapsible__actions">
           ${isOwner ? html`
-            <button
+            <solid-ui-button
               type="button"
-              class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+              variant="secondary"
+              size="sm"
+              class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
               aria-label="Add or edit languages"
               @click=${(event: Event) => createLanguageEditDialog(event, store, subject, languages, viewerMode, onSaved)}
             >
-              <span class="profile-section-collapsible__edit-label profile__add-more-content inline-flex-row">
-                <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-                Add More
+              <span class="profile-section-collapsible__edit-label profile__add-more-content">
+                <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+                <span>Add More</span>
               </span>
               <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-            </button>
+            </solid-ui-button>
           ` : html``}
-          <button
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle languages section"
             aria-controls="languages-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="languages-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="languages-panel" class="profile-section-collapsible__content">
         ${hasLanguages
           ? html`
               <ul class="languages__list" role="list" aria-label="Known languages">
@@ -85,9 +92,9 @@ function renderOwnerEmptyLanguagesContent(
   _onSaved?: () => Promise<void> | void
 ) {
   return html`
-      <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty languages section">    
+      <div class="profile__empty-state-content" role="group" aria-label="Empty languages section">    
         <div class="languages__empty-icon-wrapper">
-          <span class="languages__empty-icon inline-flex-row">${commentIcon}</span>
+          <span class="languages__empty-icon">${commentIcon}</span>
         </div>
         <p class="profile__empty-state-message languages__empty-message">
             No languages added yet.
@@ -107,17 +114,19 @@ function renderOwnerEmptyLanguagesSection(
     <section 
       aria-labelledby="languages-heading" 
       data-profile-section="languages"
-      class="profile__section--empty border-lighter rounded-md gap-lg profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
+      class="profile__section--empty profile__section--empty-sidebar profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
-        <h2 id="languages-heading" tabindex="-1">${languagesHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
-          <button
+        <h3 id="languages-heading" tabindex="-1">${languagesHeadingText}</h3>
+        <div class="profile-section-collapsible__actions">
+          <solid-ui-button
             type="button"
-            class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+            variant="secondary"
+            size="sm"
+            class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
             aria-label="Add languages"
             @click=${(event: Event) => {
               return createLanguageEditDialog(
@@ -130,25 +139,27 @@ function renderOwnerEmptyLanguagesSection(
               )
             }}
           >
-            <span class="profile-section-collapsible__edit-label profile__add-more-content inline-flex-row">
-              <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-              Add Languages
+            <span class="profile-section-collapsible__edit-label profile__add-more-content">
+              <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+              <span>Add More</span>
             </span>
-            <span class="profile-section-collapsible__edit-icon profile-section-collapsible__edit-icon--add" aria-hidden="true">${plusIcon}</span>
-          </button>
-          <button
+            <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
+          </solid-ui-button>
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle languages section"
             aria-controls="languages-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="languages-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="languages-panel" class="profile-section-collapsible__content">
         ${renderOwnerEmptyLanguagesContent(store, subject, languages, viewerMode, onSaved)}
       </div>
     </section>
diff --git a/src/sections/languages/mutations.ts b/src/sections/languages/mutations.ts
index 03f905d9..dcb39523 100644
--- a/src/sections/languages/mutations.ts
+++ b/src/sections/languages/mutations.ts
@@ -1,11 +1,13 @@
-import { blankNode, LiveStore, NamedNode, st, sym, literal } from 'rdflib'
+import { BlankNode, Collection, LiveStore, NamedNode, Node, st, sym, literal } from 'rdflib'
 import { ns } from 'solid-ui'
 import { LanguageRow } from './types'
-import { MutationOps } from '../shared/types'
+import { MutationOps, PrefixCapable, RdfStatement, RdfUpdater } from '../shared/types'
 import { presentLanguages } from './selectors'
 import { expandRdfList } from '../shared/rdfList'
 import { createIdNode } from '../shared/idNodeFactory'
-import { mutationSaveLanguagesFailedPrefixText } from '../../texts'
+import { languageMutationSaveFailedDebugText, saveLanguageUpdatesFailedMessageText } from '../../texts'
+import { findExistingNode, registerStorePrefix, runUpdateTransport } from '../shared/rdfMutationHelpers'
+import { error as debugError } from '../../utils/debug'
 
 export type LanguageMutationPlan = MutationOps<LanguageRow>
 // Language entries are serialized as an ordered rdf:List of id nodes, where
@@ -13,21 +15,8 @@ export type LanguageMutationPlan = MutationOps<LanguageRow>
 const LANGUAGE_IANA_NS = 'https://www.w3.org/ns/iana/language-code/'
 
 function ensureLanguagePrefix(store: LiveStore) {
-  const registerPrefix = (target: any) => {
-    if (!target) return
-    if (typeof target.setPrefixForURI === 'function') {
-      target.setPrefixForURI('l', LANGUAGE_IANA_NS)
-      return
-    }
-    if (!target.namespaces) {
-      target.namespaces = {}
-    }
-    target.namespaces.l = LANGUAGE_IANA_NS
-  }
-
-  const anyStore = store as any
-  registerPrefix(anyStore)
-  registerPrefix(anyStore?.updater?.store)
+  registerStorePrefix(store, 'l', LANGUAGE_IANA_NS)
+  registerStorePrefix((store.updater as RdfUpdater | undefined)?.store as PrefixCapable | undefined, 'l', LANGUAGE_IANA_NS)
 }
 
 function normalizeText(value: string | undefined): string {
@@ -58,46 +47,48 @@ function rowsFromOrderedInput(orderedRows: LanguageRow[]): LanguageRow[] {
     }))
 }
 
-function buildRdfListStatements(items: NamedNode[], doc: NamedNode) {
-  if (!items.length) {
-    return {
-      head: ns.rdf('nil'),
-      statements: [] as any[]
-    }
-  }
-
-  const listNodes = items.map(() => blankNode())
-  const statements: any[] = []
+function nodeKey(node: Node): string {
+  return `${node.termType}:${node.value}`
+}
 
-  items.forEach((item, index) => {
-    const current = listNodes[index]
-    const next = listNodes[index + 1] || ns.rdf('nil')
-    statements.push(st(current as any, ns.rdf('first'), item as any, doc))
-    statements.push(st(current as any, ns.rdf('rest'), next as any, doc))
-  })
+type LanguageEntryNode = NamedNode | BlankNode
 
-  return {
-    head: listNodes[0],
-    statements
-  }
+function isLanguageEntryNode(node: Node | null | undefined): node is LanguageEntryNode {
+  return Boolean(node && (node.termType === 'NamedNode' || node.termType === 'BlankNode'))
 }
 
-function buildLanguageStatements(subject: NamedNode, doc: NamedNode, rows: LanguageRow[]) {
+function buildLanguageStatements(
+  subject: NamedNode,
+  doc: NamedNode,
+  rows: LanguageRow[],
+  existingLanguageNodes: LanguageEntryNode[]
+) {
   const languageRows = rows
     .map((row) => ({
       name: normalizeText(row.name),
       publicId: normalizeLanguageCode(row.publicId),
+      entryNode: normalizeText(row.entryNode)
     }))
     .filter((row) => Boolean(row.publicId))
 
-  if (languageRows.length === 0) return []
+  if (languageRows.length === 0) {
+    return { statements: [] as RdfStatement[], entryNodes: [] as LanguageEntryNode[] }
+  }
 
-  const entryNodes = languageRows.map(() => createIdNode(doc))
-  const statements: any[] = []
+  const entryNodes = languageRows.map<LanguageEntryNode>((row) => {
+    const existingNode = row.entryNode
+      ? findExistingNode(existingLanguageNodes, row.entryNode)
+      : null
+
+    if (isLanguageEntryNode(existingNode)) {
+      return existingNode
+    }
+
+    return createIdNode(doc)
+  })
+  const statements: RdfStatement[] = []
 
-  const rdfList = buildRdfListStatements(entryNodes, doc)
-  statements.push(st(subject, ns.schema('knowsLanguage'), rdfList.head as any, doc))
-  statements.push(...rdfList.statements)
+  statements.push(st(subject, ns.schema('knowsLanguage'), new Collection(entryNodes), doc))
 
   entryNodes.forEach((entryNode, index) => {
     const publicIdNode = sym(`${LANGUAGE_IANA_NS}${languageRows[index].publicId}`)
@@ -107,13 +98,13 @@ function buildLanguageStatements(subject: NamedNode, doc: NamedNode, rows: Langu
     }
   })
 
-  return statements
+  return { statements, entryNodes }
 }
 
-function collectListChainNodes(store: LiveStore, listHead: any, doc: NamedNode): any[] {
+function collectListChainNodes(store: LiveStore, listHead: NamedNode, doc: NamedNode): NamedNode[] {
   const visited = new Set<string>()
-  const nodes: any[] = []
-  let current = listHead
+  const nodes: NamedNode[] = []
+  let current: NamedNode | null = listHead
 
   while (current) {
     const key = `${current.termType}:${current.value}`
@@ -121,144 +112,16 @@ function collectListChainNodes(store: LiveStore, listHead: any, doc: NamedNode):
     visited.add(key)
     nodes.push(current)
 
-    const rest = store.any(current as NamedNode, ns.rdf('rest'), null, doc) as any
+    const rest = store.any(current as any, ns.rdf('rest'), null, doc)
     if (!rest || (rest.termType === 'NamedNode' && rest.value === ns.rdf('nil').value)) {
       break
     }
-    current = rest
+    current = (rest.termType === 'NamedNode' || rest.termType === 'BlankNode') ? rest as NamedNode : null
   }
 
   return nodes
 }
 
-function isPatchFailure(message: string): boolean {
-  const text = (message || '').toLowerCase()
-  // Different pods surface PATCH incompatibility with different status codes/messages.
-  return text.includes(' on patch ') || text.includes('web error: 501') || text.includes('web error: 405') || text.includes('web error: 400')
-}
-
-function isMissingGetRecordError(message: string): boolean {
-  return (message || '').toLowerCase().includes('no record of our http get request for document')
-}
-
-function statementKey(statement: any): string {
-  return `${statement.subject?.toNT?.() || statement.subject?.value} ${statement.predicate?.toNT?.() || statement.predicate?.value} ${statement.object?.toNT?.() || statement.object?.value} ${statement.why?.toNT?.() || statement.why?.value}`
-}
-
-function sanitizePatchStatements(store: LiveStore, deletions: any[], insertions: any[]) {
-  const safeDeletions = Array.from(new Map(
-    (deletions || [])
-      .filter((statement) => {
-        if (!statement || !statement.subject || !statement.predicate || !statement.object) return false
-        if (store.holds(statement.subject, statement.predicate, statement.object, statement.why)) return true
-        return store.statementsMatching(statement.subject, statement.predicate, statement.object, statement.why).length > 0
-      })
-      .map((statement) => [statementKey(statement), statement])
-  ).values())
-
-  const safeInsertions = Array.from(new Map(
-    (insertions || [])
-      .filter((statement) => Boolean(statement && statement.subject && statement.predicate && statement.object))
-      .map((statement) => [statementKey(statement), statement])
-  ).values())
-
-  return { safeDeletions, safeInsertions }
-}
-
-async function runPutFallback(store: LiveStore, doc: NamedNode, deletions: any[], insertions: any[]) {
-  const updater = store.updater as any
-  const fetcher = (store as any).fetcher
-
-  if (!updater || typeof updater.serialize !== 'function' || !fetcher || typeof fetcher.webOperation !== 'function') {
-    throw new Error('Language updates are not supported by this store updater.')
-  }
-
-  const currentStatements = store.statementsMatching(undefined, undefined, undefined, doc).slice()
-  const deletionKeys = new Set((deletions || []).map((statement) => statementKey(statement)))
-  // Rebuild full document state for PUT when patch-oriented flows cannot be used.
-  const nextStatements = currentStatements.filter((statement) => !deletionKeys.has(statementKey(statement))).concat(insertions || [])
-
-  const contentType = 'text/turtle'
-  const body = updater.serialize(doc.value, nextStatements, contentType)
-  const response = await fetcher.webOperation('PUT', doc.value, {
-    noMeta: true,
-    contentType,
-    body
-  })
-
-  if (!response || response.ok !== true) {
-    const status = response?.status || 'unknown'
-    throw new Error(`Web error: ${status} on PUT of <${doc.value}>`)
-  }
-
-  // PUT bypasses UpdateManager's local-store patching, so apply the same changes locally.
-  store.remove(deletions)
-  insertions.forEach((statement) => {
-    store.add(statement.subject, statement.predicate, statement.object, statement.why)
-  })
-}
-
-async function runUpdateWithDavFallback(store: LiveStore, doc: NamedNode, deletions: any[], insertions: any[]) {
-  const updater = store.updater as any
-  if (!updater || typeof updater.update !== 'function') {
-    throw new Error('Language updates are not supported by this store updater.')
-  }
-
-  const { safeDeletions, safeInsertions } = sanitizePatchStatements(store, deletions, insertions)
-  if (safeDeletions.length === 0 && safeInsertions.length === 0) {
-    return
-  }
-
-  const tryUpdate = () => new Promise<void>((resolve, reject) => {
-    updater.update(safeDeletions, safeInsertions, (_uri: string, ok: boolean, message?: string) => {
-      if (ok === true) {
-        resolve()
-        return
-      }
-      reject(new Error(message || 'Failed to save languages'))
-    })
-  })
-
-  try {
-    // Preferred path: let rdflib pick the server-supported update protocol.
-    await tryUpdate()
-    return
-  } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    if (!isPatchFailure(message) || typeof updater.updateDav !== 'function') {
-      throw error
-    }
-
-    if (store.fetcher && typeof (store.fetcher as any).load === 'function') {
-      try {
-        await (store.fetcher as any).load(doc)
-      } catch {
-        // Continue; updateDav may still fail and we handle that below.
-      }
-    }
-
-    try {
-      // First fallback for PATCH failures: DAV-style whole-document update.
-      await new Promise<void>((resolve, reject) => {
-        updater.updateDav(doc, safeDeletions, safeInsertions, (_uri: string, ok: boolean, body?: string) => {
-          if (ok === true) {
-            resolve()
-            return
-          }
-          reject(new Error(body || message || 'Failed to save languages'))
-        })
-      })
-    } catch (davError) {
-      const davMessage = davError instanceof Error ? davError.message : String(davError)
-      if (!isMissingGetRecordError(davMessage)) {
-        throw davError
-      }
-      // Some stores cannot run updateDav without prior fetch metadata; use direct PUT.
-      await runPutFallback(store, doc, safeDeletions, safeInsertions)
-    }
-  }
-}
-
 function mergeLanguageOps(existingRows: LanguageRow[], languageOps: MutationOps<LanguageRow>): LanguageRow[] {
   const byEntryNode = new Map<string, LanguageRow>()
   existingRows.forEach((row) => {
@@ -321,7 +184,7 @@ async function mutateLanguageEntries(
     : mergeLanguageOps(existingRows, languageOps)
 
   const listObjects = store.each(subject, ns.schema('knowsLanguage'), null, doc)
-  const existingListHeads = listObjects.filter((node) => node.termType === 'BlankNode' || node.termType === 'NamedNode')
+  const existingListHeads = listObjects.filter((node): node is NamedNode => node.termType === 'BlankNode' || node.termType === 'NamedNode')
 
   const existingListNodes = Array.from(new Map(
     existingListHeads
@@ -329,7 +192,7 @@ async function mutateLanguageEntries(
       .map((node) => [`${node.termType}:${node.value}`, node])
   ).values())
 
-  const existingLanguageNodes = Array.from(new Set(
+  const existingLanguageNodes: LanguageEntryNode[] = Array.from(new Set(
     listObjects
       .flatMap((node) => expandRdfList(store, node))
       .filter((node) => node.termType === 'NamedNode' || node.termType === 'BlankNode')
@@ -347,21 +210,45 @@ async function mutateLanguageEntries(
       .map((node) => [`${node.termType}:${node.value}`, node])
   ).values())
 
-  const deletions = store.statementsMatching(subject, ns.schema('knowsLanguage'), null, doc)
+  const {
+    statements: insertions,
+    entryNodes: nextEntryNodes
+  } = buildLanguageStatements(subject, doc, nextRows, existingLanguageNodes)
+
+  const retainedEntryNodeKeys = new Set(nextEntryNodes.map((node) => nodeKey(node)))
+  const retainedLanguageNodes = existingLanguageNodes.filter((node) => retainedEntryNodeKeys.has(nodeKey(node)))
+  const removedLanguageNodes = existingLanguageNodes.filter((node) => !retainedEntryNodeKeys.has(nodeKey(node)))
+
+  const retainedPublicIdNodes = Array.from(new Map(
+    retainedLanguageNodes
+      .map((node) => store.any(node as NamedNode, ns.solid('publicId'), null, doc))
+      .filter((node): node is NamedNode => Boolean(node && node.termType === 'NamedNode'))
+      .map((node) => [nodeKey(node), node])
+  ).values())
+
+  const deletions: RdfStatement[] = store.statementsMatching(subject, ns.schema('knowsLanguage'), null, doc)
   existingListNodes.forEach((node) => {
-    deletions.push(...store.statementsMatching(node as any, null, null, doc))
+    deletions.push(...store.statementsMatching(node, null, null, doc))
   })
-  existingLanguageNodes.forEach((node) => {
-    // Remove old language-entry statements so save always rewrites canonical shape.
+  removedLanguageNodes.forEach((node) => {
     deletions.push(...store.statementsMatching(node as NamedNode, null, null, doc))
   })
+  retainedLanguageNodes.forEach((node) => {
+    deletions.push(...store.statementsMatching(node as NamedNode, ns.solid('publicId'), null, doc))
+  })
   existingPublicIdNodes.forEach((node) => {
-    // Language labels are attached to the publicId resource (l:xx) and should be removed for deleted rows.
     deletions.push(...store.statementsMatching(node as NamedNode, ns.schema('name'), null, doc))
   })
-  const insertions = buildLanguageStatements(subject, doc, nextRows)
+  retainedPublicIdNodes.forEach((node) => {
+    deletions.push(...store.statementsMatching(node as NamedNode, ns.schema('name'), null, doc))
+  })
 
-  await runUpdateWithDavFallback(store, doc, deletions, insertions)
+  await runUpdateTransport(store, doc, deletions, insertions, {
+    unsupportedMessage: 'Language updates are not supported by this store updater.',
+    failureMessage: 'Failed to save languages',
+    useDavFallback: true,
+    usePutFallback: true
+  })
 }
 
 export async function processLanguageMutations(
@@ -374,7 +261,8 @@ export async function processLanguageMutations(
     await mutateLanguageEntries(store, subject, mutationPlan, orderedRows)
 
   } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`${mutationSaveLanguagesFailedPrefixText} ${message}`)
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(languageMutationSaveFailedDebugText, rootError)
+    throw new Error(saveLanguageUpdatesFailedMessageText, { cause: rootError })
   }
 } 
diff --git a/src/sections/languages/selectors.ts b/src/sections/languages/selectors.ts
index a77604ee..ab0ce9ff 100644
--- a/src/sections/languages/selectors.ts
+++ b/src/sections/languages/selectors.ts
@@ -151,11 +151,8 @@ export function presentLanguages(subject: NamedNode, store: LiveStore): Language
     .filter((node) => isRdfListNode(store, node))
     .map((node) => expandRdfList(store, node))
 
-  const longestList = expandedLists
-    .sort((a, b) => b.length - a.length)[0] || []
-
   const standaloneNodes = languageObjects.filter((node) => !isRdfListNode(store, node))
-  const languageNodes = [...longestList, ...standaloneNodes]
+  const languageNodes = [...expandedLists.flat(), ...standaloneNodes]
 
   const details: LanguageDetails[] = languageNodes
     .map((lan) => ({
diff --git a/src/sections/projects/ProjectEditDialog.ts b/src/sections/projects/ProjectEditDialog.ts
index 2c02aa85..f9e166e1 100644
--- a/src/sections/projects/ProjectEditDialog.ts
+++ b/src/sections/projects/ProjectEditDialog.ts
@@ -1,8 +1,9 @@
-import { openInputDialog } from '../../ui/dialog'
+import { getSharedDialogSaveButton, openInputDialog } from '../../ui/dialog'
 import { html, render } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { ProjectDetails, ProjectRow } from './types'
 import '../../styles/EditDialogs.css'
-import '../../styles/ContactInfoEditDialog.css'
+import '../contactInfo/ContactInfoEditDialog.css'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ViewerMode } from '../../types'
 import { applyRowFieldChange, summarizeRowOps } from '../shared/rowState'
@@ -14,7 +15,6 @@ import {
   editProjectsDialogTitleText,
   ownerLoginRequiredDialogMessageText,
   pasteEntryButtonTitleText,
-  saveProjectsUpdatesFailedPrefixText,
 } from '../../texts'
 
 type ProjectFormState = {
@@ -62,9 +62,6 @@ function toFormState(_details: ProjectDetails[]): ProjectFormState {
 }
 
 function validateProjectBeforeSave(row: ProjectRow): string | null {
-  if (!hasNonEmptyText(row.url) && !hasNonEmptyText(row.entryNode)) {
-    return 'Add a project WebID.'
-  }
   if (!hasNonEmptyText(row.url)) {
     return 'WebID is required.'
   }
@@ -93,7 +90,7 @@ function renderProjectInputRow(row: ProjectRow, onChange: () => void) {
       if (!isValidProjectUrl(url)) return
 
       const dom = (event.currentTarget as HTMLElement | null)?.ownerDocument || document
-      const saveButton = dom.querySelector('#profile-modal #modal-buttons .btn-primary') as HTMLButtonElement | null
+      const saveButton = getSharedDialogSaveButton(dom)
       saveButton?.click()
     } catch {
       // Clipboard access may fail due to browser permissions; keep dialog usable.
@@ -103,7 +100,6 @@ function renderProjectInputRow(row: ProjectRow, onChange: () => void) {
   return html`
     <div class="profile-edit-dialog__row profile-edit-dialog__row--project">
       <label aria-label="Project or community WebID" class="label profile-edit-dialog__field profile-edit-dialog__field--full">
-      <p>Type or paste a project or community WebID.</p>  
       <div class="profile-edit-dialog__input-wrap">
           <input
             class="input profile-edit-dialog__input--with-action"
@@ -119,16 +115,19 @@ function renderProjectInputRow(row: ProjectRow, onChange: () => void) {
             inputmode="text"
             @input=${handleUrlInput}
           />
-          <button
+          <solid-ui-button
             type="button"
-            class="profile-edit-dialog__paste-button rounded-sm gap-xxs"
+            variant="secondary"
+            size="md"
+            label="Paste"
+            class="profile-edit-dialog__paste-button"
             aria-label="Paste project or community URL from clipboard"
             title=${pasteEntryButtonTitleText}
             @click=${handlePaste}
           >
-            <span class="profile-edit-dialog__paste-icon" aria-hidden="true">${pasteIcon}</span>
+            <span slot="icon" class="profile-edit-dialog__paste-icon" aria-hidden="true">${pasteIcon}</span>
             Paste
-          </button>
+          </solid-ui-button>
         </div>
       </label>
     </div>
@@ -174,6 +173,7 @@ export async function createProjectsEditDialog(
     dom,
     form,
     headerAction: { type: 'close' },
+    shouldCloseWithoutSave: () => !hasNonEmptyText(formState.project.url) && !hasNonEmptyText(formState.project.entryNode),
     validate: () => {
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
@@ -190,25 +190,12 @@ export async function createProjectsEditDialog(
       await processProjectsMutations(store, subject, plan)
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveProjectsUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : String(error)
     }
   })
 
-  const modalButtons = dom.querySelector('#profile-modal #modal-buttons') as HTMLElement | null
-  const previousButtonsDisplay = modalButtons?.style.display
-  if (modalButtons) {
-    modalButtons.style.display = 'none'
-  }
-
   let result: Record<string, string> | null = null
-  try {
-    result = await dialogPromise
-  } finally {
-    if (modalButtons) {
-      modalButtons.style.display = previousButtonsDisplay || ''
-    }
-  }
+  result = await dialogPromise
 
   if (!result) return
 
diff --git a/src/sections/projects/ProjectSection.css b/src/sections/projects/ProjectSection.css
new file mode 100644
index 00000000..9b352640
--- /dev/null
+++ b/src/sections/projects/ProjectSection.css
@@ -0,0 +1,368 @@
+/* Projects section styles. */
+
+.profile__section[data-profile-section='projects'],
+.profile__section--empty[data-profile-section='projects'] {
+  --project-card-rail-gap: var(--spacing-md, 1rem);
+  --project-card-rail-wrap: nowrap;
+  --project-card-rail-overflow-x: auto;
+  --project-card-rail-scroll-snap-type: x proximity;
+  --project-card-flex-basis: min(420px, 88vw);
+  --project-card-flex: 0 0 var(--project-card-flex-basis);
+  --project-card-max-width: none;
+  --project-card-scrollbar-height: 0.5rem;
+  --project-card-thumb-column-width: 88px;
+  --project-card-thumb-size: 4.125rem;
+  --project-card-follow-label-gap: var(--spacing-xxs, 0.3125rem);
+  --project-card-wrapper-gap: var(--spacing-2xs, 0.625rem);
+  --project-card-content-gap: var(--spacing-xxs, 0.3125rem);
+  --project-card-heading-gap: 0.1875rem;
+  --project-card-meta-margin-top: var(--spacing-xs, 0.75rem);
+  --project-card-meta-font-size: 0.86rem;
+  --project-card-footer-padding: var(--spacing-xs, 0.75rem);
+  --project-card-more-button-gap: var(--spacing-xs, 0.375rem);
+  --project-card-more-button-width: auto;
+  --project-card-more-button-part-width: auto;
+  --project-card-mobile-more-button-margin-top: var(--spacing-xs, 0.75rem);
+  --project-card-more-button-margin-top: 0;
+  --project-card-collapsed-extra-display: flex;
+  --project-card-more-icon-transform: rotate(0deg);
+}
+
+/* Rail and cards */
+.project-card__rail {
+  display: flex;
+  gap: var(--project-card-rail-gap);
+  overflow-x: var(--project-card-rail-overflow-x, auto);
+  padding: 0;
+  margin: 0;
+  list-style: none;
+  flex-wrap: var(--project-card-rail-wrap, nowrap);
+  scroll-snap-type: var(--project-card-rail-scroll-snap-type, x proximity);
+}
+
+solid-ui-button.project-card__follow-button {
+  width: auto;
+  min-width: 0;
+  max-width: none;
+  gap: var(--project-card-follow-label-gap);
+  --button-border-width: var(--border-width-sm, 0.1rem);
+  --button-font-size-sm: var(--font-size-sm, 0.875rem);
+  --button-font-weight: var(--font-weight-md, 500);
+  --button-padding-sm: var(--spacing-base, 0.5rem) var(--spacing-2xs, 0.625rem);
+  --button-border-radius: var(--border-radius-md, 0.5rem);
+  --button-background: var(--color-card-bg, var(--white, #FFF));
+  --button-text: var(--color-primary, #7C4DFF);
+  --button-border: var(--color-primary, #7C4DFF);
+  --button-hover-background: var(--color-primary, #7C4DFF);
+  --button-hover-text: var(--color-text-on-action, var(--white, #FFF));
+  --button-hover-border: var(--color-primary, #7C4DFF);
+}
+
+.project-card__follow-label {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--project-card-follow-label-gap);
+}
+
+.project-card__follow-label--hover {
+  display: none;
+}
+
+.project-card__follow-label--loading {
+  display: none;
+  align-items: center;
+  gap: var(--project-card-follow-label-gap);
+}
+
+solid-ui-button.project-card__follow-button:hover .project-card__follow-label--default,
+solid-ui-button.project-card__follow-button:focus-visible .project-card__follow-label--default,
+solid-ui-button.project-card__follow-button:focus-within .project-card__follow-label--default {
+  display: none;
+}
+
+solid-ui-button.project-card__follow-button:hover .project-card__follow-label--hover,
+solid-ui-button.project-card__follow-button:focus-visible .project-card__follow-label--hover,
+solid-ui-button.project-card__follow-button:focus-within .project-card__follow-label--hover {
+  display: inline-flex;
+}
+
+solid-ui-button.project-card__follow-button[data-loading='true'] {
+  pointer-events: none;
+}
+
+solid-ui-button.project-card__follow-button[data-loading='true'] .project-card__follow-label--default,
+solid-ui-button.project-card__follow-button[data-loading='true'] .project-card__follow-label--hover {
+  display: none;
+}
+
+solid-ui-button.project-card__follow-button[data-loading='true'] .project-card__follow-label--loading {
+  display: inline-flex;
+}
+
+solid-ui-button.project-card__follow-button[data-loading='true'] .loading-spinner {
+  width: var(--icon-xxs, 1rem);
+  height: var(--icon-xxs, 1rem);
+  border-width: 0.125rem;
+}
+
+.project-card__rail::-webkit-scrollbar {
+  height: var(--project-card-scrollbar-height);
+}
+
+.project-card__rail::-webkit-scrollbar-thumb {
+  background: var(--color-icon-muted, #90A1B9);
+  border-radius: 999px;
+}
+
+.project-card {
+  display: flex;
+  flex-direction: column;
+  flex: var(--project-card-flex, 0 0 var(--project-card-flex-basis));
+  width: 100%;
+  max-width: var(--project-card-max-width, none);
+  min-width: 0;
+  box-sizing: border-box;
+  scroll-snap-align: start;
+  border-radius: var(--border-radius-md, 0.5rem);
+  border: var(--border-width-sm, 0.1rem) solid var(--color-border, var(--gray-200, #E5E7EB));
+  padding: var(--spacing-md, 1.25rem);
+  justify-content: center;
+  align-items: flex-start;
+  gap: var(--spacing-sm, 0.938rem);
+  flex-shrink: 0;
+}
+
+.project-card__link {
+  display: block;
+  width: 100%;
+  align-self: stretch;
+  color: inherit;
+  text-decoration: none;
+}
+
+.project-card__link:hover .project-card__title,
+.project-card__link:focus-visible .project-card__title {
+  text-decoration: underline;
+}
+
+.project-card__wrapper {
+  display: grid;
+  grid-template-columns: var(--project-card-thumb-column-width) 1fr;
+  gap: var(--project-card-wrapper-gap);
+  width: 100%;
+  align-items: start;
+  border-radius: var(--border-radius-md, 0.5rem);
+  border-bottom: 1px solid var(--color-border, var(--gray-200, #E5E7EB));
+}
+
+.project-card__thumb {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--project-card-thumb-size);
+  height: var(--project-card-thumb-size);
+  overflow: hidden;
+  border-radius: var(--border-radius-base, 0.3125rem);
+  background: var(--color-surface-placeholder, var(--gray-200, #E5E7EB));
+  padding: 0.656rem var(--spacing-2xs, 0.625rem);
+  aspect-ratio: 1/1;
+}
+
+.project-card__thumb-image {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+}
+
+.project-card__thumb-fallback {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  font-size: 0.72rem;
+  color: var(--color-text-detail, var(--slate-500, #62748E));
+  text-transform: uppercase;
+  letter-spacing: 0.04rem;
+}
+
+.project-card__content {
+  display: flex;
+  flex-direction: column;
+  gap: var(--project-card-content-gap);
+  min-width: 0;
+}
+
+.project-card__heading-group {
+  display: flex;
+  flex-direction: column;
+  gap: var(--project-card-heading-gap);
+  min-width: 0;
+}
+
+.project-card__title,
+.project-card__organization,
+.project-card__category,
+.project-card__meta,
+.project-card__description {
+  margin: 0;
+}
+
+.project-card__title {
+  overflow: hidden;
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  text-overflow: ellipsis;
+  font-size: var(--font-size-lg, 1.125rem);
+  font-weight: var(--font-weight-bold, 600);
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+  line-clamp: 1;
+  align-self: stretch;
+}
+
+.project-card__organization {
+  color: var(--color-text-primary, var(--gray-700, #364153));
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-md, 500);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  line-height: 1.35;
+  align-self: stretch;
+}
+
+.project-card__category {
+  font-size: var(--font-size-xxs, 0.75rem);
+  font-weight: var(--font-weight-md, 500);
+}
+
+.project-card__category--project {
+  color: var(--purple-500, #AD46FF);
+}
+
+.project-card__category--community {
+  color: var(--yellow-700, #A65F00);
+}
+
+.project-card__category--unknown {
+  color: var(--color-text-control, var(--slate-700, #314158));
+}
+
+.project-card__meta {
+  margin-top: var(--project-card-meta-margin-top);
+  overflow-wrap: anywhere;
+  font-size: var(--project-card-meta-font-size, 0.86rem);
+}
+
+.project-card__footer {
+  display: flex;
+  justify-content: flex-start;
+  align-self: stretch;
+  margin-top: auto;
+  padding: var(--spacing-sm, 0.938rem) 0 0;
+}
+
+.profile__section[data-profile-section='projects'] .profile-section-inline-error {
+  margin-top: var(--spacing-sm, 0.938rem);
+  padding: var(--spacing-xs, 0.75rem);
+  border: 1px solid var(--dialog-error-border, var(--pink-700, #ff98b3));
+  border-radius: var(--border-radius-base, 0.3125rem);
+  background: var(--dialog-error-background, var(--pink-500, #ffdde6));
+  color: var(--dialog-error-text, var(--red-600, #B00020));
+  text-align: left;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+/* Action buttons */
+
+solid-ui-button.project-card__more-button {
+  width: var(--project-card-more-button-width, auto);
+  margin-top: var(--project-card-more-button-margin-top, 0);
+  --button-height-sm: 0;
+  --button-padding-x-sm: 0;
+  --button-background: transparent;
+  --button-border: transparent;
+  --button-text: var(--color-primary, #7C4DFF);
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary, #7C4DFF);
+}
+
+.project-card__more-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  transform: var(--project-card-more-icon-transform, rotate(0deg));
+  transition: transform var(--animation-duration, 0.2s) ease;
+}
+
+solid-ui-button.project-card__more-button::part(button) {
+  align-items: center;
+  justify-content: center;
+  width: var(--project-card-more-button-part-width, auto);
+  gap: var(--project-card-more-button-gap, 0.375rem);
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: var(--color-primary, #7C4DFF);
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-bold, 600);
+  cursor: var(--profile-interactive-cursor, pointer);
+}
+
+/* Compact layout */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section[data-profile-section='projects'],
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section--empty[data-profile-section='projects'] {
+  --project-card-rail-wrap: wrap;
+  --project-card-rail-overflow-x: visible;
+  --project-card-rail-scroll-snap-type: none;
+  --project-card-flex: 1 1 100%;
+  --project-card-max-width: 100%;
+  --project-card-more-button-width: 100%;
+  --project-card-more-button-part-width: 100%;
+  --project-card-more-button-margin-top: var(--project-card-mobile-more-button-margin-top, var(--spacing-xs, 0.75rem));
+}
+
+.profile-section-collapsible[data-mobile-expanded="false"] .project-card:nth-child(n + 3) {
+  display: var(--project-card-collapsed-extra-display, flex);
+}
+
+solid-ui-button.project-card__more-button[data-mobile-expanded="true"] .project-card__more-icon {
+  --project-card-more-icon-transform: rotate(180deg);
+}
+
+@media (max-width: 576px) {
+  .profile__section[data-profile-section='projects'],
+  .profile__section--empty[data-profile-section='projects'] {
+    --project-card-rail-wrap: wrap;
+    --project-card-rail-overflow-x: visible;
+    --project-card-rail-scroll-snap-type: none;
+    --project-card-flex: 1 1 100%;
+    --project-card-max-width: 100%;
+    --project-card-more-button-width: 100%;
+    --project-card-more-button-part-width: 100%;
+    --project-card-more-button-margin-top: var(--project-card-mobile-more-button-margin-top, var(--spacing-xs, 0.75rem));
+    --project-card-collapsed-extra-display: none;
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .profile__section[data-profile-section='projects'],
+  .profile__section--empty[data-profile-section='projects'] {
+    --project-card-rail-wrap: wrap;
+    --project-card-rail-overflow-x: visible;
+    --project-card-rail-scroll-snap-type: none;
+    --project-card-flex: 1 1 100%;
+    --project-card-max-width: 100%;
+    --project-card-more-button-width: 100%;
+    --project-card-more-button-part-width: 100%;
+    --project-card-more-button-margin-top: var(--project-card-mobile-more-button-margin-top, var(--spacing-xs, 0.75rem));
+    --project-card-collapsed-extra-display: none;
+  }
+}
\ No newline at end of file
diff --git a/src/sections/projects/ProjectSection.ts b/src/sections/projects/ProjectSection.ts
index f8113533..5c3e9dcb 100644
--- a/src/sections/projects/ProjectSection.ts
+++ b/src/sections/projects/ProjectSection.ts
@@ -1,17 +1,37 @@
 import { html } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ViewerMode } from '../../types'
 import { ProjectDetails, ProjectRow } from './types'
-import { projectsHeadingText } from '../../texts'
+import { projectsHeadingText, unfollowProjectFailedMessageText } from '../../texts'
 import { createProjectsEditDialog } from './ProjectEditDialog'
 import { processProjectsMutations } from './mutations'
-import { addIcon, checkMarkIcon, plusDarkIcon, twoDownArrowsIcon } from '../../icons-svg/profileIcons'
+import { addIcon, checkMarkIcon, chevronDownIcon, editIcon, plusDarkIcon, twoDownArrowsIcon } from '../../icons-svg/profileIcons'
 import { MutationOps } from '../shared/types'
-import '../../styles/ProjectsCard.css'
+import './ProjectSection.css'
 import { toggleCollapsibleSection } from '../shared/collapsibleSection'
+import { createSpinner } from '../../ui/spinner'
+import { formatDisplayError } from '../../utils/errorDisplay'
 
 const MAX_VISIBLE_PROJECTS_MOBILE = 2
 
+function setProjectsSectionError(section: HTMLElement, message: string | null): void {
+  const errorBox = section.querySelector('.profile-section-inline-error') as HTMLElement | null
+  if (!errorBox) return
+
+  if (!message) {
+    errorBox.textContent = ''
+    errorBox.hidden = true
+    errorBox.setAttribute('aria-hidden', 'true')
+    return
+  }
+
+  errorBox.textContent = message
+  errorBox.hidden = false
+  errorBox.setAttribute('aria-hidden', 'false')
+  errorBox.focus()
+}
+
 function toggleProjectsMobileList(event: Event): void {
   const button = event.currentTarget as HTMLButtonElement | null
   const section = button?.closest('.profile-section-collapsible') as HTMLElement | null
@@ -39,7 +59,7 @@ function renderProjectImage(src: string | undefined, altText: string) {
         />
       `
     : html`
-        <div class="project-card__thumb-fallback flex-center" role="img" aria-label=${altText} tabindex="0">
+        <div class="project-card__thumb-fallback" role="img" aria-label=${altText}>
           ${altText}
         </div>
       `
@@ -69,7 +89,10 @@ function renderProject(
 
   const handleUnfollow = async (event: Event) => {
     event.preventDefault()
+    event.stopPropagation()
     if (viewerMode !== 'owner') return
+    const unfollowButton = event.currentTarget as HTMLElement | null
+    const section = (event.currentTarget as HTMLElement | null)?.closest('[data-profile-section="projects"]') as HTMLElement | null
 
     const removePlan: MutationOps<ProjectRow> = {
       create: [],
@@ -77,9 +100,25 @@ function renderProject(
       remove: [toProjectRow(project, 'deleted')]
     }
 
-    await processProjectsMutations(store, subject, removePlan)
-    if (onSaved) {
-      await onSaved()
+    try {
+      unfollowButton?.setAttribute('disabled', '')
+      unfollowButton?.setAttribute('data-loading', 'true')
+      unfollowButton?.setAttribute('aria-busy', 'true')
+      await processProjectsMutations(store, subject, removePlan)
+      if (section) {
+        setProjectsSectionError(section, null)
+      }
+      if (onSaved) {
+        await onSaved()
+      }
+    } catch (error) {
+      if (section) {
+        setProjectsSectionError(section, formatDisplayError(error, unfollowProjectFailedMessageText))
+      }
+    } finally {
+      unfollowButton?.removeAttribute('disabled')
+      unfollowButton?.removeAttribute('data-loading')
+      unfollowButton?.setAttribute('aria-busy', 'false')
     }
   }
 
@@ -94,7 +133,7 @@ function renderProject(
     : 'Uncategorized'
 
   return html`
-    <li class="project-card flex-column" role="listitem">
+    <li class="project-card" role="listitem">
       <a
         class="project-card__link"
         href=${project.url}
@@ -103,26 +142,33 @@ function renderProject(
         aria-label=${project.title ? `Open ${project.title}` : 'Open project link'}
       >
         <div class="project-card__wrapper">
-          <div class="project-card__thumb flex-center">
+          <div class="project-card__thumb">
             ${renderProjectImage(project.imageUrl, project.title || 'Project preview')}
           </div>
           <div class="project-card__content">
-            <p class="project-card__title"><strong>${project.title || project.url}</strong></p>
-            <p class="project-card__organization">${project.orgName || 'Organization unknown'}</p>
+            <div class="project-card__heading-group">
+              <p class="project-card__title">${project.title || project.url}</p>
+              <p class="project-card__organization">${project.orgName || 'Organization unknown'}</p>
+            </div>
             <p class="project-card__category project-card__category--${categoryModifier}">${categoryLabel}</p>
           </div>
         </div>
       </a>
       ${viewerMode === 'owner' ? html`
         <div class="project-card__footer">
-          <button
+          <solid-ui-button
             type="button"
-            class="project-card__follow-button flex-center gap-xxs"
+            variant="secondary"
+            size="sm"
+            label="Following"
+            class="project-card__follow-button"
             aria-label="Unfollow project"
             @click=${handleUnfollow}
           >
-            <span>${checkMarkIcon} Following</span>
-          </button>
+            <span class="project-card__follow-label project-card__follow-label--default">${checkMarkIcon} Following</span>
+            <span class="project-card__follow-label project-card__follow-label--hover">Unfollow</span>
+            <span class="project-card__follow-label project-card__follow-label--loading">${createSpinner()}<span>Unfollowing...</span></span>
+          </solid-ui-button>
         </div>
       ` : html``}
     </li>
@@ -139,14 +185,16 @@ function renderOwnerEmptyProjectsContent(
   const projectDetails: ProjectDetails[] = projectData
 
   return html`
-    <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty projects section">
+    <div class="profile__empty-state-content" role="group" aria-label="Empty projects section">
       <h2 id="projects-heading" tabindex="-1">${projectsHeadingText}</h2>
       <p class="profile__empty-state-message">
         You haven't added any projects yet. Consider adding a project to boost your profile.
       </p>
     </div>
-    <button
+    <solid-ui-button
       type="button"
+      variant="secondary"
+      size="sm"
       class="profile__action-button--empty"
       aria-label="Add project details"
       @click=${(event: Event) => {
@@ -161,7 +209,7 @@ function renderOwnerEmptyProjectsContent(
       }}
     >
       <span class="profile__action-icon" aria-hidden="true">${plusDarkIcon} Add Project</span>
-    </button>
+    </solid-ui-button>
 
   `
 }
@@ -177,11 +225,31 @@ function renderOwnerEmptyProjectSection(
     <section 
       aria-labelledby="projects-heading" 
       data-profile-section="projects"
-      class="profile__section--empty border-lighter flex-column-center rounded-md gap-lg" 
+      class="profile__section--empty profile__section--empty-main profile-section-collapsible profile-section-collapsible--inline-mobile-actions profile-section-collapsible--empty-mobile-no-edit" 
       role="region"
       tabindex="-1"
+      data-expanded="false"
     >
-      ${renderOwnerEmptyProjectsContent(store, subject, projectData, viewerMode, onSaved)}
+      <header class="profile__section-header profile-section-collapsible__header">
+        <h2 id="projects-heading" tabindex="-1">${projectsHeadingText}</h2>
+        <div class="profile-section-collapsible__actions">
+          <solid-ui-button
+            type="button"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
+            aria-label="Toggle projects section"
+            aria-controls="projects-panel"
+            aria-expanded="false"
+            @click=${toggleCollapsibleSection}
+          >
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
+        </div>
+      </header>
+      <div id="projects-panel" class="profile-section-collapsible__content">
+        ${renderOwnerEmptyProjectsContent(store, subject, projectData, viewerMode, onSaved)}
+      </div>
     </section>
   `
 }
@@ -210,7 +278,8 @@ function renderProjectSectionDefault(
 
   return html`
       <section
-        class="profile__section border-lighter profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+        class="profile__section profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+        data-profile-section="projects"
         aria-labelledby="projects-heading"
         role="region"
         tabindex="-1"
@@ -219,36 +288,40 @@ function renderProjectSectionDefault(
       >
         <header class="profile__section-header profile-section-collapsible__header">
           <h2 id="projects-heading">${projectsHeadingText}</h2>
-          <div class="profile-section-collapsible__actions flex-column">
+          <div class="profile-section-collapsible__actions">
             ${isOwner ? html`
-              <button
+              <solid-ui-button
                 type="button"
-                class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+                variant="secondary"
+                size="sm"
+                class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
                 aria-label="Add or edit projects"
                 @click=${(event: Event) => {
                   return createProjectsEditDialog(event, store, subject, projects, viewerMode, onSaved)
                 }}
               >
-                <span class="profile-section-collapsible__edit-label profile__add-more-content inline-flex-row">
-                  <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-                  Add More
+                <span class="profile-section-collapsible__edit-label profile__add-more-content">
+                  <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+                  <span>Add More</span>
                 </span>
-                <span class="profile-section-collapsible__edit-icon profile-section-collapsible__edit-icon--add profile-section-collapsible__edit-icon--projects" aria-hidden="true">${plusDarkIcon}</span>
-              </button>
+                <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
+              </solid-ui-button>
             ` : html``}
-            <button
+            <solid-ui-button
               type="button"
-              class="inline-flex-row"
+              variant="icon"
+              size="sm"
+              class="profile-section-collapsible__toggle-button"
               aria-label="Toggle projects section"
               aria-controls="projects-panel"
               aria-expanded="false"
               @click=${toggleCollapsibleSection}
             >
-              <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-            </button>
+              <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+            </solid-ui-button>
           </div>
         </header>
-        <div id="projects-panel" class="profile-section-collapsible__content" aria-hidden="true">
+        <div id="projects-panel" class="profile-section-collapsible__content">
           ${hasProjects
             ? html`
                 <ul id="projects-rail" class="project-card__rail" role="list" aria-label="Known projects">
@@ -262,8 +335,11 @@ function renderProjectSectionDefault(
                 </ul>
                 ${hiddenProjectsCount > 0
                   ? html`
-                      <button
+                      <solid-ui-button
                         type="button"
+                        variant="secondary"
+                        size="sm"
+                        label="View More"
                         class="project-card__more-button"
                         aria-controls="projects-rail"
                         aria-expanded="false"
@@ -272,9 +348,18 @@ function renderProjectSectionDefault(
                       >
                         <span class="project-card__more-icon" aria-hidden="true">${twoDownArrowsIcon}</span>
                         <span class="project-card__more-label">View More</span>
-                      </button>
+                      </solid-ui-button>
                     `
                   : html``}
+                <div
+                  class="profile-section-inline-error"
+                  role="alert"
+                  aria-live="assertive"
+                  aria-atomic="true"
+                  aria-hidden="true"
+                  tabindex="-1"
+                  hidden
+                ></div>
               `
             : html`<p>No projects added yet.</p>`}
         </div>
diff --git a/src/sections/projects/mutations.ts b/src/sections/projects/mutations.ts
index 32487cd4..77a56285 100644
--- a/src/sections/projects/mutations.ts
+++ b/src/sections/projects/mutations.ts
@@ -1,11 +1,19 @@
-import { LiveStore, NamedNode, st, sym } from 'rdflib'
+import { LiveStore, NamedNode, Node, st, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { ProjectMutationPlan, ProjectRow } from './types'
-import { MutationOps } from '../shared/types'
+import { MutationOps, RdfStatement } from '../shared/types'
+import {
+	isRdfListNode,
+	projectUrlFromCommunityNode,
+	expandCommunityNodes
+} from '../shared/projectCommunityNodes'
+import {
+	projectsMutationSaveFailedDebugText,
+	saveProjectsUpdatesFailedMessageText
+} from '../../texts'
+import { runUpdateTransport } from '../shared/rdfMutationHelpers'
+import { error as debugError } from '../../utils/debug'
 
-/* This code is AI generated from Model: GPT-5.3-Codex */
-/* Prompt: I need to store Project data only the url of the project how
-   should I store it please generate the code. Follow other sections */
 function toProjectUrlNode(project: ProjectRow): NamedNode | null {
 	const value = (project.url || '').trim()
 	if (!value) return null
@@ -28,192 +36,157 @@ function normalizeProjectUrlKey(value: string): string {
 	}
 }
 
-function isPatchFailure(message: string): boolean {
-	const text = (message || '').toLowerCase()
-	return (
-		text.includes(' on patch ') ||
-		text.includes('web error: 500') ||
-		text.includes('web error: 501') ||
-		text.includes('web error: 405') ||
-		text.includes('web error: 400')
-	)
-}
+function collectListChainNodes(store: LiveStore, listHead: unknown, doc: NamedNode): Node[] {
+	if (!store.any(listHead as NamedNode, ns.rdf('first'), null, doc)) return []
 
-function isMissingGetRecordError(message: string): boolean {
-	return (message || '').toLowerCase().includes('no record of our http get request for document')
-}
+	const visited = new Set<string>()
+	const nodes: Node[] = []
+	let current = listHead as Node | null
 
-function statementKey(statement: any): string {
-	return `${statement.subject?.toNT?.() || statement.subject?.value} ${statement.predicate?.toNT?.() || statement.predicate?.value} ${statement.object?.toNT?.() || statement.object?.value} ${statement.why?.toNT?.() || statement.why?.value}`
-}
+	while (current) {
+		const key = `${current.termType}:${current.value}`
+		if (visited.has(key)) break
+		visited.add(key)
+		nodes.push(current)
+
+		const rest = store.any(current as NamedNode, ns.rdf('rest'), null, doc) as Node | null
+		if (!rest || (rest.termType === 'NamedNode' && rest.value === ns.rdf('nil').value)) {
+			break
+		}
+		current = rest
+	}
 
-function sanitizePatchStatements(store: LiveStore, deletions: any[], insertions: any[]) {
-	const safeDeletions = Array.from(new Map(
-		(deletions || [])
-			.filter((statement) => {
-				if (!statement || !statement.subject || !statement.predicate || !statement.object) return false
-				return store.holds(statement.subject, statement.predicate, statement.object, statement.why)
-			})
-			.map((statement) => [statementKey(statement), statement])
-	).values())
-
-	const safeInsertions = Array.from(new Map(
-		(insertions || [])
-			.filter((statement) => Boolean(statement && statement.subject && statement.predicate && statement.object))
-			.map((statement) => [statementKey(statement), statement])
-	).values())
-
-	return { safeDeletions, safeInsertions }
+	return nodes
 }
 
-async function runPutFallback(store: LiveStore, doc: NamedNode, deletions: any[], insertions: any[]) {
-	const updater = store.updater as any
-	const fetcher = (store as any).fetcher
+function collectCommunityCleanupStatements(store: LiveStore, statement: RdfStatement, fallbackDoc: NamedNode): RdfStatement[] {
+	const doc = (statement.why as NamedNode | null) || fallbackDoc
+	const cleanup = [st(statement.subject, statement.predicate, statement.object, doc)]
+	const objectNode = statement.object
 
-	if (!updater || typeof updater.serialize !== 'function' || !fetcher || typeof fetcher.webOperation !== 'function') {
-		throw new Error('Project updates are not supported by this store updater.')
+	if (isRdfListNode(store, objectNode, doc)) {
+		collectListChainNodes(store, objectNode, doc).forEach((listNode) => {
+			cleanup.push(...store.statementsMatching(listNode as NamedNode, null, null, doc))
+		})
+		return cleanup
 	}
 
-	const currentStatements = store.statementsMatching(undefined, undefined, undefined, doc).slice()
-	const deletionKeys = new Set((deletions || []).map((statement) => statementKey(statement)))
-	const nextStatements = currentStatements.filter((statement) => !deletionKeys.has(statementKey(statement))).concat(insertions || [])
-
-	const contentType = 'text/turtle'
-	const body = updater.serialize(doc.value, nextStatements, contentType)
-	const response = await fetcher.webOperation('PUT', doc.value, {
-		noMeta: true,
-		contentType,
-		body
-	})
-
-	if (!response || response.ok !== true) {
-		const status = response?.status || 'unknown'
-		throw new Error(`Web error: ${status} on PUT of <${doc.value}>`)
+	if (objectNode.termType === 'BlankNode') {
+		cleanup.push(...store.statementsMatching(objectNode as unknown as NamedNode, null, null, doc))
 	}
 
-	store.remove(deletions)
-	insertions.forEach((statement) => {
-		store.add(statement.subject, statement.predicate, statement.object, statement.why)
-	})
+	return cleanup
 }
 
-async function runUpdateWithDavFallback(store: LiveStore, doc: NamedNode, deletions: any[], insertions: any[]) {
-	const updater = store.updater as any
-	if (!updater || typeof updater.update !== 'function') {
-		throw new Error('Project updates are not supported by this store updater.')
+async function mutateProjectEntries(store: LiveStore, subject: NamedNode, projectOps: MutationOps<ProjectRow>) {
+	const doc = subject.doc()
+	type DocBatch = {
+		doc: NamedNode
+		cleanupStatements: RdfStatement[]
+		currentUrlsByKey: Map<string, string>
 	}
 
-	const { safeDeletions, safeInsertions } = sanitizePatchStatements(store, deletions, insertions)
-	if (safeDeletions.length === 0 && safeInsertions.length === 0) {
-		return
+	const existingLinks = store.statementsMatching(subject, ns.solid('community'), null, null)
+	const batchesByDoc = new Map<string, DocBatch>()
+	const docKeyByUrl = new Map<string, string>()
+	const touchedDocs = new Set<string>()
+
+	const getDocBatch = (targetDoc: NamedNode) => {
+		const existing = batchesByDoc.get(targetDoc.value)
+		if (existing) return existing
+		const next: DocBatch = { doc: targetDoc, cleanupStatements: [], currentUrlsByKey: new Map() }
+		batchesByDoc.set(targetDoc.value, next)
+		return next
 	}
 
-	const tryUpdate = () => new Promise<void>((resolve, reject) => {
-		updater.update(safeDeletions, safeInsertions, (_uri: string, ok: boolean, message?: string) => {
-			if (ok === true) {
-				resolve()
-				return
-			}
-			reject(new Error(message || 'Failed to save projects'))
-		})
-	})
+	existingLinks.forEach((statement) => {
+		const targetDoc = (statement.why as NamedNode | null) || doc
+		const batch = getDocBatch(targetDoc)
+		batch.cleanupStatements.push(...collectCommunityCleanupStatements(store, statement as RdfStatement, doc))
 
-	try {
-		await tryUpdate()
-		return
-	} catch (error) {
-		const message = error instanceof Error ? error.message : String(error)
-		if (!isPatchFailure(message) || typeof updater.updateDav !== 'function') {
-			throw error
-		}
+		const objectNode = statement.object
+		const communityNodes = expandCommunityNodes(store, objectNode as Node, targetDoc)
 
-		if (store.fetcher && typeof (store.fetcher as any).load === 'function') {
-			try {
-				await (store.fetcher as any).load(doc)
-			} catch {
-				// continue to fallback
-			}
-		}
+		communityNodes.forEach((communityNode) => {
+			const url = projectUrlFromCommunityNode(communityNode, store)
+			const key = normalizeProjectUrlKey(url)
+			if (!key || docKeyByUrl.has(key)) return
+			docKeyByUrl.set(key, targetDoc.value)
+			batch.currentUrlsByKey.set(key, url)
+		})
+	})
 
-		try {
-			await new Promise<void>((resolve, reject) => {
-				updater.updateDav(doc, safeDeletions, safeInsertions, (_uri: string, ok: boolean, body?: string) => {
-					if (ok === true) {
-						resolve()
-						return
-					}
-					reject(new Error(body || message || 'Failed to save projects'))
-				})
-			})
-		} catch (davError) {
-			const davMessage = davError instanceof Error ? davError.message : String(davError)
-			if (!isMissingGetRecordError(davMessage)) {
-				throw davError
-			}
-			await runPutFallback(store, doc, safeDeletions, safeInsertions)
-		}
+	const ensureDocTouched = (docKey: string) => {
+		touchedDocs.add(docKey)
 	}
-}
-
-async function mutateProjectEntries(store: LiveStore, subject: NamedNode, projectOps: MutationOps<ProjectRow>) {
-	const doc = subject.doc()
-	const existingLinks = store.each(subject, ns.solid('community'), null, doc)
-	const existingByUrl = new Map<string, NamedNode>()
-	existingLinks.forEach((linkNode: any) => {
-		if (!linkNode || linkNode.termType !== 'NamedNode') return
-		const key = normalizeProjectUrlKey(linkNode.value)
-		if (key && !existingByUrl.has(key)) {
-			existingByUrl.set(key, linkNode as NamedNode)
-		}
-	})
 
-	const deletions: any[] = []
-	const insertions: any[] = []
-	const removeLink = (link: NamedNode) => {
-		deletions.push(st(subject, ns.solid('community'), link, doc))
+	const removeExistingUrl = (key: string) => {
+		const targetDocKey = docKeyByUrl.get(key)
+		if (!targetDocKey) return null
+		const batch = batchesByDoc.get(targetDocKey)
+		if (!batch) return null
+		batch.currentUrlsByKey.delete(key)
+		docKeyByUrl.delete(key)
+		ensureDocTouched(targetDocKey)
+		return batch.doc
 	}
-	const addLink = (link: NamedNode) => {
-		insertions.push(st(subject, ns.solid('community'), link, doc))
+
+	const addUrlToDoc = (targetDoc: NamedNode, url: string) => {
+		const key = normalizeProjectUrlKey(url)
+		if (!key || docKeyByUrl.has(key)) return
+		const batch = getDocBatch(targetDoc)
+		batch.currentUrlsByKey.set(key, url)
+		docKeyByUrl.set(key, targetDoc.value)
+		ensureDocTouched(targetDoc.value)
 	}
 
 	projectOps.remove.forEach((project) => {
 		const entryKey = normalizeProjectUrlKey(project.entryNode || '')
 		const urlKey = normalizeProjectUrlKey(project.url)
-		const existing = (entryKey && existingByUrl.get(entryKey)) || (urlKey && existingByUrl.get(urlKey))
-		if (existing) removeLink(existing)
+		if (entryKey) {
+			removeExistingUrl(entryKey)
+			return
+		}
+		if (urlKey) {
+			removeExistingUrl(urlKey)
+		}
 	})
 
 	projectOps.update.forEach((project) => {
 		const newLink = toProjectUrlNode(project)
-		const urlKey = normalizeProjectUrlKey(project.url)
 		const entryKey = normalizeProjectUrlKey(project.entryNode || '')
-		const existing = (entryKey && existingByUrl.get(entryKey)) || (urlKey && existingByUrl.get(urlKey))
-		if (existing) removeLink(existing)
-		if (newLink) addLink(newLink)
+		const urlKey = normalizeProjectUrlKey(project.url)
+		const removedDoc = (entryKey && removeExistingUrl(entryKey)) || (urlKey && removeExistingUrl(urlKey)) || doc
+		if (newLink) {
+			addUrlToDoc(removedDoc, newLink.value)
+		}
 	})
 
-	const seenCreateUrlKeys = new Set<string>()
 	projectOps.create.forEach((project) => {
-		const urlKey = normalizeProjectUrlKey(project.url)
-		if (urlKey && (existingByUrl.has(urlKey) || seenCreateUrlKeys.has(urlKey))) {
-			return
-		}
 		const newLink = toProjectUrlNode(project)
 		if (!newLink) return
-		addLink(newLink)
-		if (urlKey) {
-			seenCreateUrlKeys.add(urlKey)
-		}
+		addUrlToDoc(doc, newLink.value)
 	})
 
-	await runUpdateWithDavFallback(store, doc, deletions, insertions)
+	for (const docKey of touchedDocs) {
+		const batch = batchesByDoc.get(docKey)
+		if (!batch) continue
+		const insertions = Array.from(batch.currentUrlsByKey.values()).map((url) => st(subject, ns.solid('community'), sym(url), batch.doc))
+		await runUpdateTransport(store, batch.doc, batch.cleanupStatements, insertions, {
+			unsupportedMessage: 'Project updates are not supported by this store updater.',
+			failureMessage: 'Failed to save projects',
+			useDavFallback: true,
+			usePutFallback: true
+		})
+	}
 }
 
 export async function processProjectsMutations(store: LiveStore, subject: NamedNode, mutationPlan: ProjectMutationPlan) {
 	try {
 		await mutateProjectEntries(store, subject, mutationPlan)
-	} catch (error) {
-		const message = error instanceof Error ? error.message : String(error)
-		throw new Error(`Failed to save projects: ${message}`)
+	} catch (err) {
+		const rootError = err instanceof Error ? err : new Error(String(err))
+		debugError(projectsMutationSaveFailedDebugText, rootError)
+		throw new Error(saveProjectsUpdatesFailedMessageText, { cause: rootError })
 	}
 }
diff --git a/src/sections/projects/selectors.ts b/src/sections/projects/selectors.ts
index 259f53a4..a9225149 100644
--- a/src/sections/projects/selectors.ts
+++ b/src/sections/projects/selectors.ts
@@ -1,27 +1,17 @@
 import { LiveStore, NamedNode, Node, sym } from 'rdflib'
 import { ns, utils, widgets } from 'solid-ui'
 import { ProjectDetails } from './types'
-import { expandRdfList } from '../shared/rdfList'
+import {
+  expandCommunityNodes,
+  linkedProjectNodeFromCommunityNode
+} from '../shared/projectCommunityNodes'
 
-/* The following functions communityNodesForSubject and ensureProjectDocumentsLoaded 
-   and a few updates in presentProjects are generated by AI Model: GPT-5.3-Codex */
-/* Prompt: Image and business type are not displaying, could it be that I didn't load
-  the document? */
 function communityNodesForSubject(subject: NamedNode, store: LiveStore, doc: NamedNode): Node[] {
   const inProfileDoc = store.each(subject, ns.solid('community'), null, doc) as Node[]
   const inAnyDoc = store.each(subject, ns.solid('community'), null, null) as Node[]
   const rawNodes = [...inProfileDoc, ...inAnyDoc]
 
-  const expandedNodes = rawNodes.flatMap((node) => {
-    const hasCollectionElements = Array.isArray((node as any)?.elements)
-    const isListByTriples =
-      (node.termType === 'BlankNode' || node.termType === 'NamedNode') &&
-      Boolean(store.any(node as NamedNode, ns.rdf('first')))
-
-    return hasCollectionElements || isListByTriples
-      ? expandRdfList(store, node)
-      : [node]
-  })
+  const expandedNodes = rawNodes.flatMap((node) => expandCommunityNodes(store, node, doc))
 
   const seen = new Set<string>()
   const nodes: Node[] = []
@@ -50,53 +40,6 @@ function clearStaleRequestedState(fetcher: any, docUrl: string): unknown {
   return previous
 }
 
-function linkedProjectNodeFromCommunityNode(node: Node, store: LiveStore): NamedNode | null {
-  if (!node) return null
-  if (node.termType === 'NamedNode') return node as NamedNode
-  if (node.termType === 'Literal') {
-    try {
-      return sym(node.value)
-    } catch {
-      return null
-    }
-  }
-  if (node.termType !== 'BlankNode') return null
-
-  const candidatePredicates = [
-    ns.solid('publicId'),
-    ns.schema('url'),
-    ns.foaf('homepage'),
-    ns.rdfs('seeAlso'),
-    ns.schema('sameAs'),
-    ns.schema('mainEntityOfPage')
-  ]
-
-  for (const predicate of candidatePredicates) {
-    const linked = store.any(node as NamedNode, predicate) as Node | null
-    if (!linked?.value) continue
-
-    if (linked.termType === 'NamedNode') {
-      return linked as NamedNode
-    }
-
-    if (linked.termType === 'Literal') {
-      try {
-        return sym(linked.value)
-      } catch {
-        // Keep trying the next predicate.
-      }
-    }
-  }
-
-  const outgoing = store.statementsMatching(node as NamedNode, null, null, null)
-  const firstNamedNode = outgoing.find((statement) => statement.object.termType === 'NamedNode')
-  if (firstNamedNode?.object?.value) {
-    return firstNamedNode.object as NamedNode
-  }
-
-  return null
-}
-
 export async function ensureProjectDocumentsLoaded(subject: NamedNode, store: LiveStore): Promise<void> {
   const profileDoc = subject.doc()
   const fetcher = (store as any)?.fetcher
diff --git a/src/QRCodeCard.ts b/src/sections/qrcode/QRCodeCard.ts
similarity index 73%
rename from src/QRCodeCard.ts
rename to src/sections/qrcode/QRCodeCard.ts
index 89e2640a..6587c306 100644
--- a/src/QRCodeCard.ts
+++ b/src/sections/qrcode/QRCodeCard.ts
@@ -1,8 +1,9 @@
 import { html, TemplateResult } from 'lit-html'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ns, utils } from 'solid-ui'
-import './styles/QRCodeCard.css'
-import { scanQrToConnectText } from './texts'
+import { error as debugError } from '../../utils/debug'
+import * as qrcode from 'qrcode'
+import { scanQrToConnectText } from '../../texts'
 /* Part of this code was generated by AI Model: GPT-5.3-Codex */
 /* Prompt: The QRCode has a label "link to profile" but it should
  be a VCARD with name, and link to profile. So when you scan it 
@@ -96,6 +97,57 @@ function firstContactValue(
   return ''
 }
 
+const qrCodeRenderOptions = {
+  type: 'svg' as const,
+  color: {
+    dark: '#000000',
+    light: '#ffffff'
+  }
+}
+
+function renderQRCodeSvg(value: string): Promise<string> {
+  return new Promise((resolve, reject) => {
+    qrcode.toString(value, qrCodeRenderOptions, (error, svg) => {
+      if (error) {
+        reject(error)
+        return
+      }
+
+      resolve(svg)
+    })
+  })
+}
+
+export async function hydrateQRCodeElement(QRCodeElement: HTMLElement): Promise<void> {
+  const value = QRCodeElement.getAttribute('data-value')
+  if (!value) {
+    debugError('QRCode data-value missing')
+    return
+  }
+
+  const imageContainer = QRCodeElement.querySelector('.qrcode-card__image') as HTMLElement | null
+  if (!imageContainer) {
+    debugError('QRCode image container missing')
+    return
+  }
+
+  try {
+    imageContainer.innerHTML = await renderQRCodeSvg(value)
+  } catch (error) {
+    debugError('QRcode error!', error)
+  }
+}
+
+export async function hydrateQRCodes(root: ParentNode): Promise<void> {
+  const QRCodeElements = Array.from(root.querySelectorAll('.qrcode-card')) as HTMLElement[]
+  if (!QRCodeElements.length) {
+    debugError('QRCode Ele missing')
+    return
+  }
+
+  await Promise.all(QRCodeElements.map((element) => hydrateQRCodeElement(element)))
+}
+
 export const QRCodeCard = (
   arg1: LegacySubjectArg,
   arg2?: unknown,
@@ -134,23 +186,24 @@ export const QRCodeCard = (
   vCardLines.push('END:VCARD')
   const vCard = vCardLines.join('\r\n')
 
-  // console.log(`@@ qrcodes colours highlightColor ${highlightColor}, backgroundColor ${backgroundColor}`)
-  
-   
   return html`
     <figure 
-      class="qrcode-card flex-column-center"
+      class="qrcode-card"
       data-value="${vCard}"
       data-testid="qrcode-card"
       aria-labelledby="qr-code-caption"
       role="img"
       aria-describedby="qr-code-description"
     >
-      <div 
-        aria-label="Static QR code containing contact information for ${name}"
-        role="img"
-        tabindex="0"
-      ></div>
+      <div class="qrcode-card__frame">
+        <div 
+          class="qrcode-card__image"
+          aria-label="Static QR code containing contact information for ${name}"
+          role="img"
+          tabindex="0"
+        >
+        </div>
+      </div>
       <figcaption 
         id="qr-code-caption" 
         class="qrcode-card__caption"
diff --git a/src/sections/qrcode/QRCodeSection.css b/src/sections/qrcode/QRCodeSection.css
new file mode 100644
index 00000000..31ff7702
--- /dev/null
+++ b/src/sections/qrcode/QRCodeSection.css
@@ -0,0 +1,108 @@
+/* QR code section styles. */
+
+.profile__qr-code {
+  --qrcode-card-gap: var(--spacing-md, 1.25rem);
+  --qrcode-card-caption-color: var(--color-text-strong-secondary, var(--gray-800, #1E2939));
+  --qrcode-card-caption-size: var(--font-size-md, 1rem);
+  --qrcode-card-caption-size-compact: var(--font-size-sm, 0.875rem);
+  --qrcode-card-caption-weight: var(--font-weight-md, 500);
+  --qrcode-card-image-padding-top: 1rem;
+  --qrcode-card-image-padding-right: 1rem;
+  --qrcode-card-image-padding-bottom: 1.0625rem;
+  --qrcode-card-image-padding-left: 1.0625rem;
+  --qrcode-card-frame-border: var(--border-width-thin, 0.1rem) solid var(--color-border, var(--gray-200, #E5E7EB));
+  --qrcode-card-frame-background: var(--color-surface-framed-content, #F3F4F6);
+  --qrcode-section-padding-compact: var(--spacing-sm, 0.938rem);
+  --qrcode-section-gap-compact: var(--spacing-2xs, 0.625rem);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  background: var(--color-card-bg, var(--white, #FFF));
+  border: var(--border-width-thin, 0.1rem) solid var(--color-border-lighter, #E2E8F0);
+}
+
+/* Caption */
+.qrcode-card__caption {
+  text-align: center;
+  margin: 0;
+  color: var(--qrcode-card-caption-color);
+  font-size: var(--qrcode-card-caption-size);
+  font-weight: var(--qrcode-card-caption-weight);
+}
+
+/* Card and frame */
+.qrcode-card {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--qrcode-card-gap);
+  align-self: stretch;
+}
+
+.qrcode-card__frame {
+  margin: 0;
+  padding:
+    var(--qrcode-card-image-padding-top)
+    var(--qrcode-card-image-padding-right)
+    var(--qrcode-card-image-padding-bottom)
+    var(--qrcode-card-image-padding-left);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  border: var(--qrcode-card-frame-border);
+  background: var(--qrcode-card-frame-background);
+}
+
+/* QR image */
+.qrcode-card__image {
+  flex-shrink: 0;
+  aspect-ratio: 1/1;
+}
+
+.qrcode-card__image svg {
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+
+/* Compact layout */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__qr-code {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  align-self: stretch;
+  padding: var(--qrcode-section-padding-compact);
+  gap: var(--qrcode-section-gap-compact);
+}
+
+@container profile-pane (max-width: 576px) {
+  .profile__qr-code {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    align-self: stretch;
+    padding: var(--qrcode-section-padding-compact);
+    gap: var(--qrcode-section-gap-compact);
+  }
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .qrcode-card__caption {
+  font-size: var(--qrcode-card-caption-size-compact);
+}
+
+@media (max-width: 576px) {
+  .profile__qr-code {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    align-self: stretch;
+    padding: var(--qrcode-section-padding-compact);
+    gap: var(--qrcode-section-gap-compact);
+  }
+
+  .qrcode-card__caption {
+    font-size: var(--qrcode-card-caption-size-compact);
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .qrcode-card__caption {
+    font-size: var(--qrcode-card-caption-size-compact);
+  }
+}
\ No newline at end of file
diff --git a/src/sections/qrcode/QRCodeSection.ts b/src/sections/qrcode/QRCodeSection.ts
new file mode 100644
index 00000000..b79a84a2
--- /dev/null
+++ b/src/sections/qrcode/QRCodeSection.ts
@@ -0,0 +1,13 @@
+import { html } from 'lit-html'
+import { QRCodeCard } from './QRCodeCard'
+import { LiveStore, NamedNode } from 'rdflib'
+import './QRCodeSection.css'
+
+export function renderQRCodeSection(subject: NamedNode, store: LiveStore) {
+  return html`
+      <section class="profile__section profile__qr-code" data-profile-section="qr-code" aria-labelledby="qr-heading" tabindex="-1">
+        <h3 id="qr-heading" class="sr-only">QR code</h3>
+        ${QRCodeCard(subject, store)}
+      </section>
+  `
+}
diff --git a/src/sections/resume/ResumeEditDialog.ts b/src/sections/resume/ResumeEditDialog.ts
index 588b6f75..3b26af26 100644
--- a/src/sections/resume/ResumeEditDialog.ts
+++ b/src/sections/resume/ResumeEditDialog.ts
@@ -1,8 +1,11 @@
 import { alertDialog, openInputDialog } from '../../ui/dialog'
 import { html, render } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import 'solid-ui/components/forms/combobox'
+import 'solid-ui/components/forms/select'
 import { RoleDetails, ResumeRow } from './types'
 import '../../styles/EditDialogs.css'
-import '../../styles/ContactInfoEditDialog.css'
+import '../contactInfo/ContactInfoEditDialog.css'
 import { LiveStore, NamedNode, literal } from 'rdflib'
 import { processResumeMutations } from './mutations'
 import { ViewerMode } from '../../types'
@@ -16,7 +19,7 @@ import {
   dialogSubmitLabelText,
   editResumeDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveResumeUpdatesFailedPrefixText
+  saveResumeUpdatesFailedMessageText
 } from '../../texts'
 
 type ResumeFormState = {
@@ -28,10 +31,398 @@ type ResumeValidationResult = {
   message?: string
 }
 
+type ResumeOrganizationTypeOption = {
+  label: string
+  value: string
+}
+
+type ResumeOrganizationSuggestion = {
+  label: string
+  publicId: string
+}
+
+type ResumeOrganizationComboboxOption = {
+  label: string
+  value: string
+  publicId?: string
+}
+
+type ResumeOrganizationComboboxElement = HTMLElement & {
+  suggestionProvider?: (query: string) => Promise<ResumeOrganizationComboboxOption[]>
+  options?: ResumeOrganizationComboboxOption[]
+  value?: string
+  inputValue?: string
+  label?: string
+  placeholder?: string
+}
+
+type ResumeFocusableElement = HTMLElement & {
+  _closePopup?: () => void
+}
+
+type ResumeDateSelectKind = 'start-month' | 'start-year' | 'end-month' | 'end-year'
+
+type ResumeOrganizationTypeSelectElement = HTMLElement & {
+  options?: ResumeOrganizationTypeOption[]
+  value?: string
+  label?: string
+}
+
+const RESUME_ORGANIZATION_TYPE_OPTIONS: ResumeOrganizationTypeOption[] = [
+  { label: 'Corporation', value: 'Corporation' },
+  { label: 'Educational Organization', value: 'EducationalOrganization' },
+  { label: 'Research Organization', value: 'ResearchOrganization' },
+  { label: 'Government Organization', value: 'GovernmentOrganization' },
+  { label: 'NGO', value: 'NGO' },
+  { label: 'Performing Group', value: 'PerformingGroup' },
+  { label: 'Project', value: 'Project' },
+  { label: 'Sports Organization', value: 'SportsOrganization' },
+  { label: 'Other', value: 'Other' }
+]
+
+const RESUME_MONTH_OPTIONS: ResumeOrganizationTypeOption[] = [
+  { value: '01', label: 'January' },
+  { value: '02', label: 'February' },
+  { value: '03', label: 'March' },
+  { value: '04', label: 'April' },
+  { value: '05', label: 'May' },
+  { value: '06', label: 'June' },
+  { value: '07', label: 'July' },
+  { value: '08', label: 'August' },
+  { value: '09', label: 'September' },
+  { value: '10', label: 'October' },
+  { value: '11', label: 'November' },
+  { value: '12', label: 'December' }
+]
+
+const WIKIDATA_ORGANIZATION_SEARCH_URI = 'https://www.wikidata.org/w/api.php?action=wbsearchentities&language=$(language)&type=item&limit=$(limit)&format=json&origin=*&search=$(name)'
+const WIKIDATA_ENTITY_LOOKUP_URI = 'https://www.wikidata.org/w/api.php?action=wbgetentities&format=json&origin=*&props=claims&ids=$(ids)'
+const WIKIDATA_ORGANIZATION_SEARCH_LANGUAGE = 'en'
+const WIKIDATA_ORGANIZATION_SEARCH_LIMIT = 8
+const WIKIDATA_ORGANIZATION_SEARCH_CANDIDATE_LIMIT = 24
+
+const RESUME_ORGANIZATION_TYPE_WIKIDATA_CLASS_URIS: Record<string, string[]> = {
+  Corporation: ['http://www.wikidata.org/entity/Q6881511', 'http://www.wikidata.org/entity/Q4830453'],
+  EducationalOrganization: ['http://www.wikidata.org/entity/Q178706', 'http://www.wikidata.org/entity/Q2385804', 'http://www.wikidata.org/entity/Q1664720'],
+  ResearchOrganization: ['http://www.wikidata.org/entity/Q31855'],
+  GovernmentOrganization: ['http://www.wikidata.org/entity/Q327333'],
+  NGO: ['http://www.wikidata.org/entity/Q163740', 'http://www.wikidata.org/entity/Q79913', 'http://www.wikidata.org/entity/Q708676'],
+  PerformingGroup: ['http://www.wikidata.org/entity/Q32178211'],
+  Project: ['http://www.wikidata.org/entity/Q170584'],
+  SportsOrganization: ['http://www.wikidata.org/entity/Q4438121'],
+  Other: ['http://www.wikidata.org/entity/Q43229']
+}
+
+const RESUME_ORGANIZATION_SEARCH_CLASS_URIS = Array.from(
+  new Set(
+    RESUME_ORGANIZATION_TYPE_OPTIONS.flatMap(
+      (option) => RESUME_ORGANIZATION_TYPE_WIKIDATA_CLASS_URIS[option.value] || []
+    )
+  )
+)
+
+const RESUME_PRESENT_MONTH_VALUE = '__present__'
+
 function sanitizeResumeFieldValue(value: string): string {
   return sanitizeTextValue(value)
 }
 
+function normalizeResumeOrganizationPublicId(value: string): string {
+  return sanitizeResumeFieldValue(value)
+}
+
+type WikidataSearchResult = {
+  id?: string
+  label?: string
+  match?: { text?: string }
+  concepturi?: string
+  url?: string
+}
+
+type WikidataEntity = {
+  claims?: Record<string, Array<{
+    mainsnak?: {
+      snaktype?: string
+      datavalue?: {
+        value?: { id?: string }
+      }
+    }
+  }>>
+}
+
+function buildWikidataOrganizationSearchUrl(name: string): string {
+  return WIKIDATA_ORGANIZATION_SEARCH_URI
+    .replace('$(language)', encodeURIComponent(WIKIDATA_ORGANIZATION_SEARCH_LANGUAGE))
+    .replace('$(limit)', encodeURIComponent(String(WIKIDATA_ORGANIZATION_SEARCH_CANDIDATE_LIMIT)))
+    .replace('$(name)', encodeURIComponent(name))
+}
+
+function buildWikidataEntityLookupUrl(ids: string[]): string {
+  return WIKIDATA_ENTITY_LOOKUP_URI.replace('$(ids)', encodeURIComponent(ids.join('|')))
+}
+
+function getWikidataIdFromUri(value: string): string {
+  const trimmed = sanitizeResumeFieldValue(value)
+  const match = trimmed.match(/Q\d+/)
+  return match ? match[0] : ''
+}
+
+function getWikidataClaimIds(entity: WikidataEntity | undefined, property: 'P31' | 'P279'): string[] {
+  const claims = entity?.claims?.[property] || []
+
+  return claims
+    .map((claim) => claim?.mainsnak)
+    .filter((snak) => snak?.snaktype === 'value')
+    .map((snak) => snak?.datavalue?.value?.id)
+    .filter((id): id is string => typeof id === 'string' && id.length > 0)
+}
+
+async function fetchWikidataEntities(ids: string[]): Promise<Record<string, WikidataEntity>> {
+  const uniqueIds = Array.from(new Set(ids.filter(Boolean)))
+  if (!uniqueIds.length || typeof fetch !== 'function') return {}
+
+  const response = await fetch(buildWikidataEntityLookupUrl(uniqueIds))
+  if (!response.ok) return {}
+
+  const payload = await response.json() as { entities?: Record<string, WikidataEntity> }
+  return payload?.entities || {}
+}
+
+function entityMatchesAllowedOrganizationTypes(entityId: string, entityMap: Record<string, WikidataEntity>): boolean {
+  const allowedIds = new Set(
+    RESUME_ORGANIZATION_SEARCH_CLASS_URIS.map((uri) => getWikidataIdFromUri(uri))
+  )
+  const visited = new Set<string>()
+  const agenda = [entityId]
+
+  while (agenda.length) {
+    const currentId = agenda.shift()
+    if (!currentId || visited.has(currentId)) continue
+    visited.add(currentId)
+
+    if (allowedIds.has(currentId)) {
+      return true
+    }
+
+    const entity = entityMap[currentId]
+    agenda.push(...getWikidataClaimIds(entity, 'P31'))
+    agenda.push(...getWikidataClaimIds(entity, 'P279'))
+  }
+
+  return false
+}
+
+function toResumeOrganizationLabel(result: any): string {
+  return result?.label || result?.match?.text || result?.id || ''
+}
+
+function toResumeOrganizationSuggestion(result: WikidataSearchResult): ResumeOrganizationSuggestion {
+  const label = sanitizeResumeFieldValue(toResumeOrganizationLabel(result))
+  const publicId = normalizeResumeOrganizationPublicId(
+    typeof result?.concepturi === 'string'
+      ? result.concepturi
+      : typeof result?.url === 'string'
+        ? result.url
+        : ''
+  )
+
+  return { label, publicId }
+}
+
+function dedupeResumeOrganizationSuggestions(
+  suggestions: ResumeOrganizationSuggestion[]
+): ResumeOrganizationSuggestion[] {
+  const seen = new Set<string>()
+
+  return suggestions.filter((suggestion) => {
+    if (!suggestion.label || !suggestion.publicId) return false
+    const key = suggestion.label.toLowerCase()
+    if (seen.has(key)) return false
+    seen.add(key)
+    return true
+  })
+}
+
+async function fetchWikidataOrganizationSuggestions(name: string): Promise<ResumeOrganizationSuggestion[]> {
+  const query = sanitizeResumeFieldValue(name)
+  if (query.length < 2 || typeof fetch !== 'function') return []
+
+  try {
+    const response = await fetch(buildWikidataOrganizationSearchUrl(query))
+    if (!response.ok) return []
+
+    const payload = await response.json() as any
+    const results = Array.isArray(payload?.search) ? payload.search as WikidataSearchResult[] : []
+    const suggestions = dedupeResumeOrganizationSuggestions(
+      results.map((result: WikidataSearchResult) => toResumeOrganizationSuggestion(result))
+    )
+    const resultIds = suggestions
+      .map((suggestion) => getWikidataIdFromUri(suggestion.publicId))
+      .filter(Boolean)
+
+    if (!resultIds.length) {
+      return suggestions.slice(0, WIKIDATA_ORGANIZATION_SEARCH_LIMIT)
+    }
+
+    const resultEntities = await fetchWikidataEntities(resultIds)
+    const relatedIds = Array.from(new Set(
+      Object.values(resultEntities).flatMap((entity) => [
+        ...getWikidataClaimIds(entity, 'P31'),
+        ...getWikidataClaimIds(entity, 'P279')
+      ])
+    ))
+    const relatedEntities = await fetchWikidataEntities(relatedIds)
+    const entityMap = {
+      ...resultEntities,
+      ...relatedEntities
+    }
+
+    if (Object.keys(entityMap).length === 0) {
+      return suggestions.slice(0, WIKIDATA_ORGANIZATION_SEARCH_LIMIT)
+    }
+
+    const filteredSuggestions = suggestions.filter((suggestion) => {
+      const entityId = getWikidataIdFromUri(suggestion.publicId)
+      return entityMatchesAllowedOrganizationTypes(entityId, entityMap)
+    })
+
+    return (filteredSuggestions.length > 0 ? filteredSuggestions : suggestions)
+      .slice(0, WIKIDATA_ORGANIZATION_SEARCH_LIMIT)
+  } catch {
+    return []
+  }
+}
+
+function toResumeOrganizationComboboxOption(suggestion: ResumeOrganizationSuggestion): ResumeOrganizationComboboxOption {
+  return {
+    label: suggestion.label,
+    value: suggestion.publicId,
+    publicId: suggestion.publicId
+  }
+}
+
+function readResumeOrganizationComboboxInputValue(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
+
+  const target = event.target as HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
+
+function readResumeOrganizationComboboxChange(event: Event): ResumeOrganizationComboboxOption | null {
+  const customEvent = event as CustomEvent<{
+    value?: string,
+    label?: string,
+    option?: ResumeOrganizationComboboxOption
+  }>
+
+  if (customEvent.detail?.option) {
+    return customEvent.detail.option
+  }
+
+  return null
+}
+
+function createResumeOrganizationSuggestionProvider(): (query: string) => Promise<ResumeOrganizationComboboxOption[]> {
+  return async (query: string) => {
+    const suggestions = await fetchWikidataOrganizationSuggestions(query)
+    return suggestions.map(toResumeOrganizationComboboxOption)
+  }
+}
+
+function normalizeResumeOrganizationTypeValue(value: string): string {
+  return RESUME_ORGANIZATION_TYPE_OPTIONS.some((option) => option.value === value)
+    ? value
+    : RESUME_ORGANIZATION_TYPE_OPTIONS[0]?.value || ''
+}
+
+function readResumeOrganizationTypeChange(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
+
+  const target = event.target as HTMLSelectElement | HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
+
+function readResumeSelectChange(event: Event): string {
+  return readResumeOrganizationTypeChange(event)
+}
+
+function getResumeYearOptions(selectedYears: string[]): ResumeOrganizationTypeOption[] {
+  const currentYear = new Date().getFullYear()
+  const baseYearOptions = Array.from({ length: 120 }, (_, i) => String(currentYear - i))
+  const yearOptions = Array.from(new Set([
+    ...baseYearOptions,
+    ...selectedYears
+  ].filter(Boolean))).sort((a, b) => Number(b) - Number(a))
+
+  return yearOptions.map((year) => ({ label: year, value: year }))
+}
+
+function getResumeDateSelectOptions(
+  kind: ResumeDateSelectKind,
+  selectedYears: string[],
+  isCurrentRole: boolean
+): ResumeOrganizationTypeOption[] {
+  if (kind === 'start-month') {
+    return RESUME_MONTH_OPTIONS
+  }
+
+  if (kind === 'start-year') {
+    return getResumeYearOptions(selectedYears)
+  }
+
+  if (kind === 'end-month') {
+    if (isCurrentRole) {
+      return [{ value: RESUME_PRESENT_MONTH_VALUE, label: 'Present' }]
+    }
+
+    return RESUME_MONTH_OPTIONS
+  }
+
+  if (kind === 'end-year' && isCurrentRole) {
+    return [{ value: '', label: '' }]
+  }
+
+  return getResumeYearOptions(selectedYears)
+}
+
+function getResumeDateSelectLabel(kind: ResumeDateSelectKind, row: ResumeRow): string {
+  switch (kind) {
+    case 'start-month':
+    case 'end-month':
+      return row?.isCurrentRole && kind === 'end-month' ? 'Present' : 'Select Month'
+    case 'start-year':
+      return 'Select Year'
+    case 'end-year':
+      return row?.isCurrentRole ? '' : 'Select Year'
+    default:
+      return ''
+  }
+}
+
+function getResumeDateSelectValue(kind: ResumeDateSelectKind, row: ResumeRow): string {
+  const startDateParts = parseYearMonthFromDateText(toText(row?.startDate))
+  const endDateParts = parseYearMonthFromDateText(toText(row?.endDate))
+
+  switch (kind) {
+    case 'start-month':
+      return startDateParts.month
+    case 'start-year':
+      return startDateParts.year
+    case 'end-month':
+      return row?.isCurrentRole ? RESUME_PRESENT_MONTH_VALUE : endDateParts.month
+    case 'end-year':
+      return row?.isCurrentRole ? '' : endDateParts.year
+    default:
+      return ''
+  }
+}
+
 function parseYearMonthFromDateText(dateText: string): { year: string, month: string } {
   const normalized = (dateText || '').trim()
   if (!normalized) return { year: '', month: '' }
@@ -73,7 +464,8 @@ function toFormState(resumeData: RoleDetails[]): ResumeFormState {
       endDate: role.endDate,
       isCurrentRole: role.isCurrentRole ?? !role.endDate,
       orgName: sanitizeResumeFieldValue(toText(role.orgName)),
-      orgType: sanitizeResumeFieldValue(toText(role.orgType)),
+      orgPublicId: normalizeResumeOrganizationPublicId(sanitizeResumeFieldValue(toText(role.orgPublicId))),
+      orgType: normalizeResumeOrganizationTypeValue(sanitizeResumeFieldValue(toText(role.orgType))),
       orgLocation: sanitizeResumeFieldValue(toText(role.orgLocation)),
       orgHomePage: sanitizeResumeFieldValue(toText(role.orgHomePage)),
       description: sanitizeResumeFieldValue(toText(role.description)),
@@ -92,7 +484,8 @@ function toFormState(resumeData: RoleDetails[]): ResumeFormState {
         endDate: undefined,
         isCurrentRole: false,
         orgName: '',
-        orgType: '',
+        orgPublicId: '',
+        orgType: RESUME_ORGANIZATION_TYPE_OPTIONS[0].value,
         orgLocation: '',
         orgHomePage: '',
         description: '',
@@ -139,6 +532,82 @@ type ResumeRowProps = {
   onChange: () => void
 }
 
+function initializeResumeOrganizationTypeSelects(form: HTMLFormElement, resumeData: ResumeRow[]): void {
+  const selectElements = form.querySelectorAll('solid-ui-select[data-resume-organization-type-index]') as NodeListOf<ResumeOrganizationTypeSelectElement>
+
+  selectElements.forEach((selectElement) => {
+    const rowIndex = Number(selectElement.dataset.resumeOrganizationTypeIndex)
+    if (Number.isNaN(rowIndex)) return
+
+    const resumeRow = resumeData[rowIndex]
+    if (!resumeRow) return
+
+    selectElement.options = RESUME_ORGANIZATION_TYPE_OPTIONS
+    selectElement.value = normalizeResumeOrganizationTypeValue(resumeRow.orgType || '')
+    selectElement.label = ''
+  })
+}
+
+function initializeResumeOrganizationComboboxes(form: HTMLFormElement, resumeData: ResumeRow[]): void {
+  const comboboxElements = form.querySelectorAll('solid-ui-combobox[data-resume-organization-index]') as NodeListOf<ResumeOrganizationComboboxElement>
+
+  comboboxElements.forEach((comboboxElement) => {
+    const rowIndex = Number(comboboxElement.dataset.resumeOrganizationIndex)
+    if (Number.isNaN(rowIndex)) return
+
+    const resumeRow = resumeData[rowIndex]
+    if (!resumeRow) return
+
+    const options = resumeRow.orgPublicId && resumeRow.orgName
+      ? [{ label: resumeRow.orgName, value: resumeRow.orgPublicId, publicId: resumeRow.orgPublicId }]
+      : []
+
+    comboboxElement.suggestionProvider = createResumeOrganizationSuggestionProvider()
+    comboboxElement.options = options
+    comboboxElement.value = resumeRow.orgPublicId || ''
+    comboboxElement.inputValue = resumeRow.orgName || ''
+    comboboxElement.label = ''
+    comboboxElement.placeholder = 'Company or Organization'
+  })
+}
+
+function syncResumeOrganizationRowsFromComboboxes(form: HTMLFormElement, resumeData: ResumeRow[]): void {
+  const comboboxElements = form.querySelectorAll('solid-ui-combobox[data-resume-organization-index]') as NodeListOf<ResumeOrganizationComboboxElement>
+
+  comboboxElements.forEach((comboboxElement) => {
+    const rowIndex = Number(comboboxElement.dataset.resumeOrganizationIndex)
+    if (Number.isNaN(rowIndex) || !resumeData[rowIndex]) return
+
+    const comboboxInput = comboboxElement.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    const nextName = sanitizeResumeFieldValue(comboboxInput?.value || comboboxElement.inputValue || '')
+    const nextPublicId = normalizeResumeOrganizationPublicId(comboboxElement.value || '')
+
+    applyRowFieldChange(resumeData[rowIndex], 'orgName', nextName, rowHasContent)
+    resumeData[rowIndex].orgPublicId = nextPublicId
+  })
+}
+
+function initializeResumeDateSelects(form: HTMLFormElement, resumeData: ResumeRow[]): void {
+  const selectElements = form.querySelectorAll('solid-ui-select[data-resume-date-kind]') as NodeListOf<ResumeOrganizationTypeSelectElement>
+
+  selectElements.forEach((selectElement) => {
+    const kind = selectElement.dataset.resumeDateKind as ResumeDateSelectKind | undefined
+    const rowIndex = Number(selectElement.dataset.resumeRowIndex)
+    if (!kind || Number.isNaN(rowIndex)) return
+
+    const resumeRow = resumeData[rowIndex]
+    if (!resumeRow) return
+
+    const startDateParts = parseYearMonthFromDateText(toText(resumeRow.startDate))
+    const endDateParts = parseYearMonthFromDateText(toText(resumeRow.endDate))
+    const selectedYears = [startDateParts.year, endDateParts.year]
+
+    selectElement.options = getResumeDateSelectOptions(kind, selectedYears, Boolean(resumeRow.isCurrentRole))
+    selectElement.value = getResumeDateSelectValue(kind, resumeRow)
+    selectElement.label = getResumeDateSelectLabel(kind, resumeRow)
+  })
+}
+
 function renderResumeInputRow({
   resumeData,
   index,
@@ -183,41 +652,7 @@ function renderResumeInputRow({
   const endYearParsedText = endDateParts.year
   const isCurrentRoleId = `resume-current-role-${index}`
   const currentYear = new Date().getFullYear()
-  const baseYearOptions = Array.from({ length: 120 }, (_, i) => String(currentYear - i))
-  const yearOptions = Array.from(new Set([
-    ...baseYearOptions,
-    startYearText,
-    endYearParsedText
-  ].filter(Boolean))).sort((a, b) => Number(b) - Number(a))
-
-  const monthOptions = [
-    { value: '01', label: 'January' },
-    { value: '02', label: 'February' },
-    { value: '03', label: 'March' },
-    { value: '04', label: 'April' },
-    { value: '05', label: 'May' },
-    { value: '06', label: 'June' },
-    { value: '07', label: 'July' },
-    { value: '08', label: 'August' },
-    { value: '09', label: 'September' },
-    { value: '10', label: 'October' },
-    { value: '11', label: 'November' },
-    { value: '12', label: 'December' }
-  ]
-
-  const renderMonthOptions = (selectedMonth: string, emptyLabel = 'Select Month') => html`
-    <option value="" ?selected=${!selectedMonth}>${emptyLabel}</option>
-    ${monthOptions.map((month) => html`
-      <option value=${month.value} ?selected=${month.value === selectedMonth}>${month.label}</option>
-    `)}
-  `
-
-  const renderYearOptions = (selectedYear: string, emptyLabel = 'Select Year') => html`
-    <option value="" ?selected=${!selectedYear}>${emptyLabel}</option>
-    ${yearOptions.map((year) => html`
-      <option value=${year} ?selected=${year === selectedYear}>${year}</option>
-    `)}
-  `
+  const selectedYears = [startYearText, endYearParsedText]
 
   const handleResumeInput = (field: ResumeEditableField) => (e: Event) => {
     const target = e.target as HTMLInputElement
@@ -241,8 +676,7 @@ function renderResumeInputRow({
   /* The following function was generated by AI Model: GPT-5.3-Codex  */
   /* Prompt: can you make this a month drop down for the start year */
   const handleStartMonthChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const month = target.value
+    const month = readResumeSelectChange(event)
     const year = parseYearMonthFromDateText(toText(resumeData[index]?.startDate)).year || String(currentYear)
     const nextStartDate = buildDateLiteral(month, year)
     if (resumeData[index]) {
@@ -252,8 +686,7 @@ function renderResumeInputRow({
   }
 
   const handleStartYearChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const year = target.value
+    const year = readResumeSelectChange(event)
     const month = parseYearMonthFromDateText(toText(resumeData[index]?.startDate)).month || '01'
     const nextStartDate = buildDateLiteral(month, year)
     if (resumeData[index]) {
@@ -263,8 +696,8 @@ function renderResumeInputRow({
   }
 
   const handleEndMonthChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const month = target.value
+    if (resumeData[index]?.isCurrentRole) return
+    const month = readResumeSelectChange(event)
     const year = parseYearMonthFromDateText(toText(resumeData[index]?.endDate)).year || String(currentYear)
     const nextEndDate = buildDateLiteral(month, year)
     if (resumeData[index]) {
@@ -274,8 +707,8 @@ function renderResumeInputRow({
   }
 
   const handleEndYearChange = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const year = target.value
+    if (resumeData[index]?.isCurrentRole) return
+    const year = readResumeSelectChange(event)
     const month = parseYearMonthFromDateText(toText(resumeData[index]?.endDate)).month || '01'
     const nextEndDate = buildDateLiteral(month, year)
     if (resumeData[index]) {
@@ -301,52 +734,49 @@ function renderResumeInputRow({
         applyRowFieldChange(resumeData[index], 'endDate', undefined, rowHasContent)
       }
 
-      const formRoot = target.form || target.closest('form')
-      const endMonthSelect = formRoot?.querySelector(`#${endMonthSelectId}`) as HTMLSelectElement | null
-      const endYearSelect = formRoot?.querySelector(`#${endYearSelectId}`) as HTMLSelectElement | null
-
-      if (endMonthSelect) {
-        endMonthSelect.disabled = target.checked
-        endMonthSelect.value = ''
-        const emptyOption = endMonthSelect.options[0]
-        if (emptyOption) {
-          emptyOption.text = target.checked ? 'Present' : 'Select Month'
-        }
-      }
-
-      if (endYearSelect) {
-        endYearSelect.disabled = target.checked
-        endYearSelect.value = ''
-        const emptyOption = endYearSelect.options[0]
-        if (emptyOption) {
-          emptyOption.text = target.checked ? '' : 'Select Year'
-        }
-      }
+      onChange()
     }
   }
 
   const handleOrganizationTypeInput = (e: Event) => {
-    const target = e.target as HTMLSelectElement
-    const nextType = target.value
+    const nextType = normalizeResumeOrganizationTypeValue(readResumeOrganizationTypeChange(e))
     if (resumeRow) {
       applyRowSelectChange(resumeRow, 'orgType', nextType)
       onChange()
     }
   }
 
+  const handleOrganizationNameInput = (e: Event) => {
+    const nextValue = sanitizeResumeFieldValue(readResumeOrganizationComboboxInputValue(e))
+    if (resumeRow) {
+      applyRowFieldChange(resumeRow, 'orgName', nextValue, rowHasContent)
+      resumeRow.orgPublicId = ''
+    }
+  }
+
+  const handleOrganizationNameChange = (e: Event) => {
+    const selectedOption = readResumeOrganizationComboboxChange(e)
+    if (!resumeRow || !selectedOption?.publicId) return
+
+    applyRowFieldChange(resumeRow, 'orgName', sanitizeResumeFieldValue(selectedOption.label), rowHasContent)
+    resumeRow.orgPublicId = selectedOption.publicId
+  }
+
   return html`
     <div class="profile-edit-dialog__row profile-edit-dialog__row--resume-entry-header" role="group" aria-labelledby=${experienceHeadingId}>
       <h3 id=${experienceHeadingId} class="profile-edit-dialog__entry-heading">${label}</h3>
       <div class="profile-edit-dialog__actions profile-edit-dialog__actions--edge">
-        <button
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete resume ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
     <label aria-label=${`${label} Title`} class="label profile-edit-dialog__field">
@@ -368,34 +798,26 @@ function renderResumeInputRow({
     <div class="profile-edit-dialog__row">
       <label aria-label=${`${label} Organization Name`} class="label profile-edit-dialog__field">
         Company or Organization 
-        <input
-          class="input"
-          type="text"
+        <solid-ui-combobox
           name=${organizationName}
-          .value=${resumeRow?.orgName || ''}
+          data-resume-organization-index=${String(index)}
           required
-          data-contact-field="organizationName"
-          data-entry-node=${resumeRow?.entryNode || ''}
-          data-row-status=${resumeRow?.status || 'n/a'}
-          placeholder="Company or Organization"
-          autocomplete="organization"
-          inputmode="text"
-          @change=${handleResumeInput('orgName')}
-        />
+          @input=${handleOrganizationNameInput}
+          @change=${handleOrganizationNameChange}
+        ></solid-ui-combobox>
       </label>
       <label aria-label=${`${label} Organization Type`} class="label profile-edit-dialog__field">
         Organization Type
-        <select name=${organizationTypeName} id=${organizationTypeSelectId} @change=${handleOrganizationTypeInput} .value=${resumeRow?.orgType || ''}>
-          <option value="Corporation">Corporation</option>
-          <option value="EducationalOrganization">Educational Organization</option>
-          <option value="ResearchOrganization">Research Organization</option>
-          <option value="GovernmentOrganization">Government Organization</option>
-          <option value="NGO">NGO</option>
-          <option value="PerformingGroup">Performing Group</option>
-          <option value="Project">Project</option>
-          <option value="SportsOrganization">Sports Organization</option>
-          <option value="Other">Other</option>
-        </select>
+        <solid-ui-select
+          class="profile-edit-dialog__resume-organization-type-select"
+          name=${organizationTypeName}
+          id=${organizationTypeSelectId}
+          data-resume-organization-type-index=${String(index)}
+          .options=${RESUME_ORGANIZATION_TYPE_OPTIONS}
+          .value=${normalizeResumeOrganizationTypeValue(resumeRow?.orgType || '')}
+          .label=${''}
+          @change=${handleOrganizationTypeInput}
+        ></solid-ui-select>
       </label>
     </div>  
     <div class="profile-edit-dialog__row">
@@ -436,35 +858,63 @@ function renderResumeInputRow({
       <label aria-label=${`Start Date ${displayIndex + 1}`} class="label profile-edit-dialog__field profile-edit-dialog__field--date-group">
         <span>Start Date</span>
         <div class="profile-edit-dialog__date-pair">
-          <select name=${startMonthInputName} id=${startMonthSelectId} aria-label=${startMonthLabel} @change=${handleStartMonthChange}>
-            ${renderMonthOptions(startMonthValue)}
-          </select>
-          <select name=${startYearInputName} id=${startYearSelectId} aria-label=${startYearLabel} @change=${handleStartYearChange}>
-            ${renderYearOptions(startYearText)}
-          </select>
+          <solid-ui-select
+            class="profile-edit-dialog__resume-date-select"
+            name=${startMonthInputName}
+            id=${startMonthSelectId}
+            aria-label=${startMonthLabel}
+            data-resume-date-kind="start-month"
+            data-resume-row-index=${String(index)}
+            .options=${getResumeDateSelectOptions('start-month', selectedYears, Boolean(resumeRow?.isCurrentRole))}
+            .value=${startMonthValue}
+            .label=${getResumeDateSelectLabel('start-month', resumeRow)}
+            @change=${handleStartMonthChange}
+          ></solid-ui-select>
+          <solid-ui-select
+            class="profile-edit-dialog__resume-date-select"
+            name=${startYearInputName}
+            id=${startYearSelectId}
+            aria-label=${startYearLabel}
+            data-resume-date-kind="start-year"
+            data-resume-row-index=${String(index)}
+            .options=${getResumeDateSelectOptions('start-year', selectedYears, Boolean(resumeRow?.isCurrentRole))}
+            .value=${startYearText}
+            .label=${getResumeDateSelectLabel('start-year', resumeRow)}
+            @change=${handleStartYearChange}
+          ></solid-ui-select>
         </div>
       </label>
       <label aria-label=${`End Date ${displayIndex + 1}`} class="label profile-edit-dialog__field profile-edit-dialog__field--date-group">
         <span>End Date</span>
         <div class="profile-edit-dialog__date-pair">
-          <select
+          <solid-ui-select
+            class=${`profile-edit-dialog__resume-date-select${resumeRow?.isCurrentRole ? ' profile-edit-dialog__resume-date-select--disabled' : ''}`}
             name=${endMonthInputName}
             id=${endMonthSelectId}
             aria-label=${endMonthLabel}
+            aria-disabled=${String(Boolean(resumeRow?.isCurrentRole))}
+            tabindex=${resumeRow?.isCurrentRole ? '-1' : '0'}
+            data-resume-date-kind="end-month"
+            data-resume-row-index=${String(index)}
+            .options=${getResumeDateSelectOptions('end-month', selectedYears, Boolean(resumeRow?.isCurrentRole))}
+            .value=${resumeRow?.isCurrentRole ? RESUME_PRESENT_MONTH_VALUE : endMonthValue}
+            .label=${getResumeDateSelectLabel('end-month', resumeRow)}
             @change=${handleEndMonthChange}
-            ?disabled=${Boolean(resumeRow?.isCurrentRole)}
-          >
-            ${renderMonthOptions(endMonthValue, resumeRow?.isCurrentRole ? 'Present' : 'Select Month')}
-          </select>
-          <select
+          ></solid-ui-select>
+          <solid-ui-select
+            class=${`profile-edit-dialog__resume-date-select${resumeRow?.isCurrentRole ? ' profile-edit-dialog__resume-date-select--disabled' : ''}`}
             name=${endYearInputName}
             id=${endYearSelectId}
             aria-label=${endYearLabel}
+            aria-disabled=${String(Boolean(resumeRow?.isCurrentRole))}
+            tabindex=${resumeRow?.isCurrentRole ? '-1' : '0'}
+            data-resume-date-kind="end-year"
+            data-resume-row-index=${String(index)}
+            .options=${getResumeDateSelectOptions('end-year', selectedYears, Boolean(resumeRow?.isCurrentRole))}
+            .value=${resumeRow?.isCurrentRole ? '' : endYearParsedText}
+            .label=${getResumeDateSelectLabel('end-year', resumeRow)}
             @change=${handleEndYearChange}
-            ?disabled=${Boolean(resumeRow?.isCurrentRole)}
-          >
-            ${renderYearOptions(endYearParsedText, resumeRow?.isCurrentRole ? '' : 'Select Year')}
-          </select>
+          ></solid-ui-select>
         </div>
       </label>
     </div>
@@ -539,6 +989,10 @@ function renderResumeEditTemplate(
       ? html`<p class="profile-edit-dialog__login-message">${ownerLoginRequiredDialogMessageText}</p>`
       : null}
   `, form)
+
+  initializeResumeOrganizationTypeSelects(form, formState.resumeData)
+  initializeResumeOrganizationComboboxes(form, formState.resumeData)
+  initializeResumeDateSelects(form, formState.resumeData)
 }
 
 type ResumeDialogRenderState = {
@@ -588,19 +1042,51 @@ function restoreResumeDialogRenderState(form: HTMLFormElement, state: ResumeDial
     nextActive = form.querySelector(`[name="${escapedName}"]`) as HTMLElement | null
   }
 
-  if (nextActive && typeof nextActive.focus === 'function') {
-    nextActive.focus({ preventScroll: true })
+  focusResumeFieldElement(nextActive)
+}
+
+function getResumeFocusableTarget(element: HTMLElement | null): HTMLElement | null {
+  if (!element) return null
+
+  if (element.tagName === 'SOLID-UI-COMBOBOX') {
+    const comboboxInput = element.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    if (comboboxInput) return comboboxInput
+  }
+
+  return element
+}
+
+function focusResumeFieldElement(element: HTMLElement | null): void {
+  const focusTarget = getResumeFocusableTarget(element)
+  if (!focusTarget || typeof focusTarget.focus !== 'function') return
+
+  focusTarget.focus({ preventScroll: true })
+  if (focusTarget instanceof HTMLInputElement || focusTarget instanceof HTMLTextAreaElement) {
+    const caretPosition = 0
+    focusTarget.setSelectionRange(caretPosition, caretPosition)
+    focusTarget.scrollLeft = 0
+    focusTarget.scrollTop = 0
+    requestAnimationFrame(() => {
+      focusTarget.scrollLeft = 0
+      focusTarget.scrollTop = 0
+    })
+  }
+
+  if (element?.tagName === 'SOLID-UI-COMBOBOX') {
+    const comboboxHost = element as ResumeFocusableElement
+    if (comboboxHost._closePopup) {
+      requestAnimationFrame(() => {
+        comboboxHost._closePopup?.()
+      })
+    }
   }
 }
 
 function focusResumeField(form: HTMLFormElement, selector: string): void {
   const nextField = form.querySelector(selector) as HTMLElement | null
-  if (!nextField || typeof nextField.focus !== 'function') return
+  if (!nextField) return
 
-  nextField.focus({ preventScroll: true })
-  if (nextField instanceof HTMLInputElement || nextField instanceof HTMLTextAreaElement) {
-    nextField.select()
-  }
+  focusResumeFieldElement(nextField)
 }
 
 function createResumeEditForm(resumeData: RoleDetails[], viewerMode: ViewerMode) {
@@ -630,7 +1116,8 @@ function createResumeEditForm(resumeData: RoleDetails[], viewerMode: ViewerMode)
       endDate: undefined,
       isCurrentRole: false,
       orgName: '',
-      orgType: '',
+      orgPublicId: '',
+      orgType: RESUME_ORGANIZATION_TYPE_OPTIONS[0].value,
       orgLocation: '',
       orgHomePage: '',
       description: '',
@@ -659,6 +1146,11 @@ export async function createResumeEditDialog(
     title: editResumeDialogTitleText,
     dom,
     form,
+    shouldCloseWithoutSave: () => {
+      syncResumeOrganizationRowsFromComboboxes(form, formState.resumeData)
+      const plan: MutationOps<ResumeRow> = summarizeRowOps(formState.resumeData, rowHasContent)
+      return plan.create.length === 0 && plan.update.length === 0 && plan.remove.length === 0
+    },
     headerAction: {
       type: 'button',
       label: '+ Add More',
@@ -668,16 +1160,11 @@ export async function createResumeEditDialog(
     submitLabel: dialogSubmitLabelText,
     cancelLabel: dialogCancelLabelText,
     validate: async () => {
+      syncResumeOrganizationRowsFromComboboxes(form, formState.resumeData)
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
       }
 
-      const plan: MutationOps<ResumeRow> = summarizeRowOps(formState.resumeData, rowHasContent)
-      const hasChanges = plan.create.length > 0 || plan.update.length > 0 || plan.remove.length > 0
-      if (!hasChanges) {
-        return 'No resume changes detected.'
-      }
-
       const validation = validateResumeBeforeSave(formState.resumeData)
       if (!validation.ok) {
         return validation.message || 'Please complete the required resume fields.'
@@ -686,13 +1173,13 @@ export async function createResumeEditDialog(
       return null
     },
     onSave: async () => {
+      syncResumeOrganizationRowsFromComboboxes(form, formState.resumeData)
       const plan: MutationOps<ResumeRow> = summarizeRowOps(formState.resumeData, rowHasContent)
       await processResumeMutations(store, subject, plan)
       rerender()
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveResumeUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveResumeUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/resume/ResumeSection.css b/src/sections/resume/ResumeSection.css
new file mode 100644
index 00000000..a5f763e6
--- /dev/null
+++ b/src/sections/resume/ResumeSection.css
@@ -0,0 +1,350 @@
+/* Resume section styles. */
+
+/* Section actions */
+.resume__edit-button {
+  width: auto;
+  min-width: 0;
+  max-width: none;
+  padding: var(--spacing-xxs, 0.3125rem);
+  border: none;
+  background: none;
+  color: var(--color-primary, #7C4DFF);
+  cursor: var(--profile-interactive-cursor, pointer);
+  font-size: var(--font-size-sm, 0.875rem);
+}
+
+solid-ui-button.resume__edit-button {
+  width: auto;
+  min-width: 0;
+  max-width: none;
+  --button-height-sm: 0;
+  --button-padding-sm: var(--spacing-xxs, 0.3125rem);
+  --button-font-size-sm: var(--font-size-sm, 0.875rem);
+  --button-font-weight: var(--font-weight-regular, 400);
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--color-primary, #7C4DFF);
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary, #7C4DFF);
+}
+
+.resume__edit-button:hover {
+  text-decoration: underline;
+}
+
+solid-ui-button.resume__edit-button:hover::part(button),
+solid-ui-button.resume__edit-button:focus-visible::part(button) {
+  text-decoration: underline;
+}
+
+.resume-card {
+  --resume-card-section-gap: var(--spacing-md, 1.25rem);
+  --resume-card-item-gap: var(--spacing-xs, 0.75rem);
+  --resume-card-header-gap: var(--spacing-sm, 0.75rem);
+  --resume-card-column-gap: var(--spacing-md, 1.25rem);
+  --resume-card-row-gap: var(--spacing-2xs, 0.625rem);
+  --resume-card-title-color: var(--color-text-subheading, var(--gray-900, #101828));
+  --resume-card-title-size: var(--font-size-lg, 1.125rem);
+  --resume-card-title-weight: var(--font-weight-bold, 600);
+  --resume-card-organization-color: var(--color-text-secondary, var(--gray-600, #4A5565));
+  --resume-card-organization-size: var(--font-size-md, 1rem);
+  --resume-card-organization-weight: var(--font-weight-md, 500);
+  --resume-card-location-color: var(--color-text-secondary, var(--gray-600, #4A5565));
+  --resume-card-location-size: var(--font-size-sm, 0.875rem);
+  --resume-card-location-weight: var(--font-weight-normal, 400);
+  --resume-card-period-color: var(--color-text-secondary, var(--gray-600, #4A5565));
+  --resume-card-period-size: var(--font-size-sm, 0.875rem);
+  --resume-card-period-weight: var(--font-weight-normal, 400);
+  --resume-card-description-color: var(--color-text-primary, var(--gray-700, #364153));
+  --resume-card-description-size: var(--font-size-sm, 0.875rem);
+  --resume-card-description-weight: var(--font-weight-normal, 400);
+  --resume-card-heading-color: var(--color-text-subheading, #101828);
+  --resume-card-heading-border: var(--color-border-pale, #eee);
+}
+
+/* Section layout */
+.resume-card__section {
+  margin-bottom: var(--resume-card-section-gap);
+}
+
+.resume-card__section > ul {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+.resume-card__item {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  grid-template-areas:
+    "title period"
+    "organization organization"
+    "description description";
+  column-gap: var(--resume-card-column-gap);
+  row-gap: var(--resume-card-row-gap);
+  align-items: start;
+  margin: 0 0 var(--resume-card-item-gap) 0;
+  font-size: var(--font-size-base, 1rem);
+  line-height: var(--line-height-base, 1.5);
+  gap: 0;
+}
+
+.resume-card__item:last-child {
+  margin-bottom: 0;
+}
+
+.resume-card__item-header {
+  grid-area: title;
+  display: flex;
+  align-items: baseline;
+  gap: var(--resume-card-header-gap);
+  min-width: 0;
+}
+
+.resume-card__item-header h3,
+.resume-card__item-header h4,
+.resume-card__item-header time {
+  margin: 0;
+}
+
+.resume-card__item-header h3,
+.resume-card__item-header h4 {
+  min-width: 0;
+  color: var(--resume-card-title-color);
+  font-size: var(--resume-card-title-size);
+  font-weight: var(--resume-card-title-weight);
+  line-height: var(--line-height-tight, 1.4);
+}
+
+.resume-card__item-period {
+  grid-area: period;
+  justify-self: end;
+  text-align: right;
+  margin: 0;
+  color: var(--resume-card-period-color);
+  font-size: var(--resume-card-period-size);
+  font-weight: var(--resume-card-period-weight);
+  line-height: var(--line-height-tight, 1.4);
+}
+
+.resume-card__organization {
+  grid-area: organization;
+  margin: 0;
+  line-height: var(--line-height-base, 1.5);
+}
+
+.resume-card__organization-name {
+  color: var(--resume-card-organization-color);
+  font-size: var(--resume-card-organization-size);
+  font-weight: var(--resume-card-organization-weight);
+}
+
+.resume-card__organization-separator,
+.resume-card__organization-location {
+  color: var(--resume-card-location-color);
+  font-size: var(--resume-card-location-size);
+  font-weight: var(--resume-card-location-weight);
+}
+
+/* Description toggle */
+.resume-card__description-wrap {
+  grid-area: description;
+  --resume-card-description-offset: calc(var(--spacing-sm, 0.938rem) - var(--spacing-2xs, 0.625rem));
+  --resume-description-toggle-inline-offset: 0;
+  --resume-description-toggle-line-top: calc(100% - 1.5em + 0.28em - 11px);
+  --resume-description-toggle-line-translate-y: 7px;
+  --resume-description-overflow-padding-inline-end: 4.5rem;
+  margin: var(--resume-card-description-offset) 0 0;
+  position: relative;
+  isolation: isolate;
+}
+
+.resume-card__description-text {
+  margin: 0;
+  width: 100%;
+  max-width: none;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  color: var(--resume-card-description-color);
+  font-size: var(--resume-card-description-size);
+  font-weight: var(--resume-card-description-weight);
+  line-height: var(--line-height-base, 1.5);
+  overflow: hidden;
+}
+
+.resume-card__description-text--overflowing {
+  padding-right: var(--resume-description-overflow-padding-inline-end);
+}
+
+.resume-card__description-text--expanded {
+  display: block;
+  -webkit-line-clamp: unset;
+  line-clamp: unset;
+  padding-right: 0;
+  overflow: visible;
+}
+
+.resume-card__description-toggle,
+solid-ui-button.resume-card__description-toggle {
+  margin: 0;
+  padding: 0;
+  position: absolute;
+  right: var(--resume-description-toggle-inline-offset);
+  bottom: 0;
+  background-color: var(--color-card-bg, #FFF);
+  white-space: nowrap;
+  z-index: 0;
+}
+
+.resume-card__description-toggle {
+  border: 0;
+  background: transparent;
+  color: var(--color-primary, #7C4DFF);
+  cursor: var(--profile-interactive-cursor, pointer);
+  font: inherit;
+  font-size: var(--font-size-sm, 0.875rem);
+  line-height: var(--line-height-base, 1.5);
+  min-height: auto;
+  min-width: auto;
+}
+
+solid-ui-button.resume-card__description-toggle {
+  min-height: 0;
+  min-width: 0;
+  --button-height-sm: 0;
+  --button-padding-sm: 0;
+  --button-font-size-sm: var(--font-size-sm, 0.875rem);
+  --button-line-height: var(--line-height-base, 1.5);
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--color-primary, #7C4DFF);
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary, #7C4DFF);
+}
+
+.resume-card__description-wrap .resume-card__description-text:not(.resume-card__description-text--expanded) + .resume-card__description-toggle,
+.resume-card__description-wrap .resume-card__description-text:not(.resume-card__description-text--expanded) + solid-ui-button.resume-card__description-toggle {
+  top: var(--resume-description-toggle-line-top);
+  bottom: auto;
+  transform: translateY(var(--resume-description-toggle-line-translate-y));
+}
+
+.resume-card__description-text--expanded + .resume-card__description-toggle,
+.resume-card__description-text--expanded + solid-ui-button.resume-card__description-toggle {
+  position: static;
+  display: block;
+  width: fit-content;
+  margin-left: auto;
+  top: auto;
+  bottom: auto;
+  transform: none;
+}
+
+.resume-card__description-text--expanded + solid-ui-button.resume-card__description-toggle::part(button) {
+  position: static;
+  display: inline-flex;
+  top: auto;
+  bottom: auto;
+  transform: none;
+}
+
+.resume-card__skill,
+.resume-card__language {
+  text-align: left;
+  margin: var(--resume-card-item-gap) 0;
+  font-size: var(--font-size-base, 1rem);
+  line-height: var(--line-height-base, 1.5);
+}
+
+.resume-card__section > h3 {
+  color: var(--resume-card-heading-color);
+  font-size: var(--font-size-xl, 1.375rem);
+  font-weight: var(--font-weight-md, 500);
+  line-height: var(--line-height-tight, 1.4);
+  margin-bottom: var(--resume-card-item-gap);
+  border-bottom: 1px solid var(--resume-card-heading-border);
+  padding-bottom: var(--resume-card-item-gap);
+}
+
+/* Compact layout */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .resume-card__item {
+  --resume-card-title-size: var(--font-size-lg, 1.125rem);
+  --resume-card-organization-size: var(--font-size-md, 1rem);
+  --resume-card-location-size: var(--font-size-sm, 0.875rem);
+  --resume-card-period-size: var(--font-size-xxs, 0.75rem);
+  --resume-card-description-size: var(--font-size-sm, 0.875rem);
+  --resume-card-description-offset: 0rem;
+  grid-template-columns: minmax(0, 1fr);
+  grid-template-areas:
+    "title"
+    "organization"
+    "period"
+    "description";
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .resume-card__item-header {
+  align-items: flex-start;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .resume-card__item-period {
+  justify-self: start;
+  text-align: left;
+}
+
+@media (max-width: 576px) {
+  .resume-card__item {
+    --resume-card-title-size: var(--font-size-lg, 1.125rem);
+    --resume-card-organization-size: var(--font-size-md, 1rem);
+    --resume-card-location-size: var(--font-size-sm, 0.875rem);
+    --resume-card-period-size: var(--font-size-xxs, 0.75rem);
+    --resume-card-description-size: var(--font-size-sm, 0.875rem);
+    --resume-card-description-offset: 0rem;
+    grid-template-columns: minmax(0, 1fr);
+    grid-template-areas:
+      "title"
+      "organization"
+      "period"
+      "description";
+  }
+
+  .resume-card__item-header {
+    align-items: flex-start;
+  }
+
+  .resume-card__item-period {
+    justify-self: start;
+    text-align: left;
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .resume-card__item {
+    --resume-card-title-size: var(--font-size-lg, 1.125rem);
+    --resume-card-organization-size: var(--font-size-md, 1rem);
+    --resume-card-location-size: var(--font-size-sm, 0.875rem);
+    --resume-card-period-size: var(--font-size-xxs, 0.75rem);
+    --resume-card-description-size: var(--font-size-sm, 0.875rem);
+    --resume-card-description-offset: 0rem;
+    grid-template-columns: minmax(0, 1fr);
+    grid-template-areas:
+      "title"
+      "organization"
+      "period"
+      "description";
+  }
+
+  .resume-card__item-header {
+    align-items: flex-start;
+  }
+
+  .resume-card__item-period {
+    justify-self: start;
+    text-align: left;
+  }
+}
diff --git a/src/sections/resume/ResumeSection.ts b/src/sections/resume/ResumeSection.ts
index e1dc9d1e..9d357212 100644
--- a/src/sections/resume/ResumeSection.ts
+++ b/src/sections/resume/ResumeSection.ts
@@ -1,7 +1,8 @@
 import { html } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { RoleDetails } from './types'
 import { ViewerMode } from '../../types'
-import '../../styles/CVCard.css'
+import './ResumeSection.css'
 import { resumeHeadingText } from '../../texts'
 import { LiveStore, NamedNode } from 'rdflib'
 import { createResumeEditDialog } from './ResumeEditDialog'
@@ -12,7 +13,7 @@ import {
   toggleDescription
 } from '../shared/sectionCardHelpers'
 import { toggleCollapsibleSection } from '../shared/collapsibleSection'
-import { editIcon, plusDarkIcon } from '../../icons-svg/profileIcons'
+import { chevronDownIcon, editIcon, plusDarkIcon } from '../../icons-svg/profileIcons'
 
 function renderRole(role: RoleDetails, index: number) {
   if (!role) return html``
@@ -22,39 +23,42 @@ function renderRole(role: RoleDetails, index: number) {
   const roleDescriptionId = `cv-role-description-${index}`
 
   const ariaDescribedBy = role.description
-    ? `${rolePeriodId} ${roleOrgId} ${roleDescriptionId}`
-    : `${rolePeriodId} ${roleOrgId}`
+    ? `${roleOrgId} ${rolePeriodId} ${roleDescriptionId}`
+    : `${roleOrgId} ${rolePeriodId}`
 
   return html`
-    <li class="cvRole" role="listitem" aria-labelledby=${roleTitleId} aria-describedby=${ariaDescribedBy}>
-    <div class="cvRoleHeader">
-      <h4 id=${roleTitleId}>${role.title}</h4>
-      <p id=${rolePeriodId} class="cvRolePeriod">
-        <time datetime=${toMonthDateTime(role.startDate)}>${formatMonthYear(role.startDate)}</time>
-        <span aria-hidden="true"> to </span>
-        ${role.endDate
-          ? html`<time datetime=${toMonthDateTime(role.endDate)}>${formatMonthYear(role.endDate)}</time>`
-          : html`<span>Present</span>`}
-      </p>
+    <li class="resume-card__item" role="listitem" aria-labelledby=${roleTitleId} aria-describedby=${ariaDescribedBy}>
+    <div class="resume-card__item-header">
+      <h3 id=${roleTitleId}>${role.title}</h3>
     </div>
-      <p class="cvOrg" id=${roleOrgId}>
-        <strong>${role.orgName}</strong>${role.orgLocation ? html` | ${role.orgLocation}` : ''}
-      </p>
-      ${role.description ? html`
-        <div class="cvDescriptionWrap">
-          <p class="cvDescriptionText" id=${roleDescriptionId}>${role.description}</p>
-          <button
-            type="button"
-            class="cvDescriptionToggle"
-            aria-controls=${roleDescriptionId}
-            aria-expanded="false"
-            hidden
-            @click=${toggleDescription}
-          >
-            ...more
-          </button>
-        </div>
-      ` : ''}
+    <p class="resume-card__organization" id=${roleOrgId}>
+      <strong class="resume-card__organization-name">${role.orgName}</strong>${role.orgLocation ? html`<span class="resume-card__organization-separator" aria-hidden="true"> | </span><span class="resume-card__organization-location">${role.orgLocation}</span>` : ''}
+    </p>
+    <p id=${rolePeriodId} class="resume-card__item-period">
+      <time datetime=${toMonthDateTime(role.startDate)}>${formatMonthYear(role.startDate)}</time>
+      <span> to </span>
+      ${role.endDate
+        ? html`<time datetime=${toMonthDateTime(role.endDate)}>${formatMonthYear(role.endDate)}</time>`
+        : html`<span>Present</span>`}
+    </p>
+    ${role.description ? html`
+      <div class="resume-card__description-wrap">
+        <p class="resume-card__description-text" id=${roleDescriptionId}>${role.description}</p>
+        <solid-ui-button
+          type="button"
+          variant="secondary"
+          size="sm"
+          label="...more"
+          class="resume-card__description-toggle"
+          aria-controls=${roleDescriptionId}
+          aria-expanded="false"
+          hidden
+          @click=${toggleDescription}
+        >
+          ...more
+        </solid-ui-button>
+      </div>
+    ` : ''}
     </li>
   `
 }
@@ -66,15 +70,14 @@ function renderRoles(roles: RoleDetails[]) {
 
 export const CVCard = (
   cvData: RoleDetails[],
-  viewerMode: ViewerMode
+  _viewerMode: ViewerMode
 ) => {
-  void viewerMode
   const hasRoles = Array.isArray(cvData) && cvData.length > 0
   if (!hasRoles) return html``
 
   return html`
-    <article class="cvCard" aria-label="Resume" data-testid="curriculum-vitae">
-      <section class="cvSection">
+    <article class="resume-card" aria-label="Resume" data-testid="curriculum-vitae">
+      <section class="resume-card__section">
         <ul role="list" aria-label="Work experience in chronological order">
           ${renderRoles(cvData)}
         </ul>
@@ -89,7 +92,7 @@ function renderResumeSectionDefault(
   resumeDetails: RoleDetails[], 
   viewerMode: ViewerMode, 
   onSaved?: () => Promise<void> | void) {
-    scheduleDescriptionOverflowCheck()
+  scheduleDescriptionOverflowCheck()
 
   const hasResume = resumeDetails.length > 0
   const showSection = true
@@ -99,38 +102,43 @@ function renderResumeSectionDefault(
   return showSection ? html`
     <section 
       aria-labelledby="cv-heading" 
-      class="profile__section border-lighter profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
+      data-profile-section="resume"
+      class="profile__section profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
         <h2 id="cv-heading" tabindex="-1">${resumeHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
+        <div class="profile-section-collapsible__actions">
           ${isOwner ? html`
-            <button
+            <solid-ui-button
               type="button"
-              class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+              variant="secondary"
+              size="sm"
+              class="profile__action-button resume__edit-button profile-section-collapsible__edit-button"
               aria-label="Edit resume details"
               @click=${(event: Event) => createResumeEditDialog(event, store, subject, resumeDetails, viewerMode, onSaved)}
             >
               <span class="profile-section-collapsible__edit-label">${editIcon} Edit</span>
               <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-            </button>
+            </solid-ui-button>
           ` : html``}
-          <button
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle resume section"
             aria-controls="cv-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="cv-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="cv-panel" class="profile-section-collapsible__content">
         ${hasResume ? cv : html`<p>No resume details added yet.</p>`}
       </div>
     </section>
@@ -142,19 +150,21 @@ function renderOwnerEmptyResumeContent(
   subject: NamedNode,
   resumeDetails: RoleDetails[],
   viewerMode: ViewerMode,
-  onSaved?: () => Promise<void> | void) {
+  onSaved?: () => Promise<void> | void
+) {
 
   return html`
-    <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty resume section">
+    <div class="profile__empty-state-content" role="group" aria-label="Empty resume section">
       <h2 id="resume-heading" tabindex="-1">${resumeHeadingText}</h2>
       <p class="profile__empty-state-message">
         You haven't included any professional experience yet. Consider adding your work history to enhance your resume.
       </p>
     </div>
-    <button
+    <solid-ui-button
       type="button"
+      variant="secondary"
+      size="sm"
       class="profile__action-button--empty"
-      aria-label="Add resume details"
       @click=${(event: Event) => {
         return createResumeEditDialog(
           event,
@@ -167,7 +177,7 @@ function renderOwnerEmptyResumeContent(
       }}
     >
       <span class="profile__action-icon" aria-hidden="true">${plusDarkIcon} Add Resume</span>
-    </button>
+    </solid-ui-button>
 
   `
 }
@@ -180,14 +190,34 @@ function renderOwnerEmptyResumeSection(
   onSaved?: () => Promise<void> | void
 ) {
   return html`
-    <section 
+    <section
       aria-labelledby="resume-heading" 
       data-profile-section="resume"
-      class="profile__section--empty border-lighter flex-column-center rounded-md gap-lg" 
+      class="profile__section--empty profile__section--empty-main profile-section-collapsible profile-section-collapsible--inline-mobile-actions profile-section-collapsible--empty-mobile-no-edit" 
       role="region"
       tabindex="-1"
+      data-expanded="false"
     >
-      ${renderOwnerEmptyResumeContent(store, subject, resumeDetails, viewerMode, onSaved)}
+      <header class="profile__section-header profile-section-collapsible__header">
+        <h2 id="resume-heading" tabindex="-1">${resumeHeadingText}</h2>
+        <div class="profile-section-collapsible__actions">
+          <solid-ui-button
+            type="button"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
+            aria-label="Toggle resume section"
+            aria-controls="cv-panel"
+            aria-expanded="false"
+            @click=${toggleCollapsibleSection}
+          >
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
+        </div>
+      </header>
+      <div id="cv-panel" class="profile-section-collapsible__content">
+        ${renderOwnerEmptyResumeContent(store, subject, resumeDetails, viewerMode, onSaved)}
+      </div>
     </section>
   `
 }
diff --git a/src/sections/resume/mutations.ts b/src/sections/resume/mutations.ts
index 6e4a66f5..720f289c 100644
--- a/src/sections/resume/mutations.ts
+++ b/src/sections/resume/mutations.ts
@@ -4,7 +4,12 @@ import { ResumeRow } from './types'
 import { MutationOps } from '../shared/types'
 import { applyUpdaterPatch, collectLinkedNodeStatements, collectNodeStatements, findExistingNode, replacePredicateStatements } from '../shared/rdfMutationHelpers'
 import { createIdNode } from '../shared/idNodeFactory'
-import { mutationSaveResumeFailedPrefixText, resumeUpdateEntryNotFoundErrorMessageText } from '../../texts'
+import {
+  resumeMutationSaveFailedDebugText,
+  resumeUpdateEntryNotFoundErrorMessageText,
+  saveResumeUpdatesFailedMessageText
+} from '../../texts'
+import { error as debugError } from '../../utils/debug'
 
 function asXsdDateLiteral(dateLike: { value?: string } | null | undefined) {
   const value = (dateLike?.value || '').trim()
@@ -101,6 +106,9 @@ function buildOrganizationStatements(doc: NamedNode, membershipNode: Node, resum
   if (resumeData.orgHomePage) {
     inserts.push(st(organizationNode, ns.schema('uri'), literal(resumeData.orgHomePage), doc))
   }
+  if ((resumeData.orgPublicId || '').trim()) {
+    inserts.push(st(organizationNode, ns.solid('publicId'), sym((resumeData.orgPublicId || '').trim()), doc))
+  }
 
   return inserts
 }
@@ -202,7 +210,8 @@ export async function processResumeMutations(store: LiveStore, subject: NamedNod
     await mutateResumeEntries(store, subject, mutationPlan)
 
   } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`${mutationSaveResumeFailedPrefixText} ${message}`)
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(resumeMutationSaveFailedDebugText, rootError)
+    throw new Error(saveResumeUpdatesFailedMessageText, { cause: rootError })
   }
 } 
diff --git a/src/sections/resume/selectors.ts b/src/sections/resume/selectors.ts
index 4a58d081..5e3805c8 100644
--- a/src/sections/resume/selectors.ts
+++ b/src/sections/resume/selectors.ts
@@ -121,6 +121,7 @@ function getRoles(
       endDate,
       isCurrentRole,
       orgName,
+      orgPublicId: publicId?.value || '',
       orgType,
       orgLocation,
       orgHomePage,
diff --git a/src/sections/resume/types.ts b/src/sections/resume/types.ts
index f753635a..6895c491 100644
--- a/src/sections/resume/types.ts
+++ b/src/sections/resume/types.ts
@@ -19,6 +19,7 @@ export interface Role {
   endDate?: Literal,
   isCurrentRole?: boolean,
   orgName: string,
+  orgPublicId?: string,
   orgType?: string,
   orgLocation?: string,
   orgHomePage?: string,
diff --git a/src/sections/shared/collapsibleSection.ts b/src/sections/shared/collapsibleSection.ts
index f0baab93..c97e720e 100644
--- a/src/sections/shared/collapsibleSection.ts
+++ b/src/sections/shared/collapsibleSection.ts
@@ -10,6 +10,7 @@ export function toggleCollapsibleSection(event: Event): void {
   section.setAttribute('data-expanded', String(nextExpanded))
   button.setAttribute('aria-expanded', String(nextExpanded))
   panel.setAttribute('aria-hidden', String(!nextExpanded))
+  panel.hidden = !nextExpanded
 
   if (nextExpanded && typeof window !== 'undefined') {
     window.requestAnimationFrame(() => {
diff --git a/src/sections/shared/phoneCountries.ts b/src/sections/shared/phoneCountries.ts
index 457db65d..1787c20f 100644
--- a/src/sections/shared/phoneCountries.ts
+++ b/src/sections/shared/phoneCountries.ts
@@ -4,7 +4,7 @@ export type CountryDialOption = {
   name: string
 }
 
-export const DEFAULT_DIAL_CODE = '+1'
+export const DEFAULT_DIAL_CODE = ''
 
 export const COUNTRY_DIAL_OPTIONS: CountryDialOption[] = [
   { iso2: 'EG', dialCode: '+20', name: 'Egypt' },
@@ -348,5 +348,5 @@ export function combinePhoneValue(dialCode: string, localNumber: string): string
   const trimmed = localNumber.trim()
   if (!trimmed) return ''
   if (trimmed.startsWith('+')) return trimmed
-  return `${dialCode}${trimmed}`
+  return dialCode ? `${dialCode}${trimmed}` : trimmed
 }
diff --git a/src/sections/shared/projectCommunityNodes.ts b/src/sections/shared/projectCommunityNodes.ts
new file mode 100644
index 00000000..798732dd
--- /dev/null
+++ b/src/sections/shared/projectCommunityNodes.ts
@@ -0,0 +1,64 @@
+import { LiveStore, NamedNode, Node, sym } from 'rdflib'
+import { ns } from 'solid-ui'
+import { expandRdfList } from './rdfList'
+
+export function isRdfListNode(store: LiveStore, node: unknown, doc?: NamedNode | null): boolean {
+	if ((node as { elements?: Node[] } | null)?.elements?.length) return true
+	return Boolean(store.any(node as NamedNode, ns.rdf('first'), null, doc || null))
+}
+
+export function expandCommunityNodes(store: LiveStore, node: Node, doc?: NamedNode | null): Node[] {
+	return isRdfListNode(store, node, doc) ? expandRdfList(store, node) : [node]
+}
+
+export function linkedProjectNodeFromCommunityNode(node: Node, store: LiveStore): NamedNode | null {
+	if (!node) return null
+	if (node.termType === 'NamedNode') return node as NamedNode
+	if (node.termType === 'Literal') {
+		try {
+			return sym(node.value)
+		} catch {
+			return null
+		}
+	}
+	if (node.termType !== 'BlankNode') return null
+
+	const candidatePredicates = [
+		ns.solid('publicId'),
+		ns.schema('url'),
+		ns.foaf('homepage'),
+		ns.rdfs('seeAlso'),
+		ns.schema('sameAs'),
+		ns.schema('mainEntityOfPage')
+	]
+
+	for (const predicate of candidatePredicates) {
+		const linked = store.any(node as NamedNode, predicate) as Node | null
+		if (!linked?.value) continue
+
+		if (linked.termType === 'NamedNode') {
+			return linked as NamedNode
+		}
+
+		if (linked.termType === 'Literal') {
+			try {
+				return sym(linked.value)
+			} catch {
+				// Keep trying the next predicate.
+			}
+		}
+	}
+
+	const outgoing = store.statementsMatching(node as NamedNode, null, null, null)
+	const firstNamedNode = outgoing.find((statement) => statement.object.termType === 'NamedNode')
+	if (firstNamedNode?.object?.value) {
+		return firstNamedNode.object as NamedNode
+	}
+
+	return null
+}
+
+export function projectUrlFromCommunityNode(node: Node, store: LiveStore): string {
+	const linkedProjectNode = linkedProjectNodeFromCommunityNode(node, store)
+	return linkedProjectNode?.value || node.value || ''
+}
\ No newline at end of file
diff --git a/src/sections/shared/rdfMutationHelpers.ts b/src/sections/shared/rdfMutationHelpers.ts
index dfaa91f4..a1e9d2ed 100644
--- a/src/sections/shared/rdfMutationHelpers.ts
+++ b/src/sections/shared/rdfMutationHelpers.ts
@@ -1,50 +1,305 @@
 import { LiveStore, NamedNode, Node, st } from 'rdflib'
 import { fallbackSaveUpdatesErrorMessageText, updaterUnsupportedStoreErrorMessageText } from '../../texts'
+import { PrefixCapable, RdfFetcher, RdfStatement, RdfUpdater } from './types'
+/* Some of the code below was generated by AI Model: GPT-5.4.
+   Prompt: can you add types to rdfMutationHelpers.ts and consolidate mutation logic 
+   where appropriate. */
+
+const STANDARD_MUTATION_PREFIXES: Record<string, string> = {
+  rdf: 'http://www.w3.org/1999/02/22-rdf-syntax-ns#',
+  vcard: 'http://www.w3.org/2006/vcard/ns#',
+  foaf: 'http://xmlns.com/foaf/0.1/',
+  solid: 'http://www.w3.org/ns/solid/terms#',
+  schema: 'http://schema.org/',
+  org: 'http://www.w3.org/ns/org#',
+  owl: 'http://www.w3.org/2002/07/owl#',
+  dc: 'http://purl.org/dc/elements/1.1/'
+}
 
 function normalizeNodeId(value: string): string {
   return value.startsWith('_:') ? value.slice(2) : value
 }
 
-export function applyUpdaterPatch(store: LiveStore, deletions: any[], insertions: any[]) {
-  if (!store.updater) {
-    throw new Error(updaterUnsupportedStoreErrorMessageText)
+function isCompleteStatement(statement: RdfStatement | null | undefined): statement is RdfStatement {
+  return Boolean(statement?.subject && statement?.predicate && statement?.object)
+}
+
+function statementTermKey(term: { toNT?: () => string; value?: string } | null | undefined): string {
+  if (!term) return ''
+  if (typeof term.toNT === 'function') return term.toNT()
+  return term.value || ''
+}
+
+export function registerStorePrefix(target: PrefixCapable | undefined, prefix: string, uri: string): void {
+  if (!target) return
+  if (typeof target.setPrefixForURI === 'function') {
+    target.setPrefixForURI(prefix, uri)
+    return
+  }
+  if (!target.namespaces) {
+    target.namespaces = {}
   }
+  target.namespaces[prefix] = uri
+}
+
+export function ensureStandardMutationPrefixes(store: LiveStore | undefined): void {
+  if (!store) return
+
+  const updater = getStoreUpdater(store)
+  const targets: Array<PrefixCapable | undefined> = [
+    store as PrefixCapable,
+    updater,
+    updater?.store as PrefixCapable | undefined
+  ]
 
-  const safeDeletions = (deletions || []).filter((statement: any) => {
-    if (!statement || !statement.subject || !statement.predicate || !statement.object) return false
-    const graph = statement.why
-    return store.holds(statement.subject, statement.predicate, statement.object, graph)
+  Object.entries(STANDARD_MUTATION_PREFIXES).forEach(([prefix, uri]) => {
+    targets.forEach((target) => {
+      registerStorePrefix(target, prefix, uri)
+    })
   })
+}
+
+export function statementKey(statement: RdfStatement): string {
+  return `${statementTermKey(statement.subject)} ${statementTermKey(statement.predicate)} ${statementTermKey(statement.object)} ${statementTermKey(statement.why)}`
+}
 
-  const safeInsertions = (insertions || []).filter((statement: any) => {
-    return Boolean(statement && statement.subject && statement.predicate && statement.object)
+export function uniqueStatements(statements: RdfStatement[]): RdfStatement[] {
+  return Array.from(new Map((statements || []).map((statement) => [statementKey(statement), statement])).values())
+}
+
+export function applyStatementsToStore(store: LiveStore, deletions: RdfStatement[], insertions: RdfStatement[]): void {
+  store.remove(deletions)
+  insertions.forEach((statement) => {
+    store.add(statement.subject, statement.predicate, statement.object, statement.why)
   })
+}
 
-  if (safeDeletions.length === 0 && safeInsertions.length === 0) {
-    return Promise.resolve()
+export function sanitizePatchStatements(
+  store: LiveStore,
+  deletions: RdfStatement[],
+  insertions: RdfStatement[],
+  requireStoredDelete = false
+) {
+  const safeDeletions = uniqueStatements(
+    (deletions || []).filter((statement) => {
+      if (!isCompleteStatement(statement)) return false
+      if (store.holds(statement.subject, statement.predicate, statement.object, statement.why)) return true
+      return requireStoredDelete
+        ? false
+        : store.statementsMatching(statement.subject, statement.predicate, statement.object, statement.why).length > 0
+    })
+  )
+
+  const safeInsertions = uniqueStatements((insertions || []).filter(isCompleteStatement))
+
+  return { safeDeletions, safeInsertions }
+}
+
+function getStoreUpdater(store: LiveStore): RdfUpdater | undefined {
+  return store.updater as RdfUpdater | undefined
+}
+
+function getStoreFetcher(store: LiveStore): RdfFetcher | undefined {
+  return store.fetcher as RdfFetcher | undefined
+}
+
+export function isPatchFailureMessage(message: string): boolean {
+  const text = (message || '').toLowerCase()
+  return (
+    text.includes('fetch error for patch') ||
+    text.includes('failed to fetch') ||
+    text.includes(' on patch ') ||
+    text.includes('web error: 400') ||
+    text.includes('web error: 405') ||
+    text.includes('web error: 500') ||
+    text.includes('web error: 501')
+  )
+}
+
+export function isMissingGetRecordErrorMessage(message: string): boolean {
+  return (message || '').toLowerCase().includes('no record of our http get request for document')
+}
+
+function runUpdaterUpdate(
+  updater: RdfUpdater,
+  deletions: RdfStatement[],
+  insertions: RdfStatement[],
+  failureMessage: string
+) {
+  if (typeof updater.update !== 'function') {
+    throw new Error(updaterUnsupportedStoreErrorMessageText)
   }
 
   return new Promise<void>((resolve, reject) => {
     try {
-      ;(store.updater as any).update(
-        safeDeletions as any,
-        safeInsertions as any,
-        (_uri: string, ok: boolean, message?: string) => {
-          if (ok === true) {
-            resolve()
-            return
-          }
-          reject(new Error(message || fallbackSaveUpdatesErrorMessageText))
+      updater.update(deletions, insertions, (_uri: string, ok: boolean, message?: string) => {
+        if (ok === true) {
+          resolve()
+          return
         }
-      )
+        reject(new Error(message || failureMessage))
+      })
     } catch (error) {
       reject(error instanceof Error ? error : new Error(String(error)))
     }
   })
 }
 
+export async function runDirectUpdaterUpdate(
+  store: LiveStore,
+  deletions: RdfStatement[],
+  insertions: RdfStatement[],
+  failureMessage = fallbackSaveUpdatesErrorMessageText
+) {
+  ensureStandardMutationPrefixes(store)
+
+  const updater = getStoreUpdater(store)
+  if (!updater) {
+    throw new Error(updaterUnsupportedStoreErrorMessageText)
+  }
+
+  await runUpdaterUpdate(updater, deletions, insertions, failureMessage)
+}
+
+export async function putResourceWithStatements(
+  store: LiveStore,
+  doc: NamedNode,
+  deletions: RdfStatement[],
+  insertions: RdfStatement[],
+  unsupportedMessage: string
+) {
+  ensureStandardMutationPrefixes(store)
+
+  const updater = getStoreUpdater(store)
+  const fetcher = getStoreFetcher(store)
+
+  if (!updater || typeof updater.serialize !== 'function' || !fetcher || typeof fetcher.webOperation !== 'function') {
+    throw new Error(unsupportedMessage)
+  }
+
+  const currentStatements = store.statementsMatching(undefined, undefined, undefined, doc).slice()
+  const deletionKeys = new Set((deletions || []).map((statement) => statementKey(statement)))
+  const nextStatements = currentStatements.filter((statement) => !deletionKeys.has(statementKey(statement))).concat(insertions || [])
+
+  const contentType = 'text/turtle'
+  const body = updater.serialize(doc.value, nextStatements, contentType)
+  const response = await fetcher.webOperation('PUT', doc.value, {
+    noMeta: true,
+    contentType,
+    body
+  })
+
+  if (!response || response.ok !== true) {
+    const status = response?.status || 'unknown'
+    throw new Error(`Web error: ${status} on PUT of <${doc.value}>`)
+  }
+
+  applyStatementsToStore(store, deletions, insertions)
+}
+
+type UpdateTransportOptions = {
+  unsupportedMessage: string
+  failureMessage?: string
+  requireStoredDelete?: boolean
+  useDavFallback?: boolean
+  usePutFallback?: boolean
+  patchFailureMatcher?: (message: string) => boolean
+  missingGetRecordMatcher?: (message: string) => boolean
+}
+
+export async function runUpdateTransport(
+  store: LiveStore,
+  doc: NamedNode | null,
+  deletions: RdfStatement[],
+  insertions: RdfStatement[],
+  options: UpdateTransportOptions
+) {
+  ensureStandardMutationPrefixes(store)
+
+  const updater = getStoreUpdater(store)
+  if (!updater) {
+    throw new Error(options.unsupportedMessage)
+  }
+
+  const {
+    safeDeletions,
+    safeInsertions
+  } = sanitizePatchStatements(store, deletions, insertions, options.requireStoredDelete === true)
+
+  if (safeDeletions.length === 0 && safeInsertions.length === 0) {
+    return
+  }
+
+  const failureMessage = options.failureMessage || fallbackSaveUpdatesErrorMessageText
+
+  const isPatchFailure = options.patchFailureMatcher || isPatchFailureMessage
+  const isMissingGetRecord = options.missingGetRecordMatcher || isMissingGetRecordErrorMessage
+
+  try {
+    await runUpdaterUpdate(updater, safeDeletions, safeInsertions, failureMessage)
+    return
+  } catch (error) {
+    const message = error instanceof Error ? error.message : String(error)
+    if (!isPatchFailure(message)) {
+      throw error
+    }
+
+    if (options.useDavFallback && typeof updater.updateDav === 'function') {
+      if (doc && getStoreFetcher(store)?.load) {
+        try {
+          await getStoreFetcher(store)?.load?.(doc)
+        } catch {
+          // Continue to DAV fallback and then PUT fallback if needed.
+        }
+      }
+
+      try {
+        await new Promise<void>((resolve, reject) => {
+          updater.updateDav?.(doc, safeDeletions, safeInsertions, (_uri: string, ok: boolean, body?: string) => {
+            if (ok === true) {
+              resolve()
+              return
+            }
+            reject(new Error(body || message || failureMessage))
+          })
+        })
+        return
+      } catch (davError) {
+        const davMessage = davError instanceof Error ? davError.message : String(davError)
+        if (!options.usePutFallback || !isMissingGetRecord(davMessage)) {
+          throw davError
+        }
+      }
+    }
+
+    if (options.usePutFallback) {
+      if (!doc) {
+        throw new Error(options.unsupportedMessage)
+      }
+      await putResourceWithStatements(store, doc, safeDeletions, safeInsertions, options.unsupportedMessage)
+      return
+    }
+
+    throw error
+  }
+}
+
+export function applyUpdaterPatch(store: LiveStore, deletions: RdfStatement[], insertions: RdfStatement[]) {
+  if (!store.updater) {
+    throw new Error(updaterUnsupportedStoreErrorMessageText)
+  }
+
+  return runUpdateTransport(store, null, deletions, insertions, {
+    unsupportedMessage: updaterUnsupportedStoreErrorMessageText,
+    failureMessage: fallbackSaveUpdatesErrorMessageText,
+    requireStoredDelete: true,
+    useDavFallback: false,
+    usePutFallback: false
+  })
+}
+
 export function collectNodeStatements(store: LiveStore, node: Node, doc: NamedNode) {
-  return store.statementsMatching(node as any, null, null, doc as any)
+  return store.statementsMatching(node as any, null, null, doc)
 }
 
 export function collectLinkStatements(
@@ -54,7 +309,7 @@ export function collectLinkStatements(
   node: Node,
   doc: NamedNode
 ) {
-  return store.statementsMatching(subject, predicate, node as any, doc)
+  return store.statementsMatching(subject, predicate, node, doc)
 }
 
 /* The following helper was generated by AI Model: GPT-5.3-Codex.
@@ -64,13 +319,13 @@ export function replacePredicateStatements(
   subject: NamedNode,
   predicate: NamedNode,
   doc: NamedNode,
-  deletions: any[],
-  insertions: any[],
+  deletions: RdfStatement[],
+  insertions: RdfStatement[],
   nextObject?: Node | null
 ) {
   deletions.push(...store.statementsMatching(subject, predicate, null, doc))
   if (nextObject) {
-    insertions.push(st(subject, predicate, nextObject as any, doc))
+    insertions.push(st(subject, predicate, nextObject, doc))
   }
 }
 
diff --git a/src/sections/shared/sectionCardHelpers.ts b/src/sections/shared/sectionCardHelpers.ts
index b278d53e..3c8ac042 100644
--- a/src/sections/shared/sectionCardHelpers.ts
+++ b/src/sections/shared/sectionCardHelpers.ts
@@ -1,6 +1,64 @@
 type DateLike = string | { value?: string } | null | undefined
 
 let descriptionResizeBound = false
+const DESCRIPTION_MAX_LINES = 2
+
+function getLineHeightPx(computed: CSSStyleDeclaration): number {
+  const parsedLineHeight = Number.parseFloat(computed.lineHeight)
+  if (Number.isFinite(parsedLineHeight)) {
+    return parsedLineHeight
+  }
+
+  const parsedFontSize = Number.parseFloat(computed.fontSize)
+  if (Number.isFinite(parsedFontSize)) {
+    return parsedFontSize * 1.5
+  }
+
+  return 24
+}
+
+function getExpandedTextHeight(textEl: HTMLElement): number {
+  const previousDisplay = textEl.style.display
+  const previousOverflow = textEl.style.overflow
+  const previousPaddingRight = textEl.style.paddingRight
+  const previousLineClamp = textEl.style.getPropertyValue('-webkit-line-clamp')
+  const previousBoxOrient = textEl.style.getPropertyValue('-webkit-box-orient')
+
+  textEl.style.display = 'block'
+  textEl.style.overflow = 'visible'
+  textEl.style.paddingRight = '0'
+  textEl.style.setProperty('-webkit-line-clamp', 'unset')
+  textEl.style.setProperty('-webkit-box-orient', 'initial')
+
+  const naturalHeight = textEl.getBoundingClientRect().height
+
+  textEl.style.display = previousDisplay
+  textEl.style.overflow = previousOverflow
+  textEl.style.paddingRight = previousPaddingRight
+
+  if (previousLineClamp) {
+    textEl.style.setProperty('-webkit-line-clamp', previousLineClamp)
+  } else {
+    textEl.style.removeProperty('-webkit-line-clamp')
+  }
+
+  if (previousBoxOrient) {
+    textEl.style.setProperty('-webkit-box-orient', previousBoxOrient)
+  } else {
+    textEl.style.removeProperty('-webkit-box-orient')
+  }
+
+  return naturalHeight
+}
+
+function isTextOverflowingClamp(textEl: HTMLElement, maxLines: number): boolean {
+  const computed = window.getComputedStyle(textEl)
+  const lineHeight = getLineHeightPx(computed)
+  const maxCollapsedHeight = lineHeight * maxLines
+  const naturalHeight = getExpandedTextHeight(textEl)
+
+  return naturalHeight > maxCollapsedHeight + 1
+}
 
 function toDateValue(date?: DateLike): string {
   if (!date) return ''
@@ -14,35 +72,56 @@ function toDateValue(date?: DateLike): string {
 export function updateDescriptionOverflow(root: ParentNode = document) {
   const selectorGroups = [
     {
-      wrap: '.cvDescriptionWrap',
-      text: '.cvDescriptionText',
-      toggle: '.cvDescriptionToggle'
+      wrap: '.resume-card__description-wrap',
+      text: '.resume-card__description-text',
+      toggle: '.resume-card__description-toggle',
+      expanded: 'resume-card__description-text--expanded',
+      overflowing: 'resume-card__description-text--overflowing'
     },
     {
-      wrap: '.bioDescriptionWrap',
-      text: '.bioDescriptionText',
-      toggle: '.bioDescriptionToggle'
+      wrap: '.education-card__description-wrap',
+      text: '.education-card__description-text',
+      toggle: '.education-card__description-toggle',
+      expanded: 'education-card__description-text--expanded',
+      overflowing: 'education-card__description-text--overflowing'
+    },
+    {
+      wrap: '.bio-card__description-wrap',
+      text: '.bio-card__description-text',
+      toggle: '.bio-card__description-toggle',
+      expanded: 'bio-card__description-text--expanded',
+      overflowing: 'bio-card__description-text--overflowing'
     }
   ]
 
-  selectorGroups.forEach(({ wrap, text, toggle }) => {
+  selectorGroups.forEach(({ wrap, text, toggle, expanded, overflowing }) => {
     const wraps = root.querySelectorAll(wrap)
     wraps.forEach((container) => {
+      if (!(container instanceof HTMLElement)) return
       const textEl = container.querySelector(text) as HTMLElement | null
-      const button = container.querySelector(toggle) as HTMLButtonElement | null
+      const button = container.querySelector(toggle) as HTMLElement | null
       if (!textEl || !button) return
 
-      const isExpanded = textEl.classList.contains('isExpanded')
+      textEl.classList.remove(overflowing)
+
+      if (textEl.clientHeight === 0 || textEl.clientWidth === 0) {
+        button.hidden = true
+        return
+      }
+
+      const isExpanded = textEl.classList.contains(expanded)
       if (isExpanded) {
         button.hidden = false
         return
       }
 
-      const isOverflowing = textEl.scrollHeight > textEl.clientHeight + 1
+      const isOverflowing = isTextOverflowingClamp(textEl, DESCRIPTION_MAX_LINES)
+      textEl.classList.toggle(overflowing, isOverflowing)
       button.hidden = !isOverflowing
       if (!isOverflowing) {
         button.setAttribute('aria-expanded', 'false')
         button.textContent = '...more'
+        return
       }
     })
   })
@@ -50,7 +129,9 @@ export function updateDescriptionOverflow(root: ParentNode = document) {
 
 export function scheduleDescriptionOverflowCheck() {
   if (typeof window === 'undefined') return
-  window.requestAnimationFrame(() => updateDescriptionOverflow(window.document))
+  window.requestAnimationFrame(() => {
+    window.requestAnimationFrame(() => updateDescriptionOverflow(window.document))
+  })
 
   if (!descriptionResizeBound) {
     window.addEventListener('resize', () => scheduleDescriptionOverflowCheck())
@@ -72,7 +153,16 @@ export function toggleDescription(event: Event) {
   const textEl = document.getElementById(descriptionId)
   if (!textEl) return
 
-  const isExpanded = textEl.classList.toggle('isExpanded')
+  const expandedClass =
+    textEl.matches('.resume-card__description-text')
+      ? 'resume-card__description-text--expanded'
+      : textEl.matches('.education-card__description-text')
+        ? 'education-card__description-text--expanded'
+        : textEl.matches('.bio-card__description-text')
+          ? 'bio-card__description-text--expanded'
+          : 'isExpanded'
+
+  const isExpanded = textEl.classList.toggle(expandedClass)
   button.setAttribute('aria-expanded', isExpanded ? 'true' : 'false')
   button.textContent = isExpanded ? '...less' : '...more'
   if (!isExpanded) {
diff --git a/src/sections/shared/types.ts b/src/sections/shared/types.ts
index ab5bc9ad..e0cfeda8 100644
--- a/src/sections/shared/types.ts
+++ b/src/sections/shared/types.ts
@@ -1,3 +1,5 @@
+import { LiveStore, NamedNode, st } from 'rdflib'
+
 export type RowStatus = 'existing' | 'new' | 'modified' | 'deleted'
 
 export type MutationOps<T> = {
@@ -6,3 +8,33 @@ export type MutationOps<T> = {
   remove: T[]
 }
 
+export type RdfStatement = ReturnType<typeof st>
+
+export type PrefixCapable = {
+  namespaces?: Record<string, string>
+  setPrefixForURI?: (prefix: string, uri: string) => void
+}
+
+export type UpdateCallback = (_uri: string, ok: boolean, message?: string) => void
+
+export type DavUpdateCallback = (_uri: string, ok: boolean, body?: string) => void
+
+export type RdfUpdater = PrefixCapable & {
+  update?: (deletions: RdfStatement[], insertions: RdfStatement[], callback: UpdateCallback) => void
+  updateDav?: (doc: NamedNode, deletions: RdfStatement[], insertions: RdfStatement[], callback: DavUpdateCallback) => void
+  serialize?: (docUri: string, statements: RdfStatement[], contentType: string) => string
+  store?: PrefixCapable
+}
+
+export type WebOperationResponse = {
+  ok?: boolean
+  status?: number
+}
+
+export type RdfFetcher = {
+  load?: (doc: NamedNode) => Promise<unknown>
+  webOperation?: (...args: unknown[]) => Promise<WebOperationResponse>
+}
+
+export type MutationCapableStore = LiveStore
+
diff --git a/src/sections/skills/SkillsEditDialog.ts b/src/sections/skills/SkillsEditDialog.ts
index 14beec3d..904ff97e 100644
--- a/src/sections/skills/SkillsEditDialog.ts
+++ b/src/sections/skills/SkillsEditDialog.ts
@@ -1,22 +1,24 @@
-import { openInputDialog } from '../../ui/dialog'
+import { getSharedDialogSaveButton, openInputDialog } from '../../ui/dialog'
 import { html, render } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import 'solid-ui/components/forms/combobox'
 import { SkillDetails, SkillRow } from './types'
 import '../../styles/EditDialogs.css'
-import '../../styles/ContactInfoEditDialog.css'
+import '../contactInfo/ContactInfoEditDialog.css'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ViewerMode } from '../../types'
 import { applyRowFieldChange, deleteRow, summarizeRowOps } from '../shared/rowState'
 import { hasNonEmptyText, sanitizeTextValue, toText } from '../../textUtils'
 import { MutationOps } from '../shared/types'
 import { processSkillsMutations } from './mutations'
-import { searchIcon, trashIcon } from '../../icons-svg/profileIcons'
+import { trashIcon } from '../../icons-svg/profileIcons'
 import {
   deleteEntryButtonTitleText,
   dialogCancelLabelText,
   dialogSubmitLabelText,
   editSkillsDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveContactUpdatesFailedPrefixText,
+  saveSkillsUpdatesFailedMessageText,
 } from '../../texts'
 
 type SkillFormState = {
@@ -25,14 +27,29 @@ type SkillFormState = {
 
 type SkillSuggestion = {
   label: string
-  uri: string
+  publicId: string
+}
+
+type SkillComboboxOption = {
+  label: string
+  value: string
+  publicId?: string
+}
+
+type SkillComboboxElement = HTMLElement & {
+  suggestionProvider?: (query: string) => Promise<SkillComboboxOption[]>
+  options?: SkillComboboxOption[]
+  value?: string
+  inputValue?: string
+  label?: string
+  placeholder?: string
 }
 
 type SkillRerenderOptions = {
   focusSelector?: string
 }
 
-const ESCO_SKILL_SEARCH_URI = 'https://ec.europa.eu/esco/api/search?language=$(language)&limit=$(limit)&type=skill&text=$(name)'
+const ESCO_SKILL_SEARCH_URI = 'https://ec.europa.eu/esco/api/search?language=$(language)&limit=$(limit)&type=skill&text=$(name)&selectedVersion=v1.2.0'
 const ESCO_SEARCH_LANGUAGE = 'en'
 const ESCO_SEARCH_LIMIT = 8
 const ESCO_SKILL_BASE_URI = 'http://data.europa.eu/esco/skill/'
@@ -40,6 +57,7 @@ const ESCO_SKILL_BASE_URI = 'http://data.europa.eu/esco/skill/'
 function normalizeSkillPublicId(value: string): string {
   const normalized = sanitizeSkillFieldValue(value)
   if (!normalized) return ''
+  if (normalized.startsWith('_:')) return normalized
   if (normalized.startsWith('skill:')) return normalized
   if (normalized.startsWith(ESCO_SKILL_BASE_URI)) {
     const suffix = normalized.slice(ESCO_SKILL_BASE_URI.length)
@@ -76,8 +94,8 @@ async function fetchEscoSkillSuggestions(name: string): Promise<SkillSuggestion[
     return results
       .map((result: any) => {
         const label = sanitizeSkillFieldValue(toSkillLabel(result))
-        const uri = typeof result?.uri === 'string' ? result.uri : ''
-        return { label, uri }
+        const publicId = normalizeSkillPublicId(typeof result?.uri === 'string' ? result.uri : '')
+        return { label, publicId }
       })
       .filter((suggestion: SkillSuggestion) => {
         if (!suggestion.label) return false
@@ -119,40 +137,98 @@ function toFormState(details: SkillDetails[]): SkillFormState {
   }
 }
 
-function matchSkillSuggestion(suggestions: SkillSuggestion[], value: string): SkillSuggestion | null {
-  const normalized = sanitizeSkillFieldValue(value).toLowerCase()
-  if (!normalized) return null
-  return suggestions.find((suggestion) => suggestion.label.toLowerCase() === normalized) || null
+function toSkillComboboxOption(suggestion: SkillSuggestion): SkillComboboxOption {
+  return {
+    label: suggestion.label,
+    value: suggestion.publicId,
+    publicId: suggestion.publicId
+  }
 }
 
-function validateSkillsBeforeSave(rows: SkillRow[]): string | null {
-  const ops = summarizeRowOps(rows, rowHasContent)
-  const hasChanges = ops.create.length > 0 || ops.update.length > 0 || ops.remove.length > 0
-  if (!hasChanges) return 'No skill changes detected.'
+function readSkillComboboxInputValue(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
+
+  const target = event.target as HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
 
-  for (let i = 0; i < rows.length; i++) {
-    const row = rows[i]
-    if (!row || row.status === 'deleted') continue
-    if (!hasNonEmptyText(row.name)) continue
+function readSkillComboboxChange(event: Event): SkillComboboxOption | null {
+  const customEvent = event as CustomEvent<{
+    value?: string
+    label?: string
+    option?: SkillComboboxOption
+  }>
 
-    if (row.status !== 'existing' && !hasNonEmptyText(row.publicId)) {
-      return `Skill ${i + 1}: please select a skill from the ESCO suggestions.`
-    }
+  if (customEvent.detail?.option) {
+    return customEvent.detail.option
   }
 
   return null
 }
 
-function hasInvalidSkillSelection(rows: SkillRow[]): boolean {
-  return rows.some((row) => {
-    if (!row || row.status === 'deleted') return false
-    if (!hasNonEmptyText(row.name)) return false
-    return !hasNonEmptyText(row.publicId)
+function createSkillSuggestionProvider(): (query: string) => Promise<SkillComboboxOption[]> {
+  return async (query: string) => {
+    const suggestions = await fetchEscoSkillSuggestions(query)
+    return suggestions.map(toSkillComboboxOption)
+  }
+}
+
+function initializeSkillComboboxes(form: HTMLFormElement, rows: SkillRow[]): void {
+  const comboboxElements = form.querySelectorAll('solid-ui-combobox[data-skill-row-index]') as NodeListOf<SkillComboboxElement>
+
+  comboboxElements.forEach((comboboxElement) => {
+    const rowIndex = Number(comboboxElement.dataset.skillRowIndex)
+    if (Number.isNaN(rowIndex)) return
+
+    const row = rows[rowIndex]
+    const nextInputValue = row?.name || ''
+    const options = row?.publicId && row?.name
+      ? [{ label: row.name, value: row.publicId, publicId: row.publicId }]
+      : []
+
+    comboboxElement.suggestionProvider = createSkillSuggestionProvider()
+    comboboxElement.options = options
+    comboboxElement.value = row?.publicId || ''
+    comboboxElement.inputValue = nextInputValue
+    comboboxElement.label = ''
+    comboboxElement.placeholder = 'Skill'
+
+    const comboboxInput = comboboxElement.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    if (comboboxInput) {
+      comboboxInput.value = nextInputValue
+    }
+  })
+}
+
+function syncSkillRowsFromComboboxes(form: HTMLFormElement, rows: SkillRow[]): void {
+  const comboboxElements = form.querySelectorAll('solid-ui-combobox[data-skill-row-index]') as NodeListOf<SkillComboboxElement>
+
+  comboboxElements.forEach((comboboxElement) => {
+    const rowIndex = Number(comboboxElement.dataset.skillRowIndex)
+    if (Number.isNaN(rowIndex) || !rows[rowIndex]) return
+
+    const comboboxInput = comboboxElement.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    const nextName = sanitizeSkillFieldValue(comboboxInput?.value || comboboxElement.inputValue || '')
+    const nextPublicId = normalizeSkillPublicId(comboboxElement.value || '')
+
+    applyRowFieldChange(rows[rowIndex], 'name', nextName, rowHasContent)
+    rows[rowIndex].publicId = nextPublicId
   })
 }
 
+function validateSkillsBeforeSave(_rows: SkillRow[]): string | null {
+  return null
+}
+
+function hasInvalidSkillSelection(_rows: SkillRow[]): boolean {
+  return false
+}
+
 function updateSkillsSubmitEnabled(rows: SkillRow[]): void {
-  const submitButton = document.querySelector('#profile-modal #modal-buttons button.btn-primary') as HTMLButtonElement | null
+  const submitButton = getSharedDialogSaveButton(document)
   if (!submitButton) return
   submitButton.disabled = hasInvalidSkillSelection(rows)
 }
@@ -161,10 +237,30 @@ function focusSkillField(form: HTMLFormElement, selector: string): void {
   const nextField = form.querySelector(selector) as HTMLElement | null
   if (!nextField || typeof nextField.focus !== 'function') return
 
-  nextField.scrollIntoView({ block: 'start', behavior: 'auto' })
-  nextField.focus()
-  if (nextField instanceof HTMLInputElement || nextField instanceof HTMLTextAreaElement) {
-    nextField.select()
+  if (typeof nextField.scrollIntoView === 'function') {
+    nextField.scrollIntoView({ block: 'start', behavior: 'auto' })
+  }
+  const comboboxHost = nextField.tagName === 'SOLID-UI-COMBOBOX'
+    ? (nextField as HTMLElement & { _closePopup?: () => void })
+    : null
+  const comboboxInput = comboboxHost
+    ? comboboxHost.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    : null
+  const focusTarget = comboboxInput || nextField
+  focusTarget.focus()
+  if (focusTarget instanceof HTMLInputElement) {
+    const caretPosition = 0
+    focusTarget.setSelectionRange(caretPosition, caretPosition)
+    focusTarget.scrollLeft = 0
+    requestAnimationFrame(() => {
+      focusTarget.scrollLeft = 0
+    })
+  }
+
+  if (comboboxHost?._closePopup) {
+    requestAnimationFrame(() => {
+      comboboxHost._closePopup?.()
+    })
   }
 }
 
@@ -173,38 +269,34 @@ type SkillsInputRowProps = {
   index: number
   displayIndex: number
   onDelete: () => void
-  onChange: () => void
-  onSkillSearch: (rowIndex: number, term: string) => void
-  suggestions: SkillSuggestion[]
 }
 
 function renderSkillInputRow({
   rows,
   index,
   displayIndex,
-  onDelete,
-  onChange,
-  onSkillSearch,
-  suggestions
+  onDelete
 }: SkillsInputRowProps) {
-  const row = rows[index]
   const label = `Skill ${displayIndex + 1}`
-  const skillName = `skill-${index}`
-  const datalistId = `skill-suggestions-${index}`
-  const hasSelectionIssue = Boolean(row && row.status !== 'deleted' && hasNonEmptyText(row.name) && !hasNonEmptyText(row.publicId))
 
-  const handleSkillInput = (field: SkillEditableField) => (e: Event) => {
-    const target = e.target as HTMLInputElement
-    const nextValue = sanitizeSkillFieldValue(target.value)
+  const handleSkillInput = (_field: SkillEditableField) => (e: Event) => {
+    const nextValue = sanitizeSkillFieldValue(readSkillComboboxInputValue(e))
     if (rows[index]) {
-      applyRowFieldChange(rows[index], field, nextValue, rowHasContent)
-      const matchedSuggestion = matchSkillSuggestion(suggestions, nextValue)
-      rows[index].publicId = normalizeSkillPublicId(matchedSuggestion?.uri || '')
-      onSkillSearch(index, nextValue)
-      onChange()
+      applyRowFieldChange(rows[index], 'name', nextValue, rowHasContent)
+      rows[index].publicId = ''
+      updateSkillsSubmitEnabled(rows)
     }
   }
 
+  const handleSkillChange = (e: Event) => {
+    const selectedOption = readSkillComboboxChange(e)
+    if (!rows[index] || !selectedOption?.publicId) return
+
+    applyRowFieldChange(rows[index], 'name', sanitizeSkillFieldValue(selectedOption.label), rowHasContent)
+    rows[index].publicId = selectedOption.publicId
+    updateSkillsSubmitEnabled(rows)
+  }
+
   const handleDelete = (event: Event) => {
     event.preventDefault()
     onDelete()
@@ -213,40 +305,26 @@ function renderSkillInputRow({
   return html`
     <div class="profile-edit-dialog__row profile-edit-dialog__row--full profile-edit-dialog__row--skill">
       <label aria-label=${`${label} Name`} class="label profile-edit-dialog__field profile-edit-dialog__field--full">
-        <div class="profile-edit-dialog__input-wrap">
-          <span class="profile-edit-dialog__search-icon" aria-hidden="true">${searchIcon}</span>
-          <input
-            class="input profile-edit-dialog__input--with-leading-icon"
-            type="text"
-            name=${skillName}
-            .value=${row?.name || ''}
-            required
-            data-contact-field="name"
-            data-entry-node=${row?.entryNode || ''}
-            data-row-status=${row?.status || 'n/a'}
-            placeholder="Skill"
-            autocomplete="off"
-            list=${datalistId}
-            inputmode="text"
-            aria-invalid=${hasSelectionIssue ? 'true' : 'false'}
-            @input=${handleSkillInput('name')}
-          />
-        </div>
-        <datalist id=${datalistId}>
-          ${suggestions.map((suggestion) => html`<option value=${suggestion.label}></option>`)}
-        </datalist>
-        <small class="profile-edit-dialog__input-help-text">Type to search ESCO and select one suggestion.</small>
+        <solid-ui-combobox
+          aria-label=${`${label} Name`}
+          data-skill-row-index=${String(index)}
+          @input=${handleSkillInput('name')}
+          @change=${handleSkillChange}
+        ></solid-ui-combobox>
+        <small class="profile-edit-dialog__input-help-text">Type to search ESCO, or enter your own skill.</small>
       </label>
       <div class="profile-edit-dialog__actions profile-edit-dialog__actions--edge">
-        <button
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete skill ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
   `
@@ -254,9 +332,7 @@ function renderSkillInputRow({
 
 function renderSkillsSection(
   rows: SkillRow[],
-  onAddRow: (options?: SkillRerenderOptions) => void,
-  suggestionByIndex: Record<number, SkillSuggestion[]>,
-  handleSearch: (rowIndex: number, term: string) => void
+  onAddRow: (options?: SkillRerenderOptions) => void
 ) {
   const visibleRows = rows
     .map((row, index) => ({ row, index }))
@@ -270,12 +346,8 @@ function renderSkillsSection(
           rows,
           index,
           displayIndex,
-          onChange: onAddRow,
-          onSkillSearch: handleSearch,
-          suggestions: suggestionByIndex[index] || [],
           onDelete: () => {
             deleteRow(rows, index)
-            delete suggestionByIndex[index]
             onAddRow()
           }
         }))}
@@ -290,55 +362,19 @@ function renderSkillsEditTemplate(
   viewerMode: ViewerMode,
   options: SkillRerenderOptions = {}
 ) {
-  const formStateWithSearch = formState as SkillFormState & {
-    suggestionByIndex?: Record<number, SkillSuggestion[]>
-    searchSeqByIndex?: Record<number, number>
-    searchTimerByIndex?: Record<number, ReturnType<typeof setTimeout>>
-  }
-
-  const suggestionByIndex = formStateWithSearch.suggestionByIndex || (formStateWithSearch.suggestionByIndex = {})
-  const searchSeqByIndex = formStateWithSearch.searchSeqByIndex || (formStateWithSearch.searchSeqByIndex = {})
-  const searchTimerByIndex = formStateWithSearch.searchTimerByIndex || (formStateWithSearch.searchTimerByIndex = {})
-
-  const rerender = (nextOptions: SkillRerenderOptions = {}) => renderSkillsEditTemplate(form, formState, viewerMode, nextOptions)
-  const handleSearch = (rowIndex: number, term: string) => {
-    if (searchTimerByIndex[rowIndex]) {
-      clearTimeout(searchTimerByIndex[rowIndex])
-    }
-
-    const normalized = sanitizeSkillFieldValue(term)
-    if (normalized.length < 2) {
-      suggestionByIndex[rowIndex] = []
-      rerender()
-      return
-    }
-
-    const seq = (searchSeqByIndex[rowIndex] || 0) + 1
-    searchSeqByIndex[rowIndex] = seq
-
-    searchTimerByIndex[rowIndex] = setTimeout(async () => {
-      const suggestions = await fetchEscoSkillSuggestions(normalized)
-      if (searchSeqByIndex[rowIndex] !== seq) return
-      suggestionByIndex[rowIndex] = suggestions
-
-      const row = formState.skills[rowIndex]
-      if (row) {
-        const matchedSuggestion = matchSkillSuggestion(suggestions, row.name)
-        row.publicId = matchedSuggestion ? normalizeSkillPublicId(matchedSuggestion.uri) : row.publicId
-      }
-
-      rerender()
-    }, 220)
+  const rerender = (nextOptions: SkillRerenderOptions = {}) => {
+    syncSkillRowsFromComboboxes(form, formState.skills)
+    renderSkillsEditTemplate(form, formState, viewerMode, nextOptions)
   }
 
-
   render(html`
-    ${renderSkillsSection(formState.skills, rerender, suggestionByIndex, handleSearch)}
+    ${renderSkillsSection(formState.skills, rerender)}
     ${viewerMode !== 'owner'
       ? html`<p class="profile-edit-dialog__login-message">${ownerLoginRequiredDialogMessageText}</p>`
       : null}
   `, form)
 
+  initializeSkillComboboxes(form, formState.skills)
   updateSkillsSubmitEnabled(formState.skills)
 
   if (options.focusSelector) {
@@ -354,21 +390,14 @@ function createSkillsEditForm(details: SkillDetails[], viewerMode: ViewerMode) {
   renderSkillsEditTemplate(form, formState, viewerMode)
 
   const addRow = () => {
+    syncSkillRowsFromComboboxes(form, formState.skills)
     formState.skills.unshift({
       name: '',
       publicId: '',
       entryNode: '',
       status: 'new'
     })
-    const formStateWithSearch = formState as SkillFormState & {
-      suggestionByIndex?: Record<number, SkillSuggestion[]>
-      searchSeqByIndex?: Record<number, number>
-      searchTimerByIndex?: Record<number, ReturnType<typeof setTimeout>>
-    }
-    formStateWithSearch.suggestionByIndex = {}
-    formStateWithSearch.searchSeqByIndex = {}
-    formStateWithSearch.searchTimerByIndex = {}
-    renderSkillsEditTemplate(form, formState, viewerMode, { focusSelector: '[name="skill-0"]' })
+    renderSkillsEditTemplate(form, formState, viewerMode, { focusSelector: '[data-skill-row-index="0"]' })
   }
 
   return { form, formState, addRow }
@@ -390,6 +419,12 @@ export async function createSkillsEditDialog(
     title: editSkillsDialogTitleText,
     dom,
     form,
+    onOpen: () => focusSkillField(form, '[data-skill-row-index="0"]'),
+    shouldCloseWithoutSave: () => {
+      syncSkillRowsFromComboboxes(form, formState.skills)
+      const ops = summarizeRowOps(formState.skills, rowHasContent)
+      return ops.create.length === 0 && ops.update.length === 0 && ops.remove.length === 0
+    },
     headerAction: {
       type: 'button',
       label: '+ Add More',
@@ -399,12 +434,14 @@ export async function createSkillsEditDialog(
     submitLabel: dialogSubmitLabelText,
     cancelLabel: dialogCancelLabelText,
     validate: () => {
+      syncSkillRowsFromComboboxes(form, formState.skills)
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
       }
       return validateSkillsBeforeSave(formState.skills)
     },
     onSave: async () => {
+      syncSkillRowsFromComboboxes(form, formState.skills)
       const skillOps = summarizeRowOps(formState.skills, rowHasContent)
       const plan: MutationOps<SkillRow> = {
         create: skillOps.create,
@@ -414,8 +451,7 @@ export async function createSkillsEditDialog(
       await processSkillsMutations(store, subject, plan)
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return `${saveContactUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveSkillsUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/skills/SkillsSection.css b/src/sections/skills/SkillsSection.css
new file mode 100644
index 00000000..5778d50a
--- /dev/null
+++ b/src/sections/skills/SkillsSection.css
@@ -0,0 +1,173 @@
+/* Skills list */
+.skills__list {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+  align-items: flex-start;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  gap: var(--spacing-base, 0.5rem);
+}
+
+.skills__item,
+.skills__remove-button svg,
+solid-ui-button.skills__remove-button {
+  --skills-remove-icon-size: var(--icon-xxs, 1rem);
+}
+
+/* Skill chip */
+.skills__item {
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 0.375rem;
+  padding: var(--spacing-base, 0.5rem) var(--spacing-2xs, 0.625rem);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  background: var(--color-surface-chip, var(--gray-100, #F3F4F6));
+  width: fit-content;
+  max-width: 100%;
+}
+
+.skills__item[data-pending='true'] {
+  opacity: 0.55;
+}
+
+.skills__item-label {
+  display: inline;
+  color: var(--color-text-strong, var(--slate-900, #0F172B));
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-md, 500);
+  line-height: 1.2;
+  overflow-wrap: anywhere;
+}
+
+.skills__item-tail {
+  display: inline-flex;
+  align-items: center;
+  white-space: nowrap;
+}
+
+.skills__item-tail::before {
+  content: '\00a0';
+}
+
+.skills__empty-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+/* Remove button */
+solid-ui-button.skills__remove-button {
+  width: var(--skills-remove-icon-size);
+  height: var(--skills-remove-icon-size);
+  line-height: 0;
+  vertical-align: text-top;
+  --button-height-sm: var(--skills-remove-icon-size);
+  --button-padding-sm: 0;
+  --button-icon-size-sm: var(--skills-remove-icon-size);
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: currentColor;
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: currentColor;
+}
+
+solid-ui-button.skills__remove-button[data-loading='true'] {
+  pointer-events: none;
+}
+
+.skills__remove-button svg {
+  display: block;
+  width: var(--skills-remove-icon-size);
+  height: var(--skills-remove-icon-size);
+}
+
+.profile__section[data-profile-section='skills'] .profile-section-inline-error {
+  margin-top: var(--spacing-sm, 0.938rem);
+  padding: var(--spacing-xs, 0.75rem);
+  border: 1px solid var(--dialog-error-border, var(--pink-700, #ff98b3));
+  border-radius: var(--border-radius-base, 0.3125rem);
+  background: var(--dialog-error-background, var(--pink-500, #ffdde6));
+  color: var(--dialog-error-text, var(--red-600, #B00020));
+  text-align: left;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .skills__list {
+  align-items: flex-start;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .skills__item {
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 0.375rem;
+  padding: var(--spacing-base, 0.5rem) var(--spacing-2xs, 0.625rem);
+  width: fit-content;
+  max-width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .skills__item-label {
+  font-size: var(--font-size-sm, 0.875rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .skills__item-tail::before {
+  content: none;
+}
+
+@media (max-width: 576px) {
+  .skills__list {
+    align-items: flex-start;
+  }
+
+  .skills__item {
+    display: inline-flex;
+    align-items: center;
+    justify-content: flex-start;
+    gap: 0.375rem;
+    padding: var(--spacing-base, 0.5rem) var(--spacing-2xs, 0.625rem);
+    width: fit-content;
+    max-width: 100%;
+  }
+
+  .skills__item-label {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+
+  .skills__item-tail::before {
+    content: none;
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .skills__list {
+    align-items: flex-start;
+  }
+
+  .skills__item {
+    display: inline-flex;
+    align-items: center;
+    justify-content: flex-start;
+    gap: 0.375rem;
+    padding: var(--spacing-base, 0.5rem) var(--spacing-2xs, 0.625rem);
+    width: fit-content;
+    max-width: 100%;
+  }
+
+  .skills__item-label {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+
+  .skills__item-tail::before {
+    content: none;
+  }
+}
diff --git a/src/sections/skills/SkillsSection.ts b/src/sections/skills/SkillsSection.ts
index 55530772..37f3fec1 100644
--- a/src/sections/skills/SkillsSection.ts
+++ b/src/sections/skills/SkillsSection.ts
@@ -1,13 +1,35 @@
 import { html } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { strToUpperCase } from '../../textUtils'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ViewerMode } from '../../types'
+import './SkillsSection.css'
 import { createSkillsEditDialog } from './SkillsEditDialog'
 import { SkillDetails, SkillRow } from './types'
-import { addIcon, deleteIcon, editIcon, lighteningIcon } from '../../icons-svg/profileIcons'
+import { addIcon, chevronDownIcon, deleteIcon, editIcon, lighteningIcon } from '../../icons-svg/profileIcons'
 import { skillsHeadingText } from '../../texts'
 import { toggleCollapsibleSection } from '../shared/collapsibleSection'
 import { processSkillsMutations } from './mutations'
+import { formatDisplayError } from '../../utils/errorDisplay'
+
+const removeSkillFailedMessageText = 'Unable to remove your skill.'
+
+function setSkillsSectionError(section: HTMLElement, message: string | null): void {
+  const errorBox = section.querySelector('.profile-section-inline-error') as HTMLElement | null
+  if (!errorBox) return
+
+  if (!message) {
+    errorBox.textContent = ''
+    errorBox.hidden = true
+    errorBox.setAttribute('aria-hidden', 'true')
+    return
+  }
+
+  errorBox.textContent = message
+  errorBox.hidden = false
+  errorBox.setAttribute('aria-hidden', 'false')
+  errorBox.focus()
+}
 
 function renderSkillItem(
   detail: SkillDetails,
@@ -21,6 +43,9 @@ function renderSkillItem(
   const handleRemove = async (event: Event) => {
     event.preventDefault()
     if (viewerMode !== 'owner') return
+    const removeButton = event.currentTarget as HTMLElement | null
+    const skillRow = removeButton?.closest('.skills__item') as HTMLElement | null
+    const section = (event.currentTarget as HTMLElement | null)?.closest('[data-profile-section="skills"]') as HTMLElement | null
 
     const removeRow: SkillRow = {
       name: detail.name,
@@ -29,30 +54,52 @@ function renderSkillItem(
       status: 'deleted'
     }
 
-    await processSkillsMutations(store, subject, {
-      create: [],
-      update: [],
-      remove: [removeRow]
-    })
+    try {
+      removeButton?.setAttribute('disabled', '')
+      removeButton?.setAttribute('aria-busy', 'true')
+      removeButton?.setAttribute('data-loading', 'true')
+      skillRow?.setAttribute('data-pending', 'true')
+      await processSkillsMutations(store, subject, {
+        create: [],
+        update: [],
+        remove: [removeRow]
+      })
 
-    if (onSaved) {
-      await onSaved()
+      if (section) {
+        setSkillsSectionError(section, null)
+      }
+      if (onSaved) {
+        await onSaved()
+      }
+    } catch (error) {
+      if (section) {
+        setSkillsSectionError(section, formatDisplayError(error, removeSkillFailedMessageText))
+      }
+    } finally {
+      removeButton?.removeAttribute('disabled')
+      removeButton?.setAttribute('aria-busy', 'false')
+      removeButton?.removeAttribute('data-loading')
+      skillRow?.removeAttribute('data-pending')
     }
   }
 
   return html`
-    <li class="skills__item inline-flex-row" role="listitem">
+    <li class="skills__item" role="listitem">
       <span class="skills__item-label">${strToUpperCase(detail.name)}</span>
       ${viewerMode === 'owner'
         ? html`
-            <button
-              type="button"
-              class="skills__remove-button inline-flex-row"
-              aria-label="Remove ${detail.name} skill"
-              @click=${handleRemove}
-            >
-              ${deleteIcon}
-            </button>
+            <span class="skills__item-tail">
+              <solid-ui-button
+                type="button"
+                variant="icon"
+                size="sm"
+                class="skills__remove-button"
+                aria-label=${`Remove ${detail.name} skill`}
+                @click=${handleRemove}
+              >
+                <span slot="icon" aria-hidden="true">${deleteIcon}</span>
+              </solid-ui-button>
+            </span>
           `
         : ''}
     </li>
@@ -65,58 +112,70 @@ function renderSkillsSectionDefault(store: LiveStore, subject: NamedNode, skills
 
   return html`
     <section
-      class="profile__section border-lighter profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+      class="profile__section profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+      data-profile-section="skills"
       aria-labelledby="skills-heading"
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
-        <h2 id="skills-heading">${skillsHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
+        <h3 id="skills-heading">${skillsHeadingText}</h3>
+        <div class="profile-section-collapsible__actions">
           ${isOwner ? html`
-            <button
+            <solid-ui-button
               type="button"
-              class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+              variant="secondary"
+              size="sm"
+              class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
               aria-label="Add or edit skills"
               @click=${(event: Event) => createSkillsEditDialog(event, store, subject, skills, viewerMode, onSaved)}
             >
-              <span class="profile-section-collapsible__edit-label profile__add-more-content inline-flex-row">
-                <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-                Add More
+              <span class="profile-section-collapsible__edit-label profile__add-more-content">
+                <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+                <span>Add More</span>
               </span>
               <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-            </button>
+            </solid-ui-button>
           ` : html``}
-          <button
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle skills section"
             aria-controls="skills-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
       <div
         id="skills-panel"
         class="profile-section-collapsible__content"
-        aria-hidden="true"
       >
         ${hasSkills
           ? html`
-              <ul class="skills__list flex-column" role="list" aria-label="Professional skills and competencies">
+              <ul class="skills__list" role="list" aria-label="Professional skills and competencies">
                 ${skills.map((detail) => renderSkillItem(detail, store, subject, viewerMode, onSaved))}
               </ul>
+              <div
+                class="profile-section-inline-error"
+                role="alert"
+                aria-live="assertive"
+                aria-atomic="true"
+                aria-hidden="true"
+                tabindex="-1"
+                hidden
+              ></div>
             `
           : html`<p>No skills added yet.</p>`}
       </div>
     </section>
   `
 }
-
 function renderOwnerEmptySkillsContent(
   _store: LiveStore,
   _subject: NamedNode,
@@ -125,9 +184,9 @@ function renderOwnerEmptySkillsContent(
   _onSaved?: () => Promise<void> | void
 ) {
   return html`
-      <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty skills section">    
+      <div class="profile__empty-state-content" role="group" aria-label="Empty skills section">    
         <div class="skills__empty-icon-wrapper">
-          <span class="skills__empty-icon inline-flex-row">${lighteningIcon}</span>
+          <span class="skills__empty-icon">${lighteningIcon}</span>
         </div>
         <p class="profile__empty-state-message skills__empty-message">
             No skills added yet.
@@ -147,17 +206,19 @@ function renderOwnerEmptySkillsSection(
     <section 
       aria-labelledby="skills-heading" 
       data-profile-section="skills"
-      class="profile__section--empty border-lighter rounded-md gap-lg profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
+      class="profile__section--empty profile__section--empty-sidebar profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
-        <h2 id="skills-heading" tabindex="-1">${skillsHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
-          <button
+        <h3 id="skills-heading" tabindex="-1">${skillsHeadingText}</h3>
+        <div class="profile-section-collapsible__actions">
+          <solid-ui-button
             type="button"
-            class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+            variant="secondary"
+            size="sm"
+            class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
             aria-label="Add skills"
             @click=${(event: Event) => {
               return createSkillsEditDialog(
@@ -170,25 +231,27 @@ function renderOwnerEmptySkillsSection(
               )
             }}
           >
-            <span class="profile-section-collapsible__edit-label profile__add-more-content inline-flex-row">
-              <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-              Add Skills
+            <span class="profile-section-collapsible__edit-label profile__add-more-content">
+              <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+              <span>Add More</span>
             </span>
             <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-          </button>
-          <button
+          </solid-ui-button>
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle skills section"
             aria-controls="skills-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="skills-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="skills-panel" class="profile-section-collapsible__content">
         ${renderOwnerEmptySkillsContent(store, subject, skills, viewerMode, onSaved)}
       </div>
     </section>
diff --git a/src/sections/skills/mutations.ts b/src/sections/skills/mutations.ts
index 82c97652..587a43b2 100644
--- a/src/sections/skills/mutations.ts
+++ b/src/sections/skills/mutations.ts
@@ -1,10 +1,11 @@
-import { LiveStore, NamedNode, st, literal, sym } from 'rdflib'
+import { blankNode, LiveStore, NamedNode, Node, st, literal, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { SkillRow } from './types'
-import { MutationOps } from '../shared/types'
-import { applyUpdaterPatch, collectLinkedNodeStatements, collectNodeStatements, findExistingNode } from '../shared/rdfMutationHelpers'
+import { MutationOps, RdfStatement } from '../shared/types'
+import { collectLinkedNodeStatements, collectNodeStatements, findExistingNode, registerStorePrefix, runUpdateTransport } from '../shared/rdfMutationHelpers'
 import { createIdNode } from '../shared/idNodeFactory'
-import { mutationSaveSkillsFailedPrefixText } from '../../texts'
+import { saveSkillsUpdatesFailedMessageText, skillsMutationSaveFailedDebugText } from '../../texts'
+import { error as debugError } from '../../utils/debug'
 
 export type SkillMutationPlan = MutationOps<SkillRow>
 
@@ -12,28 +13,26 @@ const ESCO_SKILL_BASE_URI = 'http://data.europa.eu/esco/skill/'
 const SKILL_PREFIX_BASE_URI = 'skill:'
 
 function ensureSkillPrefix(store: LiveStore) {
-  const anyStore = store as any
-  if (typeof anyStore.setPrefixForURI === 'function') {
-    anyStore.setPrefixForURI('skill', SKILL_PREFIX_BASE_URI)
-    return
-  }
-  if (!anyStore.namespaces) {
-    anyStore.namespaces = {}
-  }
-  anyStore.namespaces.skill = SKILL_PREFIX_BASE_URI
+  registerStorePrefix(store, 'skill', SKILL_PREFIX_BASE_URI)
 }
 
-function normalizeSkillPublicIdUri(publicId: string): string {
+function buildSkillPublicIdNode(publicId: string): Node {
   const normalized = publicId.trim()
-  if (!normalized) return normalized
+  if (!normalized) return blankNode()
+  if (normalized.startsWith('_:')) {
+    return blankNode(normalized.slice(2))
+  }
   if (normalized.startsWith('skill:')) {
-    return normalized
+    return sym(normalized)
   }
   if (normalized.startsWith(ESCO_SKILL_BASE_URI)) {
     const suffix = normalized.slice(ESCO_SKILL_BASE_URI.length)
-    return suffix ? `skill:${suffix}` : normalized
+    return sym(suffix ? `skill:${suffix}` : normalized)
   }
-  return normalized
+  if (!normalized.includes(':')) {
+    return blankNode(normalized)
+  }
+  return sym(normalized)
 }
 
 function normalizeNodeId(value: string): string {
@@ -57,14 +56,11 @@ function collectSkillLinkStatementsByEntryValue(
 
 function buildSkillsStatements(subject: NamedNode, doc: NamedNode, node: NamedNode, skill: SkillRow) {
   if (!skill.name) return []
-  if (!skill.publicId) {
-    throw new Error(`Missing skill publicId for skill: ${skill.name}`)
-  }
-  const publicIdNode = sym(normalizeSkillPublicIdUri(skill.publicId))
+  const publicIdNode = buildSkillPublicIdNode(skill.publicId)
 
   return [
     st(subject, ns.schema('skills'), node, doc),
-    st(node, ns.solid('publicId'), publicIdNode as any, doc),
+    st(node, ns.solid('publicId'), publicIdNode, doc),
     st(publicIdNode as any, ns.schema('name'), literal(skill.name), doc)
   ]
 }
@@ -74,8 +70,8 @@ async function mutateSkillsEntries(store: LiveStore, subject: NamedNode, skillOp
   const doc = subject.doc()
   const existingSkillNodes = store.each(subject, ns.schema('skills'))
 
-  const deletions: any[] = []
-  const insertions: any[] = []
+  const deletions: RdfStatement[] = []
+  const insertions: RdfStatement[] = []
 
   const collectLinkedPublicIdStatements = (skillNode: NamedNode) => {
     const linkedPublicIdStatements = collectLinkedNodeStatements(store, skillNode, ns.solid('publicId'), doc)
@@ -121,7 +117,12 @@ async function mutateSkillsEntries(store: LiveStore, subject: NamedNode, skillOp
     insertions.push(...buildSkillsStatements(subject, doc, createIdNode(doc), skill))
   })
 
-  await applyUpdaterPatch(store, deletions, insertions)
+  await runUpdateTransport(store, doc, deletions, insertions, {
+    unsupportedMessage: 'Skill updates are not supported by this store updater.',
+    failureMessage: 'Failed to save skills',
+    useDavFallback: true,
+    usePutFallback: true
+  })
 }
 
 export async function processSkillsMutations(store: LiveStore, subject: NamedNode, mutationPlan: SkillMutationPlan) {
@@ -129,7 +130,8 @@ export async function processSkillsMutations(store: LiveStore, subject: NamedNod
     await mutateSkillsEntries(store, subject, mutationPlan)
 
   } catch (error) {
-    const message = error instanceof Error ? error.message : String(error)
-    throw new Error(`${mutationSaveSkillsFailedPrefixText} ${message}`)
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(skillsMutationSaveFailedDebugText, rootError)
+    throw new Error(saveSkillsUpdatesFailedMessageText, { cause: rootError })
   }
 } 
diff --git a/src/sections/skills/selectors.ts b/src/sections/skills/selectors.ts
index ba23bf44..4a4c697e 100644
--- a/src/sections/skills/selectors.ts
+++ b/src/sections/skills/selectors.ts
@@ -11,10 +11,12 @@ export function skillAsText (store: Store, sk: Node):string {
 
   // Canonical shape: entry node -> solid:publicId -> schema:name.
   const publicId = store.any(sk as NamedNode, ns.solid('publicId')) as Node | null
-  if (publicId && publicId.termType === 'NamedNode') {
+  if (publicId && (publicId.termType === 'NamedNode' || publicId.termType === 'BlankNode')) {
     const name = store.anyJS(publicId as NamedNode, ns.schema('name'))
     if (name) return name
-    return utils.label(publicId, true)
+    if (publicId.termType === 'NamedNode') {
+      return utils.label(publicId, true)
+    }
   }
 
   return ''
@@ -26,7 +28,9 @@ export function presentSkillDetails(subject: NamedNode, store: LiveStore): Skill
     .filter((sk) => sk.termType !== 'Literal')
     .map((sk) => {
       const publicId = store.any(sk as NamedNode, ns.solid('publicId')) as Node | null
-      const publicIdUri = publicId ? publicId.value : ''
+      const publicIdUri = publicId
+        ? (publicId.termType === 'BlankNode' ? `_:${publicId.value}` : publicId.value)
+        : ''
       return {
         name: skillAsText(store, sk),
         publicId: publicIdUri,
diff --git a/src/sections/social/SocialEditDialog.ts b/src/sections/social/SocialEditDialog.ts
index 79ac4066..cf1de408 100644
--- a/src/sections/social/SocialEditDialog.ts
+++ b/src/sections/social/SocialEditDialog.ts
@@ -1,7 +1,9 @@
 import { openInputDialog } from '../../ui/dialog'
 import { html, render } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import 'solid-ui/components/forms/select'
 import type { Account, SocialRow } from './types'
-import '../../styles/ContactInfoEditDialog.css'
+import '../contactInfo/ContactInfoEditDialog.css'
 import '../../styles/EditDialogs.css'
 import { LiveStore, NamedNode } from 'rdflib'
 import { ViewerMode } from '../../types'
@@ -16,7 +18,7 @@ import {
   dialogSubmitLabelText,
   editSocialDialogTitleText,
   ownerLoginRequiredDialogMessageText,
-  saveSocialUpdatesFailedPrefixText
+  saveSocialUpdatesFailedMessageText
 } from '../../texts'
 import { DEFAULT_ICON_URI } from './constants'
 import { findSocialAccountOption, getSocialAccountOptions, type SocialAccountOption } from './helpers'
@@ -38,6 +40,17 @@ type SocialRerenderOptions = {
   focusSelector?: string
 }
 
+type SocialAccountSelectOption = {
+  label: string
+  value: string
+}
+
+type SocialAccountSelectElement = HTMLElement & {
+  options?: SocialAccountSelectOption[]
+  value?: string
+  label?: string
+}
+
 type SocialRowInputProps = {
   rows: SocialRow[]
   index: number
@@ -52,6 +65,67 @@ type SocialRowInputProps = {
   isDropTarget: boolean
 }
 
+function toSocialAccountSelectOptions(options: SocialAccountOption[]): SocialAccountSelectOption[] {
+  return options.map((option) => ({
+    label: option.label,
+    value: option.label
+  }))
+}
+
+function getSocialAccountSelectValue(row: SocialRow, options: SocialAccountOption[]): string {
+  const selected = findSocialAccountOption(options, row?.name || '')
+  return selected?.label || ''
+}
+
+function readSocialAccountTypeChange(event: Event): string {
+  const customEvent = event as CustomEvent<{ value?: string }>
+  if (typeof customEvent.detail?.value === 'string') {
+    return customEvent.detail.value
+  }
+
+  const target = event.target as HTMLSelectElement | HTMLInputElement | null
+  return typeof target?.value === 'string' ? target.value : ''
+}
+
+function initializeSocialAccountSelects(
+  form: HTMLFormElement,
+  rows: SocialRow[],
+  options: SocialAccountOption[]
+): void {
+  const selectOptions = toSocialAccountSelectOptions(options)
+  const selectElements = form.querySelectorAll('solid-ui-select[data-social-account-row-index]') as NodeListOf<SocialAccountSelectElement>
+
+  selectElements.forEach((selectElement) => {
+    const rowIndex = Number(selectElement.dataset.socialAccountRowIndex)
+    if (Number.isNaN(rowIndex)) return
+
+    const row = rows[rowIndex]
+    if (!row) return
+
+    selectElement.options = selectOptions
+    selectElement.value = getSocialAccountSelectValue(row, options)
+    selectElement.label = ''
+  })
+}
+
+function focusSocialField(form: HTMLFormElement, selector: string): void {
+  const nextField = form.querySelector(selector) as HTMLElement | null
+  if (!nextField) return
+
+  if (typeof nextField.scrollIntoView === 'function') {
+    nextField.scrollIntoView({ block: 'start', behavior: 'auto' })
+  }
+  if (nextField.tagName === 'SOLID-UI-SELECT') {
+    const triggerButton = nextField.shadowRoot?.querySelector('button') as HTMLButtonElement | null
+    triggerButton?.focus()
+    return
+  }
+
+  if (typeof nextField.focus === 'function') {
+    nextField.focus()
+  }
+}
+
 function sanitizeSocialFieldValue(value: string): string {
   return sanitizeTextValue(value)
 }
@@ -60,17 +134,6 @@ function sanitizeUrlFieldValue(value: string): string {
   return sanitizeTextValue(value).replace(/\s+/g, '')
 }
 
-function isValidProfileUrl(value: string): boolean {
-  const normalized = (value || '').trim()
-  if (!normalized) return false
-  try {
-    const parsed = new URL(normalized)
-    return parsed.protocol === 'http:' || parsed.protocol === 'https:'
-  } catch {
-    return false
-  }
-}
-
 function rowHasContent(row: SocialRow): boolean {
   // A social account is considered meaningful only when a personal profile URL is set.
   return hasNonEmptyText(row.homepage)
@@ -109,12 +172,7 @@ function hasOrderChanged(rows: SocialRow[], initialExistingOrder: string[]): boo
   return false
 }
 
-function validateSocialBeforeSave(rows: SocialRow[], initialExistingOrder: string[]): string | null {
-  const ops = summarizeRowOps(rows, rowHasContent)
-  const hasChanges = ops.create.length > 0 || ops.update.length > 0 || ops.remove.length > 0
-  const orderChanged = hasOrderChanged(rows, initialExistingOrder)
-  if (!hasChanges && !orderChanged) return 'No social changes detected.'
-
+function validateSocialBeforeSave(rows: SocialRow[]): string | null {
   for (let i = 0; i < rows.length; i++) {
     const row = rows[i]
     if (!row || row.status === 'deleted') continue
@@ -129,10 +187,6 @@ function validateSocialBeforeSave(rows: SocialRow[], initialExistingOrder: strin
     if (!hasNonEmptyText(row.homepage)) {
       return `Social account ${i + 1}: please enter your personal profile link.`
     }
-
-    if (!isValidProfileUrl(row.homepage || '')) {
-      return `Social account ${i + 1}: profile link must be a valid http(s) URL.`
-    }
   }
 
   return null
@@ -144,22 +198,19 @@ function renderSocialAccountInputSelect(
   options: SocialAccountOption[],
   onChange: (event: Event) => void
 ) {
-  const selected = findSocialAccountOption(options, row?.name || '')
-  const selectedLabel = selected?.label || ''
+  const selectedLabel = getSocialAccountSelectValue(row, options)
 
   return html`
-    <select
+    <solid-ui-select
       class="profile-edit-dialog__social-account-select"
       name=${`social-account-type-${rowIndex}`}
-      data-row-index=${String(rowIndex)}
+      data-social-account-row-index=${String(rowIndex)}
       autocomplete="off"
+      .options=${toSocialAccountSelectOptions(options)}
+      .value=${selectedLabel}
+      .label=${''}
       @change=${onChange}
-    >
-      <option value="">Select</option>
-      ${options.map((option) => html`
-        <option value=${option.label} ?selected=${option.label === selectedLabel}>${option.label}</option>
-      `)}
-    </select>
+    ></solid-ui-select>
   `
 }
 
@@ -192,8 +243,7 @@ function renderSocialInputRow({
   }
 
   const handleAccountTypeInput = (event: Event) => {
-    const target = event.target as HTMLSelectElement
-    const selected = findSocialAccountOption(options, target.value)
+    const selected = findSocialAccountOption(options, readSocialAccountTypeChange(event))
     if (!rows[index]) return
 
     if (!selected) {
@@ -220,17 +270,19 @@ function renderSocialInputRow({
       @dragover=${(event: DragEvent) => onDragOver(event)}
       @drop=${() => onDrop(index)}
     >
-      <button
+      <solid-ui-button
         type="button"
         class="profile-edit-dialog__drag-handle"
+        variant="icon"
+        size="md"
         aria-label=${`Reorder social account ${displayIndex + 1}`}
         title="Drag to reorder"
         draggable="true"
         @dragstart=${() => onDragStart(index)}
         @dragend=${() => onDragEnd()}
       >
-        ${bentoIcon}
-      </button>
+        <span slot="icon" aria-hidden="true">${bentoIcon}</span>
+      </solid-ui-button>
       <img 
         class="profile-edit-dialog__social-icon" 
         src="${row?.icon || DEFAULT_ICON_URI}" 
@@ -245,30 +297,32 @@ function renderSocialInputRow({
       <label aria-label=${homepageLabel} class="label profile-edit-dialog__field profile-edit-dialog__field--social-url">
         <input
           class="input"
-          type="url"
+          type="text"
           name=${`social-homepage-${index}`}
           .value=${row?.homepage || ''}
           data-contact-field="homepage"
           data-entry-node=${row?.entryNode || ''}
           data-row-status=${row?.status || 'n/a'}
-          placeholder="Profile URL"
-          autocomplete="url"
-          inputmode="url"
+          placeholder="Profile link or handle"
+          autocomplete="off"
+          inputmode="text"
           required
           @input=${handleTextInput('homepage')}
         />
-          <small class="profile-edit-dialog__input-help-text">Paste your full profile URL (for example: https://example.com/username)</small>
+          <small class="profile-edit-dialog__input-help-text">Enter your profile link, handle, or username.</small>
       </label>
       <div class="profile-edit-dialog__actions profile-edit-dialog__actions--edge">
-        <button
+        <solid-ui-button
           type="button"
+          variant="icon"
+          size="md"
           class="profile-edit-dialog__delete-button"
           aria-label=${`Delete social account ${displayIndex + 1}`}
           title=${deleteEntryButtonTitleText}
           @click=${handleDelete}
         >
-          <span class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
-        </button>
+          <span slot="icon" class="profile-edit-dialog__delete-icon" aria-hidden="true">${trashIcon}</span>
+        </solid-ui-button>
       </div>
     </div>
   `
@@ -342,14 +396,6 @@ function renderSocialSection(rows: SocialRow[], options: SocialAccountOption[],
   `
 }
 
-function focusSocialField(form: HTMLFormElement, selector: string): void {
-  const nextField = form.querySelector(selector) as HTMLElement | null
-  if (!nextField || typeof nextField.focus !== 'function') return
-
-  nextField.scrollIntoView({ block: 'start', behavior: 'auto' })
-  nextField.focus()
-}
-
 function renderSocialEditTemplate(
   form: HTMLFormElement,
   formState: SocialFormState,
@@ -366,6 +412,8 @@ function renderSocialEditTemplate(
       : null}
   `, form)
 
+  initializeSocialAccountSelects(form, formState.socialAccounts, socialOptions)
+
   if (rerenderOptions.focusSelector) {
     focusSocialField(form, rerenderOptions.focusSelector)
   }
@@ -410,6 +458,12 @@ export async function createSocialEditDialog(
     title: editSocialDialogTitleText,
     dom,
     form,
+    onOpen: () => focusSocialField(form, '[name="social-account-type-0"]'),
+    shouldCloseWithoutSave: () => {
+      const ops = summarizeRowOps(formState.socialAccounts, rowHasContent)
+      const orderChanged = hasOrderChanged(formState.socialAccounts, formState.initialExistingOrder)
+      return ops.create.length === 0 && ops.update.length === 0 && ops.remove.length === 0 && !orderChanged
+    },
     headerAction: {
       type: 'button',
       label: '+ Add More',
@@ -422,7 +476,7 @@ export async function createSocialEditDialog(
       if (viewerMode !== 'owner') {
         return ownerLoginRequiredDialogMessageText
       }
-      return validateSocialBeforeSave(formState.socialAccounts, formState.initialExistingOrder)
+      return validateSocialBeforeSave(formState.socialAccounts)
     },
     onSave: async () => {
       const socialOps = summarizeRowOps(formState.socialAccounts, rowHasContent)
@@ -434,10 +488,7 @@ export async function createSocialEditDialog(
       await processSocialMutations(store, subject, plan, formState.socialAccounts)
     },
     formatSaveError: (error: unknown) => {
-      const message = error instanceof Error ? error.message : String(error)
-      return message.startsWith(saveSocialUpdatesFailedPrefixText)
-        ? message
-        : `${saveSocialUpdatesFailedPrefixText} ${message}`
+      return error instanceof Error ? error.message : saveSocialUpdatesFailedMessageText
     }
   })
 
diff --git a/src/sections/social/SocialSection.css b/src/sections/social/SocialSection.css
new file mode 100644
index 00000000..781deaf7
--- /dev/null
+++ b/src/sections/social/SocialSection.css
@@ -0,0 +1,194 @@
+/* Social section styles. */
+
+.profile__section[data-profile-section='social'],
+.profile__section--empty[data-profile-section='social'] {
+  --social-card-collapsed-columns: repeat(5, max-content);
+  --social-card-expanded-columns: repeat(3, max-content);
+  --social-card-icon-size: var(--icon-base, 2rem);
+  --social-card-list-display: flex;
+  --social-card-list-columns: none;
+  --social-card-list-gap: var(--spacing-xxs, 0.3125rem);
+  --social-card-link-gap: var(--spacing-xs, 0.75rem);
+  --social-card-link-padding: var(--spacing-xs, 0.75rem);
+  --social-card-link-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff));
+  --social-card-hidden-item-display: flex;
+  --social-card-more-button-display: none;
+  --social-card-more-button-margin-top: var(--spacing-xs, 0.75rem);
+  border: var(--border-width-thin, 1px) solid var(--color-border-lighter, #D1D5DB);
+}
+
+.profile__section--empty[data-profile-section='social'] {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+/* Card and list */
+.social-card,
+.social-card__list {
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.social-card__list {
+  display: var(--social-card-list-display);
+  grid-template-columns: var(--social-card-list-columns);
+  flex-wrap: wrap;
+  justify-content: flex-start;
+  gap: var(--social-card-list-gap);
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.social-card__item,
+.social-card__link,
+.profile__section--empty[data-profile-section='social'] .profile__empty-state-content {
+  display: flex;
+  align-items: center;
+}
+
+.profile__section--empty[data-profile-section='social'] .profile__empty-state-content {
+  flex-direction: column;
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+.social__empty-icon {
+  display: inline-flex;
+}
+
+/* Links */
+.social-card__link {
+  color: var(--color-primary, #7C4DFF);
+  text-decoration: none;
+  gap: var(--social-card-link-gap);
+  padding: var(--social-card-link-padding);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  transition: background-color var(--animation-duration, 0.2s) ease;
+  position: relative;
+  flex: 1;
+  min-width: 0;
+}
+
+.social-card__link:hover,
+.social-card__link:focus {
+  text-decoration: underline;
+  background-color: var(--social-card-link-hover-background);
+}
+
+.social-card__link[href^="http"]:after {
+  content: " (external link)";
+  position: absolute;
+  left: -10000px;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+}
+
+.social-card__icon {
+  width: var(--social-card-icon-size);
+  height: var(--social-card-icon-size);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  background: var(--color-card-bg, #FFFFFF);
+  flex-shrink: 0;
+}
+
+/* Toggle button */
+
+solid-ui-button.social-card__more-button {
+  --button-height-sm: 0;
+  --button-padding-x-sm: 0;
+  --button-background: transparent;
+  --button-border: transparent;
+  --button-text: var(--color-primary, #7C4DFF);
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary, #7C4DFF);
+}
+
+.social-card__more-button,
+solid-ui-button.social-card__more-button::part(button) {
+  display: var(--social-card-more-button-display);
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: var(--color-primary, #7C4DFF);
+  font: inherit;
+  font-weight: var(--font-weight-bold, 600);
+  cursor: var(--profile-interactive-cursor, pointer);
+}
+
+.social-card[data-mobile-expanded="false"] .social-card__item:nth-child(n + 11) {
+  display: var(--social-card-hidden-item-display);
+}
+
+.social-card[data-mobile-expanded="true"] {
+  --social-card-list-columns: var(--social-card-expanded-columns);
+  --social-card-hidden-item-display: flex;
+  --social-card-more-button-display: none;
+}
+
+/* Compact layout */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section[data-profile-section='social'],
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section--empty[data-profile-section='social'] {
+  --social-card-list-display: grid;
+  --social-card-list-columns: var(--social-card-collapsed-columns);
+  --social-card-hidden-item-display: none;
+  --social-card-more-button-display: inline-flex;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .social-card .social-card__list {
+  justify-content: flex-start;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section[data-profile-section='social'] .profile-section-collapsible__toggle-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile__section--empty[data-profile-section='social'] .profile-section-collapsible__toggle-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .social-card__more-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] solid-ui-button.social-card__more-button::part(button) {
+  margin-top: var(--social-card-more-button-margin-top);
+}
+
+@media (max-width: 768px) {
+  .profile__section[data-profile-section='social'],
+  .profile__section--empty[data-profile-section='social'] {
+    --social-card-list-display: grid;
+    --social-card-list-columns: var(--social-card-collapsed-columns);
+    --social-card-hidden-item-display: none;
+    --social-card-more-button-display: inline-flex;
+  }
+
+  .social-card .social-card__list {
+    justify-content: flex-start;
+  }
+
+  .social-card__more-button,
+  solid-ui-button.social-card__more-button::part(button) {
+    margin-top: var(--social-card-more-button-margin-top);
+  }
+}
+
+@container profile-pane (max-width: 768px) {
+  .profile__section[data-profile-section='social'],
+  .profile__section--empty[data-profile-section='social'] {
+    --social-card-list-display: grid;
+    --social-card-list-columns: var(--social-card-collapsed-columns);
+    --social-card-hidden-item-display: none;
+    --social-card-more-button-display: inline-flex;
+  }
+
+  .social-card .social-card__list {
+    justify-content: flex-start;
+  }
+
+  .social-card__more-button,
+  solid-ui-button.social-card__more-button::part(button) {
+    margin-top: var(--social-card-more-button-margin-top);
+  }
+}
\ No newline at end of file
diff --git a/src/sections/social/SocialSection.ts b/src/sections/social/SocialSection.ts
index df1afa18..31312202 100644
--- a/src/sections/social/SocialSection.ts
+++ b/src/sections/social/SocialSection.ts
@@ -1,12 +1,13 @@
 import { html, TemplateResult } from 'lit-html'
+import 'solid-ui/components/actions/button'
 import { Account, SocialPresentation } from './types'
 import { ViewerMode } from '../../types'
-import '../../styles/SocialCard.css'
+import './SocialSection.css'
 import { socialAccountsHeadingText } from '../../texts'
 import { createSocialEditDialog } from './SocialEditDialog'
 import { LiveStore, NamedNode } from 'rdflib'
 import { toggleCollapsibleSection } from '../shared/collapsibleSection'
-import { addIcon, editIcon, globeIcon } from '../../icons-svg/profileIcons'
+import { addIcon, chevronDownIcon, editIcon, globeIcon } from '../../icons-svg/profileIcons'
 
 const MAX_VISIBLE_SOCIAL_ACCOUNTS_MOBILE = 10
 
@@ -16,7 +17,7 @@ function isRenderableAccount(account: Account): boolean {
 
 function expandSocialAccounts(event: Event): void {
   const button = event.currentTarget as HTMLButtonElement | null
-  const socialCard = button?.closest('.socialCard') as HTMLElement | null
+  const socialCard = button?.closest('.social-card') as HTMLElement | null
   if (!button || !socialCard) return
 
   socialCard.setAttribute('data-mobile-expanded', 'true')
@@ -26,10 +27,8 @@ function expandSocialAccounts(event: Event): void {
 
 export const SocialCard = (
   SocialData: SocialPresentation,
-  viewerMode: ViewerMode
+  _viewerMode: ViewerMode
 ): TemplateResult => {
-  void viewerMode
-
   const accounts = (SocialData.accounts || []).filter(isRenderableAccount)
   const hiddenAccountsCount = Math.max(0, accounts.length - MAX_VISIBLE_SOCIAL_ACCOUNTS_MOBILE)
 
@@ -37,27 +36,30 @@ export const SocialCard = (
 
     return html`
       <section
-        class="socialCard"
+        id="social-media"
+        class="social-card"
         aria-label="Social media"
-        data-testid="social-media"
-        data-mobile-expanded="${hiddenAccountsCount > 0 ? 'false' : 'true'}"
+        SocialData: SocialPresentation
       >
         <nav aria-label="Social media profiles">
-          <ul class="socialList list-reset" role="list">
+          <ul class="social-card__list" role="list">
             ${accounts.map(account => renderAccount(account))}
           </ul>
         </nav>
         ${hiddenAccountsCount > 0
           ? html`
-              <button
+              <solid-ui-button
                 type="button"
-                class="socialCard__more-button"
+                variant="secondary"
+                size="sm"
+                label=${`${hiddenAccountsCount} more`}
+                class="social-card__more-button"
                 aria-controls="social-media"
                 aria-expanded="false"
                 @click=${expandSocialAccounts}
               >
                 ${hiddenAccountsCount} more
-              </button>
+              </solid-ui-button>
             `
           : html``}
       </section>
@@ -68,15 +70,16 @@ export const SocialCard = (
 
   function renderAccount(account: Account) {
     return html`
-      <li class="socialItem" role="listitem">
+      <li class="social-card__item" role="listitem">
         <a 
+          class="social-card__link"
           href="${account.homepage}" 
           target="_blank" 
           rel="noopener noreferrer" 
           aria-label="Visit ${account.name} profile (opens in new tab)"
         >
           <img 
-            class="socialIcon" 
+            class="social-card__icon" 
             src="${account.icon}" 
             alt="${account.name} icon"
             width="40"
@@ -124,38 +127,46 @@ function renderSocialSectionDefault(
   return showSection ? html`
         <section 
           aria-labelledby="social-heading" 
-          class="profile__section border-lighter profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
+          data-profile-section="social"
+          class="profile__section profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
           role="region"
           tabindex="-1"
           data-expanded="false"
         >
           <header class="profile__section-header profile-section-collapsible__header">
-            <h2 id="social-heading" tabindex="-1">${socialAccountsHeadingText}</h2>
-            <div class="profile-section-collapsible__actions flex-column">
+            <h3 id="social-heading" tabindex="-1">${socialAccountsHeadingText}</h3>
+            <div class="profile-section-collapsible__actions">
               ${isOwner ? html`
-                <button
+                <solid-ui-button
                   type="button"
-                  class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+                  variant="secondary"
+                  size="sm"
+                  class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
                   aria-label="Edit social accounts"
                   @click=${handleEdit}
                 >
-                  <span class="profile-section-collapsible__edit-label">${editIcon} Edit</span>
+                  <span class="profile-section-collapsible__edit-label profile__add-more-content">
+                    <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+                    <span>Add More</span>
+                  </span>
                   <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-                </button>
+                </solid-ui-button>
               ` : html``}
-              <button
+              <solid-ui-button
                 type="button"
-                class="inline-flex-row"
+                variant="icon"
+                size="sm"
+                class="profile-section-collapsible__toggle-button"
                 aria-label="Toggle social accounts section"
                 aria-controls="social-panel"
                 aria-expanded="false"
                 @click=${toggleCollapsibleSection}
               >
-                <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-              </button>
+                <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+              </solid-ui-button>
             </div>
           </header>
-          <div id="social-panel" class="profile-section-collapsible__content" aria-hidden="true">
+          <div id="social-panel" class="profile-section-collapsible__content">
             ${renderSocialSectionContent(socialData, viewerMode)}
           </div>
         </section>
@@ -170,9 +181,9 @@ function renderOwnerEmptySocialContent(
   _onSaved?: () => Promise<void> | void
 ) {
   return html`
-      <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty social accounts section">
+      <div class="profile__empty-state-content" role="group" aria-label="Empty social accounts section">
         <div class="social__empty-icon-wrapper">
-          <span class="social__empty-icon inline-flex-row">${globeIcon}</span>
+          <span class="social__empty-icon">${globeIcon}</span>
         </div>
         <p class="profile__empty-state-message social__empty-message">
             No social media links added yet.
@@ -192,17 +203,19 @@ function renderOwnerEmptySocialSection(
     <section 
       aria-labelledby="social-heading" 
       data-profile-section="social"
-      class="profile__section--empty border-lighter flex-column-center rounded-md gap-lg profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
+      class="profile__section--empty profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
       role="region"
       tabindex="-1"
       data-expanded="false"
     >
       <header class="profile__section-header profile-section-collapsible__header">
-        <h2 id="social-heading" tabindex="-1">${socialAccountsHeadingText}</h2>
-        <div class="profile-section-collapsible__actions flex-column">
-          <button
+        <h3 id="social-heading" tabindex="-1">${socialAccountsHeadingText}</h3>
+        <div class="profile-section-collapsible__actions">
+          <solid-ui-button
             type="button"
-            class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+            variant="secondary"
+            size="sm"
+            class="profile__action-button profile-action-text profile-section-collapsible__edit-button"
             aria-label="Add social accounts"
             @click=${(event: Event) => {
               return createSocialEditDialog(
@@ -215,32 +228,34 @@ function renderOwnerEmptySocialSection(
               )
             }}
           >
-            <span class="profile-section-collapsible__edit-label profile__add-more-content inline-flex-row">
-              <span class="profile__add-more-icon inline-flex-row" aria-hidden="true">${addIcon}</span>
-              Add Account
+            <span class="profile-section-collapsible__edit-label profile__add-more-content">
+              <span class="profile__add-more-icon" aria-hidden="true">${addIcon}</span>
+              <span>Add More</span>
             </span>
             <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${editIcon}</span>
-          </button>
-          <button
+          </solid-ui-button>
+          <solid-ui-button
             type="button"
-            class="inline-flex-row"
+            variant="icon"
+            size="sm"
+            class="profile-section-collapsible__toggle-button"
             aria-label="Toggle social accounts section"
             aria-controls="social-panel"
             aria-expanded="false"
             @click=${toggleCollapsibleSection}
           >
-            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
-          </button>
+            <span slot="icon" class="profile-section-collapsible__chevron" aria-hidden="true">${chevronDownIcon}</span>
+          </solid-ui-button>
         </div>
       </header>
-      <div id="social-panel" class="profile-section-collapsible__content" aria-hidden="true">
+      <div id="social-panel" class="profile-section-collapsible__content">
         ${renderOwnerEmptySocialContent(store, subject, socialData, viewerMode, onSaved)}
       </div>
     </section>
   `
 }
 
-export function renderSocialAccounts(
+export function renderSocialSection(
   store: LiveStore,
   subject: NamedNode,
   socialData: SocialPresentation,
diff --git a/src/sections/social/mutations.ts b/src/sections/social/mutations.ts
index 033d20f4..5bb941d2 100644
--- a/src/sections/social/mutations.ts
+++ b/src/sections/social/mutations.ts
@@ -1,17 +1,20 @@
-import { blankNode, LiveStore, NamedNode, Node, st, literal, sym } from 'rdflib'
+import { Collection, LiveStore, NamedNode, Node, st, literal, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { SocialMutationPlan, SocialRow } from './types'
-import { MutationOps } from '../shared/types'
+import { MutationOps, RdfStatement } from '../shared/types'
 import { createIdNode } from '../shared/idNodeFactory'
 import {
-	applyUpdaterPatch,
 	collectNodeStatements,
-	findExistingNode
+	findExistingNode,
+	registerStorePrefix,
+	runUpdateTransport,
+	uniqueStatements
 } from '../shared/rdfMutationHelpers'
-import { saveSocialUpdatesFailedPrefixText, updaterUnsupportedStoreErrorMessageText } from '../../texts'
+import { socialMutationSaveFailedDebugText, saveSocialUpdatesFailedMessageText } from '../../texts'
 import { findSocialAccountOption, getSocialAccountOptions } from './helpers'
 import { presentSocial } from './selectors'
 import { expandRdfList } from '../shared/rdfList'
+import { error as debugError } from '../../utils/debug'
 /* The code below for handling reordering were generated by AI Model: GPT-5.3-Codex. */
 /* Prompt: can you implement on SocialEditDialog add the bentoIcon as the first item 
 on the row, you should be able to drag this button around and it should allow you 
@@ -21,37 +24,13 @@ that happen for this data. */
 const SOCIAL_ONTOLOGY_NS = 'https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#'
 
 function ensureSocialPrefix(store: LiveStore) {
-	const anyStore = store as any
-	if (typeof anyStore.setPrefixForURI === 'function') {
-		anyStore.setPrefixForURI('soc', SOCIAL_ONTOLOGY_NS)
-		return
-	}
-	if (!anyStore.namespaces) {
-		anyStore.namespaces = {}
-	}
-	anyStore.namespaces.soc = SOCIAL_ONTOLOGY_NS
-}
-
-function isSocialPatchDebugEnabled(): boolean {
-	const debugFlag = (globalThis as any)?.__PROFILE_PANE_SOCIAL_DEBUG__
-	return debugFlag === true || debugFlag === '1' || debugFlag === 'true'
+	registerStorePrefix(store, 'soc', SOCIAL_ONTOLOGY_NS)
 }
 
-function statementDebugValue(term: any): string {
-	if (!term) return ''
-	if (typeof term.toNT === 'function') return term.toNT()
-	if (typeof term.value === 'string') return term.value
-	return String(term)
+function nodeKey(node: Node): string {
+	return `${node.termType}:${node.value}`
 }
 
-function statementToDebugObject(statement: any) {
-	return {
-		subject: statementDebugValue(statement?.subject),
-		predicate: statementDebugValue(statement?.predicate),
-		object: statementDebugValue(statement?.object),
-		graph: statementDebugValue(statement?.why)
-	}
-}
 function toObjectNode(value?: string): Node | null {
 	const normalized = (value || '').trim()
 	if (!normalized) return null
@@ -109,9 +88,9 @@ function buildSocialStatements(
 	row: SocialRow,
 	accountOption?: { classUri: string, label: string, icon: string, userProfilePrefix?: string, homepage?: string }
 ) {
-	const inserts: any[] = []
+	const inserts: RdfStatement[] = []
 	if (accountOption?.classUri) {
-		inserts.push(st(node as any, ns.rdf('type'), sym(accountOption.classUri), doc))
+		inserts.push(st(node, ns.rdf('type'), sym(accountOption.classUri), doc))
 	}
 
 	const normalizedName = normalizeValue(row.name)
@@ -120,10 +99,10 @@ function buildSocialStatements(
 	if (isOther) {
 		const homepageNode = toObjectNode(row.homepage)
 		const iconNode = toObjectNode(row.icon)
-		if (homepageNode) inserts.push(st(node as any, ns.foaf('homepage'), homepageNode as any, doc))
-		if (iconNode) inserts.push(st(node as any, ns.foaf('icon'), iconNode as any, doc))
+		if (homepageNode) inserts.push(st(node, ns.foaf('homepage'), homepageNode, doc))
+		if (iconNode) inserts.push(st(node, ns.foaf('icon'), iconNode, doc))
 		if (normalizedName && normalizedName.toLowerCase() !== 'other') {
-			inserts.push(st(node as any, ns.rdfs('label'), literal(normalizedName), doc))
+			inserts.push(st(node, ns.rdfs('label'), literal(normalizedName), doc))
 		}
 		return inserts
 	}
@@ -131,122 +110,12 @@ function buildSocialStatements(
 	const accountPrefix = accountOption?.userProfilePrefix || accountOption?.homepage
 	const accountName = toAccountNameFromHomepage(normalizeValue(row.homepage), accountPrefix)
 	if (accountName) {
-		inserts.push(st(node as any, ns.foaf('accountName'), literal(accountName), doc))
+		inserts.push(st(node, ns.foaf('accountName'), literal(accountName), doc))
 	}
 
 	return inserts
 }
 
-function statementKey(statement: any): string {
-	return `${statement.subject?.toNT?.() || statement.subject?.value} ${statement.predicate?.toNT?.() || statement.predicate?.value} ${statement.object?.toNT?.() || statement.object?.value} ${statement.why?.toNT?.() || statement.why?.value}`
-}
-
-function uniqueStatements(statements: any[]): any[] {
-	return Array.from(new Map((statements || []).map((statement) => [statementKey(statement), statement])).values())
-}
-
-function buildRdfListStatements(doc: NamedNode, items: NamedNode[]) {
-	if (!items.length) {
-		return {
-			head: ns.rdf('nil') as Node,
-			statements: [] as any[]
-		}
-	}
-
-	const listNodes = items.map(() => blankNode())
-	const statements: any[] = []
-
-	items.forEach((item, index) => {
-		const current = listNodes[index]
-		const next = listNodes[index + 1] || ns.rdf('nil')
-		statements.push(st(current as any, ns.rdf('first'), item as any, doc))
-		statements.push(st(current as any, ns.rdf('rest'), next as any, doc))
-	})
-
-	return {
-		head: listNodes[0] as Node,
-		statements
-	}
-}
-
-function isPatchFailure(message: string): boolean {
-	const text = (message || '').toLowerCase()
-	return text.includes(' on patch ') || text.includes('web error: 400') || text.includes('web error: 405') || text.includes('web error: 501')
-}
-
-function sanitizePatchStatements(store: LiveStore, deletions: any[], insertions: any[]) {
-	const safeDeletions = Array.from(new Map(
-		(deletions || [])
-			.filter((statement) => {
-				if (!statement || !statement.subject || !statement.predicate || !statement.object) return false
-				if (store.holds(statement.subject, statement.predicate, statement.object, statement.why)) return true
-				return store.statementsMatching(statement.subject, statement.predicate, statement.object, statement.why).length > 0
-			})
-			.map((statement) => [statementKey(statement), statement])
-	).values())
-
-	const safeInsertions = Array.from(new Map(
-		(insertions || [])
-			.filter((statement) => Boolean(statement && statement.subject && statement.predicate && statement.object))
-			.map((statement) => [statementKey(statement), statement])
-	).values())
-
-	return { safeDeletions, safeInsertions }
-}
-
-async function runPutFallback(store: LiveStore, doc: NamedNode, deletions: any[], insertions: any[]) {
-	const updater = store.updater as any
-	const fetcher = (store as any).fetcher
-
-	if (!updater || typeof updater.serialize !== 'function' || !fetcher || typeof fetcher.webOperation !== 'function') {
-		throw new Error('Social updates are not supported by this store updater.')
-	}
-
-	const currentStatements = store.statementsMatching(undefined, undefined, undefined, doc).slice()
-	const deletionKeys = new Set((deletions || []).map((statement) => statementKey(statement)))
-	const nextStatements = currentStatements.filter((statement) => !deletionKeys.has(statementKey(statement))).concat(insertions || [])
-
-	const contentType = 'text/turtle'
-	const body = updater.serialize(doc.value, nextStatements, contentType)
-	const response = await fetcher.webOperation('PUT', doc.value, {
-		noMeta: true,
-		contentType,
-		body
-	})
-
-	if (!response || response.ok !== true) {
-		const status = response?.status || 'unknown'
-		throw new Error(`Web error: ${status} on PUT of <${doc.value}>`)
-	}
-
-	store.remove(deletions)
-	insertions.forEach((statement) => {
-		store.add(statement.subject, statement.predicate, statement.object, statement.why)
-	})
-}
-
-async function applySocialPatchWithFallback(store: LiveStore, doc: NamedNode, deletions: any[], insertions: any[]) {
-	if (!store.updater) {
-		throw new Error(updaterUnsupportedStoreErrorMessageText)
-	}
-
-	const { safeDeletions, safeInsertions } = sanitizePatchStatements(store, deletions, insertions)
-
-	if (safeDeletions.length === 0 && safeInsertions.length === 0) {
-		return
-	}
-
-	try {
-		await applyUpdaterPatch(store, safeDeletions, safeInsertions)
-		return
-	} catch (error) {
-		const message = error instanceof Error ? error.message : String(error)
-		if (!isPatchFailure(message)) throw error
-	}
-
-	await runPutFallback(store, doc, safeDeletions, safeInsertions)
-}
-
 function collectListChainNodes(store: LiveStore, listHead: Node, doc: NamedNode): Node[] {
 	if (!store.any(listHead as any, ns.rdf('first'), null, doc)) return []
 
@@ -356,11 +225,13 @@ async function mutateSocialEntries(
 		return createIdNode(doc)
 	})
 
-	const insertions: any[] = []
+	const retainedAccountNodeKeys = new Set(rowEntryNodes.map((node) => nodeKey(node)))
+	const retainedAccountNodes = existingAccountNodes.filter((node) => retainedAccountNodeKeys.has(nodeKey(node)))
+	const removedAccountNodes = existingAccountNodes.filter((node) => !retainedAccountNodeKeys.has(nodeKey(node)))
+
+	const insertions: RdfStatement[] = []
 	if (rowEntryNodes.length > 0) {
-		const rdfList = buildRdfListStatements(doc, rowEntryNodes)
-		insertions.push(st(subject, ns.foaf('account'), rdfList.head as any, doc))
-		insertions.push(...rdfList.statements)
+		insertions.push(st(subject, ns.foaf('account'), new Collection(rowEntryNodes), doc))
 	}
 
 	nextRows.forEach((row, index) => {
@@ -370,22 +241,22 @@ async function mutateSocialEntries(
 	const deletions = uniqueStatements([
 		...store.statementsMatching(subject, ns.foaf('account'), null, doc),
 		...existingListNodes,
-		...existingAccountNodes.flatMap((node) => collectNodeStatements(store, node, doc))
+		...removedAccountNodes.flatMap((node) => collectNodeStatements(store, node, doc)),
+		...retainedAccountNodes.flatMap((node) => [
+			...store.statementsMatching(node, ns.rdf('type'), null, doc),
+			...store.statementsMatching(node, ns.foaf('accountName'), null, doc),
+			...store.statementsMatching(node, ns.foaf('homepage'), null, doc),
+			...store.statementsMatching(node, ns.foaf('icon'), null, doc),
+			...store.statementsMatching(node, ns.rdfs('label'), null, doc)
+		])
 	])
 
-	if (isSocialPatchDebugEnabled()) {
-		console.log('[social-mutations] patch payload', {
-			subject: subject.value,
-			doc: doc.value,
-			nextRows,
-			deletionsCount: deletions.length,
-			insertionsCount: insertions.length,
-			deletions: deletions.map(statementToDebugObject),
-			insertions: uniqueStatements(insertions).map(statementToDebugObject)
-		})
-	}
-
-	await applySocialPatchWithFallback(store, doc, deletions, uniqueStatements(insertions))
+	await runUpdateTransport(store, doc, deletions, uniqueStatements(insertions), {
+		unsupportedMessage: 'Social updates are not supported by this store updater.',
+		failureMessage: 'Failed to save updates',
+		useDavFallback: false,
+		usePutFallback: true
+	})
 }
 
 export async function processSocialMutations(
@@ -397,7 +268,8 @@ export async function processSocialMutations(
 	try {
 		await mutateSocialEntries(store, subject, mutationPlan, orderedRows)
 	} catch (error) {
-		const message = error instanceof Error ? error.message : String(error)
-		throw new Error(`${saveSocialUpdatesFailedPrefixText} ${message}`)
+		const rootError = error instanceof Error ? error : new Error(String(error))
+		debugError(socialMutationSaveFailedDebugText, rootError)
+		throw new Error(saveSocialUpdatesFailedMessageText, { cause: rootError })
 	}
 }
diff --git a/src/specialButtons/AddMeToYourFriends.css b/src/specialButtons/AddMeToYourFriends.css
new file mode 100644
index 00000000..43655912
--- /dev/null
+++ b/src/specialButtons/AddMeToYourFriends.css
@@ -0,0 +1,54 @@
+.profile-friends-button__section {
+  --profile-friends-button-color: var(--color-primary, #7C4DFF);
+  width: 100%;
+  min-width: 0;
+  display: grid;
+}
+
+.profile-friends-button__section[hidden] {
+  display: none !important;
+}
+
+.profile-friends-button__section solid-ui-button.profile__btn-friends {
+  width: 100%;
+  min-width: 0;
+  --button-hover-background: var(--profile-friends-button-color);
+  --button-hover-border: var(--profile-friends-button-color);
+  --button-hover-text: var(--color-text-on-action, var(--white, #FFF));
+}
+
+.profile-friends-button__section solid-ui-button.profile__btn-friends[disabled],
+.profile-friends-button__section solid-ui-button.profile__btn-friends[aria-disabled="true"] {
+  pointer-events: none;
+  --button-hover-background: var(--button-background, transparent);
+  --button-hover-border: var(--button-border, var(--profile-friends-button-color));
+  --button-hover-text: var(--button-text, var(--profile-friends-button-color));
+}
+
+.profile-friends-button__section .profile__btn-friends-label {
+  color: var(--profile-friends-button-color);
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-md, 500);
+  line-height: 1;
+  letter-spacing: -0.01em;
+}
+
+.profile-friends-button__section solid-ui-button.profile__btn-friends:not([disabled]):hover .profile__btn-friends-label,
+.profile-friends-button__section solid-ui-button.profile__btn-friends:not([disabled]):focus-visible .profile__btn-friends-label,
+.profile-friends-button__section solid-ui-button.profile__btn-friends:not([aria-disabled="true"]):hover .profile__btn-friends-label,
+.profile-friends-button__section solid-ui-button.profile__btn-friends:not([aria-disabled="true"]):focus-visible .profile__btn-friends-label {
+  color: var(--color-text-on-action, var(--white, #FFF));
+}
+
+.profile-friends-button__section .profile__btn-friends-label--short {
+  display: none;
+}
+
+.profile-friends-button__section .profile__btn-friends-label--short::before {
+  content: attr(data-short-label-text);
+}
+
+.profile-friends-button__container input[type="text"] {
+  width: 100%;
+  box-sizing: border-box;
+}
diff --git a/src/specialButtons/addContact/AddMeToYourContacts.css b/src/specialButtons/addContact/AddMeToYourContacts.css
new file mode 100644
index 00000000..1b205c15
--- /dev/null
+++ b/src/specialButtons/addContact/AddMeToYourContacts.css
@@ -0,0 +1,1118 @@
+/* Launch button */
+.profile-contacts-button__section {
+  width: 100%;
+  min-width: 0;
+  display: grid;
+}
+
+#add-to-contacts-button-container {
+  position: relative;
+  overflow: visible;
+}
+
+#add-to-contacts-button-container solid-ui-button.profile__btn-contacts {
+  --profile-contacts-button-border-default: var(--dialog-cancel-button-border, var(--gray-300, #D1D5DC));
+  --profile-contacts-button-background-default: transparent;
+  --profile-contacts-button-text-default: var(--dialog-cancel-button-text, var(--gray-800, #1E2939));
+  --profile-contacts-button-border-hover: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+  --profile-contacts-button-background-hover: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+  --profile-contacts-button-text-hover: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  --button-padding-sm: var(--spacing-sm, 0.9375rem) var(--spacing-md, 1.25rem);
+  --button-font-size-sm: var(--font-size-md, 1rem);
+  --button-font-weight: var(--font-weight-normal, normal);
+  --button-border-radius: var(--border-radius-base);
+  --button-transition: all 0.3s ease-in-out;
+  --button-focus-outline: var(--focus-indicator-width) solid var(--color-primary);
+  --button-focus-outline-offset: var(--outline-offset-sm);
+  --button-focus-box-shadow: var(--box-shadow-focus-accessible, 0 0 0 var(--focus-ring-width) var(--color-focus-gap, var(--white, #FFF)), 0 0 0 calc(var(--focus-ring-width) + var(--focus-indicator-width)) var(--color-primary-alpha, rgba(124, 77, 255, 0.2)));
+  --button-border: var(--profile-contacts-button-border-default);
+  --button-background: var(--profile-contacts-button-background-default);
+  --button-text: var(--profile-contacts-button-text-default);
+  --button-hover-border: var(--profile-contacts-button-border-hover);
+  --button-hover-background: var(--profile-contacts-button-background-hover);
+  --button-hover-text: var(--profile-contacts-button-text-hover);
+  color: var(--button-text);
+}
+
+html[data-theme="dark"] #add-to-contacts-button-container solid-ui-button.profile__btn-contacts {
+  --profile-contacts-button-border-default: var(--dialog-cancel-button-border, var(--gray-300, #D1D5DC));
+}
+
+#add-to-contacts-button-container .profile__btn-contacts-label {
+  color: currentColor;
+  font-size: inherit;
+  font-weight: inherit;
+  line-height: 1;
+}
+
+#add-to-contacts-button-container .profile__btn-contacts-icon {
+  width: var(--icon-xxxs, 0.75rem);
+  height: var(--icon-xxxs, 0.75rem);
+  margin-right: var(--spacing-xxs, 0.3125rem);
+  flex-shrink: 0;
+}
+
+#add-to-contacts-button-container .profile__btn-contacts-icon svg {
+  width: var(--icon-xxxs, 0.75rem);
+  height: var(--icon-xxxs, 0.75rem);
+  display: block;
+}
+
+#add-to-contacts-button-container .profile__btn-contacts-icon path {
+  fill: currentColor;
+}
+
+#add-to-contacts-button-container solid-ui-button.profile__btn-contacts:hover .profile__btn-contacts-label,
+#add-to-contacts-button-container solid-ui-button.profile__btn-contacts:focus-visible .profile__btn-contacts-label {
+  color: currentColor;
+}
+
+#add-to-contacts-button-container solid-ui-button.profile__btn-contacts:hover .profile__btn-contacts-icon path,
+#add-to-contacts-button-container solid-ui-button.profile__btn-contacts:focus-visible .profile__btn-contacts-icon path {
+  fill: currentColor;
+}
+
+#add-to-contacts-button-container solid-ui-button.profile__btn-contacts[disabled],
+#add-to-contacts-button-container solid-ui-button.profile__btn-contacts[aria-disabled="true"] {
+  --profile-contacts-button-border-default: var(--dialog-cancel-button-border, var(--gray-300, #D1D5DC));
+  --profile-contacts-button-background-default: transparent;
+  --profile-contacts-button-text-default: var(--dialog-cancel-button-text, var(--gray-800, #1E2939));
+  --profile-contacts-button-border-hover: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+  --profile-contacts-button-background-hover: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+  --profile-contacts-button-text-hover: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  opacity: 1;
+}
+
+/* Main dialog shell */
+.contacts-dialog__content {
+  --contacts-dialog-action-width: 10.8rem;
+  --contacts-dialog-list-width: 20rem;
+  --contacts-dialog-panel-width: 20.75rem;
+  --contacts-dialog-mobile-popup-max-width: calc(92vw - 5px);
+  --contacts-dialog-panel-border: var(--color-border-lighter, var(--slate-200, #E2E8F0));
+  --contacts-dialog-panel-background: var(--color-background, #F8F9FB);
+  --contacts-dialog-panel-header-background: var(--color-surface-overlay-header, var(--slate-50, #F8FAFC));
+  --contacts-dialog-panel-body-background: var(--color-card-bg, #FFF);
+  --contacts-dialog-panel-padding-inline: calc(var(--spacing-lg, 1.5625rem) + var(--spacing-xxs, 0.3125rem));
+  --contacts-dialog-inner-footer-padding: var(--spacing-sm, 0.9375rem) var(--spacing-lg, 1.5625rem);
+  --contacts-dialog-inner-footer-padding-mobile: var(--spacing-xs, 0.75rem) var(--spacing-sm, 0.9375rem);
+  background: transparent;
+  border-radius: 0;
+  box-shadow: none;
+  max-height: none;
+  min-width: 0;
+}
+
+.contacts-dialog__frame {
+  min-width: 0;
+  background: transparent;
+  border-radius: 0;
+  max-height: none;
+  overflow: visible;
+}
+
+.contacts-dialog__main {
+  width: 100%;
+  min-width: 0;
+  padding: var(--spacing-sm, 0.938rem);
+  box-sizing: border-box;
+}
+
+.contacts-dialog__creation {
+  width: 100%;
+  min-width: 0;
+  border-radius: 0;
+  background: transparent;
+  box-sizing: border-box;
+  padding: 0;
+  gap: 0;
+}
+
+.contacts-dialog__description {
+  padding: var(--spacing-xs, 0.75rem);
+  background: transparent;
+  color: var(--color-text-secondary, var(--gray-600, #4A5565));
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-regular, 400);
+}
+
+.contacts-dialog__body {
+  min-width: 0;
+  margin-top: var(--spacing-lg, 1.5625rem);
+  overflow: auto;
+}
+
+.contacts-dialog__footer {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  gap: var(--spacing-sm, 0.938rem);
+  width: auto;
+  min-width: 0;
+  padding: var(--spacing-md, 1.25rem) var(--contacts-dialog-panel-padding-inline);
+  border-top: var(--border-width-sm, 0.1rem) solid var(--contacts-dialog-panel-border);
+  background: var(--color-surface-tertiary, var(--gray-50, #F9FAFB));
+  box-sizing: border-box;
+}
+
+.contacts-dialog__footer > solid-ui-button {
+  width: var(--contacts-dialog-action-width);
+}
+
+/* Shared button tokens */
+solid-ui-button.contacts-dialog__action-button {
+  --button-font-size-md: var(--font-size-sm, 0.875rem);
+  --button-font-weight: var(--font-weight-md, 500);
+  --button-background: var(--color-card-bg, var(--white, #FFF));
+  --button-text: var(--color-text-control, var(--slate-700, #314158));
+  --button-border: transparent;
+  --button-border-width: 0;
+  --button-border-radius: var(--border-radius-base);
+  --button-transition: all 0.3s ease-in-out;
+  --button-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff));
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-text-accent-subtle, var(--color-text-control, var(--slate-700, #314158)));
+  --button-hover-box-shadow: none;
+  --button-active-transform: none;
+  --button-active-box-shadow: none;
+  --button-focus-outline: 3px solid var(--color-primary);
+  --button-focus-outline-offset: 2px;
+  --button-focus-box-shadow: var(--box-shadow-focus-accessible, 0 0 0 var(--focus-ring-width) var(--color-background), 0 0 0 calc(var(--focus-ring-width) + var(--focus-indicator-width)) var(--color-primary-alpha));
+}
+
+solid-ui-button.contacts-dialog__action-button--primary {
+  --button-height-md: 0;
+  --button-background: var(--color-primary, #7C4DFF) !important;
+  --button-text: var(--color-text-on-action, var(--white, #FFF)) !important;
+  --button-border-width: 0.8px;
+  --button-border: var(--color-primary, #7C4DFF) !important;
+  --button-font-size-md: var(--font-size-md, 1rem);
+  --button-font-weight: var(--font-weight-bold, 600);
+  --button-line-height: 1;
+  --button-padding-md: 0.85rem 1rem;
+  --button-hover-background: color-mix(in srgb, var(--color-primary, #7C4DFF) 85%, var(--black, #000)) !important;
+  --button-hover-text: var(--color-text-on-action, var(--white, #FFF)) !important;
+  --button-hover-border: var(--color-primary, #7C4DFF) !important;
+  --button-hover-box-shadow: var(--box-shadow-hover, 0 2px 4px rgba(124, 77, 255, 0.2));
+  --button-active-box-shadow: var(--box-shadow-active, 0 1px 2px rgba(124, 77, 255, 0.2));
+}
+
+solid-ui-button.contacts-dialog__action-button[disabled],
+solid-ui-button.contacts-dialog__action-button[aria-disabled="true"] {
+  cursor: not-allowed;
+  opacity: 0.55;
+  --button-box-shadow: none !important;
+  --button-hover-box-shadow: none !important;
+  --button-active-box-shadow: none !important;
+  --button-active-transform: none;
+}
+
+solid-ui-button.contacts-dialog__action-button--primary[disabled],
+solid-ui-button.contacts-dialog__action-button--primary[aria-disabled="true"] {
+  --button-background: color-mix(in srgb, var(--color-primary, #7C4DFF) 60%, var(--color-card-bg, var(--white, #FFF))) !important;
+  --button-border-width: 0.8px;
+  --button-border: color-mix(in srgb, var(--color-primary, #7C4DFF) 60%, var(--color-card-bg, var(--white, #FFF))) !important;
+  --button-text: var(--color-text-on-action, var(--white, #FFF)) !important;
+}
+
+solid-ui-button.contacts-dialog__confirm {
+  --button-padding-md: var(--spacing-sm) var(--spacing-md);
+  --button-font-size-md: var(--font-size-md, 1rem);
+  --button-font-weight: var(--font-weight-md, 500);
+  --button-line-height: 1;
+  --button-active-box-shadow: none;
+}
+
+solid-ui-button.contacts-dialog__cancel {
+  --button-padding-md: var(--spacing-sm) var(--spacing-md);
+  --button-font-size-md: var(--font-size-md, 1rem);
+  --button-font-weight: var(--font-weight-normal, normal);
+  --button-background: var(--dialog-cancel-button-background, transparent);
+  --button-text: var(--dialog-cancel-button-text, var(--gray-800, #1E2939));
+  --button-border: var(--dialog-cancel-button-border, var(--gray-300, #D1D5DC));
+  --button-border-radius: var(--border-radius-base);
+  --button-transition: all 0.3s ease-in-out;
+  --button-hover-background: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575)) !important;
+  --button-hover-text: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  --button-hover-border: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+  --button-hover-box-shadow: none;
+  --button-active-transform: none;
+  --button-active-box-shadow: none;
+  --button-focus-outline: var(--focus-indicator-width) solid var(--color-primary);
+  --button-focus-outline-offset: var(--outline-offset-sm);
+  --button-focus-box-shadow: var(--box-shadow-focus-accessible, 0 0 0 var(--focus-ring-width) var(--color-focus-gap, var(--white, #FFF)), 0 0 0 calc(var(--focus-ring-width) + var(--focus-indicator-width)) var(--color-primary-alpha, rgba(124, 77, 255, 0.2)));
+}
+
+solid-ui-button.contacts-dialog__cancel:hover::part(button),
+solid-ui-button.contacts-dialog__cancel:focus-visible::part(button),
+solid-ui-button.contacts-dialog__cancel:focus-within::part(button) {
+  background: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+  border-color: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+  color: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+}
+
+solid-ui-button.contacts-dialog__cancel--footer {
+  width: var(--contacts-dialog-action-width);
+  min-width: var(--contacts-dialog-action-width);
+  max-width: var(--contacts-dialog-action-width);
+  inline-size: var(--contacts-dialog-action-width);
+  align-self: auto;
+}
+
+.contacts-dialog__submit-contact {
+  width: var(--contacts-dialog-action-width) !important;
+  min-width: var(--contacts-dialog-action-width);
+  max-width: var(--contacts-dialog-action-width);
+  inline-size: var(--contacts-dialog-action-width);
+  flex: 0 0 var(--contacts-dialog-action-width);
+  align-self: flex-end;
+  line-height: 1;
+}
+
+.contacts-dialog__address-submit {
+  width: fit-content;
+  min-width: fit-content;
+  max-width: fit-content;
+  inline-size: fit-content;
+  flex: 0 0 auto;
+  align-self: auto;
+  margin: 0 0 0 auto;
+  white-space: nowrap;
+}
+
+.contacts-dialog__group-submit {
+  width: fit-content;
+  min-width: fit-content;
+  max-width: fit-content;
+  inline-size: fit-content;
+  flex: 0 0 auto;
+  align-self: auto;
+  margin: 0 0 0 auto;
+  white-space: nowrap;
+}
+
+.contacts-dialog__uri-submit {
+  width: fit-content;
+  min-width: fit-content;
+  max-width: fit-content;
+  inline-size: fit-content;
+  flex: 0 0 auto;
+  align-self: auto;
+  margin: 0 0 0 auto;
+  line-height: 1;
+  white-space: nowrap;
+}
+
+.contacts-dialog__uri-submit::part(button),
+.contacts-dialog__address-submit::part(button) {
+  width: auto;
+  min-width: 0;
+}
+
+/* Selection layout */
+.contacts-dialog__details {
+  width: 100%;
+  min-width: 0;
+  min-height: 0;
+  border-radius: 0;
+  justify-content: flex-start;
+  align-items: flex-start;
+  box-sizing: border-box;
+  gap: var(--spacing-sm, 0.938rem);
+  padding: 0;
+  overflow-x: auto;
+  overflow-y: auto;
+  background: transparent;
+}
+
+.contacts-dialog__address-book-list {
+  flex: 0 0 15rem;
+  width: 100%;
+  max-width: 16rem;
+  min-width: 240px;
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  box-sizing: border-box;
+}
+
+.contacts-dialog__group-list {
+  width: auto;
+  max-width: 14rem;
+  min-width: 12.5rem;
+  box-sizing: border-box;
+  gap: 1px;
+}
+
+.contacts-dialog__column-title {
+  margin: 0 0 0.35rem;
+  padding-bottom: 0.35rem;
+  border-bottom: var(--border-width-sm, 0.1rem) solid var(--color-border-lighter, var(--slate-200, #E2E8F0));
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  font-size: var(--font-size-lg, 1.125rem);
+}
+
+#addressbook-list > solid-ui-button#contacts-create-addressbook-button,
+#addressbook-list > solid-ui-button#contacts-addressbook-uri-entry-button,
+#group-list > solid-ui-button#contacts-create-group-button {
+  width: 100% !important;
+  min-width: 100% !important;
+  max-width: 100% !important;
+  inline-size: 100% !important;
+}
+
+solid-ui-button.contacts-dialog__list-button {
+  flex-shrink: 0;
+  width: 100%;
+  -webkit-tap-highlight-color: transparent;
+  --button-height-sm: 0;
+  --button-padding-sm: 0.85rem 1rem;
+  --button-font-size-sm: var(--font-size-sm, 0.875rem);
+  --button-font-weight: var(--font-weight-md, 500);
+  --button-border-width: 0;
+  --button-border-radius: var(--border-radius-md, 0.5rem);
+  --button-selected-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff)) !important;
+  --button-selected-text: var(--color-text-accent-subtle, var(--color-text-control, var(--slate-700, #314158)));
+  --button-selected-border: transparent;
+  --button-box-shadow: none !important;
+  --button-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff)) !important;
+  --button-hover-text: var(--color-text-accent-subtle, var(--color-text-control, var(--slate-700, #314158)));
+  --button-hover-border: transparent;
+  --button-hover-box-shadow: none !important;
+  --button-active-transform: none;
+  --button-active-box-shadow: none !important;
+  --button-focus-outline: none;
+  --button-focus-box-shadow: none !important;
+}
+
+/* Inline panel shells */
+.contacts-dialog__inline-panel-region {
+  display: none;
+  min-width: 0;
+  order: 3;
+}
+
+.contacts-dialog__inline-panel-region--active {
+  display: block;
+  min-width: 0;
+  width: min(100%, var(--contacts-dialog-panel-width)) !important;
+  max-width: var(--contacts-dialog-panel-width) !important;
+  align-self: flex-start;
+  order: 3;
+}
+
+.contacts-dialog__inline-panel.contacts-dialog__popup {
+  position: static;
+  inset: auto;
+  transform: none;
+  min-width: 0;
+  width: 100% !important;
+  max-width: 100% !important;
+  max-height: none;
+  margin: 0;
+  margin-right: 0;
+  overflow: visible;
+  box-shadow: none;
+  border-left: 1px solid var(--contacts-dialog-panel-border);
+}
+
+.contacts-dialog__address-form,
+.contacts-dialog__group-form,
+.contacts-dialog__uri-entry {
+  padding: 0 !important;
+  gap: 0;
+  box-sizing: border-box;
+  border-radius: var(--border-radius-base);
+}
+
+.contacts-dialog__address-form {
+  width: 100% !important;
+  max-width: 100% !important;
+  align-items: stretch;
+  border: 1px solid var(--contacts-dialog-panel-border);
+  background: var(--contacts-dialog-panel-background);
+}
+
+.contacts-dialog__group-form {
+  border: none;
+  border-left: 1px solid var(--contacts-dialog-panel-border);
+  border-radius: 0;
+  background: var(--contacts-dialog-panel-background);
+}
+
+.contacts-dialog__uri-entry {
+  width: 100% !important;
+  max-width: 100% !important;
+  min-width: 0;
+  align-self: flex-start;
+  border: 1px solid var(--contacts-dialog-panel-border);
+  background: var(--contacts-dialog-panel-background);
+}
+
+.contacts-dialog__uri-entry-form {
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  align-items: stretch;
+  box-sizing: border-box;
+  gap: 0;
+  background: var(--color-card-bg, #FFF);
+}
+
+/* Popup chrome */
+.contacts-dialog__header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--spacing-sm, 0.938rem);
+  width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.contacts-dialog__title {
+  margin: 0;
+  min-width: 0;
+  flex: 1 1 auto;
+  line-height: 1.3;
+  font-size: var(--font-size-md);
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+}
+
+.contacts-dialog__popup .contacts-dialog__header {
+  border-bottom: var(--border-width-sm, 0.1rem) solid var(--color-border-lighter, var(--slate-200, #E2E8F0));
+}
+
+.contacts-dialog__address-form .contacts-dialog__header,
+.contacts-dialog__group-form .contacts-dialog__header,
+.contacts-dialog__uri-entry .contacts-dialog__header {
+  margin-bottom: 0;
+  padding: var(--spacing-md, 1.25rem) var(--spacing-lg, 1.5625rem);
+  border-bottom: var(--border-width-sm, 0.1rem) solid var(--contacts-dialog-panel-border);
+  background: var(--contacts-dialog-panel-header-background);
+}
+
+solid-ui-button.contacts-dialog__close {
+  flex: 0 0 auto;
+  align-self: flex-start;
+  min-inline-size: var(--icon-base, 2rem);
+  --button-height-sm: var(--icon-base, 2rem);
+  --button-width-sm: var(--icon-base, 2rem);
+  --button-padding-sm: 0;
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-border-radius: 999px;
+  --button-text: var(--color-text);
+  --button-box-shadow: none;
+  --button-hover-background: rgba(0, 0, 0, 0.04);
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary);
+  --button-hover-box-shadow: none;
+  --button-active-box-shadow: none;
+  --button-active-transform: none;
+  --button-icon-size-sm: var(--icon-xxs, 1rem);
+}
+
+solid-ui-button.contacts-dialog__close:focus-visible::part(button) {
+  outline: var(--focus-indicator-width) solid var(--color-primary);
+  outline-offset: var(--outline-offset-sm);
+  box-shadow: var(--box-shadow-focus-accessible, 0 0 0 var(--focus-ring-width) var(--color-background), 0 0 0 calc(var(--focus-ring-width) + var(--focus-indicator-width)) var(--color-primary-alpha));
+}
+
+.contacts-dialog__popup-body {
+  min-width: 0;
+  gap: var(--spacing-base, 0.5rem);
+}
+
+.contacts-dialog__address-form .contacts-dialog__popup-body,
+.contacts-dialog__group-form .contacts-dialog__popup-body,
+.contacts-dialog__uri-entry .contacts-dialog__popup-body {
+  padding: var(--spacing-lg, 1.5625rem);
+  box-sizing: border-box;
+  background: var(--contacts-dialog-panel-body-background);
+}
+
+.contacts-dialog__popup .input {
+  width: 100%;
+  max-width: 100%;
+  min-height: var(--min-touch-target, 44px);
+  height: var(--min-touch-target, 44px);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  border: 1px solid var(--color-border-button-hover, var(--gray-400, #99A1AF));
+  background: var(--color-card-bg, var(--white, #FFF));
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-medium, 500);
+  padding: var(--spacing-2xs, 0.625rem);
+  box-sizing: border-box;
+  margin-bottom: var(--spacing-base, 0.5rem);
+}
+
+.contacts-dialog__address-form .input,
+.contacts-dialog__group-form .input,
+.contacts-dialog__uri-entry .input {
+  margin-bottom: 0;
+}
+
+.contacts-dialog__uri-input {
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  display: block;
+  flex: 1 1 auto;
+  align-self: stretch;
+  box-sizing: border-box;
+}
+
+.contacts-dialog__popup-footer {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  width: 100%;
+  min-width: 0;
+  align-self: stretch;
+  box-sizing: border-box;
+  gap: var(--spacing-md);
+  margin-top: 1rem;
+  padding-top: 1rem;
+  border-top: var(--border-width-sm, 0.1rem) solid var(--contacts-dialog-panel-border);
+  background: var(--color-surface-tertiary, var(--gray-50, #F9FAFB));
+}
+
+.contacts-dialog__address-form .contacts-dialog__popup-footer,
+.contacts-dialog__group-form .contacts-dialog__popup-footer,
+.contacts-dialog__uri-entry .contacts-dialog__popup-footer {
+  margin-top: 0;
+  gap: var(--spacing-sm, 0.9375rem);
+  padding: var(--contacts-dialog-inner-footer-padding);
+}
+
+.contacts-dialog__address-form .contacts-dialog__popup-footer,
+.contacts-dialog__uri-entry-form .contacts-dialog__popup-footer {
+  justify-content: flex-end;
+}
+
+.contacts-dialog__popup-footer > solid-ui-button.contacts-dialog__confirm,
+.contacts-dialog__popup-footer > solid-ui-button.contacts-dialog__cancel {
+  width: var(--contacts-dialog-action-width);
+  min-width: var(--contacts-dialog-action-width);
+  max-width: var(--contacts-dialog-action-width);
+  inline-size: var(--contacts-dialog-action-width);
+}
+
+/* Validation and feedback */
+.contacts-dialog__validation {
+  display: none;
+  width: calc(100% - 0.5rem);
+  max-width: calc(100% - 0.5rem);
+  margin: 0 auto;
+  padding-right: 0.25rem;
+  padding-left: 0.25rem;
+  align-self: stretch;
+  box-sizing: border-box;
+  color: var(--red-600, #B00020);
+  font-size: var(--font-size-sm, 0.875rem);
+  white-space: normal;
+  overflow-wrap: anywhere;
+  word-break: break-word;
+  text-align: left;
+}
+
+.contacts-dialog__validation--visible {
+  display: block;
+}
+
+.contacts-dialog__error,
+.contacts-dialog__error[role='alert'] {
+  position: relative;
+  z-index: 3;
+  display: none;
+  width: 100%;
+  align-self: stretch;
+  margin: 0;
+  padding: 0;
+  border: 1px solid var(--dialog-error-border, var(--pink-700, #ff98b3));
+  border-radius: var(--border-radius-base);
+  background: var(--dialog-error-background, var(--pink-500, #ffdde6));
+  background-color: var(--dialog-error-background, var(--pink-500, #ffdde6));
+  color: var(--dialog-error-text, var(--red-600, #B00020));
+  text-align: center;
+}
+
+.contacts-dialog__error--visible {
+  display: flex !important;
+  flex-direction: row;
+  justify-content: center;
+}
+
+solid-ui-button.contacts-dialog__error-close {
+  position: absolute;
+  top: var(--spacing-xxxs, 0.2rem);
+  right: var(--spacing-xxxs, 0.2rem);
+  z-index: 4;
+  --button-height-sm: 0;
+  --button-padding-sm: 0;
+  --button-font-size-sm: var(--font-size-sm);
+  --button-background: transparent;
+  --button-border: transparent;
+  --button-border-width: 0;
+  --button-border-radius: 0;
+  --button-text: var(--dialog-error-text, var(--red-600, #B00020));
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--dialog-error-text, var(--red-600, #B00020));
+  --button-line-height: 1;
+  --button-active-transform: none;
+  --button-box-shadow: none;
+  --button-hover-box-shadow: none;
+  --button-active-box-shadow: none;
+}
+
+/* Overlays and confirmation popups */
+.contacts-dialog__popup-overlay {
+  position: absolute;
+  inset: 0;
+  z-index: 8;
+  background: color-mix(in srgb, var(--black, #000) 50%, transparent);
+}
+
+.contacts-dialog__popup {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 10;
+  width: min(calc(24rem - 5px), calc(100% - 1rem - 5px));
+  max-width: calc(100% - 1rem - 5px);
+  max-height: min(calc(100% - 1rem - 5px), calc(100vh - 6rem - 5px));
+  padding: 1rem;
+  box-sizing: border-box;
+  overflow: auto;
+  overflow-x: hidden;
+  transform: translate(-50%, -50%);
+  border-radius: var(--border-radius-base);
+  background: var(--color-surface-overlay, var(--white, #FFF)) !important;
+  color: var(--color-text-overlay, var(--gray-800, #1E2939));
+  box-shadow: var(--box-shadow-overlay, 0 4px 24px rgba(0, 0, 0, 0.2));
+}
+
+.contacts-dialog__shared-confirm-form {
+  display: flex;
+  flex-direction: column;
+}
+
+.contacts-dialog__shared-confirm-message {
+  margin: 0;
+  color: var(--color-text-overlay, var(--gray-800, #1E2939));
+}
+
+.contacts-dialog__shared-confirm-name {
+  font-weight: var(--font-weight-bold, 600);
+}
+
+.contacts-dialog__contact-exists {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 10;
+  width: min(90vw, 20rem);
+  padding: 1rem;
+  transform: translate(-50%, -50%);
+  border-radius: var(--border-radius-base);
+  background: var(--color-surface-overlay, var(--white, #FFF));
+  color: var(--color-text-overlay, var(--gray-800, #1E2939));
+  box-shadow: var(--box-shadow-modal, 0 2px 10px rgba(0, 0, 0, 0.3));
+  align-items: center;
+  gap: var(--spacing-md, 1rem);
+  text-wrap: pretty;
+}
+
+.contacts-dialog__contact-exists .contacts-dialog__popup-footer {
+  width: 100%;
+  justify-content: center;
+  gap: var(--spacing-2xs, 0.625rem);
+  margin-top: var(--spacing-base, 0.5rem);
+  padding-top: 0;
+  border-top: none;
+  background: transparent;
+}
+
+.contacts-dialog__contact-exists .contacts-dialog__confirm,
+.contacts-dialog__contact-exists .contacts-dialog__cancel {
+  width: auto;
+  min-width: 6rem;
+  flex: 0 0 auto;
+  margin: 0;
+  white-space: nowrap;
+}
+
+/* Responsive overrides */
+
+/* Explicit mobile layout mode uses the same values as the small-screen rules,
+   but plain CSS still needs a separate block because `data-layout` is not a media query. */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__frame {
+  max-height: none;
+  overflow: visible;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__body {
+  padding-bottom: 0;
+  overflow: visible;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__footer {
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-end;
+  gap: var(--spacing-sm, 0.9375rem);
+  width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__footer > solid-ui-button {
+  flex: 1 0 0;
+  width: auto;
+  min-width: 0;
+  max-width: none;
+  inline-size: auto;
+  --button-font-size-md: var(--font-size-md, 1rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__popup {
+  max-width: var(--contacts-dialog-mobile-popup-max-width);
+  max-height: 78vh;
+  padding: 0.85rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-form {
+  width: min(100%, var(--contacts-dialog-panel-width)) !important;
+  max-width: min(100%, var(--contacts-dialog-panel-width)) !important;
+  margin-inline: auto;
+  padding: 0 !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__inline-panel-region {
+  min-width: 0;
+  width: min(100%, var(--contacts-dialog-list-width)) !important;
+  max-width: min(100%, var(--contacts-dialog-list-width)) !important;
+  margin-inline: auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__inline-panel-region--active {
+  width: min(100%, var(--contacts-dialog-panel-width)) !important;
+  max-width: min(100%, var(--contacts-dialog-panel-width)) !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-form .contacts-dialog__header,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__group-form .contacts-dialog__header,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__uri-entry .contacts-dialog__header {
+  padding: var(--spacing-sm, 0.9375rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-form .contacts-dialog__popup-body,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__group-form .contacts-dialog__popup-body,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__uri-entry .contacts-dialog__popup-body {
+  gap: var(--spacing-base, 0.5rem);
+  padding: var(--spacing-sm, 0.9375rem) var(--spacing-sm, 0.9375rem) var(--spacing-lg, 1.5625rem) var(--spacing-sm, 0.9375rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-form .input {
+  min-height: 2.5rem;
+  height: 2.5rem;
+  margin-bottom: 0.375rem;
+  padding: var(--spacing-base, 0.5rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__uri-entry .contacts-dialog__popup-footer,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-form .contacts-dialog__popup-footer {
+  justify-content: flex-end;
+  gap: var(--spacing-sm, 0.9375rem);
+  padding: var(--contacts-dialog-inner-footer-padding-mobile);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__group-form .contacts-dialog__popup-footer {
+  justify-content: center;
+  gap: var(--spacing-sm, 0.9375rem);
+  padding: var(--contacts-dialog-inner-footer-padding-mobile);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__uri-entry .contacts-dialog__popup-footer > solid-ui-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-form .contacts-dialog__popup-footer > solid-ui-button {
+  flex: 1 0 0;
+  width: auto !important;
+  min-width: 0 !important;
+  max-width: none !important;
+  inline-size: auto !important;
+  --button-font-size-md: var(--font-size-md, 1rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__uri-submit,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-submit,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__submit-contact,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__cancel--footer {
+  flex: 1 0 0 !important;
+  width: auto !important;
+  min-width: 0 !important;
+  max-width: none !important;
+  inline-size: auto !important;
+  margin-left: 0 !important;
+  margin-right: 0 !important;
+  align-self: auto;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__group-form .contacts-dialog__popup-footer > solid-ui-button.contacts-dialog__group-submit {
+  flex: 0 0 auto;
+  width: fit-content;
+  min-width: fit-content;
+  max-width: fit-content;
+  inline-size: fit-content;
+  margin: 0 auto;
+  align-self: auto;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__details {
+  width: 100% !important;
+  min-width: 0;
+  max-height: none;
+  padding: var(--spacing-base, 0.5rem) var(--spacing-base, 0.5rem) 0;
+  overflow-y: visible;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__address-book-list,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__group-list {
+  min-width: 0;
+  width: min(100%, var(--contacts-dialog-list-width)) !important;
+  max-width: min(100%, var(--contacts-dialog-list-width)) !important;
+  margin-inline: auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__inline-panel.contacts-dialog__popup,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__group-form,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .contacts-dialog__uri-entry {
+  width: min(100%, var(--contacts-dialog-panel-width)) !important;
+  max-width: min(100%, var(--contacts-dialog-panel-width)) !important;
+  margin-inline: auto !important;
+  align-self: center;
+}
+
+@media (max-width: 576px) {
+  .contacts-dialog__frame {
+    max-height: none;
+    overflow: visible;
+  }
+
+  .contacts-dialog__body {
+    padding-bottom: 0;
+    overflow: visible;
+  }
+
+  .contacts-dialog__footer {
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-end;
+    gap: var(--spacing-sm, 0.9375rem);
+    width: 100%;
+  }
+
+  .contacts-dialog__footer > solid-ui-button {
+    flex: 1 0 0;
+    width: auto;
+    min-width: 0;
+    max-width: none;
+    inline-size: auto;
+    --button-font-size-md: var(--font-size-md, 1rem);
+  }
+
+  .contacts-dialog__popup {
+    max-width: var(--contacts-dialog-mobile-popup-max-width);
+    max-height: 78vh;
+    padding: 0.85rem;
+  }
+
+  .contacts-dialog__address-form {
+    width: min(100%, var(--contacts-dialog-panel-width)) !important;
+    max-width: min(100%, var(--contacts-dialog-panel-width)) !important;
+    margin-inline: auto;
+    padding: 0 !important;
+  }
+
+  .contacts-dialog__inline-panel-region {
+    min-width: 0;
+    width: min(100%, var(--contacts-dialog-list-width)) !important;
+    max-width: min(100%, var(--contacts-dialog-list-width)) !important;
+    margin-inline: auto;
+  }
+
+  .contacts-dialog__inline-panel-region--active {
+    width: min(100%, var(--contacts-dialog-panel-width)) !important;
+    max-width: min(100%, var(--contacts-dialog-panel-width)) !important;
+  }
+
+  .contacts-dialog__address-form .contacts-dialog__header,
+  .contacts-dialog__group-form .contacts-dialog__header,
+  .contacts-dialog__uri-entry .contacts-dialog__header {
+    padding: var(--spacing-sm, 0.9375rem);
+  }
+
+  .contacts-dialog__address-form .contacts-dialog__popup-body,
+  .contacts-dialog__group-form .contacts-dialog__popup-body,
+  .contacts-dialog__uri-entry .contacts-dialog__popup-body {
+    gap: var(--spacing-base, 0.5rem);
+    padding: var(--spacing-sm, 0.9375rem) var(--spacing-sm, 0.9375rem) var(--spacing-lg, 1.5625rem) var(--spacing-sm, 0.9375rem);
+  }
+
+  .contacts-dialog__address-form .input {
+    min-height: 2.5rem;
+    height: 2.5rem;
+    margin-bottom: 0.375rem;
+    padding: var(--spacing-base, 0.5rem);
+  }
+
+  .contacts-dialog__uri-entry .contacts-dialog__popup-footer,
+  .contacts-dialog__address-form .contacts-dialog__popup-footer {
+    justify-content: flex-end;
+    gap: var(--spacing-sm, 0.9375rem);
+    padding: var(--contacts-dialog-inner-footer-padding-mobile);
+  }
+
+  .contacts-dialog__group-form .contacts-dialog__popup-footer {
+    justify-content: center;
+    gap: var(--spacing-sm, 0.9375rem);
+    padding: var(--contacts-dialog-inner-footer-padding-mobile);
+  }
+
+  .contacts-dialog__uri-entry .contacts-dialog__popup-footer > solid-ui-button,
+  .contacts-dialog__address-form .contacts-dialog__popup-footer > solid-ui-button {
+    flex: 1 0 0;
+    width: auto !important;
+    min-width: 0 !important;
+    max-width: none !important;
+    inline-size: auto !important;
+    --button-font-size-md: var(--font-size-md, 1rem);
+  }
+
+  .contacts-dialog__uri-submit,
+  .contacts-dialog__address-submit,
+  .contacts-dialog__submit-contact,
+  .contacts-dialog__cancel--footer {
+    flex: 1 0 0 !important;
+    width: auto !important;
+    min-width: 0 !important;
+    max-width: none !important;
+    inline-size: auto !important;
+    margin-left: 0 !important;
+    margin-right: 0 !important;
+    align-self: auto;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+  }
+
+  .contacts-dialog__group-form .contacts-dialog__popup-footer > solid-ui-button.contacts-dialog__group-submit {
+    flex: 0 0 auto;
+    width: fit-content;
+    min-width: fit-content;
+    max-width: fit-content;
+    inline-size: fit-content;
+    margin: 0 auto;
+    align-self: auto;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .contacts-dialog__details {
+    width: 100% !important;
+    min-width: 0;
+    max-height: none;
+    padding: var(--spacing-base, 0.5rem) var(--spacing-base, 0.5rem) 0;
+    overflow-y: visible;
+  }
+
+  .contacts-dialog__address-book-list,
+  .contacts-dialog__group-list {
+    min-width: 0;
+    width: min(100%, var(--contacts-dialog-list-width)) !important;
+    max-width: min(100%, var(--contacts-dialog-list-width)) !important;
+    margin-inline: auto;
+  }
+
+  .contacts-dialog__inline-panel.contacts-dialog__popup,
+  .contacts-dialog__group-form,
+  .contacts-dialog__uri-entry {
+    width: min(100%, var(--contacts-dialog-panel-width)) !important;
+    max-width: min(100%, var(--contacts-dialog-panel-width)) !important;
+    margin-inline: auto !important;
+    align-self: center;
+  }
+}
+
+/* Tablet and stacked panel layout */
+@media (max-width: 900px) {
+  .contacts-dialog__frame {
+    max-height: none;
+    overflow: visible;
+  }
+
+  .contacts-dialog__body {
+    padding-bottom: 0;
+    overflow: visible;
+  }
+
+  .contacts-dialog__details {
+    flex-direction: column !important;
+    align-items: stretch !important;
+    width: 100% !important;
+    max-height: none;
+    gap: var(--spacing-base, 0.5rem);
+    padding-bottom: 0;
+    overflow-y: visible;
+    overflow-x: hidden;
+  }
+
+  .contacts-dialog__inline-panel-region,
+  .contacts-dialog__inline-panel-region--active,
+  .contacts-dialog__address-book-list,
+  .contacts-dialog__group-list {
+    width: min(100%, var(--contacts-dialog-list-width)) !important;
+    max-width: min(100%, var(--contacts-dialog-list-width)) !important;
+    min-width: 0;
+    margin-inline: auto;
+    align-self: center;
+  }
+
+  .contacts-dialog__address-book-list {
+    padding-bottom: var(--spacing-base, 0.5rem);
+    border-bottom: var(--border-width-sm, 0.1rem) solid var(--color-border-lighter, var(--slate-200, #E2E8F0));
+  }
+
+  .contacts-dialog__inline-panel.contacts-dialog__popup,
+  .contacts-dialog__address-form,
+  .contacts-dialog__group-form,
+  .contacts-dialog__uri-entry {
+    width: min(100%, var(--contacts-dialog-panel-width)) !important;
+    max-width: min(100%, var(--contacts-dialog-panel-width)) !important;
+    min-width: 0;
+    margin-inline: auto;
+    align-self: center;
+  }
+
+  .contacts-dialog__creation .contacts-dialog__submit-contact {
+    width: auto;
+    min-width: 0;
+    margin-left: 0;
+    margin-right: 0;
+    align-self: auto;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+  }
+}
diff --git a/src/specialButtons/addContact/ContactCreationDialog.ts b/src/specialButtons/addContact/ContactCreationDialog.ts
new file mode 100644
index 00000000..99171623
--- /dev/null
+++ b/src/specialButtons/addContact/ContactCreationDialog.ts
@@ -0,0 +1,1512 @@
+import { DataBrowserContext } from 'pane-registry'
+import 'solid-ui/components/actions/button'
+import type { Button as SolidUIButtonElement } from 'solid-ui/components/actions/button'
+import { addAddressBookToAddressBooksData, addGroupToAddressBookData, refreshButton } from './helpers'
+import { checkIfContactExistsByName, checkIfContactExistsByWebID } from './selectors'
+import { addANewAddressBookUriToAddressBooks, addWebIDToExistingContact, createContactInAddressBook, handleAddressBookCreation } from './mutations'
+import { AddressBookDetails, AddressBooksData, ContactData, GroupData } from './contactsTypes'
+import ContactsModuleRdfLib from '@solid-data-modules/contacts-rdflib'
+import { render } from 'lit-html'
+import { clearPreviousMessage, complain } from '../../buttonsHelper'
+import { contactExistsMessage, dialogCancelLabelText, errorAddingContactWebIDToAddressBook, errorAddressBookCreation, errorContactCreation, errorGroupCreation, errorNotExistsAddressBookUri, errorProcessingUriAddressBook, groupIsRequired } from '../../texts'
+import { addErrorToErrorDisplay, checkAndAddErrorToDisplay, checkAndRemoveErrorDisplay, formatContactsDialogError } from './contactsErrors'
+import { literal, NamedNode, st, sym } from 'rdflib'
+import { closeIcon } from '../../icons-svg/profileIcons'
+import { ns } from 'solid-ui'
+import { closeSharedDialog, getSharedDialogCancelButton, openInputDialog, setSharedDialogSavingState } from '../../ui/dialog'
+import { ensureStandardMutationPrefixes, runDirectUpdaterUpdate } from '../../sections/shared/rdfMutationHelpers'
+import { error as debugError } from '../../utils/debug'
+
+const CONTACTS_POPUP_OVERLAY_ID = 'contacts-popup-overlay'
+const CONTACTS_OVERLAY_ACTIVE_CLASS = 'contacts-dialog--overlay-active'
+type ContactsButtonElement = SolidUIButtonElement
+
+function setContactsListButtonSelected(button: Element, isSelected: boolean): void {
+  const listButton = button as ContactsButtonElement
+  listButton.selected = isSelected
+  if (isSelected) {
+    listButton.setAttribute('selected', '')
+  } else {
+    listButton.removeAttribute('selected')
+  }
+  listButton.setAttribute('aria-pressed', isSelected ? 'true' : 'false')
+}
+
+function isContactsListButtonSelected(button: Element | null): boolean {
+  if (!(button instanceof HTMLElement)) return false
+  const listButton = button as ContactsButtonElement
+  return listButton.selected || button.hasAttribute('selected')
+}
+
+function createContactsButtonElement(
+  context: DataBrowserContext,
+  options: {
+    id?: string
+    type?: 'button' | 'submit' | 'reset'
+    label?: string
+    ariaLabel?: string
+    variant?: 'primary' | 'secondary' | 'icon'
+    size?: 'sm' | 'md' | 'lg'
+    contentAlign?: 'start' | 'center' | 'end'
+    classes?: string[]
+  }
+): SolidUIButtonElement {
+  const button = context.dom.createElement('solid-ui-button') as SolidUIButtonElement
+  button.setAttribute('type', options.type || 'button')
+  button.setAttribute('variant', options.variant || 'secondary')
+  button.setAttribute('size', options.size || 'sm')
+
+  if (options.id) button.setAttribute('id', options.id)
+  if (options.ariaLabel) button.setAttribute('aria-label', options.ariaLabel)
+  button.setAttribute('aria-pressed', 'false')
+  if (options.contentAlign) button.setAttribute('content-align', options.contentAlign)
+  if (options.classes?.length) button.classList.add(...options.classes)
+  if (options.label) button.textContent = options.label
+
+  return button
+}
+
+export const createAddressBookContactCreationDialog = (context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  contactData: ContactData,
+  addressBooksData: AddressBooksData
+): HTMLFormElement => {
+  const addressBookContactCreationDialog = context.dom.createElement('form')
+  addressBookContactCreationDialog.classList.add('contacts-dialog__frame', 'contacts-dialog__content', 'flex-column')
+  addressBookContactCreationDialog.setAttribute('id', 'contacts-addressbook-picker-dialog')
+
+  const dialogDescription = context.dom.createElement('p')
+  dialogDescription.setAttribute('id', 'contacts-dialog-description')
+  dialogDescription.classList.add('contacts-dialog__description')
+  dialogDescription.textContent = 'Choose an address book and group for this contact, or create them first.'
+  addressBookContactCreationDialog.setAttribute('aria-describedby', 'contacts-dialog-description')
+
+  const mainContent = context.dom.createElement('div')
+  mainContent.classList.add('contacts-dialog__main')
+
+  const addressBookContactCreationDiv = context.dom.createElement('section')
+  addressBookContactCreationDiv.setAttribute('aria-label', 'Contact creation options')
+  addressBookContactCreationDiv.classList.add('contacts-dialog__body', 'contacts-dialog__creation', 'flex-column')
+
+  const addressBookDetailsSection = createAddressBookDetailsSection(context)
+  const statusRegion = createContactsStatusRegion(context)
+  const addressBookListDiv = createAddressBookListSection(context, contactsModule, contactData, addressBooksData)
+  const inlinePanelRegion = createInlinePanelRegion(context)
+  addressBookDetailsSection.appendChild(addressBookListDiv)
+  addressBookDetailsSection.appendChild(inlinePanelRegion)
+
+  addressBookContactCreationDiv.appendChild(addressBookDetailsSection)
+
+  mainContent.appendChild(dialogDescription)
+  mainContent.appendChild(addressBookContactCreationDiv)
+
+  addressBookContactCreationDialog.appendChild(mainContent)
+  addressBookContactCreationDialog.appendChild(statusRegion)
+
+  setTimeout(() => {
+    const firstAction = addressBookContactCreationDialog.querySelector('#addressbook-list button, #contacts-create-addressbook-button, #contacts-addressbook-uri-entry-button') as HTMLElement | null
+    if (firstAction) firstAction.focus()
+  }, 0)
+ 
+  return addressBookContactCreationDialog
+}
+
+export function createAddressBookContactCreationFooter(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+): HTMLDivElement {
+  const footer = context.dom.createElement('div')
+  footer.classList.add('contacts-dialog__footer')
+
+  const cancelButton = createDialogCancelButton(context)
+  const submitButton = createNewContactCreationButton(context, contactsModule, addressBooksData, contactData)
+
+  footer.appendChild(cancelButton)
+  footer.appendChild(submitButton)
+  return footer
+}
+
+// Backward-compatible export name used by consumers and tests.
+export const createAddressBookUriSelectorDialog = createAddressBookContactCreationDialog
+
+function createPopupHeader(
+  context: DataBrowserContext,
+  title: string,
+  titleId: string,
+  closeButton: ContactsButtonElement
+): HTMLDivElement {
+  const header = context.dom.createElement('div')
+  header.classList.add('contacts-dialog__header', 'contacts-dialog__header--popup')
+
+  const heading = context.dom.createElement('h3')
+  heading.setAttribute('id', titleId)
+  heading.classList.add('contacts-dialog__title')
+  heading.textContent = title
+
+  header.appendChild(heading)
+  header.appendChild(closeButton)
+  return header
+}
+
+const createAddressBookDetailsSection = (
+  context: DataBrowserContext
+): HTMLElement => {
+  const addressBookDetailsSection = context.dom.createElement('section')
+  addressBookDetailsSection.setAttribute('id', 'addressbook-details-section')
+  addressBookDetailsSection.classList.add('contacts-dialog__details', 'flex-row')
+
+  return addressBookDetailsSection
+}
+
+const createAddressBookCreationButton = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+): ContactsButtonElement => {
+  const setButtonOnClickHandler = async (event) => {
+    event.preventDefault()
+    resetSelectedAddressBookState(context)
+    const newAddressBookForm = createNewAddressBookForm(context, addressBooksData, contactsModule, contactData)
+    renderInlinePanel(context, newAddressBookForm)
+  }
+
+  const addressBookCreationButton = createContactsButtonElement(context, {
+    id: 'contacts-create-addressbook-button',
+    type: 'button',
+    label: 'Create Address Book',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__action-button--primary']
+  })
+  addressBookCreationButton.addEventListener('click', setButtonOnClickHandler)
+  return addressBookCreationButton
+}
+
+const createAddressBookUriEntryDialog = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+): HTMLElement => {
+  const addressBookUriEntryDialog = context.dom.createElement('section')
+  addressBookUriEntryDialog.setAttribute('aria-labelledby', 'contacts-addressbook-uri-entry-title')
+  addressBookUriEntryDialog.setAttribute('id', 'contacts-addressbook-uri-entry')
+  addressBookUriEntryDialog.classList.add('contacts-dialog__popup', 'contacts-dialog__uri-entry', 'flex-column')
+
+  const closeButton = createCloseButton(context, addressBookUriEntryDialog)
+  addressBookUriEntryDialog.appendChild(createPopupHeader(context, 'Enter address book URI', 'contacts-addressbook-uri-entry-title', closeButton))
+  addressBookUriEntryDialog.appendChild(createAddressBookUriEntryForm(context, contactsModule, addressBooksData, contactData))
+  return addressBookUriEntryDialog
+}
+const createAddressBookUriEntryButton = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+): ContactsButtonElement => {
+  const setButtonOnClickHandler = async (event) => { 
+    event.preventDefault()
+    resetSelectedAddressBookState(context)
+    const addressBookUriEntryDialog = createAddressBookUriEntryDialog(context, contactsModule, addressBooksData, contactData)
+    renderInlinePanel(context, addressBookUriEntryDialog)
+  }
+
+  const addressBookCreationButton = createContactsButtonElement(context, {
+    id: 'contacts-addressbook-uri-entry-button',
+    type: 'button',
+    label: 'Enter Address Book URI',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__action-button--primary']
+  })
+  addressBookCreationButton.addEventListener('click', setButtonOnClickHandler)
+  return addressBookCreationButton
+}
+
+const createAddressBookUriEntryForm = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+): HTMLFormElement => {
+  let submitButton: ContactsButtonElement | null = null
+
+  const setButtonOnSubmitHandler = async (event) => {
+    event.preventDefault()
+    await runWithButtonLoading(context, submitButton, 'Adding...', async () => {
+      try {
+        const addressBookUriField = context.dom.querySelector('#addressBookUriInput') as HTMLInputElement | null
+
+        const enteredAddressBookUri = sanitizeInput(addressBookUriField?.value || '')
+        if (addressBookUriField) addressBookUriField.value = enteredAddressBookUri
+
+        if (!enteredAddressBookUri) {
+          addErrorToErrorDisplay(context, errorNotExistsAddressBookUri)
+          return
+        }
+
+        const uriCheck = enteredAddressBookUri.substring(enteredAddressBookUri.length - 5, enteredAddressBookUri.length)
+        const normalizedUri = (uriCheck === '#this') ? enteredAddressBookUri : enteredAddressBookUri + '#this'
+        const books = await addANewAddressBookUriToAddressBooks(context, contactsModule, addressBooksData, normalizedUri)
+
+        const addressBookListDiv = context.dom.querySelector('#addressbook-list')
+        if (addressBookListDiv) {
+          clearInlinePanel(context)
+          removePopupOverlayIfNoPopup(context)
+          const addressBookCreationButton = context.dom.getElementById('contacts-create-addressbook-button')
+          const addressBookUriEntryButton = context.dom.getElementById('contacts-addressbook-uri-entry-button')
+          addressBookCreationButton.remove()
+          addressBookUriEntryButton.remove()
+          addressBookListDiv.appendChild(createAddressBookButton(context, contactsModule, books.addressBooksData, books.addressBook, enteredAddressBookUri, contactData))
+          addressBookListDiv.appendChild(createAddressBookCreationButton(context, contactsModule, books.addressBooksData, contactData))
+          addressBookListDiv.appendChild(createAddressBookUriEntryButton(context, contactsModule, books.addressBooksData, contactData))
+          announceContactsStatus(context, 'Address book added to the list.')
+        }
+      } catch (error) {
+        debugError('Contacts address book URI processing failed', error)
+        addErrorToErrorDisplay(context, formatContactsDialogError(errorProcessingUriAddressBook, error))
+      }
+    })
+  }
+
+  const inputAddressUriEventListener = (event) => {
+    const input = event.target as HTMLInputElement
+    input.value = sanitizeInput(input.value)
+    checkAndRemoveErrorDisplay(context)
+  }
+  const addressBookUriEntryForm = context.dom.createElement('form')
+  addressBookUriEntryForm.setAttribute('id', 'contacts-address-uri-entry-form')
+  addressBookUriEntryForm.classList.add('contacts-dialog__uri-entry-form', 'flex-column')
+  addressBookUriEntryForm.method = 'post'
+  addressBookUriEntryForm.addEventListener('submit', setButtonOnSubmitHandler)
+  const popupBody = createPopupSection(context, 'contacts-dialog__popup-body', 'flex-column-center', 'text-center')
+  const popupFooter = createPopupSection(context, 'contacts-dialog__popup-footer')
+
+  const addressBookUriEntryLabel = context.dom.createElement('label')
+  addressBookUriEntryLabel.setAttribute('for', 'addressBookUriInput')
+  const addressBookUriEntryLabelText = context.dom.createElement('span')
+  addressBookUriEntryLabelText.classList.add('sr-only')
+  addressBookUriEntryLabelText.textContent = 'Address book URI'
+  addressBookUriEntryLabel.appendChild(addressBookUriEntryLabelText)
+
+  const addressBookNameInputBox = context.dom.createElement('input')
+  addressBookNameInputBox.type = 'text'
+  addressBookNameInputBox.name = 'addressBookUri'
+  addressBookNameInputBox.id = 'addressBookUriInput'
+  addressBookNameInputBox.placeholder = 'Enter address book URI to find your address book'
+  addressBookNameInputBox.classList.add('input', 'contacts-dialog__uri-input')
+  addressBookNameInputBox.addEventListener('input', inputAddressUriEventListener)
+  
+  popupBody.appendChild(addressBookUriEntryLabel)
+  popupBody.appendChild(addressBookNameInputBox)
+  submitButton = createAddressBookUriEntryAddButton(context)
+  popupFooter.appendChild(submitButton)
+  addressBookUriEntryForm.appendChild(popupBody)
+  addressBookUriEntryForm.appendChild(popupFooter)
+  
+  return addressBookUriEntryForm
+}
+
+const createAddressBookUriEntryAddButton = (
+  context: DataBrowserContext
+): ContactsButtonElement => {
+
+  const setButtonOnClickHandler = async (event) => {
+    event.preventDefault()
+    const addressBookUriEntryForm = context.dom.querySelector('#contacts-address-uri-entry-form') 
+    // @ts-ignore
+    if (addressBookUriEntryForm) addressBookUriEntryForm.requestSubmit()
+  }
+
+  const entryButton = createContactsButtonElement(context, {
+    id: 'contacts-addressbook-entry-button',
+    type: 'submit',
+    ariaLabel: 'Submit new address book URI',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__action-button--primary', 'contacts-dialog__uri-submit', 'inline-flex-row', 'justify-center']
+  })
+  entryButton.addEventListener('click', setButtonOnClickHandler)
+  entryButton.textContent = 'Add'
+  return entryButton
+}
+
+const createAddressBookListSection = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  contactData: ContactData,
+  addressBooksData: AddressBooksData
+): HTMLElement => {
+
+  const addressBookListSection = context.dom.createElement('section')
+  addressBookListSection.setAttribute('class', 'contacts-dialog__address-book-list')
+  addressBookListSection.setAttribute('aria-label', 'Select an address book for this contact.')
+  addressBookListSection.setAttribute('aria-describedby', 'addressbook-list')
+  addressBookListSection.setAttribute('id', 'addressbook-list')
+  const heading = context.dom.createElement('h3')
+  heading.classList.add('contacts-dialog__column-title')
+  heading.textContent = 'Address Books'
+  addressBookListSection.appendChild(heading)
+  addressBooksData.public.forEach((addressBook, addressBookUri) => {
+    addressBookListSection.appendChild(createAddressBookButton(context, contactsModule, addressBooksData, addressBook, addressBookUri, contactData))
+  })
+
+  addressBooksData.private.forEach((addressBook, addressBookUri) => {
+    addressBookListSection.appendChild(createAddressBookButton(context, contactsModule, addressBooksData, addressBook, addressBookUri, contactData))
+  })
+  const addressBookCreationButton = createAddressBookCreationButton(context, contactsModule, addressBooksData, contactData)
+  const addressBookUriEntryButton = createAddressBookUriEntryButton(context, contactsModule, addressBooksData, contactData)
+
+  addressBookListSection.appendChild(addressBookCreationButton)
+  addressBookListSection.appendChild(addressBookUriEntryButton)
+  return addressBookListSection
+}
+
+const createAddressBookGroupCreationButton = (
+  context: DataBrowserContext, 
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+): ContactsButtonElement => {
+  const setButtonOnClickHandler = async (event) => { 
+    event.preventDefault()
+    const groupNameForm = context.dom.getElementById('new-group-form')
+    if (!groupNameForm) {
+      const newGroupForm = createGroupNameForm(context, contactsModule, addressBooksData, contactData)
+      renderInlinePanel(context, newGroupForm)
+    }
+  }
+  const groupCreationButton = createContactsButtonElement(context, {
+    id: 'contacts-create-group-button',
+    type: 'button',
+    label: 'Create Group',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__action-button--primary']
+  })
+  groupCreationButton.addEventListener('click', setButtonOnClickHandler)
+  return groupCreationButton
+}
+
+const createGroupListSection = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  addressBook: AddressBookDetails,
+  contactData: ContactData
+): HTMLElement => {
+
+  const groupListSection = context.dom.createElement('section')
+  groupListSection.setAttribute('class', 'contacts-dialog__group-list flex-column')
+  groupListSection.setAttribute('aria-label', 'Select a group to add your contact to.')
+  groupListSection.setAttribute('aria-describedby', 'group-list')
+  groupListSection.setAttribute('id', 'group-list')
+  const heading = context.dom.createElement('h3')
+  heading.classList.add('contacts-dialog__column-title')
+  heading.textContent = 'Groups'
+  groupListSection.appendChild(heading)
+  if (addressBook) {
+    addressBook.groups.map((group) => {
+        groupListSection.appendChild(createGroupButton(context, group))
+    })
+  } 
+  groupListSection.appendChild(createAddressBookGroupCreationButton(context, contactsModule, addressBooksData, contactData))
+  return groupListSection as HTMLElement
+}
+
+const createNewContactCreationButton = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+): ContactsButtonElement => {
+  let button: ContactsButtonElement
+
+  const setButtonOnClickHandler = async (event) => {
+    event.preventDefault()
+
+    await runWithButtonLoading(context, button, 'Adding...', async () => {
+      const contactExistsByWebID = checkIfContactExistsByWebID(addressBooksData, contactData.webID)
+      const contactExistsByNameUri = checkIfContactExistsByName(addressBooksData, contactData.name)
+      const contactExistsHandled = handleContactExistsFromNonRegisteredAddressBook(
+        context,
+        addressBooksData,
+        contactData,
+        contactExistsByWebID,
+        contactExistsByNameUri
+      )
+      if (contactExistsHandled) return
+      
+      let selectedAddressBookUri = null 
+      const selectedGroupUris = []
+
+      const selectedAddressBookElements = context.dom.querySelectorAll('#addressbook-list .contacts-dialog__list-button[selected]')
+      selectedAddressBookElements.forEach((addressBookButton) => {
+        selectedAddressBookUri = addressBookButton.getAttribute('id')
+      })
+
+      const selectedGroupElements = context.dom.querySelectorAll('#group-list .contacts-dialog__list-button[selected]')
+      selectedGroupElements.forEach((groupButtons) => {
+        selectedGroupUris.push(groupButtons.getAttribute('id'))
+      })
+      
+      if (selectedGroupUris.length) {
+        const selectedAddressBookUris = { 
+          addressBookUri: selectedAddressBookUri,
+          groupUris: selectedGroupUris 
+        }
+
+        try {
+          const contactUri = await createContactInAddressBook(context, contactsModule, contactData, selectedAddressBookUris)
+          finalizeContactEntry(context, addressBooksData, contactData, contactUri)
+        } catch(error) {
+          debugError('Contacts contact creation failed', error)
+          addErrorToErrorDisplay(context, formatContactsDialogError(errorContactCreation, error))
+        }
+      } else {
+        addErrorToErrorDisplay(context, groupIsRequired)
+      }
+    })
+  }
+
+  button = createContactsButtonElement(context, {
+    id: 'contacts-submit-contact-button',
+    type: 'submit',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__action-button--primary', 'contacts-dialog__submit-contact']
+  })
+  button.disabled = true
+  button.setAttribute('aria-disabled', 'true')
+  button.addEventListener('click', setButtonOnClickHandler)
+  button.textContent = 'Add Contact'
+  return button
+}
+
+const createAddressBookButton = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData,
+  addressBook: AddressBookDetails,
+  addressBookUri: string,
+  contactData: ContactData
+): ContactsButtonElement => {
+  
+  const setButtonOnClickHandler =  (event) => {
+    event.preventDefault()
+    const selectedAddressBookButton = event.currentTarget as ContactsButtonElement
+    const previouslySelected = isContactsListButtonSelected(selectedAddressBookButton)
+    const addressBookDetailsSection = context.dom.getElementById('addressbook-details-section')
+    
+    let addressBook = null
+    // remove the previous groups
+    const groupDivToRemove = context.dom.getElementById('group-list')
+    if (groupDivToRemove) groupDivToRemove.remove()
+    
+    // remove presious address book selection bc you can only have one
+    const selectedAddressBookElements = context.dom.querySelectorAll('#addressbook-list .contacts-dialog__list-button[selected]')
+    selectedAddressBookElements.forEach((addressBookButton) => {
+      setContactsListButtonSelected(addressBookButton, false)
+    })
+    
+    if (previouslySelected) {
+      setContactsListButtonSelected(selectedAddressBookButton, false)
+      clearInlinePanel(context)
+   } else {
+      clearInlinePanel(context)
+
+      setContactsListButtonSelected(selectedAddressBookButton, true)
+      // selected address book code
+      const selectedAddressBookUri = selectedAddressBookButton.id
+      // can check for the class on private
+      addressBook = addressBooksData.public.get(selectedAddressBookUri) 
+      if (!addressBook) addressBook = addressBooksData.private.get(selectedAddressBookUri) 
+      
+      // remove the previous groups
+      const groupDivToRemove = context.dom.getElementById('group-list')
+      if (groupDivToRemove) groupDivToRemove.remove()
+      // add groups for addressbook    
+      const groupListSection = createGroupListSection(context, contactsModule, addressBooksData, addressBook, contactData)  
+      addressBookDetailsSection.appendChild(groupListSection)
+    }
+
+    selectedAddressBookButton.blur()
+    syncAddContactActionState(context)
+  }
+
+  const button = createContactsButtonElement(context, {
+    id: addressBookUri,
+    type: 'button',
+    ariaLabel: 'Select address book ' + addressBook.name,
+    variant: 'secondary',
+    size: 'sm',
+    contentAlign: 'start',
+    classes: ['contacts-dialog__list-button']
+  })
+  button.setAttribute('value', addressBook.name)
+  button.addEventListener('click', setButtonOnClickHandler)
+  button.textContent = addressBook.name
+  return button
+}
+
+const createNewAddressBookForm = (
+  context: DataBrowserContext,
+  addressBooksData: AddressBooksData,
+  contactsModule: ContactsModuleRdfLib,
+  contactData: ContactData
+): HTMLFormElement => {
+  let submitButton: ContactsButtonElement | null = null
+
+  const newAddressBookEventListener = async (event) => {
+    event.preventDefault()
+    await runWithButtonLoading(context, submitButton, 'Creating...', async () => {
+      try {
+        let enteredAddressBookUri = null
+        let newGroupNode: NamedNode | null = null
+
+        const addressNameField = context.dom.querySelector('#addressBookNameInput')
+
+        // @ts-ignore
+        const enteredAddressName = sanitizeInput(addressNameField.value)
+        // @ts-ignore
+        addressNameField.value = enteredAddressName
+
+        const addressContainerField = context.dom.querySelector('#addressBookContainerInput')
+
+        // @ts-ignore
+        const enteredAddressContainer = sanitizeInput(addressContainerField.value)
+        // @ts-ignore
+        addressContainerField.value = enteredAddressContainer
+
+        const groupNameField = context.dom.querySelector('#groupNameInput')
+        // @ts-ignore
+        const enteredGroupName = sanitizeInput(groupNameField.value)
+        // @ts-ignore
+        groupNameField.value = enteredGroupName
+
+        if (!enteredAddressName) return
+
+        enteredAddressBookUri = await handleAddressBookCreation(context, enteredAddressContainer, enteredAddressName)
+        if (!enteredAddressBookUri) {
+          throw new Error(errorNotExistsAddressBookUri)
+        }
+
+        const resolvedAddressBookUri = enteredAddressBookUri
+        
+        if (enteredGroupName) {
+          const selectedAddressBookNode = new NamedNode(resolvedAddressBookUri)
+          newGroupNode = await saveNewGroupToAddressBook(context, selectedAddressBookNode, enteredGroupName)
+        }
+
+        const nextAddressBooksData = addAddressBookToAddressBooksData(
+          addressBooksData,
+          resolvedAddressBookUri,
+          {
+            name: enteredAddressName,
+            groups: newGroupNode ? [{ name: enteredGroupName, uri: newGroupNode.value }] : [],
+            contacts: []
+          },
+          'private'
+        )
+
+        refreshAddressBookDialogContents(
+          context,
+          contactsModule,
+          contactData,
+          nextAddressBooksData,
+          resolvedAddressBookUri,
+          newGroupNode?.value || null
+        )
+
+        clearInlinePanel(context)
+        removePopupOverlayIfNoPopup(context)
+      } catch (error) {
+        debugError('Contacts address book creation failed', error)
+        addErrorToErrorDisplay(context, formatContactsDialogError(errorAddressBookCreation, error))
+      }
+    })
+  }   
+
+  const submitFormEventListener = (event) => {
+    event.preventDefault()
+    newAddressBookForm.requestSubmit()
+  }
+
+  const newAddressBookForm = context.dom.createElement('form')
+  newAddressBookForm.setAttribute('aria-labelledby', 'new-addressbook-form-title')
+  newAddressBookForm.method = 'post'
+  newAddressBookForm.setAttribute('id', 'new-addressbook-form')
+  newAddressBookForm.classList.add('contacts-dialog__popup', 'contacts-dialog__address-form', 'flex-column')
+  
+  const addressBookNameLabel = context.dom.createElement('label')
+  addressBookNameLabel.setAttribute('for', 'addressBookNameInput')
+  const addressBookNameLabelText = context.dom.createElement('span')
+  addressBookNameLabelText.classList.add('sr-only')
+  addressBookNameLabelText.textContent = 'Address book name'
+  addressBookNameLabel.appendChild(addressBookNameLabelText)
+
+  const addressBookNameInputBox = context.dom.createElement('input')
+  addressBookNameInputBox.type = 'text'
+  addressBookNameInputBox.name = 'addressBookName'
+  addressBookNameInputBox.id = 'addressBookNameInput' 
+  addressBookNameInputBox.placeholder = 'New address book name' 
+  addressBookNameInputBox.classList.add('input')
+  addressBookNameInputBox.required = true
+
+  const addressBookContainerLabel = context.dom.createElement('label')
+  addressBookContainerLabel.setAttribute('for', 'addressBookContainerInput')
+  const addressBookContainerLabelText = context.dom.createElement('span')
+  addressBookContainerLabelText.classList.add('sr-only')
+  addressBookContainerLabelText.textContent = 'Address book container'
+  addressBookContainerLabel.appendChild(addressBookContainerLabelText)
+
+  const addressBookContainerInputBox = context.dom.createElement('input')
+  addressBookContainerInputBox.type = 'text'
+  addressBookContainerInputBox.name = 'addressBookContainer'
+  addressBookContainerInputBox.id = 'addressBookContainerInput' 
+  addressBookContainerInputBox.placeholder = 'Address book container' 
+  addressBookContainerInputBox.classList.add('input')
+  addressBookContainerInputBox.required = true
+
+  const groupNameLabel = context.dom.createElement('label')
+  groupNameLabel.setAttribute('for', 'groupNameInput')
+  const groupNameLabelText = context.dom.createElement('span')
+  groupNameLabelText.classList.add('sr-only')
+  groupNameLabelText.textContent = 'Group name'
+  groupNameLabel.appendChild(groupNameLabelText)
+
+  const groupNameInputBox = context.dom.createElement('input')
+  groupNameInputBox.type = 'text'  
+  groupNameInputBox.name = 'groupName'  
+  groupNameInputBox.id = 'groupNameInput'  
+  groupNameInputBox.placeholder = 'New group name'  
+  groupNameInputBox.classList.add('input')
+  groupNameInputBox.required = true
+
+  const validationMessage = createValidationMessage(context)
+  validationMessage.setAttribute('id', 'contacts-addressbook-validation-message')
+
+  addressBookNameInputBox.setAttribute('aria-describedby', 'contacts-addressbook-validation-message')
+  addressBookContainerInputBox.setAttribute('aria-describedby', 'contacts-addressbook-validation-message')
+  groupNameInputBox.setAttribute('aria-describedby', 'contacts-addressbook-validation-message')
+
+  attachSanitizingValidation(addressBookNameInputBox, validationMessage)
+  attachSanitizingValidation(addressBookContainerInputBox, validationMessage)
+  attachSanitizingValidation(groupNameInputBox, validationMessage)
+
+  submitButton = createContactsButtonElement(context, {
+    type: 'submit',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__action-button--primary', 'contacts-dialog__address-submit']
+  })
+  submitButton.addEventListener('click', submitFormEventListener)
+  submitButton.textContent = 'Add'
+  
+  const closeButton = createCloseButton(context, newAddressBookForm)
+  const popupBody = createPopupSection(context, 'contacts-dialog__popup-body', 'flex-column')
+  const popupFooter = createPopupSection(context, 'contacts-dialog__popup-footer')
+
+  newAddressBookForm.appendChild(createPopupHeader(context, 'Create a new address book', 'new-addressbook-form-title', closeButton))
+
+  popupBody.appendChild(addressBookNameLabel)
+  popupBody.appendChild(addressBookNameInputBox)
+
+  popupBody.appendChild(addressBookContainerLabel)
+  popupBody.appendChild(addressBookContainerInputBox)
+
+  popupBody.appendChild(groupNameLabel)
+  popupBody.appendChild(groupNameInputBox)
+  popupBody.appendChild(validationMessage)
+  popupFooter.appendChild(submitButton)
+  newAddressBookForm.appendChild(popupBody)
+  newAddressBookForm.appendChild(popupFooter)
+  newAddressBookForm.addEventListener('submit', newAddressBookEventListener)
+    
+  return newAddressBookForm
+}
+
+function removeDialogElement(
+  context: DataBrowserContext,
+  element: HTMLElement
+): void {
+  if (element && element.classList.contains('contacts-dialog__inline-panel')) {
+    clearInlinePanel(context)
+  } else if (element) {
+    element.remove()
+    removePopupOverlayIfNoPopup(context)
+  }
+}
+
+const createCloseButton = (
+  context: DataBrowserContext,
+  element: HTMLElement
+): SolidUIButtonElement => {
+
+  const buttonID = `${element.id}-close-button`
+  const setButtonOnClickHandler = (event) => {
+    event.preventDefault()
+    removeDialogElement(context, element)
+  }
+
+  const closeButton = createContactsButtonElement(context, {
+    id: buttonID,
+    type: 'button',
+    ariaLabel: 'Close dialog',
+    variant: 'icon',
+    size: 'sm',
+    classes: ['contacts-dialog__close']
+  })
+  closeButton.addEventListener('click', setButtonOnClickHandler)
+  const iconSlot = context.dom.createElement('span')
+  iconSlot.setAttribute('slot', 'icon')
+  render(closeIcon, iconSlot)
+  closeButton.appendChild(iconSlot)
+  return closeButton
+}   
+
+function createDialogCancelButton(
+  context: DataBrowserContext
+): SolidUIButtonElement {
+  const cancelButton = createContactsButtonElement(context, {
+    type: 'button',
+    label: dialogCancelLabelText,
+    variant: 'secondary',
+    size: 'md',
+    classes: ['contacts-dialog__cancel', 'contacts-dialog__cancel--footer']
+  })
+  cancelButton.addEventListener('click', (event) => {
+    event.preventDefault()
+    const sharedCancelButton = getSharedDialogCancelButton(context.dom)
+    if (sharedCancelButton) {
+      sharedCancelButton.click()
+    }
+  })
+  return cancelButton
+}
+
+function createPopupSection(
+  context: DataBrowserContext,
+  className: string,
+  ...extraClasses: string[]
+): HTMLDivElement {
+  const section = context.dom.createElement('div')
+  section.classList.add(className, ...extraClasses)
+  return section
+}
+
+function createInlinePanelRegion(context: DataBrowserContext): HTMLElement {
+  const region = context.dom.createElement('section')
+  region.setAttribute('id', 'contacts-inline-panel-region')
+  region.classList.add('contacts-dialog__inline-panel-region')
+  region.setAttribute('aria-live', 'polite')
+  return region
+}
+
+function refreshAddressBookDialogContents(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  contactData: ContactData,
+  addressBooksData: AddressBooksData,
+  selectedAddressBookUri: string | null,
+  selectedGroupUri: string | null
+): void {
+  const detailsSection = context.dom.getElementById('addressbook-details-section')
+  if (!detailsSection || !addressBooksData) return
+
+  const addressBookListSection = createAddressBookListSection(context, contactsModule, contactData, addressBooksData)
+  const inlinePanelRegion = createInlinePanelRegion(context)
+
+  detailsSection.replaceChildren()
+  detailsSection.appendChild(addressBookListSection)
+
+  if (selectedAddressBookUri) {
+    const selectedAddressBook = addressBooksData.public.get(selectedAddressBookUri) || addressBooksData.private.get(selectedAddressBookUri)
+    if (selectedAddressBook) {
+      const groupListSection = createGroupListSection(context, contactsModule, addressBooksData, selectedAddressBook, contactData)
+      detailsSection.appendChild(groupListSection)
+    }
+  }
+
+  detailsSection.appendChild(inlinePanelRegion)
+
+  if (selectedAddressBookUri) {
+    const selectedAddressBookButton = context.dom.getElementById(selectedAddressBookUri)
+    if (selectedAddressBookButton) {
+      setContactsListButtonSelected(selectedAddressBookButton, true)
+    }
+  }
+
+  if (selectedGroupUri) {
+    const selectedGroupButton = context.dom.getElementById(selectedGroupUri)
+    if (selectedGroupButton) {
+      setContactsListButtonSelected(selectedGroupButton, true)
+    }
+  }
+
+  syncAddContactActionState(context)
+}
+
+function resetSelectedAddressBookState(context: DataBrowserContext): void {
+  const selectedAddressBookElements = context.dom.querySelectorAll('#addressbook-list .contacts-dialog__list-button[selected]')
+  selectedAddressBookElements.forEach((addressBookButton) => {
+    setContactsListButtonSelected(addressBookButton, false)
+  })
+
+  const groupListSection = context.dom.getElementById('group-list')
+  if (groupListSection) groupListSection.remove()
+  syncAddContactActionState(context)
+}
+
+function clearInlinePanel(context: DataBrowserContext): void {
+  const region = context.dom.getElementById('contacts-inline-panel-region')
+  if (!region) return
+
+  region.replaceChildren()
+  region.classList.remove('contacts-dialog__inline-panel-region--active')
+  syncAddContactActionState(context)
+}
+
+function renderInlinePanel(context: DataBrowserContext, element: HTMLElement): void {
+  const region = context.dom.getElementById('contacts-inline-panel-region')
+  if (!region) return
+
+  region.replaceChildren()
+  element.classList.add('contacts-dialog__inline-panel')
+  region.appendChild(element)
+  region.classList.add('contacts-dialog__inline-panel-region--active')
+  syncAddContactActionState(context)
+  focusFirstInputInPopup(element)
+}
+
+function syncAddContactActionState(context: DataBrowserContext): void {
+  const selectedAddressBook = context.dom.querySelector('#addressbook-list .contacts-dialog__list-button[selected]')
+  const selectedGroup = context.dom.querySelector('#group-list .contacts-dialog__list-button[selected]')
+  const inlinePanelRegion = context.dom.getElementById('contacts-inline-panel-region')
+  const hasActiveInlinePanel = inlinePanelRegion?.classList.contains('contacts-dialog__inline-panel-region--active') ?? false
+
+  setAddContactActionDisabled(context, !(selectedAddressBook && selectedGroup) || hasActiveInlinePanel)
+}
+
+function setAddContactActionDisabled(context: DataBrowserContext, disabled: boolean): void {
+  const actionButton = context.dom.getElementById('contacts-submit-contact-button') as ContactsButtonElement | null
+  if (!actionButton) return
+  actionButton.disabled = disabled
+  actionButton.setAttribute('aria-disabled', String(disabled))
+}
+
+const createGroupNameForm = (
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData, 
+  contactData: ContactData
+): HTMLFormElement => {
+  let submitButton: ContactsButtonElement | null = null
+
+  const addGroupEventListener = async (event) => {
+    event.preventDefault()
+    await runWithButtonLoading(context, submitButton, 'Creating...', async () => {
+      try {
+        let selectedAddressBookUri = null 
+
+        const selectedAddressBookElements = context.dom.querySelectorAll('#addressbook-list .contacts-dialog__list-button[selected]')
+        selectedAddressBookElements.forEach((addressBookButton) => {
+          selectedAddressBookUri = addressBookButton.getAttribute('id')
+        })
+        
+        const groupNameField = context.dom.querySelector('#groupNameInput')
+        // @ts-ignore
+        const enteredGroupName = sanitizeInput(groupNameField.value)
+        // @ts-ignore
+        groupNameField.value = enteredGroupName
+
+        if (!selectedAddressBookUri) {
+          addErrorToErrorDisplay(context, errorNotExistsAddressBookUri)
+          return
+        }
+
+        if (enteredGroupName) {
+          const selectedAddressBookNode = new NamedNode(selectedAddressBookUri)
+          const newGroupNode = await saveNewGroupToAddressBook(context, selectedAddressBookNode, enteredGroupName)
+          const newGroup = { name: enteredGroupName, uri: newGroupNode.value }
+          const wasUpdated = addGroupToAddressBookData(addressBooksData, selectedAddressBookUri, newGroup)
+          if (!wasUpdated) {
+            addErrorToErrorDisplay(context, errorNotExistsAddressBookUri)
+            return
+          }
+          
+          const removeGroupAddButton = context.dom.getElementById('contacts-create-group-button')
+          if (removeGroupAddButton) removeGroupAddButton.remove()
+
+          const groupListDiv = context.dom.querySelector('#group-list')
+          if (groupListDiv) {
+            groupListDiv.appendChild(createGroupButton(context, newGroup))
+            groupListDiv.appendChild(createAddressBookGroupCreationButton(context, contactsModule, addressBooksData, contactData))
+            announceContactsStatus(context, 'Group added to the list.')
+          }
+          clearInlinePanel(context)
+          removePopupOverlayIfNoPopup(context)
+        }
+      } catch (error) {
+        debugError('Contacts group creation failed', error)
+        addErrorToErrorDisplay(context, formatContactsDialogError(errorGroupCreation, error))
+      }
+    })
+  } 
+  
+  const newGroupForm = context.dom.createElement('form')
+  newGroupForm.setAttribute('aria-labelledby', 'new-group-form-title')
+  newGroupForm.addEventListener('submit', addGroupEventListener) 
+  newGroupForm.setAttribute('id', 'new-group-form')
+  newGroupForm.classList.add('contacts-dialog__popup', 'contacts-dialog__group-form', 'flex-column')
+  
+  const groupNameLabel = context.dom.createElement('label')
+  groupNameLabel.setAttribute('for', 'groupNameInput')
+  const groupNameLabelText = context.dom.createElement('span')
+  groupNameLabelText.classList.add('sr-only')
+  groupNameLabelText.textContent = 'Group name'
+  groupNameLabel.appendChild(groupNameLabelText)
+
+  const groupNameInputBox = context.dom.createElement('input')
+  groupNameInputBox.type = 'text' 
+  groupNameInputBox.name = 'groupName' 
+  groupNameInputBox.id = 'groupNameInput' 
+  groupNameInputBox.placeholder = 'New group name' 
+  groupNameInputBox.classList.add('input')
+
+  const validationMessage = createValidationMessage(context)
+  validationMessage.setAttribute('id', 'contacts-group-validation-message')
+  groupNameInputBox.setAttribute('aria-describedby', 'contacts-group-validation-message')
+
+  attachSanitizingValidation(groupNameInputBox, validationMessage)
+ 
+  submitButton = createAddGroupButton(context, newGroupForm)
+  const closeButton = createCloseButton(context, newGroupForm)
+  const popupBody = createPopupSection(context, 'contacts-dialog__popup-body', 'flex-column')
+  const popupFooter = createPopupSection(context, 'contacts-dialog__popup-footer')
+
+  newGroupForm.appendChild(createPopupHeader(context, 'Create a new group', 'new-group-form-title', closeButton))
+  popupBody.appendChild(groupNameLabel)
+  popupBody.appendChild(groupNameInputBox)
+  popupBody.appendChild(validationMessage)
+  popupFooter.appendChild(submitButton)
+  newGroupForm.appendChild(popupBody)
+  newGroupForm.appendChild(popupFooter)
+    
+  return newGroupForm
+}
+
+const createAddGroupButton = (
+  context: DataBrowserContext,
+  form: HTMLFormElement
+): ContactsButtonElement => {
+  const setButtonOnClickHandler = async (event) => {
+    event.preventDefault()
+    form.requestSubmit()
+  }
+
+  const button = createContactsButtonElement(context, {
+    id: 'contacts-create-group-button',
+    type: 'button',
+    label: 'Add',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__action-button--primary', 'contacts-dialog__group-submit']
+  })
+  button.addEventListener('click', setButtonOnClickHandler)
+  return button
+}     
+
+const handleContactExistsFromNonRegisteredAddressBook = (
+  context: DataBrowserContext,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData,
+  contactExistsByWebID: boolean,
+  contactExistsByNameUri: string,
+): boolean => {
+  
+
+  if (contactExistsByWebID) {
+      addErrorToErrorDisplay(context, contactExistsMessage )
+      return true
+    } else if (contactExistsByNameUri) {
+      const fromRegisteredAddressBook = false
+      const handled = handleContactExistsByName(context, addressBooksData, contactData, contactExistsByNameUri, fromRegisteredAddressBook)
+      return handled
+    }
+    return false
+}
+
+export const handleContactExistsByName = (
+  context: DataBrowserContext,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData,
+  contactExistsByNameUri: string,
+  fromRegisteredAddressBook: boolean
+): boolean => {
+  const selectorDialog = context.dom.getElementById('contacts-addressbook-picker-dialog')
+  const useSharedDialog = fromRegisteredAddressBook || !selectorDialog
+
+  if (useSharedDialog) {
+    void openSharedContactExistsDialog(context, addressBooksData, contactData, contactExistsByNameUri)
+    return true
+  }
+  
+  const contactExistsDialog = context.dom.createElement('section')
+  contactExistsDialog.setAttribute('role', 'alertdialog')
+  contactExistsDialog.setAttribute('aria-modal', 'true')
+  contactExistsDialog.setAttribute('aria-labelledby', 'contacts-contact-exists-title')
+  contactExistsDialog.setAttribute('aria-describedby', 'contacts-contact-exists-message')
+  contactExistsDialog.setAttribute('tabindex', '-1')
+  contactExistsDialog.classList.add('contacts-dialog__popup', 'contacts-dialog__contact-exists', 'flex-column')
+
+  const popupBody = createPopupSection(context, 'contacts-dialog__popup-body', 'flex-column')
+  const popupFooter = createPopupSection(context, 'contacts-dialog__popup-footer')
+
+  const heading = context.dom.createElement('h3')
+  heading.setAttribute('id', 'contacts-contact-exists-title')
+  heading.classList.add('contacts-dialog__title')
+  heading.textContent = 'Contact already exists'
+
+  const message = context.dom.createElement('p')
+  message.setAttribute('id', 'contacts-contact-exists-message')
+  message.textContent = `${contactData.name} already exists. Do you want to add their WebID?`
+  
+  const confirmButton = createContactsButtonElement(context, {
+    type: 'button',
+    label: 'Yes',
+    variant: 'primary',
+    size: 'md',
+    classes: ['contacts-dialog__action-button', 'contacts-dialog__confirm', 'inline-flex-row', 'justify-center']
+  })
+  confirmButton.addEventListener('click', async (event) => {
+    event.preventDefault()
+    await runWithButtonLoading(context, confirmButton, 'Adding...', async () => {
+      await addWebIDToExistingContact(context, contactData, contactExistsByNameUri)
+      contactExistsDialog.remove()
+      finalizeContactEntry(context, addressBooksData, contactData, addressBooksData.contactWebIDs.get(contactData.webID))
+      refreshButton(context, addressBooksData, contactData)
+    })
+  })
+
+  const cancelButton = createContactsButtonElement(context, {
+    type: 'button',
+    label: 'No',
+    variant: 'secondary',
+    size: 'md',
+    classes: ['contacts-dialog__cancel', 'inline-flex-row', 'justify-center']
+  })
+  cancelButton.addEventListener('click', (event) => {
+    event.preventDefault()
+    if (!fromRegisteredAddressBook) {
+      selectorDialog.remove()
+    }
+    
+    contactExistsDialog.remove()
+    complain(getButtonContainer(context), context, 'Contact was not added')
+    setTimeout(() => {
+      clearPreviousMessage(getButtonContainer(context))
+    }, 2000)  
+      refreshButton(context, addressBooksData, contactData)  
+  })
+
+  popupBody.appendChild(heading)
+  popupBody.appendChild(message)
+  popupFooter.appendChild(confirmButton)
+  popupFooter.appendChild(cancelButton)
+
+  contactExistsDialog.appendChild(popupBody)
+  contactExistsDialog.appendChild(popupFooter)
+  showPopupOverlay(context)
+  if (selectorDialog) selectorDialog.appendChild(contactExistsDialog)
+  setTimeout(() => contactExistsDialog.focus(), 0)
+  return true
+}
+
+async function openSharedContactExistsDialog(
+  context: DataBrowserContext,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData,
+  contactExistsByNameUri: string
+): Promise<void> {
+  const form = context.dom.createElement('form')
+  form.classList.add('contacts-dialog__shared-confirm-form')
+
+  const message = context.dom.createElement('p')
+  message.classList.add('contacts-dialog__shared-confirm-message')
+  const name = context.dom.createElement('span')
+  name.classList.add('contacts-dialog__shared-confirm-name')
+  name.textContent = contactData.name
+  message.appendChild(name)
+  message.appendChild(context.dom.createTextNode(' already exists. Do you want to add their WebID?'))
+  form.appendChild(message)
+
+  const result = await openInputDialog({
+    title: 'Contact already exists',
+    dom: context.dom,
+    form,
+    cancelLabel: 'No',
+    submitLabel: 'Yes',
+    onSave: async () => {
+      await addWebIDToExistingContact(context, contactData, contactExistsByNameUri)
+      finalizeContactEntry(context, addressBooksData, contactData, addressBooksData.contactWebIDs.get(contactData.webID))
+      refreshButton(context, addressBooksData, contactData)
+    },
+    formatSaveError: (error: unknown) => {
+      return error instanceof Error ? error.message : errorAddingContactWebIDToAddressBook
+    }
+  })
+
+  if (result) return
+
+  complain(getButtonContainer(context), context, 'Contact was not added')
+  setTimeout(() => {
+    clearPreviousMessage(getButtonContainer(context))
+  }, 2000)
+  refreshButton(context, addressBooksData, contactData)
+}
+
+const finalizeContactEntry = (
+  context: DataBrowserContext,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData,
+  contactUri: string,
+) => {
+    const sharedCancelButton = getSharedDialogCancelButton(context.dom)
+    if (sharedCancelButton) {
+      sharedCancelButton.click()
+    } else {
+      closeSharedDialog()
+    }
+    addressBooksData.contactWebIDs.set(contactData.webID, contactUri)
+    const selectorDialog = context.dom.getElementById('contacts-addressbook-picker-dialog')
+    if (selectorDialog) {
+      selectorDialog.remove()
+    }
+
+    refreshButton(context, addressBooksData, contactData)  
+}
+
+const createGroupButton = (
+  context: DataBrowserContext,
+  group: GroupData
+): ContactsButtonElement => {
+  const setButtonOnClickHandler = async (event) => {
+    event.preventDefault()
+    
+    const selectedGroupButton = event.currentTarget as ContactsButtonElement
+    const previouslySelected = isContactsListButtonSelected(selectedGroupButton)
+    
+    if (previouslySelected) {
+      setContactsListButtonSelected(selectedGroupButton, false)
+      checkAndAddErrorToDisplay(context, groupIsRequired)
+    } else {
+      setContactsListButtonSelected(selectedGroupButton, true)
+      checkAndRemoveErrorDisplay(context)
+    }
+
+    selectedGroupButton.blur()
+    syncAddContactActionState(context)
+  } 
+
+  const button = createContactsButtonElement(context, {
+    id: group.uri,
+    type: 'button',
+    ariaLabel: 'Select group ' + group.name,
+    variant: 'secondary',
+    size: 'sm',
+    contentAlign: 'start',
+    classes: ['contacts-dialog__list-button']
+  })
+  button.setAttribute('value', group.name)
+  button.addEventListener('click', setButtonOnClickHandler)
+  button.textContent = group.name
+
+  return button
+}
+
+export function getButtonContainer(
+  context: DataBrowserContext
+): HTMLDivElement {
+
+  const buttonContainer = context.dom.getElementById('add-to-contacts-button-container')
+  return buttonContainer as HTMLDivElement
+}
+
+const setSelectorDialogBackgroundAccessibility = (
+  selectorDialog: HTMLElement,
+  isPopupActive: boolean
+): void => {
+  const popupManagedAriaHiddenAttribute = 'data-popup-managed-aria-hidden'
+  const popupManagedInertAttribute = 'data-popup-managed-inert'
+
+  Array.from(selectorDialog.children).forEach((child) => {
+    if (!(child instanceof HTMLElement)) return
+    if (child.id === CONTACTS_POPUP_OVERLAY_ID || child.classList.contains('contacts-dialog__contact-exists')) return
+
+    if (isPopupActive) {
+      child.setAttribute('aria-hidden', 'true')
+      child.setAttribute('inert', '')
+
+      const nestedRegions = child.matches('.contacts-dialog__main')
+        ? Array.from(child.querySelectorAll<HTMLElement>('.contacts-dialog__description, .contacts-dialog__body'))
+        : []
+
+      nestedRegions.forEach((region) => {
+        if (region.getAttribute('aria-hidden') !== 'true') {
+          region.setAttribute('aria-hidden', 'true')
+          region.setAttribute(popupManagedAriaHiddenAttribute, 'true')
+        }
+
+        if (region.matches('.contacts-dialog__body') && !region.hasAttribute('inert')) {
+          region.setAttribute('inert', '')
+          region.setAttribute(popupManagedInertAttribute, 'true')
+        }
+      })
+    } else {
+      child.removeAttribute('aria-hidden')
+      child.removeAttribute('inert')
+
+      Array.from(child.querySelectorAll<HTMLElement>(`[${popupManagedAriaHiddenAttribute}="true"]`)).forEach((descendant) => {
+        descendant.removeAttribute('aria-hidden')
+        descendant.removeAttribute(popupManagedAriaHiddenAttribute)
+      })
+
+      Array.from(child.querySelectorAll<HTMLElement>(`[${popupManagedInertAttribute}="true"]`)).forEach((descendant) => {
+        descendant.removeAttribute('inert')
+        descendant.removeAttribute(popupManagedInertAttribute)
+      })
+    }
+  })
+}
+
+const showPopupOverlay = (
+  context: DataBrowserContext
+): void => {
+  const selectorDialog = context.dom.getElementById('contacts-addressbook-picker-dialog')
+  if (!selectorDialog) return
+
+  selectorDialog.classList.add(CONTACTS_OVERLAY_ACTIVE_CLASS)
+  setSelectorDialogBackgroundAccessibility(selectorDialog, true)
+
+  const existingOverlay = selectorDialog.querySelector(`#${CONTACTS_POPUP_OVERLAY_ID}`)
+  if (existingOverlay) return
+
+  const overlay = context.dom.createElement('div')
+  overlay.setAttribute('aria-hidden', 'true')
+  overlay.setAttribute('id', CONTACTS_POPUP_OVERLAY_ID)
+  overlay.classList.add('contacts-dialog__popup-overlay')
+  selectorDialog.appendChild(overlay)
+}
+
+const removePopupOverlayIfNoPopup = (
+  context: DataBrowserContext
+): void => {
+  const selectorDialog = context.dom.getElementById('contacts-addressbook-picker-dialog')
+  if (!selectorDialog) return
+
+  const activePopup = selectorDialog.querySelector('.contacts-dialog__contact-exists')
+  if (activePopup) return
+
+  const overlay = selectorDialog.querySelector(`#${CONTACTS_POPUP_OVERLAY_ID}`)
+  if (overlay) overlay.remove()
+  selectorDialog.classList.remove(CONTACTS_OVERLAY_ACTIVE_CLASS)
+  setSelectorDialogBackgroundAccessibility(selectorDialog, false)
+}
+/* Sanitization and validation */
+function sanitizeInput(input: string): string {
+  return (input || '')
+    .replace(/[^a-zA-Z0-9 ]+/g, '')
+    .replace(/\s+/g, ' ')
+    .trim()
+}
+
+function sanitizeInputForTyping(input: string): string {
+  return (input || '')
+    .replace(/[^a-zA-Z0-9 ]+/g, '')
+}
+
+function attachSanitizingValidation(input: HTMLInputElement, feedbackElement: HTMLElement): void {
+  input.addEventListener('input', () => {
+    const rawValue = input.value
+    const sanitizedValue = sanitizeInputForTyping(rawValue)
+
+    if (rawValue !== sanitizedValue) {
+      input.value = sanitizedValue
+      input.setAttribute('aria-invalid', 'true')
+      feedbackElement.textContent = 'Only letters, numbers, and spaces are allowed.'
+      feedbackElement.classList.add('contacts-dialog__validation--visible')
+      feedbackElement.setAttribute('aria-hidden', 'false')
+      return
+    }
+
+    input.removeAttribute('aria-invalid')
+    feedbackElement.textContent = ''
+    feedbackElement.classList.remove('contacts-dialog__validation--visible')
+    feedbackElement.setAttribute('aria-hidden', 'true')
+  })
+}
+
+function createValidationMessage(context: DataBrowserContext): HTMLParagraphElement {
+  const validationMessage = context.dom.createElement('p')
+  validationMessage.setAttribute('role', 'status')
+  validationMessage.setAttribute('aria-live', 'polite')
+  validationMessage.classList.add('contacts-dialog__validation')
+  validationMessage.setAttribute('aria-hidden', 'true')
+  return validationMessage
+}
+
+function createContactsStatusRegion(context: DataBrowserContext): HTMLParagraphElement {
+  const statusRegion = context.dom.createElement('p')
+  statusRegion.setAttribute('id', 'contacts-list-status')
+  statusRegion.setAttribute('role', 'status')
+  statusRegion.setAttribute('aria-live', 'polite')
+  statusRegion.classList.add('sr-only')
+  return statusRegion
+}
+
+function announceContactsStatus(context: DataBrowserContext, message: string): void {
+  const statusRegion = context.dom.getElementById('contacts-list-status')
+  if (!statusRegion) return
+
+  statusRegion.textContent = ''
+  setTimeout(() => {
+    statusRegion.textContent = message
+  }, 0)
+}
+
+function focusFirstInputInPopup(container: HTMLElement): void {
+  setTimeout(() => {
+    const firstInput = container.querySelector('input, textarea, select') as HTMLElement | null
+    if (firstInput) firstInput.focus()
+  }, 0)
+}
+
+function setButtonLoadingState(button: ContactsButtonElement | null, isLoading: boolean, loadingLabel?: string): void {
+  if (!button) return
+
+  const originalLabel = button.dataset.originalLabel || button.textContent || ''
+  if (!button.dataset.originalLabel) button.dataset.originalLabel = originalLabel
+
+  if (isLoading) {
+    button.disabled = true
+    button.setAttribute('aria-busy', 'true')
+    button.textContent = loadingLabel || originalLabel
+    return
+  }
+
+  button.disabled = false
+  button.removeAttribute('aria-busy')
+  button.textContent = button.dataset.originalLabel || originalLabel
+}
+
+async function runWithButtonLoading<T>(context: DataBrowserContext, button: ContactsButtonElement | null, loadingLabel: string, action: () => Promise<T>): Promise<T> {
+  const sharedModal = context.dom.getElementById('profile-modal') as HTMLDialogElement | null
+  const useDialogOverlay = Boolean(sharedModal?.hasAttribute('open'))
+
+  if (useDialogOverlay) {
+    if (button) {
+      button.disabled = true
+      button.setAttribute('aria-busy', 'true')
+    }
+    setSharedDialogSavingState(context.dom, true, loadingLabel)
+  } else {
+    setButtonLoadingState(button, true, loadingLabel)
+  }
+
+  try {
+    return await action()
+  } finally {
+    if (useDialogOverlay) {
+      setSharedDialogSavingState(context.dom, false, loadingLabel)
+      if (button) {
+        button.disabled = false
+        button.removeAttribute('aria-busy')
+      }
+    } else {
+      setButtonLoadingState(button, false)
+    }
+  }
+}
+
+function sanitizeGroupFileName(name: string): string {
+  return name.replace(/\W/gu, '_').replace(/_+/g, '_')
+}
+
+function getDocumentKey(statementDocument: ReturnType<typeof st>['why']): string {
+  return 'value' in statementDocument ? statementDocument.value : '__default__'
+}
+
+async function updateAcrossDocuments(
+  context: DataBrowserContext,
+  deletions: Array<ReturnType<typeof st>>,
+  insertions: Array<ReturnType<typeof st>> = []
+): Promise<void> {
+  const store = context.session.store
+  ensureStandardMutationPrefixes(store)
+  const docs = deletions.concat(insertions).map((statement) => statement.why)
+  const uniqueDocKeys = new Set<string>()
+  const uniqueDocs = docs.filter((doc) => {
+    const key = getDocumentKey(doc)
+    if (uniqueDocKeys.has(key)) return false
+    uniqueDocKeys.add(key)
+    return true
+  })
+
+  await Promise.all(uniqueDocs.map((doc) =>
+    runDirectUpdaterUpdate(
+      store,
+      deletions.filter((statement) => getDocumentKey(statement.why) === getDocumentKey(doc)),
+      insertions.filter((statement) => getDocumentKey(statement.why) === getDocumentKey(doc)),
+      errorGroupCreation
+    )
+  ))
+}
+
+async function saveNewGroupToAddressBook(
+  context: DataBrowserContext,
+  addressBookNode: NamedNode,
+  name: string
+): Promise<NamedNode> {
+  const store = context.session.store
+
+  await store.fetcher.load(addressBookNode.doc())
+  const groupIndex = store.any(addressBookNode, ns.vcard('groupIndex')) as NamedNode | null
+  if (!groupIndex) {
+    throw new Error('Error loading group index for the selected address book.')
+  }
+
+  const groupFileName = sanitizeGroupFileName(name)
+  const groupNode = sym(`${addressBookNode.dir().uri}Group/${groupFileName}.ttl#this`) as NamedNode
+  const groupDocument = groupNode.doc()
+
+  try {
+    await store.fetcher.load(groupIndex)
+  } catch (error) {
+    throw new Error(`Error loading group index ${groupIndex.value}: ${error}`)
+  }
+
+  if (store.holds(addressBookNode, ns.vcard('includesGroup'), groupNode, groupIndex)) {
+    return groupNode
+  }
+
+  const indexInsertions = [
+    st(addressBookNode, ns.vcard('includesGroup'), groupNode, groupIndex),
+    st(groupNode, ns.rdf('type'), ns.vcard('Group'), groupIndex),
+    st(groupNode, ns.vcard('fn'), literal(name), groupIndex)
+  ]
+
+  const groupInsertions = [
+    st(addressBookNode, ns.vcard('includesGroup'), groupNode, groupDocument),
+    st(groupNode, ns.rdf('type'), ns.vcard('Group'), groupDocument),
+    st(groupNode, ns.vcard('fn'), literal(name), groupDocument)
+  ]
+
+  await updateAcrossDocuments(context, [], indexInsertions)
+  await updateAcrossDocuments(context, [], groupInsertions)
+
+  return groupNode
+}
diff --git a/src/specialButtons/addContact/addMeToYourContacts.ts b/src/specialButtons/addContact/addMeToYourContacts.ts
new file mode 100644
index 00000000..361c54f7
--- /dev/null
+++ b/src/specialButtons/addContact/addMeToYourContacts.ts
@@ -0,0 +1,165 @@
+import { html, render, TemplateResult } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import type { Button as SolidUIButtonElement } from 'solid-ui/components/actions/button'
+import { DataBrowserContext } from 'pane-registry'
+import { authn } from 'solid-logic'
+import { LiveStore, NamedNode } from 'rdflib'
+import {
+  clearPreviousMessage, complain, checkIfAnyUserLoggedIn
+} from '../../buttonsHelper'
+import { getContactData, getAddressBooksData, checkIfContactExistsByWebID, checkIfContactExistsByName } from './selectors'
+import { addContactToAddressBook } from './mutations'
+import { AddressBooksData, ContactData } from './contactsTypes'
+import {
+  addMeToYourContactsButtonText, contactExistsAlreadyButtonText, contactExistsAlreadyByNameButtonText, contactExistsMessage, logInAddMeToYourContactsButtonText, userNotLoggedInErrorMessage,
+  errorAddingContactWebIDToAddressBook
+} from '../../texts'
+import './AddMeToYourContacts.css'
+import type ContactsModuleRdfLib from '@solid-data-modules/contacts-rdflib'
+import { addErrorToErrorDisplay } from './contactsErrors'
+import { handleContactExistsByName } from './ContactCreationDialog'
+import { plusIcon } from '../../icons-svg/profileIcons'
+
+type RefreshableSolidUIButton = SolidUIButtonElement & { refresh?: () => void }
+
+function renderAddToContactsButtonLabel(button: SolidUIButtonElement, label: string, showIcon = false): void {
+  const buttonDocument = button.ownerDocument
+  const content: Node[] = []
+
+  if (showIcon) {
+    const iconWrapper = buttonDocument.createElement('span')
+    iconWrapper.className = 'profile__btn-contacts-icon inline-flex-row justify-center'
+    iconWrapper.setAttribute('aria-hidden', 'true')
+    render(plusIcon, iconWrapper)
+    content.push(iconWrapper)
+  }
+
+  const labelWrapper = buttonDocument.createElement('span')
+  labelWrapper.className = 'profile__btn-contacts-label'
+  labelWrapper.textContent = label
+  content.push(labelWrapper)
+
+  button.replaceChildren(...content)
+}
+let buttonContainer = <HTMLDivElement>document.createElement('section')
+
+const addMeToYourContactsDiv = async (
+  subject: NamedNode,
+  context: DataBrowserContext
+): Promise<TemplateResult> => {
+  
+  buttonContainer = context.dom.createElement('section') as HTMLDivElement
+  buttonContainer.setAttribute('id', 'add-to-contacts-button-container')
+  buttonContainer.setAttribute('class', 'profile-contacts-button__section text-truncate text-center section-centered')
+  buttonContainer.setAttribute('aria-label', 'Add me to your contacts actions')
+  buttonContainer.setAttribute('data-testid', 'button')
+  buttonContainer.hidden = true
+
+  const button = await createAddMeToYourContactsButton(subject, context)
+  button.classList.add('profile__action-button', 'profile__btn-contacts', 'flex-center')
+  buttonContainer.appendChild(button)
+  return html`${buttonContainer}`
+}
+
+const createAddMeToYourContactsButton = async (
+  subject: NamedNode,
+  context: DataBrowserContext
+): Promise<RefreshableSolidUIButton> => {
+  const me = authn.currentUser()
+  
+  let addressBooksData = null
+  let contactData = null
+  const store: LiveStore = context.session.store
+  const fetcher = store.fetcher
+  const updater = store.updater
+  const { default: ContactsModuleRdfLib } = await import('@solid-data-modules/contacts-rdflib')
+  const contactsModule = new ContactsModuleRdfLib({ store, fetcher, updater})
+
+  try {
+    addressBooksData = await getAddressBooksData(context, contactsModule)
+    contactData = await getContactData(store, subject)   
+  } catch (error) {
+    addErrorToErrorDisplay(context, error)
+  }
+  function setButtonHandler(event) {
+    event.preventDefault()
+    saveNewContact(subject, context, contactsModule, addressBooksData)
+      .catch((error) => {
+        clearPreviousMessage(buttonContainer)
+        complain(buttonContainer, context, error)
+      })
+  }
+  const label = checkIfAnyUserLoggedIn(me) ? addMeToYourContactsButtonText : logInAddMeToYourContactsButtonText
+  const button = context.dom.createElement('solid-ui-button') as RefreshableSolidUIButton
+  button.setAttribute('type', 'button')
+  button.setAttribute('variant', 'secondary')
+  button.setAttribute('size', 'sm')
+  button.addEventListener('click', setButtonHandler)
+  button.setAttribute('id', 'add-to-contacts-button')
+  renderAddToContactsButtonLabel(button, label, checkIfAnyUserLoggedIn(me))
+  button.refresh = refreshButton
+  refreshButton()
+  
+  function refreshButton() {
+    if (checkIfAnyUserLoggedIn(me)) {
+      button.disabled = false
+      button.removeAttribute('disabled')
+
+      const contactExistsByWebID = (contactData) ? checkIfContactExistsByWebID(addressBooksData, contactData.webID) : false
+      const contactExistsByName = (contactData) ? checkIfContactExistsByName(addressBooksData, contactData.name) : false
+      if (contactExistsByWebID) {
+        renderAddToContactsButtonLabel(button, contactExistsAlreadyButtonText)
+        button.disabled = true
+        button.setAttribute('disabled', 'true')
+      } else if (contactExistsByName) {
+        renderAddToContactsButtonLabel(button, contactExistsAlreadyByNameButtonText)
+      } else {
+        renderAddToContactsButtonLabel(button, addMeToYourContactsButtonText, true)
+      }
+    } else {
+      renderAddToContactsButtonLabel(button, logInAddMeToYourContactsButtonText)
+    }
+  }
+  return button
+}
+
+async function saveNewContact(
+  subject: NamedNode,
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBooksData: AddressBooksData
+): Promise<void> {
+  const me = authn.currentUser()
+  const store: LiveStore = context.session.store
+
+// need to find out where the user wants to add the Contact
+  if (checkIfAnyUserLoggedIn(me)) {
+    if (!(checkIfContactExistsByWebID(addressBooksData, subject.value))) {
+      //if contact does not exist, we add her/him
+      await store.fetcher.load(me)
+      try {
+        const contactData: ContactData = await getContactData(store, subject) 
+        const contactExistsByNameUri = checkIfContactExistsByName(addressBooksData, contactData.name)
+        if (contactExistsByNameUri) {
+          const fromRegisteredAddressBook = true
+          const handled = handleContactExistsByName(context, addressBooksData, contactData, contactExistsByNameUri, fromRegisteredAddressBook)
+            if (!handled) addErrorToErrorDisplay(context, errorAddingContactWebIDToAddressBook)
+        } else {
+          await addContactToAddressBook(context, contactsModule, contactData, addressBooksData, buttonContainer)
+        }
+      } catch (error) {
+        let errorMessage = error
+        if (errorMessage.toString().includes('Unauthenticated'))
+          errorMessage = userNotLoggedInErrorMessage
+        throw new Error(errorMessage)
+      }
+    } 
+      else throw new Error(contactExistsMessage)
+  } else throw new Error(userNotLoggedInErrorMessage)
+}
+
+export {
+  addMeToYourContactsDiv,
+  createAddMeToYourContactsButton,
+  saveNewContact
+}
diff --git a/src/specialButtons/addContact/contactsErrors.ts b/src/specialButtons/addContact/contactsErrors.ts
new file mode 100644
index 00000000..61789c30
--- /dev/null
+++ b/src/specialButtons/addContact/contactsErrors.ts
@@ -0,0 +1,130 @@
+import type { Button as SolidUIButtonElement } from 'solid-ui/components/actions/button'
+import { DataBrowserContext } from  'pane-registry'
+import { complain } from  '../../buttonsHelper'
+
+function toErrorMessage(error: unknown): string {
+  return error instanceof Error ? error.message : String(error)
+}
+
+function formatContactsDialogError(prefix: string, error: unknown): string {
+  const message = toErrorMessage(error)
+  return message.startsWith(prefix) ? message : `${prefix}\n${message}`
+}
+
+function getSharedDialogErrorSection(context: DataBrowserContext): HTMLElement | null {
+  return context.dom.querySelector('#profile-modal #modal-error') as HTMLElement | null
+}
+
+const addErrorToErrorDisplay = (
+  context: DataBrowserContext,
+  message: string
+) => {
+  const sharedDialogErrorSection = getSharedDialogErrorSection(context)
+  if (sharedDialogErrorSection && context.dom.getElementById('contacts-addressbook-picker-dialog')) {
+    sharedDialogErrorSection.textContent = message
+    sharedDialogErrorSection.setAttribute('aria-hidden', 'false')
+    sharedDialogErrorSection.hidden = false
+    sharedDialogErrorSection.focus()
+    return
+  }
+
+  const errorDisplaySection = context.dom.getElementById('error-display-section')
+  if (errorDisplaySection) {
+    const errorMessage = context.dom.getElementById('error-display-message')
+    errorDisplaySection.classList.add('contacts-dialog__error--visible')
+    errorDisplaySection.setAttribute('aria-hidden', 'false')
+    if (errorMessage) {
+      errorMessage.textContent = message
+    } else {
+      errorDisplaySection.textContent = message
+    }
+    if (errorDisplaySection instanceof HTMLElement) {
+      errorDisplaySection.focus()
+    }
+  } else {
+    const buttonContainer = context.dom.getElementById('add-to-contacts-button-container')
+    complain(buttonContainer as HTMLDivElement , context, message)
+  }
+}
+
+const checkAndAddErrorToDisplay = (
+  context: DataBrowserContext,
+  message: string
+) => {
+  
+  const selectedGroupElements = context.dom.querySelectorAll('#group-list .contacts-dialog__list-button[selected]')
+
+  const groupNameField = context.dom.querySelector('#groupNameInput')
+  // @ts-ignore
+  const enteredGroupName = groupNameField.value
+  if (selectedGroupElements.length === 0 && !enteredGroupName) {
+    addErrorToErrorDisplay(context, message)
+  }
+}
+
+const createErrorDisplaySection = (
+  context: DataBrowserContext
+): HTMLElement => {
+  const setButtonOnClickHandler = (event) => {
+    event.preventDefault()
+    errorDisplaySection.classList.remove('contacts-dialog__error--visible')
+    errorDisplaySection.setAttribute('aria-hidden', 'true')
+    const errorMessage = context.dom.getElementById('error-display-message')
+    if (errorMessage) errorMessage.textContent = ''
+  }
+
+  const errorDisplaySection = context.dom.createElement('section')
+  errorDisplaySection.setAttribute('role', 'alert')
+  errorDisplaySection.setAttribute('aria-live', 'assertive')
+  errorDisplaySection.setAttribute('aria-atomic', 'true')
+  errorDisplaySection.setAttribute('aria-hidden', 'true')
+  errorDisplaySection.setAttribute('aria-label', 'Section to display error messages related to contact creation')
+  errorDisplaySection.setAttribute('id', 'error-display-section')
+  errorDisplaySection.setAttribute('tabindex', '-1')
+  errorDisplaySection.classList.add('contacts-dialog__error')
+
+  const closeButton = context.dom.createElement('solid-ui-button') as SolidUIButtonElement
+  closeButton.setAttribute('type', 'button')
+  closeButton.setAttribute('variant', 'icon')
+  closeButton.setAttribute('size', 'sm')
+  closeButton.setAttribute('aria-label', 'Close error')
+  closeButton.setAttribute('label', 'Close error')
+  closeButton.classList.add('contacts-dialog__error-close')
+  closeButton.textContent = 'x'
+  closeButton.addEventListener('click', setButtonOnClickHandler)
+
+  const errorMessage = context.dom.createElement('p')
+  errorMessage.setAttribute('id', 'error-display-message')
+
+  errorDisplaySection.appendChild(closeButton)
+  errorDisplaySection.appendChild(errorMessage)
+  return errorDisplaySection
+}
+
+const checkAndRemoveErrorDisplay = (
+  context: DataBrowserContext
+) => {
+  const sharedDialogErrorSection = getSharedDialogErrorSection(context)
+  if (sharedDialogErrorSection && context.dom.getElementById('contacts-addressbook-picker-dialog')) {
+    sharedDialogErrorSection.textContent = ''
+    sharedDialogErrorSection.setAttribute('aria-hidden', 'true')
+    sharedDialogErrorSection.hidden = true
+    return
+  }
+
+  const errorDisplaySection = context.dom.getElementById('error-display-section')
+  if (errorDisplaySection && errorDisplaySection.classList.contains('contacts-dialog__error--visible')) {
+    errorDisplaySection.classList.remove('contacts-dialog__error--visible')
+    errorDisplaySection.setAttribute('aria-hidden', 'true')
+    const errorMessage = context.dom.getElementById('error-display-message')
+    if (errorMessage) errorMessage.textContent = ''
+  }
+}
+
+export { 
+  createErrorDisplaySection, 
+  checkAndRemoveErrorDisplay,
+  addErrorToErrorDisplay,
+  checkAndAddErrorToDisplay,
+  formatContactsDialogError
+ }
diff --git a/src/specialButtons/addContact/contactsTypes.ts b/src/specialButtons/addContact/contactsTypes.ts
new file mode 100644
index 00000000..ed3fbe8a
--- /dev/null
+++ b/src/specialButtons/addContact/contactsTypes.ts
@@ -0,0 +1,47 @@
+import { NamedNode } from 'rdflib'
+
+export interface SelectedAddressBookUris {
+  addressBookUri: string,
+  groupUris: string []
+}
+export type GroupData = {
+  name: string,
+  uri: string
+}
+
+export type ContactDataFromAddressBook = {
+  name: string,
+  uri: string
+}
+export interface AddressBookDetails {
+  name: string,
+  groups: GroupData[]
+  contacts: ContactDataFromAddressBook[]
+}
+
+export interface AddressBooksData {
+  public: Map<string, AddressBookDetails>,
+  private: Map<string, AddressBookDetails>,
+  contactWebIDs: Map<string,string> 
+  contactNames: Map<string,string>
+}
+
+export interface EmailDetails {
+  type: NamedNode,
+  email: NamedNode
+}
+
+export interface PhoneDetails {
+  type: NamedNode,
+  phoneNumber: NamedNode
+}
+export interface ContactData {
+  name: string,
+  nickname?: string,
+  preferredSubjectPronoun?: string,
+  preferredObjectPronoun?: string,
+  preferredRelativePronoun?: string,
+  emails?: EmailDetails[],
+  phoneNumbers?: PhoneDetails[],
+  webID: string
+}
diff --git a/src/specialButtons/addContact/helpers.ts b/src/specialButtons/addContact/helpers.ts
new file mode 100644
index 00000000..2bfb7cd9
--- /dev/null
+++ b/src/specialButtons/addContact/helpers.ts
@@ -0,0 +1,135 @@
+import { DataBrowserContext } from 'pane-registry'
+import { authn } from 'solid-logic'
+import {
+  contactExistsAlreadyButtonText,
+  contactExistsAlreadyByNameButtonText,
+  logInAddMeToYourContactsButtonText
+} from '../../texts'
+import { checkIfAnyUserLoggedIn } from '../../buttonsHelper'
+import { AddressBookDetails, AddressBooksData, ContactData, GroupData } from './contactsTypes'
+import { checkIfContactExistsByName, checkIfContactExistsByWebID } from './selectors'
+import { plusIcon } from '../../icons-svg/profileIcons'
+
+const addAsContactButtonText = 'Add as Contact'
+
+function setAddToContactsButtonContent(button: HTMLElement | null, label: string, showIcon = false): void {
+  if (!button) return
+
+  const { ownerDocument } = button
+  const content: Node[] = []
+
+  if (showIcon) {
+    const iconWrapper = ownerDocument.createElement('span')
+    iconWrapper.className = 'profile__btn-contacts-icon inline-flex-row justify-center'
+    iconWrapper.setAttribute('aria-hidden', 'true')
+    renderIconIntoElement(iconWrapper)
+    content.push(iconWrapper)
+  }
+
+  const labelWrapper = ownerDocument.createElement('span')
+  labelWrapper.className = 'profile__btn-contacts-label'
+  labelWrapper.textContent = label
+  content.push(labelWrapper)
+
+  button.replaceChildren(...content)
+}
+
+function renderIconIntoElement(element: HTMLElement): void {
+  const svgTemplate = (plusIcon as unknown as { strings?: string[], values?: unknown[] })
+  if ('innerHTML' in element && svgTemplate && Array.isArray(svgTemplate.strings)) {
+    element.innerHTML = svgTemplate.strings.join('')
+  }
+}
+
+function refreshButton(
+  context: DataBrowserContext,
+  addressBooksData: AddressBooksData,
+  contactData: ContactData
+) {
+  const me = authn.currentUser()
+  const button = context.dom.getElementById('add-to-contacts-button')
+  if (checkIfAnyUserLoggedIn(me)) {
+    const contactExistsByWebID = checkIfContactExistsByWebID(addressBooksData, contactData.webID)
+    const contactExistsByName = checkIfContactExistsByName(addressBooksData, contactData.name)
+    if (contactExistsByWebID) {
+      setAddToContactsButtonContent(button, contactExistsAlreadyButtonText)
+      button.onclick = null
+      button.setAttribute('disabled', '')
+    } else if (contactExistsByName) {
+      setAddToContactsButtonContent(button, contactExistsAlreadyByNameButtonText)
+      button.removeAttribute('disabled')
+    } else {
+      setAddToContactsButtonContent(button, addAsContactButtonText, true)
+    }
+  } else {
+    setAddToContactsButtonContent(button, logInAddMeToYourContactsButtonText)
+  }
+}
+
+function addGroupToAddressBookData(
+  addressBooksData: AddressBooksData,
+  addressBookUri: string,
+  group: GroupData
+): boolean {
+  const publicAddressBook = addressBooksData.public.get(addressBookUri)
+  if (publicAddressBook) {
+    const groupExists = publicAddressBook.groups.some((existingGroup) => existingGroup.uri === group.uri)
+    if (!groupExists) {
+      addressBooksData.public.set(addressBookUri, {
+        ...publicAddressBook,
+        groups: [...publicAddressBook.groups, group]
+      })
+    }
+    return true
+  }
+
+  const privateAddressBook = addressBooksData.private.get(addressBookUri)
+  if (privateAddressBook) {
+    const groupExists = privateAddressBook.groups.some((existingGroup) => existingGroup.uri === group.uri)
+    if (!groupExists) {
+      addressBooksData.private.set(addressBookUri, {
+        ...privateAddressBook,
+        groups: [...privateAddressBook.groups, group]
+      })
+    }
+    return true
+  }
+
+  return false
+}
+
+function addAddressBookToAddressBooksData(
+  addressBooksData: AddressBooksData,
+  addressBookUri: string,
+  addressBook: AddressBookDetails,
+  visibility: 'public' | 'private' = 'private'
+): AddressBooksData {
+  const nextAddressBooksData: AddressBooksData = {
+    public: new Map(addressBooksData.public),
+    private: new Map(addressBooksData.private),
+    contactWebIDs: addressBooksData.contactWebIDs,
+    contactNames: addressBooksData.contactNames
+  }
+
+  const existingAddressBook = nextAddressBooksData.public.get(addressBookUri) || nextAddressBooksData.private.get(addressBookUri)
+  const nextAddressBook = existingAddressBook
+    ? {
+        ...existingAddressBook,
+        ...addressBook,
+        groups: addressBook.groups.length ? addressBook.groups : existingAddressBook.groups,
+        contacts: addressBook.contacts.length ? addressBook.contacts : existingAddressBook.contacts
+      }
+    : addressBook
+
+  nextAddressBooksData.public.delete(addressBookUri)
+  nextAddressBooksData.private.delete(addressBookUri)
+  nextAddressBooksData[visibility].set(addressBookUri, nextAddressBook)
+
+  return nextAddressBooksData
+}
+
+export {
+  refreshButton,
+  addGroupToAddressBookData,
+  addAddressBookToAddressBooksData
+}
\ No newline at end of file
diff --git a/src/specialButtons/addContact/mutations.ts b/src/specialButtons/addContact/mutations.ts
new file mode 100644
index 00000000..efa39434
--- /dev/null
+++ b/src/specialButtons/addContact/mutations.ts
@@ -0,0 +1,422 @@
+import { literal, NamedNode, st, sym } from 'rdflib'
+import { ns } from 'solid-ui'
+import ContactsModuleRdfLib from '@solid-data-modules/contacts-rdflib'
+import type { NewContact } from '@solid-data-modules/contacts-rdflib'
+import { DataBrowserContext } from 'pane-registry'
+import { authn, solidLogicSingleton } from 'solid-logic'
+import contacts from 'contacts-pane'
+import { createAddressBookContactCreationDialog, createAddressBookContactCreationFooter } from './ContactCreationDialog'
+import { addErrorToErrorDisplay } from './contactsErrors'
+import { openInputDialog } from '../../ui/dialog'
+import {
+  addContactWebIdSaveFailedDebugText,
+  errorContactCreation,
+  errorAddingContactWebIDToAddressBook,
+  errorAddressBookCreation,
+  errorUnableToDetermineUserWorkspace,
+  groupIsRequired
+} from '../../texts'
+import { AddressBookDetails, AddressBooksData, ContactData, SelectedAddressBookUris } from './contactsTypes'
+import { getAddressBooksData } from './selectors'
+import { error as debugError } from '../../utils/debug'
+import { ensureStandardMutationPrefixes, runDirectUpdaterUpdate } from '../../sections/shared/rdfMutationHelpers'
+
+async function addContactToAddressBook(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  contactData: ContactData,
+  addressBooksData: AddressBooksData,
+  container: HTMLDivElement
+) {
+  const launchButton = container.querySelector('#add-to-contacts-button') as HTMLButtonElement | null
+  if (launchButton) launchButton.disabled = true
+
+  const form = createAddressBookContactCreationDialog(context, contactsModule, contactData, addressBooksData)
+  const footer = createAddressBookContactCreationFooter(context, contactsModule, addressBooksData, contactData)
+  await openInputDialog({
+    title: 'Add contact to address book',
+    dom: context.dom,
+    form,
+    headerAction: { type: 'none' },
+    onOpen: () => {
+      const buttonsContainer = context.dom.querySelector('#modal-buttons') as HTMLDivElement | null
+      if (!buttonsContainer) return
+
+      const sharedButtons = Array.from(buttonsContainer.querySelectorAll(':scope > solid-ui-button')) as HTMLElement[]
+      sharedButtons.forEach((button) => {
+        button.hidden = true
+        button.setAttribute('aria-hidden', 'true')
+      })
+
+      buttonsContainer.appendChild(footer)
+    }
+  })
+
+  const refreshedButton = container.querySelector('#add-to-contacts-button') as (HTMLButtonElement & { refresh?: () => void }) | null
+  if (refreshedButton?.refresh) {
+    refreshedButton.refresh()
+  } else if (refreshedButton) {
+    refreshedButton.disabled = false
+  }
+}
+
+async function getAddressData(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBookUri: string
+) {
+  const nextData = await getAddressBooksData(context, contactsModule)
+  const matchingAddressBookUri = resolveAddressBookUri(nextData, addressBookUri)
+  const matchingAddressBook = matchingAddressBookUri
+    ? nextData?.private.get(matchingAddressBookUri) || nextData?.public.get(matchingAddressBookUri) || null
+    : null
+  return { nextData, matchingAddressBook, matchingAddressBookUri }
+}
+
+function getAddressBookUriCandidates(addressBookUri: string): string[] {
+  if (!addressBookUri) return []
+
+  const trimmedUri = addressBookUri.trim()
+  const candidates = new Set<string>([trimmedUri])
+
+  if (trimmedUri.endsWith('#this')) {
+    const withoutFragment = trimmedUri.slice(0, -5)
+    candidates.add(withoutFragment)
+    if (!withoutFragment.endsWith('index.ttl')) {
+      candidates.add(`${withoutFragment.replace(/\/?$/, '/') }index.ttl#this`.replace('/index.ttl#this', '/index.ttl#this'))
+    }
+  } else {
+    candidates.add(`${trimmedUri}#this`)
+    if (trimmedUri.endsWith('/')) {
+      candidates.add(`${trimmedUri}index.ttl#this`)
+    }
+    if (trimmedUri.endsWith('index.ttl')) {
+      candidates.add(`${trimmedUri}#this`)
+    }
+  }
+
+  return Array.from(candidates)
+}
+
+function resolveAddressBookUri(addressBooksData: AddressBooksData | null, addressBookUri: string): string | null {
+  if (!addressBooksData) return null
+
+  const candidates = getAddressBookUriCandidates(addressBookUri)
+  for (const candidate of candidates) {
+    if (addressBooksData.private.has(candidate) || addressBooksData.public.has(candidate)) {
+      return candidate
+    }
+  }
+
+  return null
+}
+
+async function addANewAddressBookUriToAddressBooks(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  _addressBooksData: AddressBooksData,
+  enteredAddressBookUri: string
+): Promise<{ addressBooksData: AddressBooksData, addressBook: AddressBookDetails, addressBookUri: string | null }> {
+  try {
+    const { nextData, matchingAddressBook, matchingAddressBookUri } = await getAddressData(context, contactsModule, enteredAddressBookUri)
+    if (!matchingAddressBook || !nextData || !matchingAddressBookUri) {
+      throw new Error('Address book was not found for the entered URI.')
+    }
+    return { addressBooksData: nextData, addressBook: matchingAddressBook, addressBookUri: matchingAddressBookUri }
+  } catch (error) {
+    throw error instanceof Error ? error : new Error(String(error))
+  }
+}
+
+async function addContactDetails(
+  context: DataBrowserContext,
+  contactUri: string,
+  contactData: ContactData
+) {
+  const store = context.session.store
+  const contactNode = new NamedNode(contactUri)
+  const detailDoc = contactNode.doc()
+  const max = 9999999999999
+  const min = 1000000000000
+
+  const createDetailNode = (): NamedNode => {
+    const randomId = Math.floor(Math.random() * (max - min + 1)) + min
+    return sym(`${detailDoc.uri}#id${randomId}`) as NamedNode
+  }
+
+  const insertions = []
+
+  try {
+    if (contactData.nickname) {
+      insertions.push(st(contactNode, ns.foaf('nick'), literal(contactData.nickname), detailDoc))
+    }
+    if (contactData.preferredSubjectPronoun) {
+      insertions.push(st(contactNode, ns.solid('preferredSubjectPronoun'), literal(contactData.preferredSubjectPronoun), detailDoc))
+    }
+    if (contactData.preferredObjectPronoun) {
+      insertions.push(st(contactNode, ns.solid('preferredObjectPronoun'), literal(contactData.preferredObjectPronoun), detailDoc))
+    }
+    if (contactData.preferredRelativePronoun) {
+      insertions.push(st(contactNode, ns.solid('preferredRelativePronoun'), literal(contactData.preferredRelativePronoun), detailDoc))
+    }
+
+    contactData.emails.map((emailInfo) => {
+      const node = createDetailNode()
+      insertions.push(st(contactNode, ns.vcard('hasEmail'), node, detailDoc))
+      insertions.push(st(node, ns.rdf('type'), emailInfo.type, detailDoc))
+      insertions.push(st(node, ns.vcard('value'), emailInfo.email, detailDoc))
+    })
+    contactData.phoneNumbers.map((phoneInfo) => {
+      const node = createDetailNode()
+      insertions.push(st(contactNode, ns.vcard('hasTelephone'), node, detailDoc))
+      insertions.push(st(node, ns.rdf('type'), phoneInfo.type, detailDoc))
+      insertions.push(st(node, ns.vcard('value'), phoneInfo.phoneNumber, detailDoc))
+    })
+
+    await runDirectUpdaterUpdate(store, [], insertions, errorContactCreation)
+  } catch (error) {
+    addErrorToErrorDisplay(context, error)
+  }
+}
+
+async function createContactInAddressBook(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  contactData: ContactData,
+  selectedAddressBookUris: SelectedAddressBookUris
+): Promise<string> {
+  let contactUri = null
+  const store = context.session.store
+  const newContact: NewContact = {
+    name: contactData.name
+  }
+
+  try {
+    const groupUris = selectedAddressBookUris.groupUris.length ? selectedAddressBookUris.groupUris : undefined
+    if (groupUris) {
+      contactUri = await contactsModule.createNewContact({ addressBookUri: selectedAddressBookUris.addressBookUri, contact: newContact, groupUris })
+    } else {
+      addErrorToErrorDisplay(context, groupIsRequired)
+      return null as any
+    }
+    await context.session.store.fetcher.load(contactUri)
+    const contactNode = new NamedNode(contactUri)
+    await addWebIDToContactCard(store, contactNode, contactData.webID, ns.vcard('WebID'))
+    if (
+      contactData.emails.length ||
+      contactData.phoneNumbers.length ||
+      contactData.nickname ||
+      contactData.preferredSubjectPronoun ||
+      contactData.preferredObjectPronoun ||
+      contactData.preferredRelativePronoun
+    ) {
+      await addContactDetails(context, contactUri, contactData)
+    }
+    return contactUri
+  } catch (error) {
+    throw error instanceof Error ? error : new Error(String(error))
+  }
+
+  return null as any
+}
+
+async function addAddressToTypeIndex(
+  context: DataBrowserContext,
+  typeOfIndex: string,
+  addressBookUri: string
+): Promise<boolean> {
+  const store = context.session.store
+  const me = authn.currentUser()
+  let typeIndexNode = null
+
+  try {
+    await store.fetcher.load(me)
+    const typeIndexes = await solidLogicSingleton.typeIndex.loadTypeIndexesFor(me)
+    if (!typeIndexes.length) {
+      throw new Error('No type index found for the current user')
+    }
+    typeIndexes.map((typeIndex) => {
+      if (typeIndex.label === typeOfIndex) typeIndexNode = typeIndex.index
+    })
+    if (typeIndexNode) {
+      const registration = await solidLogicSingleton.typeIndex.registerInTypeIndex(sym(addressBookUri), typeIndexNode, ns.vcard('AddressBook'))
+      if (registration) return true
+    }
+  } catch (error) {
+    addErrorToErrorDisplay(context, error)
+  }
+  return false
+}
+
+async function addWebIDToExistingContact(
+  context: DataBrowserContext,
+  contactData: ContactData,
+  contactUri: string
+) {
+  const store = context.session.store
+  try {
+    await context.session.store.fetcher.load(contactUri)
+    const contactNode = new NamedNode(contactUri)
+    await addWebIDToContactCard(store, contactNode, contactData.webID, ns.vcard('WebID'))
+  } catch (error) {
+    const rootError = error instanceof Error ? error : new Error(String(error))
+    debugError(addContactWebIdSaveFailedDebugText, rootError)
+    throw new Error(errorAddingContactWebIDToAddressBook, { cause: rootError })
+  }
+}
+
+async function updateAcrossDocuments(
+  store: DataBrowserContext['session']['store'],
+  deletions: Array<ReturnType<typeof st>>,
+  insertions: Array<ReturnType<typeof st>> = []
+): Promise<void> {
+  ensureStandardMutationPrefixes(store)
+
+  const docs = deletions.concat(insertions).map((statement) => statement.why)
+  const uniqueDocKeys = new Set<string>()
+  const uniqueDocs = docs.filter((doc) => {
+    const key = 'value' in doc ? doc.value : '__default__'
+    if (uniqueDocKeys.has(key)) return false
+    uniqueDocKeys.add(key)
+    return true
+  })
+
+  await Promise.all(uniqueDocs.map((doc) =>
+    runDirectUpdaterUpdate(
+      store,
+      deletions.filter((statement) => ('value' in statement.why ? statement.why.value : '__default__') === ('value' in doc ? doc.value : '__default__')),
+      insertions.filter((statement) => ('value' in statement.why ? statement.why.value : '__default__') === ('value' in doc ? doc.value : '__default__')),
+      errorAddingContactWebIDToAddressBook
+    )
+  ))
+}
+
+async function addWebIDToContactCard(
+  store: DataBrowserContext['session']['store'],
+  contactNode: NamedNode,
+  webId: string,
+  urlType: NamedNode
+): Promise<void> {
+  try {
+     
+    new URL(webId)
+  } catch {
+    throw new Error(`WebID: ${webId} is not a valid url.`)
+  }
+
+  const vcardUrlNode = store.bnode()
+  const insertions = [
+    st(contactNode, ns.vcard('url'), vcardUrlNode, contactNode.doc()),
+    st(vcardUrlNode, ns.rdf('type'), urlType, contactNode.doc()),
+    st(vcardUrlNode, ns.vcard('value'), literal(webId), contactNode.doc())
+  ]
+
+  let deletions: Array<ReturnType<typeof st>> = []
+  const groups = store.each(null, ns.vcard('hasMember'), contactNode) as NamedNode[]
+  groups.forEach((group) => {
+    deletions = deletions.concat(store.statementsMatching(group, ns.vcard('hasMember'), contactNode, group.doc()))
+    insertions.push(st(group, ns.vcard('hasMember'), sym(webId), group.doc()))
+    insertions.push(st(sym(webId), ns.owl('sameAs'), contactNode, group.doc()))
+  })
+
+  await updateAcrossDocuments(store, deletions, insertions)
+}
+
+function sanitizeAlphaNumericSpaces(input: string): string {
+  return (input || '')
+    .replace(/[^a-zA-Z0-9 ]+/g, '')
+    .replace(/\s+/g, ' ')
+    .trim()
+}
+
+async function updateAddressBookName(
+  context: DataBrowserContext,
+  addressBookUri: string,
+  newName: string
+) {
+  const store = context.session.store
+  const addressBookNode = sym(addressBookUri)
+  const addressBookDoc = addressBookNode.doc()
+  const trimmedName = newName?.trim()
+
+  if (!trimmedName) return
+
+  try {
+    await store.fetcher.load(addressBookDoc)
+
+    const deletions = [
+      ...store.statementsMatching(addressBookNode, ns.dc('title'), null, addressBookDoc),
+      ...store.statementsMatching(addressBookNode, ns.vcard('fn'), null, addressBookDoc)
+    ]
+
+    const insertions = [
+      st(addressBookNode, ns.dc('title'), literal(trimmedName), addressBookDoc),
+      st(addressBookNode, ns.vcard('fn'), literal(trimmedName), addressBookDoc)
+    ]
+
+    await runDirectUpdaterUpdate(store, deletions, insertions, errorAddressBookCreation)
+  } catch (error) {
+    throw error instanceof Error ? error : new Error(String(error))
+  }
+}
+
+async function handleAddressBookCreation(
+  dataBrowserContext: DataBrowserContext,
+  containerName: string,
+  enteredAddressName: string
+): Promise<string> {
+  const me = authn.currentUser()
+  const newAddressContainer = me?.site()?.value
+  let addressBookUri = null
+
+  const div = dataBrowserContext.dom.getElementById('new-addressbook-form') as HTMLDivElement
+  try {
+    if (!me || !newAddressContainer) {
+      throw new Error(errorUnableToDetermineUserWorkspace)
+    }
+
+    const sanitizedAddressName = sanitizeAlphaNumericSpaces(enteredAddressName)
+    if (!sanitizedAddressName) {
+      throw new Error('Address book name can only contain letters, numbers, and spaces')
+    }
+
+    const sanitizedContainerName = sanitizeAlphaNumericSpaces(containerName)
+
+    const normalizedContainer = newAddressContainer.endsWith('/')
+      ? newAddressContainer
+      : `${newAddressContainer}/`
+
+    const addressBookSlug = (sanitizedContainerName || 'address-book')
+      .trim()
+      .toLowerCase()
+      .replace(/\s+/g, '-')
+      .replace(/[^a-z0-9-]+/g, '-')
+      .replace(/^-+|-+$/g, '') || 'address-book'
+
+    const newBase = `${normalizedContainer}${addressBookSlug}/`
+    const mintResult = await contacts.mintNew(dataBrowserContext, {
+      me,
+      dom: dataBrowserContext.dom,
+      div,
+      newBase,
+      instanceClass: ns.vcard('AddressBook'),
+      instanceName: sanitizedAddressName
+    })
+
+    addressBookUri = mintResult?.newInstance?.uri || `${newBase}index.ttl#this`
+    await updateAddressBookName(dataBrowserContext, addressBookUri, sanitizedAddressName)
+  } catch (error) {
+    throw error instanceof Error ? error : new Error(String(error))
+  }
+  return addressBookUri
+}
+
+export {
+  addContactToAddressBook,
+  createContactInAddressBook,
+  addAddressToTypeIndex,
+  addWebIDToExistingContact,
+  addANewAddressBookUriToAddressBooks,
+  updateAddressBookName,
+  handleAddressBookCreation
+}
\ No newline at end of file
diff --git a/src/specialButtons/addContact/selectors.ts b/src/specialButtons/addContact/selectors.ts
new file mode 100644
index 00000000..363b285e
--- /dev/null
+++ b/src/specialButtons/addContact/selectors.ts
@@ -0,0 +1,207 @@
+import { LiveStore, NamedNode } from 'rdflib'
+import { ns, utils } from 'solid-ui'
+import ContactsModuleRdfLib from '@solid-data-modules/contacts-rdflib'
+import type { AddressBook } from '@solid-data-modules/contacts-rdflib'
+import { DataBrowserContext } from 'pane-registry'
+import { authn } from 'solid-logic'
+import { AddressBooksData, ContactData, EmailDetails, PhoneDetails } from './contactsTypes'
+import { errorGettingAddressBooks, errorLoadingContact, errorReadingAddressBook } from '../../texts'
+import { addErrorToErrorDisplay } from './contactsErrors'
+
+async function getAddressData(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib,
+  addressBookUri: string
+): Promise<AddressBook | null> {
+  let result = null
+  try {
+    result = await contactsModule.readAddressBook(addressBookUri)
+  } catch (error) {
+    addErrorToErrorDisplay(context, `${errorReadingAddressBook}\n${error}`)
+  }
+  return result
+}
+
+async function getWebID(
+  context: DataBrowserContext,
+  contact: { uri: string }
+): Promise<{ webID: string, uri: string } | null> {
+  let webID = null
+  let node = null
+  let webIDNode = null
+
+  try {
+    await context.session.store.fetcher.load(contact.uri.substring(0, contact.uri.length - 5))
+    node = new NamedNode(contact.uri)
+    webIDNode = context.session.store.any(node, ns.vcard('url'), undefined, node.doc())
+    if (webIDNode) {
+      webID = context.session.store.anyValue(webIDNode, ns.vcard('value'), undefined, node.doc())
+      return { webID, uri: contact.uri }
+    }
+    return null
+  } catch (error) {
+    addErrorToErrorDisplay(context, `${errorLoadingContact}${contact.uri}\n${error}`)
+  }
+}
+
+async function processContactWebIDs(
+  context: DataBrowserContext,
+  addressBooksData: AddressBooksData,
+  allContacts: Array<{ name: string, uri: string }>
+): Promise<AddressBooksData> {
+  const contactPromises = allContacts.map(getWebID.bind(null, context))
+  const results = await Promise.all(contactPromises)
+
+  results.map((contact) => {
+    if (contact?.webID) addressBooksData.contactWebIDs.set(contact.webID.trim(), contact.uri)
+  })
+
+  return addressBooksData
+}
+
+async function getAddressBooks(
+  context: DataBrowserContext,
+  contactsModule: ContactsModuleRdfLib
+): Promise<AddressBooksData> {
+  const allContacts = []
+  const me = authn.currentUser()
+
+  let addressBooksData = {
+    public: new Map(),
+    private: new Map(),
+    contactWebIDs: new Map(),
+    contactNames: new Map()
+  }
+
+  try {
+    await context.session.store.fetcher.load(me)
+
+    const addressBookUris = await contactsModule.listAddressBooks(me.value)
+
+    const publicAddressBookPromises = addressBookUris.publicUris.map(addressBook => getAddressData(context, contactsModule, addressBook))
+    const publicAddressBooksData = await Promise.all(publicAddressBookPromises)
+    publicAddressBooksData.map((addressBook) => {
+      if (!addressBook) return
+      addressBooksData.public.set(addressBook.uri, {
+        name: addressBook.title,
+        groups: addressBook.groups,
+        contacts: addressBook.contacts
+      })
+      addressBook.contacts.map((contact) => {
+        addressBooksData.contactNames.set(contact.name, contact.uri)
+        allContacts.push(contact)
+      })
+    })
+
+    const privateAddressBookPromises = addressBookUris.privateUris.map(addressBook => getAddressData(context, contactsModule, addressBook))
+    const privateAddressBooksData = await Promise.all(privateAddressBookPromises)
+    privateAddressBooksData.map((addressBook) => {
+      if (!addressBook) return
+      addressBooksData.private.set(addressBook.uri, {
+        name: addressBook.title,
+        groups: addressBook.groups,
+        contacts: addressBook.contacts
+      })
+      addressBook.contacts.map((contact) => {
+        addressBooksData.contactNames.set(contact.name, contact.uri)
+        allContacts.push(contact)
+      })
+    })
+
+    addressBooksData = await processContactWebIDs(context, addressBooksData, allContacts)
+  } catch (error) {
+    addErrorToErrorDisplay(context, error)
+  }
+  return addressBooksData
+}
+
+async function getAddressBooksData(
+  context: DataBrowserContext,
+  contactModule: ContactsModuleRdfLib
+): Promise<AddressBooksData> {
+  const me = authn.currentUser()
+  if (!me) return null as any
+  let addressBooksData = null
+
+  try {
+    addressBooksData = await getAddressBooks(context, contactModule)
+  } catch (error) {
+    addErrorToErrorDisplay(context, `${errorGettingAddressBooks}\n${error}`)
+  }
+  return addressBooksData
+}
+
+async function getContactData(
+  store: LiveStore,
+  subject: NamedNode
+): Promise<ContactData> {
+  const emails: EmailDetails[] = []
+  const phoneNumbers: PhoneDetails[] = []
+  let type = null
+  let email = null
+  let phoneNumber = null
+
+  const name = utils.label(subject)
+  const nickname = store.anyValue(subject, ns.foaf('nick'), null, subject.doc()) || undefined
+  const preferredSubjectPronoun = store.anyValue(subject, ns.solid('preferredSubjectPronoun'), null, subject.doc()) || undefined
+  const preferredObjectPronoun = store.anyValue(subject, ns.solid('preferredObjectPronoun'), null, subject.doc()) || undefined
+  const preferredRelativePronoun = store.anyValue(subject, ns.solid('preferredRelativePronoun'), null, subject.doc()) || undefined
+
+  const emailNodes = store.each(subject, ns.vcard('hasEmail'), null, subject.doc()) || null
+  const phoneNodes = store.each(subject, ns.vcard('hasTelephone'), null, subject.doc()) || null
+
+  emailNodes.map((node) => {
+    email = store.any(node as NamedNode, ns.vcard('value'), null, subject.doc())
+    type = store.any(node as NamedNode, ns.rdf('type'), null, subject.doc())
+    emails.push({ type, email })
+  })
+  phoneNodes.map((node) => {
+    phoneNumber = store.any(node as NamedNode, ns.vcard('value'), null, subject.doc())
+    type = store.any(node as NamedNode, ns.rdf('type'), null, subject.doc())
+    phoneNumbers.push({ type, phoneNumber })
+  })
+
+  const webID = subject.value
+  return {
+    name,
+    nickname,
+    preferredSubjectPronoun,
+    preferredObjectPronoun,
+    preferredRelativePronoun,
+    emails,
+    phoneNumbers,
+    webID
+  }
+}
+
+function checkIfContactExistsByWebID(
+  addressBooksData: AddressBooksData,
+  subjectUri: string
+): boolean {
+  if (!subjectUri?.trim()) return false
+  return addressBooksData.contactWebIDs.has(subjectUri.trim())
+}
+
+function checkIfContactExistsByName(
+  addressBooksData: AddressBooksData,
+  name: string
+): string | null {
+  let normalizedContactName = null
+  let contactUri = null
+
+  const normalizedSubjectName = name.replace(/\s/g, '').toLowerCase().trim()
+
+  addressBooksData.contactNames.forEach((uri, contactName) => {
+    normalizedContactName = contactName.replace(/\s/g, '').toLowerCase().trim()
+    if (normalizedSubjectName === normalizedContactName) return contactUri = uri
+  })
+
+  return contactUri
+}
+
+export {
+  getAddressBooksData,
+  getContactData,
+  checkIfContactExistsByWebID,
+  checkIfContactExistsByName
+}
\ No newline at end of file
diff --git a/src/addMeToYourFriends.ts b/src/specialButtons/addMeToYourFriends.ts
similarity index 61%
rename from src/addMeToYourFriends.ts
rename to src/specialButtons/addMeToYourFriends.ts
index 26008a9e..eb04f06f 100644
--- a/src/addMeToYourFriends.ts
+++ b/src/specialButtons/addMeToYourFriends.ts
@@ -1,4 +1,6 @@
 import { html, TemplateResult } from 'lit-html'
+import 'solid-ui/components/actions/button'
+import type { Button as SolidUIButtonElement } from 'solid-ui/components/actions/button'
 import { DataBrowserContext } from 'pane-registry'
 import { authn } from 'solid-logic'
 import { LiveStore, NamedNode, st } from 'rdflib'
@@ -6,23 +8,45 @@ import { ns } from 'solid-ui'
 import {
   clearPreviousMessage, complain,
   mention
-} from './buttonsHelper'
+} from '../buttonsHelper'
 import {
   addMeToYourFriendsButtonText, friendExistsAlreadyButtonText, friendExistsMessage, friendWasAddedSuccesMessage, logInAddMeToYourFriendsButtonText, userNotLoggedInErrorMessage
-} from './texts'
-import { ViewerMode } from './types'
-import './styles/ProfileCard.css'
+} from '../texts'
+import { ViewerMode } from '../types'
+import { ensureStandardMutationPrefixes } from '../sections/shared/rdfMutationHelpers'
+import './AddMeToYourFriends.css'
 
 let buttonContainer = <HTMLDivElement>document.createElement('section')
 
+function setAddToFriendsButtonLabel(button: SolidUIButtonElement, label: string): void {
+  const labelWrapper = button.ownerDocument.createElement('span')
+  labelWrapper.className = 'profile__btn-friends-label profile__btn-friends-label--full'
+  labelWrapper.textContent = label
+
+  if (label === friendExistsAlreadyButtonText) {
+    const shortLabelWrapper = button.ownerDocument.createElement('span')
+    shortLabelWrapper.className = 'profile__btn-friends-label profile__btn-friends-label--short'
+    shortLabelWrapper.setAttribute('aria-hidden', 'true')
+    shortLabelWrapper.setAttribute('data-short-label-text', 'Friends')
+    button.setAttribute('data-friends-short-label', 'true')
+    button.setAttribute('aria-label', label)
+    button.replaceChildren(labelWrapper, shortLabelWrapper)
+    return
+  }
+
+  button.removeAttribute('data-friends-short-label')
+  button.removeAttribute('aria-label')
+  button.replaceChildren(labelWrapper)
+}
+
 const addMeToYourFriendsDiv = (
   subject: NamedNode,
   context: DataBrowserContext,
-  viewerMode: ViewerMode
+  _viewerMode: ViewerMode
 ): TemplateResult => {
 
   buttonContainer = context.dom.createElement('section') as HTMLDivElement
-  buttonContainer.setAttribute('class', 'buttonSubSection text-truncate text-center section-centered')
+  buttonContainer.setAttribute('class', 'profile-friends-button__section text-truncate text-center section-centered')
   buttonContainer.setAttribute('aria-labelledby', 'add-me-to-your-friends-button-section')
   buttonContainer.setAttribute('data-testid', 'button')
 
@@ -42,11 +66,13 @@ const addMeToYourFriendsDiv = (
 const createAddMeToYourFriendsButton = (
   subject: NamedNode,
   context: DataBrowserContext
-): HTMLButtonElement => {
+): SolidUIButtonElement => {
   let label = addMeToYourFriendsButtonText
-  const button = context.dom.createElement('button')
-  button.type = 'button'
-  button.textContent = label
+  const button = context.dom.createElement('solid-ui-button') as SolidUIButtonElement
+  button.setAttribute('type', 'button')
+  button.setAttribute('variant', 'secondary')
+  button.setAttribute('size', 'sm')
+  setAddToFriendsButtonLabel(button, label)
   button.addEventListener('click', setButtonHandler)
 
   function setButtonHandler(event: Event) {
@@ -72,19 +98,32 @@ const createAddMeToYourFriendsButton = (
 
     if (checkIfAnyUserLoggedIn(me)) {
       button.disabled = false
+      button.removeAttribute('disabled')
       checkIfThingExists(store, me, subject, ns.foaf('knows')).then((friendExists) => {
+        const isMobileLayout = context.environment?.layout === 'mobile'
+
         if (friendExists) {
           //logged in and friend exists or friend was just added
-          button.textContent = friendExistsAlreadyButtonText
+          setAddToFriendsButtonLabel(button, friendExistsAlreadyButtonText)
+          button.disabled = true
+          button.setAttribute('disabled', 'true')
+          buttonContainer.hidden = isMobileLayout
+          buttonContainer.style.display = isMobileLayout ? 'none' : ''
         } else {
           //logged in and friend does not exist yet
-          button.textContent = addMeToYourFriendsButtonText
+          setAddToFriendsButtonLabel(button, addMeToYourFriendsButtonText)
+          button.disabled = false
+          button.removeAttribute('disabled')
+          buttonContainer.hidden = false
+          buttonContainer.style.display = ''
         }
       })
     } else {
       //not logged in — disable and indicate login is required
-      button.textContent = logInAddMeToYourFriendsButtonText
+      setAddToFriendsButtonLabel(button, logInAddMeToYourFriendsButtonText)
       button.disabled = true
+      button.setAttribute('disabled', 'true')
+      buttonContainer.hidden = false
     }
   }
 
@@ -106,6 +145,7 @@ async function saveNewThing(
       const updater = store.updater
       const toBeInserted = [st(me, predicate, subject, me.doc())]
       try {
+        ensureStandardMutationPrefixes(store)
         await updater.update([], toBeInserted)
       } catch (error) {
         let errorMessage = error
diff --git a/src/styles/BioSection.css b/src/styles/BioSection.css
deleted file mode 100644
index 4069d573..00000000
--- a/src/styles/BioSection.css
+++ /dev/null
@@ -1,77 +0,0 @@
-.bioDescriptionWrap {
-	margin: 0;
-	position: relative;
-	isolation: isolate;
-}
-
-.bioDescriptionText {
-	margin: 0;
-	width: 100%;
-	max-width: none;
-	display: -webkit-box;
-	-webkit-box-orient: vertical;
-	-webkit-line-clamp: 3;
-	line-clamp: 3;
-	line-height: var(--line-height-base, 1.5);
-	position: relative;
-	overflow: hidden;
-}
-
-.bioDescriptionText:not(.isExpanded)::after {
-	content: '';
-	position: absolute;
-	right: 0;
-	top: calc(100% - 1.5em);
-	width: 50%;
-	height: 1.5em;
-	background: var(--color-card-bg);
-	pointer-events: none;
-}
-
-.bioDescriptionText.isExpanded {
-	display: block;
-	-webkit-line-clamp: unset;
-	line-clamp: unset;
-	overflow: visible;
-}
-
-.bioDescriptionToggle {
-	margin: 0;
-	padding: 0;
-	border: 0;
-	background: none;
-	color: var(--color-primary);
-	cursor: pointer;
-	font: inherit;
-	font-size: var(--font-size-sm);
-	line-height: var(--line-height-base, 1.5);
-	position: absolute;
-	left: 50%;
-	bottom: 0;
-	background-color: var(--color-card-bg);
-	white-space: nowrap;
-	min-height: auto;
-	min-width: auto;
-	padding-left: 0;
-	padding-right: 0;
-	padding-top: 0;
-	padding-bottom: 0;
-	margin-left: 0;
-	margin-right: 0;
-	z-index: 0;
-}
-
-.bioDescriptionWrap .bioDescriptionText:not(.isExpanded) + .bioDescriptionToggle {
-	top: calc(100% - 1.5em + 0.28em - 12px);
-	bottom: auto;
-	transform: translateY(7px);
-}
-
-.bioDescriptionText.isExpanded + .bioDescriptionToggle {
-	position: static;
-	display: inline;
-	padding-left: 0;
-	top: auto;
-	bottom: auto;
-	transform: none;
-}
diff --git a/src/styles/CVCard.css b/src/styles/CVCard.css
deleted file mode 100644
index 24d84b4d..00000000
--- a/src/styles/CVCard.css
+++ /dev/null
@@ -1,142 +0,0 @@
-/* CVCard.css */
-/* Note: Uses utilities: .section-title for cvOrg styling */
-
-.cvSection {
-  margin-bottom: 1.25em;
-}
-
-.cvSection > ul {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-
-.cvRole {
-  margin: 0 0 var(--spacing-xs) 0;
-  font-size: var(--font-size-base);
-  line-height: var(--line-height-base);
-  display: flex;
-  flex-direction: column;
-  gap: 0;
-}
-
-.cvRole:last-child {
-  margin-bottom: 0;
-}
-
-.cvRoleHeader {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: baseline;
-  gap: var(--spacing-sm);
-}
-
-.cvRoleHeader h4,
-.cvRoleHeader time {
-  margin: 0;
-}
-
-.cvRolePeriod {
-  margin: 0;
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-tight);
-}
-
-@media (max-width: 640px) {
-  .cvRoleHeader {
-    flex-direction: column;
-    align-items: flex-start;
-  }
-}
-
-.cvOrg {
-  font-weight: 600;
-  color: var(--color-primary);
-  margin: 0;
-}
-
-.cvDescriptionWrap {
-  margin: 0;
-  position: relative;
-  isolation: isolate;
-}
-
-.cvDescriptionText {
-  margin: 0;
-  width: 100%;
-  max-width: none;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-  line-clamp: 2;
-  line-height: var(--line-height-base);
-  padding-right: 4.5em;
-  overflow: hidden;
-}
-
-.cvDescriptionText.isExpanded {
-  display: block;
-  -webkit-line-clamp: unset;
-  line-clamp: unset;
-  padding-right: 0;
-  overflow: visible;
-}
-
-.cvDescriptionToggle {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  background: none;
-  color: var(--color-primary);
-  cursor: pointer;
-  font: inherit;
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-base, 1.5);
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  background-color: var(--color-card-bg);
-  white-space: nowrap;
-  min-height: auto;
-  min-width: auto;
-  padding-left: 0;
-  padding-right: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-  margin-left: 0;
-  margin-right: 0;
-  z-index: 0;
-}
-
-.cvDescriptionWrap .cvDescriptionText:not(.isExpanded) + .cvDescriptionToggle {
-  top: calc(100% - 1.5em + 0.28em - 11px);
-  bottom: auto;
-  transform: translateY(7px);
-}
-
-.cvDescriptionText.isExpanded + .cvDescriptionToggle {
-  position: static;
-  display: inline;
-  padding-left: 0;
-  top: auto;
-  bottom: auto;
-  transform: none;
-}
-
-.cvSkill, .cvLanguage {
-  text-align: left;
-  margin: var(--spacing-xs) 0;
-  font-size: var(--font-size-base);
-  line-height: var(--line-height-base);
-}
-
-.cvSection h3 {
-  color: var(--color-text);
-  font-size: var(--font-size-lg);
-  font-weight: 600;
-  line-height: var(--line-height-tight);
-  margin-bottom: var(--spacing-xs);
-  border-bottom: 1px solid var(--color-border-pale);
-  padding-bottom: var(--spacing-xs);
-}
diff --git a/src/styles/ChatWithMe.css b/src/styles/ChatWithMe.css
deleted file mode 100644
index 3cf237f0..00000000
--- a/src/styles/ChatWithMe.css
+++ /dev/null
@@ -1,6 +0,0 @@
-/* ChatWithMe.css */
-/* Uses utilities: .section-centered, .loading-text, .btn-primary, .btn-transparent */
-
-.chatSection {
-  overflow-x: auto;
-}
diff --git a/src/styles/CollapsibleSection.css b/src/styles/CollapsibleSection.css
new file mode 100644
index 00000000..9b36b88d
--- /dev/null
+++ b/src/styles/CollapsibleSection.css
@@ -0,0 +1,438 @@
+/* Collapsible section styles for the main profile pane. */
+
+/* Base structure */
+.profile-section-collapsible {
+  display: block;
+}
+
+.profile__section--empty.profile-section-collapsible {
+  gap: var(--spacing-lg, 1.5625rem);
+  border-radius: var(--border-radius-md, 0.5rem);
+}
+
+.profile-section-collapsible__header {
+  margin-bottom: 0;
+}
+
+.profile-section-collapsible__content {
+  width: 100%;
+  max-width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.profile-section-collapsible__content > :first-child {
+  margin-top: 0;
+}
+
+.profile-section-collapsible__content > :last-child {
+  margin-bottom: 0;
+}
+
+/* Actions */
+.profile-section-collapsible__actions {
+  --profile-section-collapsible-action-button-text: var(--color-primary, #7C4DFF);
+  --profile-section-collapsible-action-button-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff));
+  --profile-section-collapsible-edit-icon-size: 0.75rem;
+  --profile-section-collapsible-mobile-action-gap: 0.25rem;
+  --profile-section-collapsible-chevron-width: 0.75rem;
+  --profile-section-collapsible-chevron-height: 0.4375rem;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-end;
+  gap: var(--spacing-xs, 0.75rem);
+  margin-top: -0.25rem;
+}
+
+.profile-section-collapsible__edit-button {
+  min-width: 0;
+  align-items: center;
+  justify-content: center;
+}
+
+.profile-section-collapsible__toggle-button {
+  display: none !important;
+  align-items: center;
+  justify-content: center;
+  min-height: auto;
+  min-width: auto;
+  padding: var(--spacing-xxs, 0.3125rem);
+  border: none;
+  background: none;
+  color: var(--profile-section-collapsible-action-button-text);
+  cursor: var(--profile-interactive-cursor, pointer);
+  --button-height-sm: 0;
+  --button-padding-sm: var(--spacing-xxs, 0.3125rem);
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--profile-section-collapsible-action-button-text);
+  --button-hover-background: var(--profile-section-collapsible-action-button-hover-background);
+  --button-hover-border: transparent;
+  --button-hover-text: var(--profile-section-collapsible-action-button-text);
+}
+
+/* Icons */
+.profile-section-collapsible__edit-icon {
+  display: none;
+}
+
+.profile-section-collapsible__edit-icon,
+.profile-section-collapsible__edit-icon svg {
+  line-height: 0;
+}
+
+.profile-section-collapsible__chevron {
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: center;
+  width: var(--profile-section-collapsible-chevron-width);
+  height: var(--profile-section-collapsible-chevron-height);
+  line-height: 0;
+  transition: transform var(--animation-duration, 0.2s) ease;
+}
+
+.profile-section-collapsible__chevron svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.profile-section-collapsible__edit-icon--add svg path {
+  fill: var(--color-text-strong, var(--gray-800, #1E2939)) !important;
+  stroke: var(--color-text-strong, var(--gray-800, #1E2939)) !important;
+}
+
+.profile-section-collapsible__edit-icon--projects svg path {
+  stroke-width: 1.714px !important;
+  stroke: var(--color-text-strong, var(--gray-800, #1E2939)) !important;
+  fill: none !important;
+}
+
+/* App-driven mobile layout when the host/root explicitly sets data-layout. */
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions > .profile-section-collapsible__header h2 {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__actions {
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+  gap: var(--profile-section-collapsible-mobile-action-gap);
+  margin-top: 0;
+  flex: 0 0 auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible__edit-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--profile-section-collapsible-action-button-text);
+  --button-hover-background: var(--profile-section-collapsible-action-button-hover-background);
+  --button-hover-border: transparent;
+  --button-hover-text: var(--profile-section-collapsible-action-button-text);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
+  display: inline-flex !important;
+  order: 1;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:active,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus-visible {
+  border: none !important;
+  outline: none !important;
+  box-shadow: none !important;
+  background: transparent !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__toggle-button {
+  order: 2;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible[data-expanded="false"] .profile-section-collapsible__content {
+  display: none;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible__actions.flex-column {
+  gap: var(--profile-section-collapsible-mobile-action-gap);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__chevron {
+  transform: rotate(180deg);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible__edit-label {
+  display: none !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible__edit-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--profile-section-collapsible-edit-icon-size);
+  height: var(--profile-section-collapsible-edit-icon-size);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible .profile-section-collapsible__edit-button {
+  display: none !important;
+  order: 2;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--empty-mobile-no-edit .profile-section-collapsible__edit-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--empty-mobile-no-edit[data-expanded="true"] .profile-section-collapsible__edit-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--empty-mobile-no-edit .profile-section-collapsible__edit-icon,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible--empty-mobile-no-edit[data-expanded="true"] .profile-section-collapsible__edit-icon {
+  display: none !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__edit-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-section-collapsible__toggle-button {
+  display: inline-flex !important;
+}
+
+/* Viewport fallback when no explicit layout attribute is available. */
+@media (min-width: 769px) {
+  .profile-section-collapsible > .profile-section-collapsible__content {
+    display: block;
+  }
+
+  .profile-section-collapsible__edit-label svg,
+  .profile__action-icon svg {
+    width: 0.75rem;
+    height: 0.75rem;
+    position: relative;
+    top: 0;
+  }
+
+  .profile-section-collapsible__edit-label {
+    color: var(--profile-section-collapsible-action-button-text);
+  }
+
+  .profile-section-collapsible__edit-label svg path {
+    fill: currentColor;
+  }
+
+  .profile-section-collapsible__edit-label {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--spacing-xxs, 0.3125rem);
+    transform: translateY(0);
+  }
+
+  .profile-section-collapsible__edit-icon {
+    display: none;
+  }
+}
+
+/* Container-driven desktop fallback for wide panes inside a mixed viewport. */
+@container profile-pane (min-width: 769px) {
+  .profile-section-collapsible > .profile-section-collapsible__content {
+    display: block;
+  }
+
+  .profile-section-collapsible__edit-label svg,
+  .profile__action-icon svg {
+    width: 0.75rem;
+    height: 0.75rem;
+    position: relative;
+    top: 0;
+  }
+
+  .profile-section-collapsible__edit-label {
+    color: var(--profile-section-collapsible-action-button-text);
+  }
+
+  .profile-section-collapsible__edit-label svg path {
+    fill: currentColor;
+  }
+
+  .profile-section-collapsible__edit-label {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--spacing-xxs, 0.3125rem);
+    transform: translateY(0);
+  }
+
+  .profile-section-collapsible__edit-icon {
+    display: none;
+  }
+}
+
+/* Viewport fallback for mobile-width panes when no explicit layout attribute is available. */
+@media (max-width: 768px) {
+  .profile-section-collapsible--inline-mobile-actions > .profile-section-collapsible__header h2 {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__actions {
+    display: inline-flex;
+    flex-direction: row;
+    align-items: center;
+    gap: var(--profile-section-collapsible-mobile-action-gap);
+    margin-top: 0;
+    flex: 0 0 auto;
+  }
+
+  .profile-section-collapsible__edit-button,
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
+    --button-background: transparent;
+    --button-border-width: 0;
+    --button-border: transparent;
+    --button-text: var(--profile-section-collapsible-action-button-text);
+    --button-hover-background: var(--profile-section-collapsible-action-button-hover-background);
+    --button-hover-border: transparent;
+    --button-hover-text: var(--profile-section-collapsible-action-button-text);
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
+    display: inline-flex !important;
+    order: 1;
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:active,
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus,
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus-visible {
+    border: none !important;
+    outline: none !important;
+    box-shadow: none !important;
+    background: transparent !important;
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__toggle-button {
+    order: 2;
+  }
+
+  .profile-section-collapsible[data-expanded="false"] .profile-section-collapsible__content {
+    display: none;
+  }
+
+  .profile-section-collapsible__actions.flex-column {
+    gap: var(--profile-section-collapsible-mobile-action-gap);
+  }
+
+  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__chevron {
+    transform: rotate(180deg);
+  }
+
+  .profile-section-collapsible__edit-label {
+    display: none !important;
+  }
+
+  .profile-section-collapsible__edit-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--profile-section-collapsible-edit-icon-size);
+    height: var(--profile-section-collapsible-edit-icon-size);
+  }
+
+  .profile-section-collapsible .profile-section-collapsible__edit-button {
+    display: none !important;
+    order: 2;
+  }
+
+  .profile-section-collapsible--empty-mobile-no-edit .profile-section-collapsible__edit-button,
+  .profile-section-collapsible--empty-mobile-no-edit[data-expanded="true"] .profile-section-collapsible__edit-button,
+  .profile-section-collapsible--empty-mobile-no-edit .profile-section-collapsible__edit-icon,
+  .profile-section-collapsible--empty-mobile-no-edit[data-expanded="true"] .profile-section-collapsible__edit-icon {
+    display: none !important;
+  }
+
+  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__edit-button,
+  .profile-section-collapsible__toggle-button {
+    display: inline-flex !important;
+  }
+}
+
+/* Container-driven fallback for mobile-width panes inside a wider viewport. */
+@container profile-pane (max-width: 768px) {
+  .profile-section-collapsible--inline-mobile-actions > .profile-section-collapsible__header h2 {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__actions {
+    display: inline-flex;
+    flex-direction: row;
+    align-items: center;
+    gap: var(--profile-section-collapsible-mobile-action-gap);
+    margin-top: 0;
+    flex: 0 0 auto;
+  }
+
+  .profile-section-collapsible__edit-button,
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
+    --button-background: transparent;
+    --button-border-width: 0;
+    --button-border: transparent;
+    --button-text: var(--profile-section-collapsible-action-button-text);
+    --button-hover-background: var(--profile-section-collapsible-action-button-hover-background);
+    --button-hover-border: transparent;
+    --button-hover-text: var(--profile-section-collapsible-action-button-text);
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
+    display: inline-flex !important;
+    order: 1;
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:active,
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus,
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus-visible {
+    border: none !important;
+    outline: none !important;
+    box-shadow: none !important;
+    background: transparent !important;
+  }
+
+  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__toggle-button {
+    order: 2;
+  }
+
+  .profile-section-collapsible[data-expanded="false"] .profile-section-collapsible__content {
+    display: none;
+  }
+
+  .profile-section-collapsible__actions.flex-column {
+    gap: var(--profile-section-collapsible-mobile-action-gap);
+  }
+
+  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__chevron {
+    transform: rotate(180deg);
+  }
+
+  .profile-section-collapsible__edit-label {
+    display: none !important;
+  }
+
+  .profile-section-collapsible__edit-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--profile-section-collapsible-edit-icon-size);
+    height: var(--profile-section-collapsible-edit-icon-size);
+  }
+
+  .profile-section-collapsible .profile-section-collapsible__edit-button {
+    display: none !important;
+    order: 2;
+  }
+
+  .profile-section-collapsible--empty-mobile-no-edit .profile-section-collapsible__edit-button,
+  .profile-section-collapsible--empty-mobile-no-edit[data-expanded="true"] .profile-section-collapsible__edit-button,
+  .profile-section-collapsible--empty-mobile-no-edit .profile-section-collapsible__edit-icon,
+  .profile-section-collapsible--empty-mobile-no-edit[data-expanded="true"] .profile-section-collapsible__edit-icon {
+    display: none !important;
+  }
+
+  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__edit-button,
+  .profile-section-collapsible__toggle-button {
+    display: inline-flex !important;
+  }
+}
diff --git a/src/styles/ContactInfoEditDialog.css b/src/styles/ContactInfoEditDialog.css
deleted file mode 100644
index 3b575dd2..00000000
--- a/src/styles/ContactInfoEditDialog.css
+++ /dev/null
@@ -1,153 +0,0 @@
-.profile__edit-form--contact-info .profile-edit-dialog__section {
-  gap: 0;
-}
-
-.profile__edit-form--contact-info .profile-edit-dialog__section + .profile-edit-dialog__section {
-  border-top: var(--border-width-sm, 0.1rem) solid var(--slate-200, #E2E8F0);
-  padding-top: var(--spacing-xs, 0.75rem);
-}
-
-.profile__edit-form--contact-info .profile__section-header {
-  margin-bottom: 0;
-}
-
-.profile__edit-form--contact-info .profile-edit-dialog__section fieldset {
-  margin-top: 0.25rem;
-  gap: var(--spacing-xs, 0.75rem);
-}
-
-.profile__edit-form--contact-info .profile-edit-dialog__section-heading {
-  margin: 0;
-  color: var(--gray-700, #364153);
-  font-size: var(--font-size-md, 1rem); /* 16px */
-  font-weight: var(--font-weight-md, 500);
-  line-height: normal;
-}
-
-.profile-edit-dialog__phone-prefix-field {
-  flex: 0 0 6.1rem;
-  margin: 0;
-}
-
-.phonePrefixSelect,
-.profile-edit-dialog__phone-local-input {
-  border: 0 !important;
-  background: transparent;
-  min-height: calc(var(--min-touch-target, 44px) - 2px);
-  height: calc(var(--min-touch-target, 44px) - 2px);
-}
-
-.phonePrefixSelect {
-  padding: 0 0.2rem 0 0;
-}
-
-.phonePrefixSelect:focus,
-.profile-edit-dialog__phone-local-input:focus {
-  outline: none;
-}
-
-.profile-edit-dialog__phone-type-row {
-  flex: 0 0 7.5rem;
-}
-
-.profile-edit-dialog__row--contact-point {
-  max-width: 100%;
-  width: 100%;
-  border: 0;
-  outline: 0;
-  box-shadow: none;
-}
-
-.profile-edit-dialog__section fieldset > .profile-edit-dialog__row--contact-point {
-  margin-bottom: var(--spacing-xs, 0.75rem);
-}
-
-.profile-edit-dialog__section fieldset > .profile-edit-dialog__row--contact-point:last-child {
-  margin-bottom: var(--spacing-sm, 0.9375rem);
-}
-
-.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field,
-.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type,
-.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field > .label {
-  border: 0;
-  outline: 0;
-  box-shadow: none;
-  background: transparent;
-}
-
-.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field {
-  flex: 1 1 auto;
-  min-width: 0;
-}
-
-.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field > .label {
-  display: block;
-  width: 100%;
-}
-
-.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row {
-  flex: 0 0 6.5rem;
-  width: 6.5rem;
-  min-width: 6.5rem;
-}
-
-.profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.emailTypeRow {
-  flex: 0 0 6.5rem;
-  width: 6.5rem;
-  min-width: 6.5rem;
-}
-
-.profile-edit-dialog__row--address-header.profile-edit-dialog__row--full {
-  max-width: 100%;
-  width: 100%;
-  align-items: center;
-}
-
-.profile-edit-dialog__row--address-header.profile-edit-dialog__row--full .profile-edit-dialog__actions {
-  align-self: center;
-}
-
-.profile-edit-dialog__row--address-header.profile-edit-dialog__row--full .profile-edit-dialog__delete-button,
-#profile-modal .modal .profile-edit-dialog__row--address-header.profile-edit-dialog__row--full button.profile-edit-dialog__delete-button {
-  min-height: 1.75rem;
-  min-width: 1.75rem;
-}
-
-.profile-edit-dialog__address-title {
-  margin: 0;
-  font-size: var(--font-size-sm, 0.875rem);
-  font-weight: var(--font-weight-medium, 500);
-  line-height: var(--line-height-base, 1.5);
-}
-
-@media (max-width: 640px) {
-  .profile-edit-dialog__row--contact-point {
-    flex-direction: row;
-    align-items: center;
-    flex-wrap: nowrap;
-    gap: var(--spacing-2xs, 0.625rem);
-  }
-
-  .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field {
-    flex: 1 1 0;
-    min-width: 0;
-  }
-
-  .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.profile-edit-dialog__phone-type-row,
-  .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.emailTypeRow {
-    flex: 0 0 5.5rem;
-    width: 5.5rem;
-    min-width: 5.5rem;
-    max-width: 5.5rem;
-  }
-
-  .profile-edit-dialog__row--contact-point > .profile-edit-dialog__actions {
-    flex: 0 0 auto;
-    margin-left: 0;
-    justify-content: flex-end;
-  }
-
-  .profile-edit-dialog__phone-prefix-field {
-    flex: 0 0 5.75rem;
-  }
-}
diff --git a/src/styles/EditDialogs.base.css b/src/styles/EditDialogs.base.css
new file mode 100644
index 00000000..34e06735
--- /dev/null
+++ b/src/styles/EditDialogs.base.css
@@ -0,0 +1,485 @@
+.profile__edit-form {
+  --profile-edit-dialog-row-max-width: 34rem;
+  --profile-edit-dialog-action-hover-background: var(--color-surface-accent-subtle, var(--lavender-300, #e6dcff));
+  --profile-edit-dialog-muted-text: var(--color-text-secondary, #4A5565);
+  --profile-edit-dialog-quiet-text: var(--color-text-primary, var(--gray-700, #364153));
+  --profile-edit-dialog-mobile-image-button-font-size: var(--font-size-xxs, 0.75rem);
+  --profile-edit-dialog-mobile-image-label-font-size: var(--font-size-sm, 0.875rem);
+  --profile-edit-dialog-mobile-image-description-font-size: 0.625rem;
+  --profile-edit-dialog-mobile-image-button-padding: 0.4125rem 0.7547rem 0.4375rem 0.8625rem;
+  width: 100%;
+}
+
+.profile-edit-dialog__section,
+.profile-edit-dialog__section--education {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs, 0.75rem);
+}
+
+.profile-edit {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-lg, 1.25rem);
+}
+
+.profile-edit-dialog__section h4 {
+  margin: 0;
+}
+
+.profile-edit-dialog__section fieldset {
+  width: 100%;
+  margin: 0;
+  display: grid;
+  gap: var(--spacing-sm);
+  border: 0;
+  padding: 0;
+  min-inline-size: 0;
+}
+
+.profile-edit-dialog__field-description {
+  color: var(--profile-edit-dialog-muted-text);
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-normal, normal);
+  line-height: var(--line-height-base, 1.5);
+}
+
+.profile-edit-dialog__row {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--spacing-sm);
+  max-width: var(--profile-edit-dialog-row-max-width);
+}
+
+.profile-edit-dialog__row--full {
+  max-width: 100%;
+  width: 100%;
+}
+
+.profile-edit-dialog__field,
+.profile-edit-dialog__field-type {
+  display: block;
+  margin: 0;
+}
+
+.profile-edit-dialog__field-type {
+  width: 100%;
+}
+
+.profile-edit-dialog__field {
+  min-width: 0;
+}
+
+.profile-edit-dialog__field--stack {
+  display: grid;
+}
+
+.profile-edit-dialog__field--stack > small {
+  display: block;
+  width: 100%;
+  text-align: right;
+  justify-self: end;
+}
+
+.profile-edit-dialog__field--full {
+  max-width: 100% !important;
+  width: 100%;
+}
+
+.profile-edit-dialog__field--row-width {
+  max-width: 34rem;
+  width: 100%;
+}
+
+.profile-edit-dialog__login-message {
+  margin: 0;
+  font-size: var(--font-size-xs, 0.75rem);
+  color: var(--red-600, #E7000B);
+}
+
+.profile-edit-dialog__section + .profile-edit-dialog__login-message {
+  margin-top: var(--spacing-sm, 0.938rem);
+}
+
+.profile__edit-form--projects .profile-edit-dialog__login-message {
+  margin-top: var(--spacing-sm, 0.938rem);
+}
+
+.profile-edit-dialog__actions {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  flex: 0 0 auto;
+}
+
+.profile-edit-dialog__actions--edge {
+  margin-left: auto;
+}
+
+.profile-edit-dialog__add-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.profile-edit-dialog__input-wrap {
+  position: relative;
+  width: 100%;
+}
+
+.profile-edit-dialog__input--with-action {
+  width: 100%;
+  box-sizing: border-box;
+  padding-right: 7.5rem;
+}
+
+.profile-edit-dialog__delete-icon {
+  width: var(--icon-xxs, 1rem);
+  height: var(--icon-xxs, 1rem);
+  fill: currentColor;
+}
+
+.profile-edit-dialog__delete-icon svg {
+  width: var(--icon-xxs, 1rem);
+  height: var(--icon-xxs, 1rem);
+}
+
+solid-ui-button.profile-edit-dialog__delete-button {
+  min-height: var(--min-touch-target, 44px);
+  min-width: var(--min-touch-target, 44px);
+  color: inherit;
+  --button-background: transparent;
+  --button-height-md: var(--min-touch-target, 44px);
+  --button-padding-md: 0;
+  --button-padding-x-sm: 0;
+  --button-border-width: 0;
+  --button-border-radius: var(--border-radius-base, 0.3125rem);
+  --button-text: currentColor;
+  --button-box-shadow: none;
+  --button-hover-background: var(--profile-edit-dialog-action-hover-background);
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary, #7C4DFF);
+  --button-hover-box-shadow: none;
+  --button-active-box-shadow: none;
+  --button-active-transform: none;
+  --button-icon-size-md: var(--icon-xxs, 1rem);
+  --button-icon-size-lg: var(--icon-xxs, 1rem);
+}
+
+solid-ui-button.profile-edit-dialog__delete-button:hover,
+solid-ui-button.profile-edit-dialog__delete-button:focus-within {
+  color: inherit;
+}
+
+.profile-edit-dialog__image-preview {
+  display: grid;
+  gap: var(--spacing-xs);
+}
+
+.profile-edit-dialog__image-preview-header {
+  margin-bottom: var(--spacing-md, 1.25rem);
+}
+
+.profile-edit-dialog__image-preview-actions {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs, 0.75rem);
+}
+
+.profile-edit-dialog__image-preview-label,
+.profile-edit-dialog__image-preview-description {
+  margin: 0;
+}
+
+.profile-edit-dialog__image-frame {
+  position: relative;
+  display: inline-block;
+  line-height: 0;
+}
+
+.profile-edit-dialog__image-camera-button {
+  display: none;
+  position: absolute;
+  align-items: center;
+  justify-content: center;
+  right: var(--spacing-2xs, 0.625rem);
+  bottom: var(--spacing-2xs, 0.625rem);
+  z-index: 1;
+}
+
+solid-ui-button.profile-edit-dialog__image-camera-button {
+  width: 1.25rem;
+  height: 1.25rem;
+  min-width: 1.25rem;
+  min-height: 1.25rem;
+  --button-height-md: 1.25rem;
+  --button-padding-md: 0.1875rem;
+  --button-icon-size-md: 0.875rem;
+  --button-background: var(--color-card-bg, var(--white, #FFF));
+  --button-border-width: 0;
+  --button-border-radius: 0.2083rem;
+  --button-box-shadow: 0 0 0.2778rem 0 rgba(0, 0, 0, 0.25);
+  --button-hover-background: var(--color-card-bg, var(--white, #FFF));
+  --button-hover-border: transparent;
+  --button-hover-text: currentColor;
+  --button-hover-box-shadow: 0 0 0.2778rem 0 rgba(0, 0, 0, 0.25);
+  --button-active-box-shadow: 0 0 0.2778rem 0 rgba(0, 0, 0, 0.25);
+  --button-active-transform: none;
+}
+
+.profile-edit-dialog__image-camera-button svg {
+  width: 0.875rem !important;
+  height: 0.875rem !important;
+  display: block;
+  flex-shrink: 0;
+}
+
+.profile-edit-dialog__image-camera-capture-row {
+  display: flex;
+  justify-content: center;
+  width: 100%;
+}
+
+.profile-edit-dialog__image-camera-capture-frame {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: fit-content;
+  max-width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: calc(var(--spacing-xs, 0.625rem) / 2);
+  margin-bottom: var(--spacing-xs, 0.625rem);
+  padding: var(--spacing-2xs, 0.625rem);
+  box-sizing: border-box;
+  border: 1px solid var(--color-border, var(--gray-200, #E5E7EB));
+  border-radius: var(--border-radius-md, 0.5rem);
+}
+
+.profile-edit-dialog__image-camera-capture-frame[hidden] {
+  display: none;
+}
+
+.profile-edit-dialog__photo-capture {
+  display: block;
+  width: 100%;
+  --photo-capture-gap: var(--spacing-2xs, 0.625rem);
+  --photo-capture-frame-max-width: 260px;
+  --photo-capture-surface: transparent;
+  --photo-capture-text: var(--color-text-subheading, var(--gray-900, #101828));
+  --photo-capture-muted-text: var(--profile-edit-dialog-muted-text);
+  --photo-capture-border: var(--color-border-button, var(--gray-300, #D1D5DC));
+  --photo-capture-hover: var(--color-surface-tertiary-hover, var(--gray-100, #F3F4F6));
+  --photo-capture-shadow: none;
+  --photo-capture-trigger-background: var(--color-card-bg, var(--white, #FFF));
+  --photo-capture-trigger-text: var(--color-text-subheading, var(--gray-900, #101828));
+}
+
+.profile-edit-dialog__photo-capture::part(panel) {
+  width: auto;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  box-shadow: none;
+}
+
+.profile-edit-dialog__photo-capture::part(header) {
+  justify-content: flex-end;
+}
+
+.profile-edit-dialog__photo-capture::part(heading),
+.profile-edit-dialog__photo-capture::part(status-message),
+.profile-edit-dialog__photo-capture::part(cancel-button) {
+  display: none;
+}
+
+.profile-edit-dialog__photo-capture::part(close-button) {
+  width: auto;
+  height: auto;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: var(--profile-edit-dialog-muted-text);
+  font-size: 1.25rem;
+}
+
+.profile-edit-dialog__photo-capture::part(close-button):hover,
+.profile-edit-dialog__photo-capture::part(close-button):focus-visible {
+  background: transparent;
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+}
+
+.profile-edit-dialog__photo-capture::part(actions) {
+  justify-content: center;
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+.profile-edit-dialog__photo-capture::part(capture-button),
+.profile-edit-dialog__photo-capture::part(retake-button),
+.profile-edit-dialog__photo-capture::part(confirm-button) {
+  min-height: auto;
+  padding: 0.4125rem 0.6922rem 0.4375rem 0.8rem;
+  border-radius: var(--border-radius-base, 0.3125rem);
+  border: 0.8px solid var(--color-border-button, var(--gray-300, #D1D5DC));
+  background: var(--color-card-bg, var(--white, #FFF));
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  font-size: var(--font-size-xxs, 0.75rem);
+  font-weight: var(--font-weight-xbold, 700);
+  line-height: var(--line-height-base, 1.5);
+}
+
+.profile-edit-dialog__photo-capture::part(capture-button):hover,
+.profile-edit-dialog__photo-capture::part(capture-button):focus-visible,
+.profile-edit-dialog__photo-capture::part(retake-button):hover,
+.profile-edit-dialog__photo-capture::part(retake-button):focus-visible,
+.profile-edit-dialog__photo-capture::part(confirm-button):hover,
+.profile-edit-dialog__photo-capture::part(confirm-button):focus-visible {
+  background: var(--color-surface-tertiary-hover, var(--gray-100, #F3F4F6));
+  border-color: var(--color-border-button-hover, var(--gray-400, #99A1AF));
+}
+
+.profile-edit-dialog__image-upload-button::part(button),
+.profile-edit-dialog__image-remove-button::part(button) {
+  min-height: var(--min-touch-target, 44px);
+}
+
+.profile-edit-dialog__image-button::part(button) {
+  font-size: var(--font-size-xxs, 0.75rem);
+  font-weight: var(--font-weight-xbold, 700);
+  line-height: var(--line-height-base, 1.5);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  transform: none;
+}
+
+.profile-edit-dialog__image-upload-button::part(button) {
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  border: 0.8px solid var(--color-border-button, var(--gray-300, #D1D5DC));
+  background: var(--color-card-bg, var(--white, #FFF));
+  padding: 0.4125rem 0.6922rem 0.4375rem 0.8rem;
+}
+
+.profile-edit-dialog__image-remove-button::part(button) {
+  color: var(--red-600, #E7000B);
+  padding: 0.4125rem 0.8148rem 0.4375rem 0.8625rem;
+  border: 0.8px solid transparent;
+  background: var(--color-surface-tertiary-hover, var(--gray-100, #F3F4F6));
+}
+
+#profile-modal .modal .profile-edit-dialog__image-upload-button:hover::part(button),
+#profile-modal .modal .profile-edit-dialog__image-upload-button:focus-within::part(button),
+#profile-modal .modal .profile-edit-dialog__image-remove-button:hover::part(button),
+#profile-modal .modal .profile-edit-dialog__image-remove-button:focus-within::part(button) {
+  background: var(--color-surface-tertiary-hover, var(--gray-100, #F3F4F6)) !important;
+  border-color: var(--color-border-button-hover, var(--gray-400, #99A1AF)) !important;
+}
+
+.profile-edit-dialog__paste-button {
+  position: absolute;
+  white-space: nowrap;
+  right: var(--spacing-2xs, 0.625rem);
+  top: 50%;
+  transform: translateY(-50%);
+  z-index: 1;
+  color: var(--profile-edit-dialog-muted-text);
+  min-width: 0;
+  --button-height-md: 0;
+  --button-padding-md: 0.25rem 0.375rem;
+  --button-font-size-md: var(--font-size-xxs, 0.75rem);
+  --button-font-weight: var(--font-weight-normal, 400);
+  --button-background: var(--color-surface-tertiary-hover, var(--gray-100, #F3F4F6));
+  --button-border-width: 0;
+  --button-border-radius: var(--border-radius-base, 0.3125rem);
+  --button-text: var(--profile-edit-dialog-muted-text);
+  --button-box-shadow: none;
+  --button-hover-background: var(--color-surface-tertiary-hover, var(--gray-100, #F3F4F6));
+  --button-hover-text: var(--profile-edit-dialog-quiet-text);
+  --button-hover-box-shadow: none;
+  --button-active-box-shadow: none;
+  --button-active-transform: none;
+  --button-icon-size-md: 0.813rem;
+  --spacing-xxs: var(--spacing-xxs, 0.3125rem);
+}
+
+.profile-edit-dialog__paste-button:hover,
+.profile-edit-dialog__paste-button:focus-within {
+  color: var(--profile-edit-dialog-quiet-text);
+}
+
+.profile-edit-dialog__paste-icon {
+  width: 0.694rem;
+  height: 0.813rem;
+  fill: currentColor;
+}
+
+solid-ui-button.profile-edit-dialog__drag-handle {
+  min-width: 1.75rem;
+  min-height: 1.75rem;
+  --button-background: transparent;
+  --button-height-md: 1.75rem;
+  --button-padding-md: 0;
+  --button-border-width: 0;
+  --button-border-radius: var(--border-radius-base, 0.3125rem);
+  --button-icon-size-md: 0.813rem;
+  --button-box-shadow: none;
+  --button-hover-background: var(--profile-edit-dialog-action-hover-background);
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary, #7C4DFF);
+  --button-hover-box-shadow: none;
+  --button-active-box-shadow: none;
+}
+
+.profile-edit-dialog__row--drop-target {
+  outline: 1px dashed var(--color-border-button-hover, var(--gray-400, #99A1AF));
+  outline-offset: 2px;
+}
+
+.profile-edit-dialog__field input,
+.profile-edit-dialog__field select,
+.profile-edit-dialog__field-type input,
+.profile-edit-dialog__field-type select {
+  width: 100%;
+  max-width: 100%;
+  box-sizing: border-box;
+  min-height: var(--min-touch-target, 44px);
+  height: var(--min-touch-target, 44px);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  border: 1px solid var(--color-border-button-hover, var(--gray-400, #99A1AF));
+  background: var(--color-card-bg, var(--white, #FFF));
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-medium, 500);
+  padding: var(--spacing-2xs, 0.625rem);
+}
+
+.profile-edit-dialog__field > solid-ui-combobox,
+.profile-edit-dialog__field-type > solid-ui-combobox {
+  display: block;
+  width: 100%;
+  min-width: 0;
+  max-width: 100%;
+  box-sizing: border-box;
+  align-self: stretch;
+}
+
+.profile-edit-dialog__field textarea,
+.profile-edit-dialog__field-type textarea {
+  width: 100%;
+  max-width: 100%;
+  box-sizing: border-box;
+  min-height: var(--min-touch-target, 44px);
+}
+
+.profile-edit-dialog__textarea {
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+  font-size: var(--font-size-sm, 0.875rem);
+  font-weight: var(--font-weight-md, 500);
+  line-height: var(--line-height-loose, 1.6);
+  border-radius: var(--border-radius-base, 0.3125rem);
+  border: var(--border-width-sm, 0.1rem) solid var(--color-border-button-hover, var(--gray-400, #99A1AF));
+  background: var(--color-card-bg, var(--white, #FFF));
+  min-height: 10rem !important;
+  height: auto;
+  resize: vertical;
+}
\ No newline at end of file
diff --git a/src/styles/EditDialogs.css b/src/styles/EditDialogs.css
index 8089fe89..9e3de189 100644
--- a/src/styles/EditDialogs.css
+++ b/src/styles/EditDialogs.css
@@ -1,37 +1,18 @@
-.profile-edit-dialog__section {
+@import './EditDialogs.base.css';
+@import './EditDialogs.responsive.css';
+
+.profile__edit-form--heading {
   display: flex;
   flex-direction: column;
-  gap: var(--spacing-xs);
+  gap: 1.25rem;
 }
 
-.profile__edit-form {
-  width: 100%;
-}
-
-.profile-edit-dialog__section h4 {
-  margin: 0;
-}
-
-.profile-edit-dialog__section fieldset {
-  width: 100%;
-  margin: 0;
-  display: grid;
-  gap: var(--spacing-sm);
-  border: 0;
-  padding: 0;
-  min-inline-size: 0;
-}
-.profile-edit-dialog__field-description {
-  color: var(--gray-600, #4A5565);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  font-weight: var(--font-weight-normal, normal);
-  line-height: var(--line-height-base, 1.5); /* 21px */
-}
+/* Section-specific edit dialog overrides */
 
 .profile-edit-dialog__bio-field-container {
   display: flex;
   width: 100%;
-  max-width: 34rem;
+  max-width: var(--profile-edit-dialog-row-max-width);
   padding: 0;
   flex-direction: column;
   align-items: flex-start;
@@ -40,19 +21,17 @@
   margin: 0;
 }
 
-.profile-edit-dialog__row {
-  display: flex;
-  align-items: flex-start;
-  gap: var(--spacing-sm);
-  max-width: 34rem;
+.profile-edit-dialog__row--language {
+  margin-left: 0;
 }
 
-.profile-edit-dialog__section--resume fieldset {
-  gap: var(--spacing-xs, 0.75rem);
+.profile-edit-dialog__row--language > .profile-edit-dialog__field--language-name {
+  flex: 1 1 0;
+  min-width: 0;
 }
 
-.profile-edit-dialog__row--language {
-  margin-left: calc(-1 * var(--spacing-xs, 0.75rem));
+.profile-edit-dialog__actions--language {
+  margin-left: 0;
 }
 
 .profile-edit-dialog__row--social {
@@ -62,9 +41,9 @@
 }
 
 .profile-edit-dialog__field--social-type {
-  flex: 0 0 7rem;
-  width: 7rem;
-  max-width: 7rem;
+  flex: 0 0 6rem;
+  width: 6rem;
+  max-width: 6rem;
 }
 
 .profile-edit-dialog__field--social-url {
@@ -72,11 +51,6 @@
   min-width: 0;
 }
 
-.profile-edit-dialog__row--full {
-  max-width: 100%;
-  width: 100%;
-}
-
 .profile-edit-dialog__row--project {
   max-width: 100%;
   width: 100%;
@@ -84,7 +58,7 @@
 
 .profile-edit-dialog__row--resume-entry-header {
   align-items: center;
-  border-bottom: 1px solid var(--gray-400, #99A1AF);
+  border-bottom: 1px solid var(--color-border-button-hover, var(--gray-400, #99A1AF));
 }
 
 .profile-edit-dialog__row--resume-entry-header > .profile-edit-dialog__entry-heading {
@@ -93,24 +67,22 @@
 
 .profile-edit-dialog__entry-heading {
   margin: 0;
-  color: var(--gray-700, #364153);
+  color: var(--color-text-primary, var(--gray-700, #364153));
   font-size: var(--font-size-sm, 0.875rem);
-  font-style: normal;
   font-weight: var(--font-weight-md, 500);
-  line-height: normal;
 }
 
-.educationEditSection .profile-edit-dialog__section-heading {
+.profile-edit-dialog__section--education .profile-edit-dialog__section-heading {
   margin: 0;
-  color: var(--gray-700, #364153);
-  font-size: 16px;
-  font-weight: 500;
+  color: var(--color-text-primary, var(--gray-700, #364153));
+  font-size: var(--font-size-md, 1rem);
+  font-weight: var(--font-weight-md, 500);
 }
 
 .profile-edit-dialog__row--resume-entry-header .profile-edit-dialog__delete-button,
-#profile-modal .modal .profile-edit-dialog__row--resume-entry-header button.profile-edit-dialog__delete-button {
-  min-height: 1.75rem;
-  min-width: 1.75rem;
+solid-ui-button.profile-edit-dialog__delete-button.profile-edit-dialog__delete-button {
+  min-height: var(--icon-sm, 1.8rem);
+  min-width: var(--icon-sm, 1.8rem);
 }
 
 /* Force two direct children to split the row into equal columns. */
@@ -120,243 +92,15 @@
   min-width: 0;
 }
 
-.profile-edit-dialog__image-preview {
-  display: grid;
-  gap: var(--spacing-xs);
-}
-
-.profile-edit-dialog__image-preview-label,
-.profile-edit-dialog__image-preview-description {
-  margin: 0;
-}
-
-.profile-edit-dialog__image-preview-actions {
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-xs);
-}
-
-.profile-edit-dialog__image-frame {
-  position: relative;
-  display: inline-block;
-  line-height: 0;
-}
-
-.profile-edit-dialog__image-camera-button {
-  display: none;
-  position: absolute;
-  right: var(--spacing-2xs, 0.625rem);
-  bottom: var(--spacing-2xs, 0.625rem);
-  z-index: 1;
-}
-
-/* Override modal-wide button defaults for the small camera overlay control. */
-#profile-modal .modal button.profile-edit-dialog__image-camera-button {
-  display: none !important;
-  position: absolute;
-  right: var(--spacing-2xs, 0.625rem);
-  bottom: var(--spacing-2xs, 0.625rem);
-  width: 1.25rem;
-  height: 1.25rem;
-  min-width: 1.25rem;
-  min-height: 1.25rem;
-  padding: 3px;
-  background: var(--white, #FFF);
-  border-radius: 3.333px;
-  box-shadow: 0 0 4.444px 0 rgba(0, 0, 0, 0.25);
-  flex-shrink: 0;
-}
-
-.profile-edit-dialog__image-camera-button svg {
-  width: 0.875rem !important;
-  height: 0.875rem !important;
-  display: block;
-  flex-shrink: 0;
-}
-.profile-edit-dialog__image-camera-capture-row {
-  display: flex;
-  justify-content: center;
-  width: 100%;
-}
-
 .profile-edit-dialog--heading .profile-edit-dialog__image-camera-capture-row {
   margin-bottom: calc(var(--spacing-lg, 1.25rem) / -2);
 }
 
-.profile-edit-dialog__image-camera-capture-frame {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  width: fit-content;
-  max-width: 100%;
-  margin-left: auto;
-  margin-right: auto;
-  margin-top: calc(var(--spacing-xs, 0.625rem) / 2);
-  margin-bottom: var(--spacing-xs, 0.625rem);
-  padding: 10px;
-  box-sizing: border-box;
-  border: 1px solid var(--gray-200, #E5E7EB);
-  border-radius: 8px;
-}
-
 .profile-edit-dialog--heading .profile-edit-dialog__image-camera-capture-frame {
   margin-top: calc(var(--spacing-xs, 0.625rem) / 4);
   margin-bottom: calc(var(--spacing-xs, 0.625rem) / 2);
 }
 
-.profile-edit-dialog__image-camera-capture-frame[hidden] {
-  display: none;
-}
-
-.profile-edit-dialog__image-camera-capture-frame table {
-  border-collapse: collapse;
-  width: 100%;
-  table-layout: fixed;
-}
-
-.profile-edit-dialog__image-camera-capture-frame td {
-  text-align: center;
-  vertical-align: middle;
-}
-
-.profile-edit-dialog__image-camera-capture-frame tr:last-child {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  gap: var(--spacing-2xs, 0.625rem);
-}
-
-.profile-edit-dialog__image-camera-capture-frame tr:last-child td {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex: 0 0 auto;
-  width: auto;
-}
-
-.profile-edit-dialog__image-camera-capture-frame tr:last-child td:first-child {
-  margin-right: auto;
-}
-
-#profile-modal .modal .profile-edit-dialog__image-camera-capture-frame tr:last-child td:first-child button {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.profile-edit-dialog__camera-control {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-
-.profile-edit-dialog__camera-control-actions {
-  display: flex;
-  align-items: center;
-  justify-content: center !important;
-  gap: var(--spacing-2xs, 0.625rem);
-  width: max-content;
-  margin-left: auto;
-  margin-right: auto;
-  margin-top: calc(var(--spacing-2xs, 0.625rem) / 2);
-  align-self: center;
-}
-
-.profile-edit-dialog__camera-control-cancel {
-  position: absolute;
-  top: 0;
-  right: 0;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0;
-  border: 0 !important;
-  background: transparent !important;
-  box-shadow: none !important;
-  color: var(--gray-600, #4A5565) !important;
-  margin-right: 0 !important;
-}
-
-.profile-edit-dialog__camera-control-cancel svg {
-  display: block;
-}
-
-#profile-modal .modal .profile-edit-dialog__camera-control-cancel:hover,
-#profile-modal .modal .profile-edit-dialog__camera-control-cancel:focus-visible {
-  background: transparent !important;
-  border: 0 !important;
-  color: var(--gray-900, #101828) !important;
-}
-/*   display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  min-height: 2rem;
-  padding: 0.25rem 0.625rem;
-  border: 1px solid var(--gray-300, #D5D7DA) !important;
-  -- background: var(--gray-200, #E5E7EB) !important; 
-  background: var(--gray-100, #FFF) !important;
-  color: var(--gray-700, #364153) !important;
-  box-shadow: none !important;
-  border-radius: 0.375rem;
-  font-weight: var(--font-weight-md, 500); */
-.profile-edit-dialog__camera-control-action {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  font-size: var(--font-size-xxs, 0.75rem) !important; /* 12 px */
-  font-weight: var(--font-weight-xbold, 700) !important;
-  line-height: var(--line-height-base, 1.5) !important; /* 150% */
-  border-radius: var(--border-radius-base, 0.3125rem) !important;
-  border: 0.8px solid var(--gray-300, #D1D5DC) !important;
-  color: var(--gray-900, #101828) !important;
-  background: var(--white, #FFF) !important;
-  padding: 6.6px 11.075px 7px 12.8px !important;
-}
-
-#profile-modal .modal .profile-edit-dialog__camera-control-actions button:hover,
-#profile-modal .modal .profile-edit-dialog__camera-control-actions button:focus-visible {
-  background: var(--gray-100, #F3F4F6) !important;
-  border-color: var(--gray-400, #99A1AF) !important;
-}
-
-.profile-edit-dialog__image-camera-capture-frame video,
-.profile-edit-dialog__image-camera-capture-frame canvas {
-  display: block;
-  width: 100%;
-  max-width: 260px;
-  height: auto;
-  border-radius: 0.5rem;
-  margin: 0 auto;
-}
-
-#profile-modal .modal .profile-edit-dialog__image-camera-capture-frame button {
-  font-size: var(--font-size-sm, 0.875rem);
-}
-
-.profile-edit-dialog__image-upload-button,
-.profile-edit-dialog__image-remove-button {
-  min-height: var(--min-touch-target, 44px);
-  padding: 0 var(--spacing-sm);
-}
-
-.profile-edit-dialog__field,
-.profile-edit-dialog__field-type {
-  display: block;
-  margin: 0;
-}
-
-.profile-edit-dialog__field-type {
-  width: 100%;
-}
-
-.profile-edit-dialog__field {
-  /* flex: 1 1 auto; */
-  min-width: 0;
-}
-
 .profile__edit-form--resume .profile-edit-dialog__field,
 .profile__edit-form--resume .profile-edit-dialog__field-type:not(.hidden),
 .profile__edit-form--contact-info .profile-edit-dialog__field,
@@ -378,16 +122,18 @@
 }
 
 .profile__edit-form--resume .profile-edit-dialog__field > input,
-.profile__edit-form--resume .profile-edit-dialog__field > select,
+.profile__edit-form--resume .profile-edit-dialog__field > solid-ui-select,
+.profile__edit-form--resume .profile-edit-dialog__field > solid-ui-combobox,
 .profile__edit-form--resume .profile-edit-dialog__field > textarea,
 .profile__edit-form--resume .profile-edit-dialog__field-type > input,
-.profile__edit-form--resume .profile-edit-dialog__field-type > select,
+.profile__edit-form--resume .profile-edit-dialog__field-type > solid-ui-select,
 .profile__edit-form--resume .profile-edit-dialog__field-type > textarea,
 .profile__edit-form--contact-info .profile-edit-dialog__field > input,
-.profile__edit-form--contact-info .profile-edit-dialog__field > select,
+.profile__edit-form--contact-info .profile-edit-dialog__field > solid-ui-select,
 .profile__edit-form--contact-info .profile-edit-dialog__field > textarea,
 .profile__edit-form--contact-info .profile-edit-dialog__field-type > input,
 .profile__edit-form--contact-info .profile-edit-dialog__field-type > select,
+.profile__edit-form--contact-info .profile-edit-dialog__field-type > solid-ui-select,
 .profile__edit-form--contact-info .profile-edit-dialog__field-type > textarea {
   align-self: stretch;
 }
@@ -415,20 +161,22 @@
   width: 100%;
 }
 
-.profile-edit-dialog__date-pair > select {
+.profile-edit-dialog__date-pair > solid-ui-select {
   flex: 1 1 0;
   min-width: 0;
 }
 
-.profile-edit-dialog__field--stack {
-  display: grid;
-  gap: var(--spacing-xxs);
-}
-
-.profile-edit-dialog__field--stack > small {
+.profile-edit-dialog__resume-date-select {
   display: block;
   width: 100%;
-  text-align: right;
+  min-width: 0;
+  max-width: 100%;
+  box-sizing: border-box;
+}
+
+.profile-edit-dialog__resume-date-select--disabled {
+  pointer-events: none;
+  opacity: var(--opacity-input-disabled, 0.75);
 }
 
 .profile-edit-dialog__bio-field-container > small {
@@ -436,16 +184,6 @@
   text-align: right;
 }
 
-.profile-edit-dialog__field--full {
-  max-width: 100% !important;
-  width: 100%;
-}
-
-.profile-edit-dialog__field--row-width {
-  max-width: 34rem;
-  width: 100%;
-}
-
 .profile-edit-dialog--heading .profile-edit-dialog__row,
 .profile-edit-dialog--heading .profile-edit-dialog__field--row-width {
   max-width: 100%;
@@ -453,29 +191,14 @@
 }
 
 .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo {
-  padding-bottom: calc(var(--spacing-sm, 0.938rem) / 2);
-  margin-bottom: calc(var(--spacing-sm, 0.938rem) / 2);
-  border-bottom: 1px solid var(--slate-200, #E2E8F0);
+  padding-bottom: var(--spacing-md, 1.25rem);
+  border-bottom: 1px solid var(--color-border-lighter, var(--slate-200, #E2E8F0));
 }
 
 .profile-edit-dialog--heading .profile-edit {
   gap: calc(var(--spacing-lg, 1.25rem) / 2);
 }
 
-.profile-edit-dialog__login-message {
-  margin: 0;
-  font-size: var(--font-size-xs, 0.75rem);
-  color: var(--red-600, #E7000B);
-}
-
-.profile-edit-dialog__section + .profile-edit-dialog__login-message {
-  margin-top: var(--spacing-sm, 0.938rem);
-}
-
-.profile__edit-form--projects .profile-edit-dialog__login-message {
-  margin-top: var(--spacing-sm, 0.938rem);
-}
-
 .profile-edit-dialog--heading .profile-edit-dialog__row--contact-point {
   max-width: 100%;
   width: 100%;
@@ -499,14 +222,8 @@
   max-width: 6.4375rem;
 }
 
-.profile-edit-dialog__field-type--contact-point select {
-  width: auto;
-  max-width: none;
-  min-width: 6.4375rem;
-}
-
 .profile-edit-dialog__row--address-header {
-  max-width: 34rem;
+  max-width: var(--profile-edit-dialog-row-max-width);
   align-items: flex-end;
 }
 
@@ -516,20 +233,20 @@
 }
 
 .profile-edit-dialog__checkbox-label {
+  margin-left: auto;
   display: inline-flex;
   align-items: center;
-  gap: var(--spacing-xs);
-  margin-left: auto;
-  cursor: pointer;
+  gap: var(--spacing-xs, 0.75rem);
+  cursor: var(--profile-interactive-cursor, pointer);
 }
 
 .profile-edit-dialog__checkbox-input {
-  width: 1rem;
-  height: 1rem;
+  width: var(--icon-xxs, 1rem);
+  height: var(--icon-xxs, 1rem);
   margin: 0;
   flex: 0 0 auto;
   accent-color: var(--color-primary, #7C4DFF);
-  cursor: pointer;
+  cursor: var(--profile-interactive-cursor, pointer);
 }
 
 .profile-edit-dialog__checkbox-input:focus-visible {
@@ -543,7 +260,7 @@
 
 /* The street-address row is a standalone label, so cap its width like the flex rows. */
 .profile-edit-dialog__section fieldset > .profile-edit-dialog__field {
-  max-width: 34rem;
+  max-width: var(--profile-edit-dialog-row-max-width);
 }
 
 .profile-edit-dialog__field-type--wide {
@@ -560,267 +277,32 @@
   align-self: flex-start;
 }
 
-.profile-edit-dialog__actions {
-  flex: 0 0 auto;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-}
-
-.profile-edit-dialog__actions--edge {
-  margin-left: auto;
-}
-
-.profile-edit-dialog__input-wrap {
-  position: relative;
-  width: 100%;
-}
-
-.profile-edit-dialog__input--with-action {
-  width: 100%;
-  box-sizing: border-box;
-  padding-right: 7.5rem;
-}
-
-.profile-edit-dialog__input--with-leading-icon {
-  width: 100%;
-  box-sizing: border-box;
-  padding-left: 2.1rem;
-}
-
-.profile-edit-dialog__search-icon {
-  position: absolute;
-  left: var(--spacing-2xs, 0.625rem);
-  top: 50%;
-  transform: translateY(-50%);
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--gray-400, #99A1AF);
-  pointer-events: none;
-  z-index: 1;
-}
-
-.profile-edit-dialog__search-icon svg {
-  display: block;
-  width: 0.8125rem;
-  height: 0.8125rem;
-}
-
-.profile-edit-dialog__delete-button {
+.profile__edit-form--resume .profile-edit-dialog__field > solid-ui-combobox {
   min-height: var(--min-touch-target, 44px);
-  min-width: var(--min-touch-target, 44px);
-  padding: 0;
-  border: 0;
-  background: transparent;
-  color: inherit;
-  cursor: pointer;
-}
-
-#profile-modal .modal button.profile-edit-dialog__delete-button {
-  min-height: var(--min-touch-target, 44px);
-  min-width: var(--min-touch-target, 44px);
-  padding: 0;
-  border: 0;
-  border-radius: 0;
-  background: transparent;
-  color: inherit;
-  box-shadow: none;
-}
-
-.profile-edit-dialog__delete-icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 1.1rem;
-  height: 1.1rem;
-  fill: currentColor;
-}
-
-.profile-edit-dialog__delete-icon svg {
-  width: 1.1rem;
-  height: 1.1rem;
-}
-
-.profile-edit-dialog__delete-button:hover,
-.profile-edit-dialog__delete-button:focus-visible {
-  color: var(--color-danger, #b42318);
-}
-
-.profile-edit-dialog__image-button {
-  text-align: center;
-  font-size: var(--font-size-xxs, 0.75rem); /* 12 px */
-  font-weight: var(--font-weight-xbold, 700);
-  line-height: var(--line-height-base, 1.5); /* 150% */
-  border-radius: var(--border-radius-base, 0.3125rem);
-  border: 0.8px solid var(--gray-300, #D1D5DC);
-}
-
-.profile-edit-dialog__image-upload-button {
-  color: var(--gray-900, #101828);
-  border: 0.8px solid var(--gray-300, #D1D5DC);
-  background: var(--white, #FFF);
-  padding: 6.6px 11.075px 7px 12.8px;
-}
-
-.profile-edit-dialog__image-remove-button {
-  color: var(--red-600, #E7000B);
-  padding: 6.6px 13.037px 7px 13.8px;
-  border: 0.8px solid rgba(0, 0, 0, 0.00);
-  background: var(--gray-100, #F3F4F6);
-}
-
-#profile-modal .modal .profile-edit-dialog__image-upload-button:hover,
-#profile-modal .modal .profile-edit-dialog__image-upload-button:focus-visible,
-#profile-modal .modal .profile-edit-dialog__image-remove-button:hover,
-#profile-modal .modal .profile-edit-dialog__image-remove-button:focus-visible {
-  background: var(--gray-100, #F3F4F6) !important;
-  border-color: var(--gray-400, #99A1AF) !important;
-}
-
-/* Placeholder class for project paste action styling. */
-.profile-edit-dialog__paste-button {
-  display: flex;
-  padding: 0.25rem 0.375rem; /* 4px 6px */
-  align-items: center;
-  position: absolute;
-  background: var(--white, #fff);
-  border: 0;
-  outline: none;
-  white-space: nowrap;
-  right: var(--spacing-2xs, 0.625rem);
-  top: 50%;
-  transform: translateY(-50%);
-  z-index: 1;
-  color: var(--gray-500, #6A7282);
-  font-size: 0.75rem; /* 12px */
-  font-weight: var(--font-weight-normal, 400);
-}
-
-.profile-edit-dialog__paste-button:focus,
-.profile-edit-dialog__paste-button:focus-visible {
-  outline: none;
-}
-
-/* remove the regular button styling for paste */
-#profile-modal .modal button.profile-edit-dialog__paste-button,
-#profile-modal .modal button.profile-edit-dialog__paste-button:hover,
-#profile-modal .modal button.profile-edit-dialog__paste-button:focus,
-#profile-modal .modal button.profile-edit-dialog__paste-button:focus-visible,
-#profile-modal .modal button.profile-edit-dialog__paste-button:active {
-  border: 0;
-  outline: none;
-  box-shadow: none;
-  -webkit-appearance: none;
-  appearance: none;
-}
-.profile-edit-dialog__paste-icon {
-  width: 0.694rem; /* 11.105px */
-  height: 0.813rem; /* 13.038px */
-  fill: var(--gray-500, #6A7282);
-}
-#profile-modal .modal button.profile-edit-dialog__drag-handle {
-  min-height: 1.75rem;
-  min-width: 1.75rem;
-  padding: 0;
-  border: 0;
-  background: transparent;
-  box-shadow: none;
-}
-
-.profile-edit-dialog__row--drop-target {
-  outline: 1px dashed var(--gray-400, #99A1AF);
-  outline-offset: 2px;
-}
-
-#profile-modal .modal button.profile-edit-dialog__delete-button:hover,
-#profile-modal .modal button.profile-edit-dialog__delete-button:focus-visible {
-  border: 0;
-  background: transparent;
-  color: var(--color-danger, #b42318);
+  height: var(--min-touch-target, 44px);
 }
 
-.profile-edit-dialog__field input,
-.profile-edit-dialog__field select,
-.profile-edit-dialog__field-type input,
-.profile-edit-dialog__field-type select {
-  width: 100%;
-  max-width: 100%;
-  box-sizing: border-box;
+.profile__edit-form--resume .profile-edit-dialog__field > solid-ui-combobox::part(input) {
   min-height: var(--min-touch-target, 44px);
   height: var(--min-touch-target, 44px);
-  border-radius: var(--border-radius-base, 0.3125rem);
-  border: 1px solid var(--gray-400, #99A1AF);
-  background: var(--white, #FFF);
-  color: var(--gray-900, #101828);
-  font-size: var(--font-size-sm, 0.875rem);
-  font-weight: var(--font-weight-medium, 500);
-  padding: var(--spacing-2xs, 0.625rem);
-}
-
-.profile-edit-dialog__field input.profile-edit-dialog__input--with-leading-icon {
-  padding-left: 2.1rem;
-}
-
-/* Keep phone/email contact-point type selects compact. */
-.profile-edit-dialog__field-type--contact-point > select {
-  display: inline-block;
-  width: auto !important;
-  max-width: none !important;
-  min-width: 0 !important;
 }
 
-/* In heading edit, force both type selects to fill the same fixed wrapper width. */
-.profile-edit-dialog--heading .profile-edit-dialog__row--contact-point > .profile-edit-dialog__field-type.profile-edit-dialog__field-type--contact-point > select {
+/* Dedicated hook for the social account type select in SocialEditDialog. */
+.profile-edit-dialog__social-account-select {
   display: block;
-  width: 100% !important;
-  min-width: 0 !important;
-  max-width: 100% !important;
-}
-
-/* Keep phone/email type selects compact after the generic full-width rule above. */
-.profile-edit-dialog__field-type--contact-point select {
-  width: fit-content;
-  max-width: none;
-  min-width: 6.4375rem;
-}
-
-.profile-edit-dialog__textarea {
-  color: var(--gray-900, #101828);
-  font-size: var(--font-size-sm, 0.875rem);
-  font-weight: var(--font-weight-md, 500);
-  line-height: var(--line-height-loose, 1.6); /* 22.4px */
-  border-radius: var(--border-radius-base, 0.3125rem);
-  border: var(--border-width-sm, 0.1rem) solid var(--gray-400, #99A1AF);
-  background: var(--white, #FFF);
-}
-
-.profile-edit-dialog__field textarea,
-.profile-edit-dialog__field-type textarea {
   width: 100%;
+  min-width: 0;
   max-width: 100%;
   box-sizing: border-box;
-  min-height: var(--min-touch-target, 44px);
+  contain: inline-size;
 }
 
-/* Dedicated hook for the social account type select in SocialEditDialog. */
-.profile-edit-dialog__social-account-select {
+.profile-edit-dialog__resume-organization-type-select {
   display: block;
   width: 100%;
   min-width: 0;
   max-width: 100%;
   box-sizing: border-box;
-  min-height: var(--min-touch-target, 44px);
-  height: var(--min-touch-target, 44px);
-  border-radius: var(--border-radius-base, 0.3125rem);
-  border: 1px solid var(--gray-400, #99A1AF);
-  background: var(--white, #FFF);
-  color: var(--gray-900, #101828);
-  font-size: var(--font-size-sm, 0.875rem);
-  font-weight: var(--font-weight-medium, 500);
-  padding: var(--spacing-2xs, 0.625rem);
-
-
 }
 
 .profile-edit-dialog__bio-field-container textarea {
@@ -829,200 +311,3 @@
   box-sizing: border-box;
   min-height: var(--min-touch-target, 44px);
 }
-
-.profile-edit-dialog__textarea {
-  min-height: 10rem !important;
-  height: auto;
-  resize: vertical;
-}
-
-.profile-edit-dialog__field--stack small {
-  justify-self: end;
-  text-align: right;
-}
-
-@media (max-width: 640px) {
-  .profile-edit-dialog__row {
-    max-width: 100%;
-    flex-direction: column;
-    align-items: stretch;
-  }
-
-  .profile-edit-dialog__row--equal > .profile-edit-dialog__field,
-  .profile-edit-dialog__row--equal > .profile-edit-dialog__field-type {
-    flex: 1 1 auto;
-  }
-
-  .profile-edit-dialog__field-type {
-    flex: 1 1 auto;
-  }
-
-  .profile-edit-dialog__field-type--contact-point {
-    flex: 1 1 auto;
-    max-width: 100%;
-  }
-
-  .profile-edit-dialog__row--address-header {
-    flex-direction: row;
-    align-items: flex-end;
-  }
-
-  .profile-edit-dialog__row--social {
-    margin-left: 0;
-    gap: var(--spacing-2xs, 0.625rem);
-    flex-direction: row;
-    align-items: center;
-    flex-wrap: nowrap;
-  }
-
-  .profile-edit-dialog__row--social .profile-edit-dialog__social-icon {
-    width: 1.5rem;
-    height: 1.5rem;
-  }
-
-  .profile-edit-dialog__field--social-type {
-    flex: 0 0 5.5rem;
-    width: 5.5rem;
-    max-width: 5.5rem;
-  }
-
-  .profile-edit-dialog__field--social-url {
-    flex: 1 1 auto;
-    min-width: 0;
-  }
-
-  .profile-edit-dialog__field--resume-location {
-    flex: 1 1 100%;
-    width: 100%;
-    max-width: 100%;
-  }
-
-  .profile-edit-dialog__row--language {
-    flex-direction: row;
-    align-items: center;
-    flex-wrap: nowrap;
-  }
-
-  .profile-edit-dialog__row--language > .profile-edit-dialog__field {
-    flex: 1 1 0;
-    min-width: 0;
-  }
-
-  .profile-edit-dialog__row--resume-entry-header {
-    flex-direction: row;
-    align-items: center;
-    flex-wrap: nowrap;
-    width: 100%;
-    max-width: 100%;
-  }
-
-  .profile-edit-dialog__row--resume-entry-header > .profile-edit-dialog__actions--edge {
-    margin-left: auto;
-  }
-
-  .profile-edit-dialog__row--skill {
-    flex-direction: row;
-    align-items: center;
-    flex-wrap: nowrap;
-    gap: var(--spacing-2xs, 0.625rem);
-  }
-
-  .profile-edit-dialog__row--skill > .profile-edit-dialog__field {
-    flex: 1 1 0;
-    min-width: 0;
-  }
-
-  .profile-edit-dialog__row--skill > .profile-edit-dialog__actions {
-    flex: 0 0 auto;
-    margin-left: 0;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo {
-    flex-direction: row;
-    align-items: center;
-    flex-wrap: nowrap;
-    gap: var(--spacing-xs, 0.75rem);
-    width: 100%;
-    max-width: 100%;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo > header {
-    margin-bottom: 0;
-    flex: 0 0 auto;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero,
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
-    width: 5.5rem;
-    height: 5.5rem;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-camera-button {
-    display: inline-flex;
-    right: var(--spacing-xxs, 0.3125rem);
-    bottom: var(--spacing-xxs, 0.3125rem);
-    width: 1.875rem;
-    min-width: 1.875rem;
-    min-height: 1.875rem;
-  }
-
-  #profile-modal .modal button.profile-edit-dialog__image-camera-button {
-    display: inline-flex !important;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview {
-    flex: 1 1 auto;
-    min-width: 0;
-    gap: var(--spacing-xxs, 0.3125rem);
-    width: 100%;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-label {
-    font-size: var(--font-size-sm, 0.875rem);
-    line-height: var(--line-height-tight, 1.25);
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-description {
-    font-size: 10px;
-    line-height: var(--line-height-base, 1.4);
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-actions {
-    flex-wrap: nowrap;
-    gap: var(--spacing-xs, 0.5rem);
-    width: 100%;
-  }
-
-  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button {
-    flex: 1 1 0;
-    width: 100%;
-    padding: 0 0.75rem;
-  }
-
-  .profile-edit-dialog__row--inline-end {
-    justify-content: flex-start;
-  }
-
-  .profile-edit-dialog__actions {
-    justify-content: flex-start;
-  }
-
-  .profile-edit-dialog__row--address-header .profile-edit-dialog__actions {
-    justify-content: flex-end;
-  }
-
-  .profile-edit-dialog__textarea {
-    min-height: 15rem !important;
-  }
-
-  .profile-edit-dialog__input-help-text {
-    display: none;
-  }
-}
diff --git a/src/styles/EditDialogs.responsive.css b/src/styles/EditDialogs.responsive.css
new file mode 100644
index 00000000..e8844a9a
--- /dev/null
+++ b/src/styles/EditDialogs.responsive.css
@@ -0,0 +1,883 @@
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row {
+  max-width: 100%;
+  flex-direction: column;
+  align-items: stretch;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--equal > .profile-edit-dialog__field,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--equal > .profile-edit-dialog__field-type {
+  flex: 1 1 auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__field-type {
+  flex: 1 1 auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__section-heading {
+  font-size: var(--font-size-lg, 1.125rem);
+  line-height: var(--line-height-tight, 1.4);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header {
+  padding: var(--spacing-sm, 0.938rem);
+  gap: var(--spacing-lg, 1.5625rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile-edit-dialog__section-heading {
+  font-size: var(--font-size-lg, 1.125rem);
+  line-height: var(--line-height-tight, 1.4);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile__action-button,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header solid-ui-button.profile__action-button::part(button) {
+  font-size: var(--font-size-sm, 0.875rem);
+  line-height: var(--line-height-base, 1.5);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile__add-more-content,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-label {
+  font-size: var(--font-size-sm, 0.875rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile__add-more-icon,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-icon {
+  width: var(--icon-xxs, 1rem);
+  height: var(--icon-xxs, 1rem);
+  padding: 0.125rem;
+  box-sizing: border-box;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile__add-more-icon svg,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-icon svg {
+  width: 100%;
+  height: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--inline-end {
+  justify-content: flex-start;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__actions {
+  justify-content: flex-start;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__textarea {
+  min-height: 15rem !important;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__input--with-action {
+  padding-right: 6.5rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__paste-button {
+  right: var(--spacing-xxs, 0.3125rem);
+  --button-padding-md: var(--spacing-xxs, 0.3125rem) var(--spacing-xxs, 0.3125rem);
+  --button-font-size-md: var(--font-size-2xs, 0.6875rem);
+  --button-icon-size-md: var(--font-size-xxs, 0.75rem);
+  --button-icon-size-lg: var(--font-size-xxs, 0.75rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__input-help-text {
+  display: none;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__field-type--contact-point {
+  flex: 1 1 auto;
+  width: 100%;
+  max-width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--contact-point {
+  flex-direction: row;
+  align-items: stretch;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--contact-point.profile-edit-dialog__row--equal > .profile-edit-dialog__field-type.profile-edit-dialog__field-type--contact-point {
+  flex: 0 0 6.4375rem;
+  width: 6.4375rem;
+  min-width: 6.4375rem;
+  max-width: 6.4375rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--address-header {
+  flex-direction: row;
+  align-items: flex-end;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--social {
+  margin-left: 0;
+  gap: var(--spacing-2xs, 0.625rem);
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--social .profile-edit-dialog__social-icon {
+  display: none;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__field--social-type {
+  flex: 0 0 4.75rem;
+  width: 4.75rem;
+  max-width: 4.75rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__field--social-url {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__field--resume-location {
+  flex: 1 1 100%;
+  width: 100%;
+  max-width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--language {
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
+  gap: var(--spacing-xxs, 0.3125rem);
+  margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--language > .profile-edit-dialog__field--language-name {
+  flex: 1 1 0;
+  min-width: 0;
+  margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__actions--language {
+  margin-left: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--language > solid-ui-button.profile-edit-dialog__drag-handle,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__actions--language > solid-ui-button.profile-edit-dialog__delete-button {
+  min-width: 1.5rem;
+  min-height: 1.5rem;
+  --button-height-md: 1.5rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--resume-entry-header {
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
+  width: 100%;
+  max-width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--resume-entry-header > .profile-edit-dialog__actions--edge {
+  margin-left: auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--skill {
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--skill > .profile-edit-dialog__field {
+  flex: 1 1 0;
+  min-width: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--skill > .profile-edit-dialog__actions {
+  flex: 0 0 auto;
+  margin-left: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo {
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: nowrap;
+  gap: var(--spacing-xs, 0.75rem);
+  width: 100%;
+  max-width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo > header {
+  margin-bottom: 0;
+  flex: 0 0 auto;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero,
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
+  width: 5rem;
+  height: 5rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
+  padding: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__image-frame--fallback .profile__hero-alt {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-camera-button {
+  display: inline-flex;
+  right: var(--spacing-xxs, 0.3125rem);
+  bottom: var(--spacing-xxs, 0.3125rem);
+  width: 1.875rem;
+  min-width: 1.875rem;
+  min-height: 1.875rem;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview {
+  flex: 1 1 auto;
+  min-width: 0;
+  gap: var(--spacing-xxs, 0.3125rem);
+  width: 100%;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-label {
+  font-size: var(--profile-edit-dialog-mobile-image-label-font-size);
+  line-height: var(--line-height-tight, 1.25);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-description {
+  font-size: var(--profile-edit-dialog-mobile-image-description-font-size);
+  line-height: var(--line-height-base, 1.4);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-actions {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: var(--spacing-xxs, 0.3125rem);
+  width: 100%;
+  align-items: stretch;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button {
+  width: 100%;
+  min-width: 0;
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button::part(button) {
+  min-width: 0;
+  width: 100%;
+  justify-content: center;
+  padding: var(--spacing-xxs, 0.3125rem) var(--spacing-2xs, 0.625rem);
+  font-size: var(--profile-edit-dialog-mobile-image-button-font-size);
+}
+
+:is(.profile-pane-host, .profile-pane-root)[data-layout='mobile'] .profile-edit-dialog__row--address-header .profile-edit-dialog__actions {
+  justify-content: flex-end;
+}
+
+@media (max-width: 576px) {
+  .profile-edit-dialog__row {
+    max-width: 100%;
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .profile-edit-dialog__section-heading {
+    font-size: var(--font-size-lg, 1.125rem);
+    line-height: var(--line-height-tight, 1.4);
+  }
+
+  #profile-modal .modal .profile__section-header {
+    padding: var(--spacing-sm, 0.938rem);
+    gap: var(--spacing-lg, 1.5625rem);
+  }
+
+  #profile-modal .modal .profile__section-header .profile-edit-dialog__section-heading {
+    font-size: var(--font-size-lg, 1.125rem);
+    line-height: var(--line-height-tight, 1.4);
+  }
+
+  #profile-modal .modal .profile__section-header .profile__action-button,
+  #profile-modal .modal .profile__section-header solid-ui-button.profile__action-button::part(button) {
+    font-size: var(--font-size-sm, 0.875rem);
+    line-height: var(--line-height-base, 1.5);
+  }
+
+  #profile-modal .modal .profile__section-header .profile__add-more-content,
+  #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-label {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+
+  #profile-modal .modal .profile__section-header .profile__add-more-icon,
+  #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-icon {
+    width: var(--icon-xxs, 1rem);
+    height: var(--icon-xxs, 1rem);
+    padding: 0.125rem;
+    box-sizing: border-box;
+  }
+
+  #profile-modal .modal .profile__section-header .profile__add-more-icon svg,
+  #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-icon svg {
+    width: 100%;
+    height: 100%;
+  }
+
+  .profile-edit-dialog__row--equal > .profile-edit-dialog__field,
+  .profile-edit-dialog__row--equal > .profile-edit-dialog__field-type {
+    flex: 1 1 auto;
+  }
+
+  .profile-edit-dialog__field-type {
+    flex: 1 1 auto;
+  }
+
+  .profile-edit-dialog__row--inline-end {
+    justify-content: flex-start;
+  }
+
+  .profile-edit-dialog__actions {
+    justify-content: flex-start;
+  }
+
+  .profile-edit-dialog__textarea {
+    min-height: 15rem !important;
+  }
+
+  .profile-edit-dialog__input--with-action {
+    padding-right: 6.5rem;
+  }
+
+  .profile-edit-dialog__paste-button {
+    right: var(--spacing-xxs, 0.3125rem);
+    --button-padding-md: var(--spacing-xxs, 0.3125rem) var(--spacing-xxs, 0.3125rem);
+    --button-font-size-md: var(--font-size-2xs, 0.6875rem);
+    --button-icon-size-md: var(--font-size-xxs, 0.75rem);
+    --button-icon-size-lg: var(--font-size-xxs, 0.75rem);
+  }
+
+  .profile-edit-dialog__input-help-text {
+    display: none;
+  }
+
+  .profile-edit-dialog__field-type--contact-point {
+    flex: 1 1 auto;
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--contact-point {
+    flex-direction: row;
+    align-items: stretch;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--contact-point.profile-edit-dialog__row--equal > .profile-edit-dialog__field-type.profile-edit-dialog__field-type--contact-point {
+    flex: 0 0 6.4375rem;
+    width: 6.4375rem;
+    min-width: 6.4375rem;
+    max-width: 6.4375rem;
+  }
+
+  .profile-edit-dialog__row--address-header {
+    flex-direction: row;
+    align-items: flex-end;
+  }
+
+  .profile-edit-dialog__row--social {
+    margin-left: 0;
+    gap: var(--spacing-2xs, 0.625rem);
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+  }
+
+  .profile-edit-dialog__row--social .profile-edit-dialog__social-icon {
+    display: none;
+  }
+
+  .profile-edit-dialog__field--social-type {
+    flex: 0 0 4.75rem;
+    width: 4.75rem;
+    max-width: 4.75rem;
+  }
+
+  .profile-edit-dialog__field--social-url {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+
+  .profile-edit-dialog__field--resume-location {
+    flex: 1 1 100%;
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog__row--language {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    gap: var(--spacing-xxs, 0.3125rem);
+    margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+  }
+
+  .profile-edit-dialog__row--language > .profile-edit-dialog__field--language-name {
+    flex: 1 1 0;
+    min-width: 0;
+    margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+  }
+
+  .profile-edit-dialog__actions--language {
+    margin-left: 0;
+  }
+
+  .profile-edit-dialog__row--language > solid-ui-button.profile-edit-dialog__drag-handle,
+  .profile-edit-dialog__actions--language > solid-ui-button.profile-edit-dialog__delete-button {
+    min-width: 1.5rem;
+    min-height: 1.5rem;
+    --button-height-md: 1.5rem;
+  }
+
+  .profile-edit-dialog__row--resume-entry-header {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog__row--resume-entry-header > .profile-edit-dialog__actions--edge {
+    margin-left: auto;
+  }
+
+  .profile-edit-dialog__row--skill {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    gap: var(--spacing-2xs, 0.625rem);
+  }
+
+  .profile-edit-dialog__row--skill > .profile-edit-dialog__field {
+    flex: 1 1 0;
+    min-width: 0;
+  }
+
+  .profile-edit-dialog__row--skill > .profile-edit-dialog__actions {
+    flex: 0 0 auto;
+    margin-left: 0;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    gap: var(--spacing-xs, 0.75rem);
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo > header {
+    margin-bottom: 0;
+    flex: 0 0 auto;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero,
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
+    width: 5rem;
+    height: 5rem;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
+    padding: 0;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__image-frame--fallback .profile__hero-alt {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-camera-button {
+    display: inline-flex;
+    right: var(--spacing-xxs, 0.3125rem);
+    bottom: var(--spacing-xxs, 0.3125rem);
+    width: 1.875rem;
+    min-width: 1.875rem;
+    min-height: 1.875rem;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview {
+    flex: 1 1 auto;
+    min-width: 0;
+    gap: var(--spacing-xxs, 0.3125rem);
+    width: 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-label {
+    font-size: var(--profile-edit-dialog-mobile-image-label-font-size);
+    line-height: var(--line-height-tight, 1.25);
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-description {
+    font-size: var(--profile-edit-dialog-mobile-image-description-font-size);
+    line-height: var(--line-height-base, 1.4);
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-actions {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: var(--spacing-xs, 0.5rem);
+    width: 100%;
+    align-items: stretch;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button {
+    width: 100%;
+    min-width: 0;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button::part(button) {
+    min-width: 0;
+    padding: var(--profile-edit-dialog-mobile-image-button-padding);
+    font-size: var(--profile-edit-dialog-mobile-image-button-font-size);
+  }
+
+  .profile-edit-dialog__row--address-header .profile-edit-dialog__actions {
+    justify-content: flex-end;
+  }
+}
+
+@container profile-pane (max-width: 576px) {
+  .profile-edit-dialog__row {
+    max-width: 100%;
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .profile-edit-dialog__section-heading {
+    font-size: var(--font-size-lg, 1.125rem);
+    line-height: var(--line-height-tight, 1.4);
+  }
+
+  #profile-modal .modal .profile__section-header {
+    padding: var(--spacing-sm, 0.938rem);
+    gap: var(--spacing-lg, 1.5625rem);
+  }
+
+  #profile-modal .modal .profile__section-header .profile-edit-dialog__section-heading {
+    font-size: var(--font-size-lg, 1.125rem);
+    line-height: var(--line-height-tight, 1.4);
+  }
+
+  #profile-modal .modal .profile__section-header .profile__action-button,
+  #profile-modal .modal .profile__section-header solid-ui-button.profile__action-button::part(button) {
+    font-size: var(--font-size-sm, 0.875rem);
+    line-height: var(--line-height-base, 1.5);
+  }
+
+  #profile-modal .modal .profile__section-header .profile__add-more-content,
+  #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-label {
+    font-size: var(--font-size-sm, 0.875rem);
+  }
+
+  #profile-modal .modal .profile__section-header .profile__add-more-icon,
+  #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-icon {
+    width: var(--icon-xxs, 1rem);
+    height: var(--icon-xxs, 1rem);
+    padding: 0.125rem;
+    box-sizing: border-box;
+  }
+
+  #profile-modal .modal .profile__section-header .profile__add-more-icon svg,
+  #profile-modal .modal .profile__section-header .profile-section-collapsible__edit-icon svg {
+    width: 100%;
+    height: 100%;
+  }
+
+  .profile-edit-dialog__row--equal > .profile-edit-dialog__field,
+  .profile-edit-dialog__row--equal > .profile-edit-dialog__field-type {
+    flex: 1 1 auto;
+  }
+
+  .profile-edit-dialog__field-type {
+    flex: 1 1 auto;
+  }
+
+  .profile-edit-dialog__row--inline-end {
+    justify-content: flex-start;
+  }
+
+  .profile-edit-dialog__actions {
+    justify-content: flex-start;
+  }
+
+  .profile-edit-dialog__textarea {
+    min-height: 15rem !important;
+  }
+
+  .profile-edit-dialog__input--with-action {
+    padding-right: 6.5rem;
+  }
+
+  .profile-edit-dialog__paste-button {
+    right: var(--spacing-xxs, 0.3125rem);
+    --button-padding-md: var(--spacing-xxs, 0.3125rem) var(--spacing-xxs, 0.3125rem);
+    --button-font-size-md: var(--font-size-2xs, 0.6875rem);
+    --button-icon-size-md: var(--font-size-xxs, 0.75rem);
+    --button-icon-size-lg: var(--font-size-xxs, 0.75rem);
+  }
+
+  .profile-edit-dialog__input-help-text {
+    display: none;
+  }
+
+  .profile-edit-dialog__field-type--contact-point {
+    flex: 1 1 auto;
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--contact-point {
+    flex-direction: row;
+    align-items: stretch;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--contact-point.profile-edit-dialog__row--equal > .profile-edit-dialog__field-type.profile-edit-dialog__field-type--contact-point {
+    flex: 0 0 6.4375rem;
+    width: 6.4375rem;
+    min-width: 6.4375rem;
+    max-width: 6.4375rem;
+  }
+
+  .profile-edit-dialog__row--address-header {
+    flex-direction: row;
+    align-items: flex-end;
+  }
+
+  .profile-edit-dialog__row--social {
+    margin-left: 0;
+    gap: var(--spacing-2xs, 0.625rem);
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+  }
+
+  .profile-edit-dialog__row--social .profile-edit-dialog__social-icon {
+    display: none;
+  }
+
+  .profile-edit-dialog__field--social-type {
+    flex: 0 0 4.75rem;
+    width: 4.75rem;
+    max-width: 4.75rem;
+  }
+
+  .profile-edit-dialog__field--social-url {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+
+  .profile-edit-dialog__field--resume-location {
+    flex: 1 1 100%;
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog__row--language {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    gap: var(--spacing-xxs, 0.3125rem);
+    margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+  }
+
+  .profile-edit-dialog__row--language > .profile-edit-dialog__field--language-name {
+    flex: 1 1 0;
+    min-width: 0;
+    margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+  }
+
+  .profile-edit-dialog__actions--language {
+    margin-left: 0;
+  }
+
+  .profile-edit-dialog__row--language > solid-ui-button.profile-edit-dialog__drag-handle,
+  .profile-edit-dialog__actions--language > solid-ui-button.profile-edit-dialog__delete-button {
+    min-width: 1.5rem;
+    min-height: 1.5rem;
+    --button-height-md: 1.5rem;
+  }
+
+  .profile-edit-dialog__row--resume-entry-header {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog__row--resume-entry-header > .profile-edit-dialog__actions--edge {
+    margin-left: auto;
+  }
+
+  .profile-edit-dialog__row--skill {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    gap: var(--spacing-2xs, 0.625rem);
+  }
+
+  .profile-edit-dialog__row--skill > .profile-edit-dialog__field {
+    flex: 1 1 0;
+    min-width: 0;
+  }
+
+  .profile-edit-dialog__row--skill > .profile-edit-dialog__actions {
+    flex: 0 0 auto;
+    margin-left: 0;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero,
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
+    width: 5rem;
+    height: 5rem;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo {
+    flex-direction: row;
+    align-items: center;
+    flex-wrap: nowrap;
+    gap: var(--spacing-xs, 0.75rem);
+    width: 100%;
+    max-width: 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo > header {
+    margin-bottom: 0;
+    flex: 0 0 auto;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__hero-alt {
+    padding: 0;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile__image-frame--fallback .profile__hero-alt {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-camera-button {
+    display: inline-flex;
+    right: var(--spacing-xxs, 0.3125rem);
+    bottom: var(--spacing-xxs, 0.3125rem);
+    width: 1.875rem;
+    min-width: 1.875rem;
+    min-height: 1.875rem;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview {
+    flex: 1 1 auto;
+    min-width: 0;
+    gap: var(--spacing-xxs, 0.3125rem);
+    width: 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-label {
+    font-size: var(--profile-edit-dialog-mobile-image-label-font-size);
+    line-height: var(--line-height-tight, 1.25);
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-description {
+    font-size: var(--profile-edit-dialog-mobile-image-description-font-size);
+    line-height: var(--line-height-base, 1.4);
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-actions {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: var(--spacing-xs, 0.5rem);
+    width: 100%;
+    align-items: stretch;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button {
+    width: 100%;
+    min-width: 0;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button::part(button) {
+    min-width: 0;
+    padding: var(--profile-edit-dialog-mobile-image-button-padding);
+    font-size: var(--profile-edit-dialog-mobile-image-button-font-size);
+  }
+
+  .profile-edit-dialog__row--address-header .profile-edit-dialog__actions {
+    justify-content: flex-end;
+  }
+}
+
+@media (max-width: 20rem) {
+  .profile-edit-dialog__row--language {
+    gap: var(--spacing-xxs, 0.3125rem);
+    margin-left: calc(-1 * var(--spacing-2xs, 0.625rem));
+  }
+
+  .profile-edit-dialog__row--language > .profile-edit-dialog__field--language-name {
+    margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+  }
+
+  .profile-edit-dialog__actions--language {
+    margin-left: 0;
+  }
+
+  .profile-edit-dialog__row--language > solid-ui-button.profile-edit-dialog__drag-handle,
+  .profile-edit-dialog__actions--language > solid-ui-button.profile-edit-dialog__delete-button {
+    min-width: 1.5rem;
+    min-height: 1.5rem;
+    --button-height-md: 1.5rem;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-actions {
+    flex-wrap: wrap;
+    gap: var(--spacing-xxs, 0.3125rem);
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button {
+    flex: 1 1 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button::part(button) {
+    width: 100%;
+    justify-content: center;
+    padding: var(--spacing-xxs, 0.3125rem) var(--spacing-2xs, 0.625rem);
+  }
+}
+
+@container profile-pane (max-width: 20rem) {
+  .profile-edit-dialog__row--language {
+    gap: var(--spacing-xxs, 0.3125rem);
+    margin-left: calc(-1 * var(--spacing-2xs, 0.625rem));
+  }
+
+  .profile-edit-dialog__row--language > .profile-edit-dialog__field--language-name {
+    margin-left: calc(-1 * var(--spacing-xxs, 0.3125rem));
+  }
+
+  .profile-edit-dialog__actions--language {
+    margin-left: 0;
+  }
+
+  .profile-edit-dialog__row--language > solid-ui-button.profile-edit-dialog__drag-handle,
+  .profile-edit-dialog__actions--language > solid-ui-button.profile-edit-dialog__delete-button {
+    min-width: 1.5rem;
+    min-height: 1.5rem;
+    --button-height-md: 1.5rem;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-preview-actions {
+    flex-wrap: wrap;
+    gap: var(--spacing-xxs, 0.3125rem);
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button {
+    flex: 1 1 100%;
+  }
+
+  .profile-edit-dialog--heading .profile-edit-dialog__row--heading-photo .profile-edit-dialog__image-button::part(button) {
+    width: 100%;
+    justify-content: center;
+    padding: var(--spacing-xxs, 0.3125rem) var(--spacing-2xs, 0.625rem);
+  }
+}
\ No newline at end of file
diff --git a/src/styles/EducationCard.css b/src/styles/EducationCard.css
deleted file mode 100644
index 8d4ebe1f..00000000
--- a/src/styles/EducationCard.css
+++ /dev/null
@@ -1,103 +0,0 @@
-/* EducationCard.css */
-/* Mirrors Resume/CV card typography and spacing patterns. */
-
-.educationCard {
-  width: 100%;
-}
-
-.educationSection {
-  margin-bottom: 1.25em;
-}
-
-.education {
-  margin: var(--spacing-xs) 0;
-  font-size: var(--font-size-base);
-  line-height: var(--line-height-base);
-  display: flex;
-  flex-direction: column;
-  gap: 0;
-}
-
-.education + .education {
-  margin-top: var(--spacing-sm);
-}
-
-.educationHeader {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: baseline;
-  gap: var(--spacing-sm);
-}
-
-.educationHeader h4,
-.educationHeader time,
-.educationHeader p {
-  margin: 0;
-}
-
-.educationPeriod {
-  margin: 0;
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-tight);
-}
-
-.educationOrg {
-  font-weight: 600;
-  color: var(--color-primary);
-  margin: 0;
-}
-
-.cvDescriptionWrap {
-  margin: 0;
-  position: relative;
-}
-
-.cvDescriptionText {
-  margin: 0;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-  line-clamp: 2;
-  line-height: var(--line-height-base);
-  padding-right: 4.5em;
-  overflow: hidden;
-}
-
-.cvDescriptionText.isExpanded {
-  display: block;
-  -webkit-line-clamp: unset;
-  line-clamp: unset;
-  padding-right: 0;
-  overflow: visible;
-}
-
-.cvDescriptionToggle {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  background: none;
-  color: var(--color-primary);
-  cursor: pointer;
-  font: inherit;
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-tight);
-  position: absolute;
-  right: 0;
-  bottom: 0;
-  background-color: var(--color-card-bg);
-  padding-left: 0.25em;
-}
-
-.cvDescriptionText.isExpanded + .cvDescriptionToggle {
-  position: static;
-  display: inline;
-  padding-left: 0;
-}
-
-@media (max-width: 640px) {
-  .educationHeader {
-    flex-direction: column;
-    align-items: flex-start;
-  }
-}
diff --git a/src/styles/HeadingSection.css b/src/styles/HeadingSection.css
deleted file mode 100644
index b3127ff2..00000000
--- a/src/styles/HeadingSection.css
+++ /dev/null
@@ -1,309 +0,0 @@
-.profile__avatar {
-  flex: 0 0 auto;
-}
-
-.profile__heading-top {
-  display: grid;
-  grid-template-columns: auto minmax(0, 1fr) auto;
-  grid-template-areas:
-    "avatar info actions"
-    "avatar details details";
-  column-gap: var(--spacing-md, 1.25rem);
-  row-gap: var(--spacing-sm, 0.75rem);
-  align-items: start;
-  width: 100%;
-}
-
-.profile__name {
-color: var(--color-text-heading, #000);
-font-size: var(--font-size-xxl, 1.75rem); /* 28px */
-font-weight: var(--font-weight-bold, 600);
-margin: 0;
-padding: 0;
-text-indent: 0;
-line-height: 1.2;
-text-align: left;
-transform: translateX(-4px);
-}
-
-.profile__info {
-  grid-area: info;
-  display: flex;
-  flex-direction: column;
-  flex: 1 1 auto;
-  min-width: 0;
-  align-items: flex-start;
-}
-
-.profile__details {
-  grid-area: details;
-  color: var(--color-text-secondary, #4A5565);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  display: flex;
-  width: 100%;
-  align-content: flex-start;
-  align-items: flex-start;
-  flex-wrap: wrap;
-  gap: var(--spacing-sm, 0.75rem) 2rem; /* 12px vertical, 32px horizontal */
-}
-
-.profile__info > .profile__header-bar {
-  margin-left: 0;
-  padding-left: 0;
-  align-self: stretch;
-}
-
-.profile__header-bar {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 0.125rem;
-  width: 100%;
-  margin: 0;
-  padding: 0;
-}
-
-.profile__heading-actions {
-  grid-area: actions;
-  margin-left: auto;
-  align-self: flex-start;
-}
-
-.profile__avatar {
-  grid-area: avatar;
-}
-
-.profile__heading-action-button {
-  position: static;
-  min-width: 0;
-  width: auto;
-  max-width: none;
-  padding: var(--spacing-xxs, 0.3125rem);
-}
-.profile__identity {
-  display: flex;
-  flex-direction: row;
-  align-items: baseline;
-  gap: 0.4375rem; /* 7px */
-  justify-content: flex-start;
-  width: 100%;
-  flex-wrap: nowrap;
-}
-
-.profile__pronouns {
-  color: var(--color-text-secondary, #4A5565);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  font-weight: var(--font-weight-regular, 400);
-  line-height: 1.2;
-}
-
-.profile__role-org {
-  margin: 0;
-  width: 100%;
-  white-space: normal;
-  color: var(--color-text-subheading, #101828);
-  font-size: var(--font-size-base, 1rem);
-  font-weight: var(--font-weight-medium, 500);
-  line-height: 1.25;
-  text-align: left;
-}
-
-.profile__meta-row,
-.profile__contact-row {
-  display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  justify-content: flex-start;
-  column-gap: 0.25rem; /* 4px */
-  row-gap: var(--spacing-xs, 0.5rem);
-  align-items: start;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-}
-
-.profile__meta-row .profile__item,
-.profile__contact-row .profile__item {
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-2xs, 0.625rem);
-  min-width: 0;
-}
-
-.profile__meta-row .profile__value,
-.profile__contact-row .profile__value {
-  display: flex;
-  align-items: flex-start;
-  gap: var(--spacing-xxs, 0.3125rem);
-  min-width: 0;
-  white-space: normal !important;
-  overflow-wrap: anywhere;
-  word-break: break-word;
-}
-
-.profile__meta-row .profile__value-text,
-.profile__contact-row .profile__value-text {
-  min-width: 0;
-  white-space: normal !important;
-  overflow-wrap: anywhere;
-  word-break: break-word;
-}
-
-.profile__prefix-icon {
-  display: inline-flex;
-  align-items: center;
-  margin-right: 0.125rem;
-}
-
-.profile__detail-icon {
-  display: block;
-  width: 1rem;
-  height: 1rem;
-}
-
-.profile__hero {
-  width: 140px;
-  height: 140px;
-  border-radius: var(--border-radius-full, 0.625rem); /* 10px */;
-  border: var(--border-width-sm, 0.1rem) solid var(--color-primary, #7C4DFF);
-  background: lightgray 50% / cover no-repeat;
-  background-position: 50%;
-  object-fit: cover;
-  object-position: center;
-}
-
-.profile__hero-alt {
-  width: 140px;
-  height: 140px;
-  padding: 0 36.4px; 
-  border-radius: var(--border-radius-full, 0.625rem); /* 10px */;
-  border: 1.6px dashed #CBD5E1;
-  background: #F8FAFC;
-  box-sizing: border-box;
-}
-
-/* added because the icon wasn't centering on mobile
-   due to styles in mashlib */
-.profile__hero-alt .profile__hero-icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  line-height: 0;
-}
-
-.profile__hero-alt .profile__hero-icon svg {
-  display: block;
-  width: 100%;
-  height: 100%;
-}
-
-@media (max-width: 640px) {
-  .profile__heading-top {
-    grid-template-columns: auto minmax(0, 1fr) auto;
-    grid-template-areas:
-      "avatar info actions"
-      "details details details";
-    column-gap: var(--spacing-sm, 0.75rem);
-    row-gap: var(--spacing-sm, 0.75rem);
-  }
-
-  .profile__name {
-    font-size: 1.5rem;
-    line-height: 1.15;
-  }
-
-  .profile__identity {
-    gap: 0.125rem;
-  }
-
-  .profile__pronouns {
-    font-size: var(--font-size-xs, 0.75rem);
-    line-height: 1.1;
-    white-space: nowrap;
-  }
-
-  .profile__hero,
-  .profile__hero-alt {
-    width: 112px;
-    height: 112px;
-  }
-
-  .profile__hero-alt {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0;
-  }
-
-  .profile__hero-icon {
-    display: block;
-    margin: 0 auto;
-    width: 48px;
-    height: 48px;
-  }
-
-  .profile__details {
-    gap: var(--spacing-xs, 0.5rem);
-  }
-
-  .profile__meta-row,
-  .profile__contact-row {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-    column-gap: 0.25rem;
-  }
-}
-
-@container profile-pane (max-width: 640px) {
-  .profile__heading-top {
-    grid-template-columns: auto minmax(0, 1fr) auto;
-    grid-template-areas:
-      "avatar info actions"
-      "details details details";
-    column-gap: var(--spacing-sm, 0.75rem);
-    row-gap: var(--spacing-sm, 0.75rem);
-  }
-
-  .profile__name {
-    font-size: 1.5rem;
-    line-height: 1.15;
-  }
-
-  .profile__identity {
-    gap: 0.125rem;
-  }
-
-  .profile__pronouns {
-    font-size: var(--font-size-xs, 0.75rem);
-    line-height: 1.1;
-    white-space: nowrap;
-  }
-
-  .profile__hero,
-  .profile__hero-alt {
-    width: 112px;
-    height: 112px;
-  }
-
-  .profile__hero-alt {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0;
-  }
-
-  .profile__hero-icon {
-    display: block;
-    margin: 0 auto;
-    width: 48px;
-    height: 48px;
-  }
-
-  .profile__details {
-    gap: var(--spacing-xs, 0.5rem);
-  }
-
-  .profile__meta-row,
-  .profile__contact-row {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-    column-gap: 0.25rem;
-  }
-}
diff --git a/src/styles/ProfileCard.css b/src/styles/ProfileCard.css
deleted file mode 100644
index ae43612b..00000000
--- a/src/styles/ProfileCard.css
+++ /dev/null
@@ -1,66 +0,0 @@
-/* ProfileCard.css */
-/* Uses utilities: .action-button-focus, .btn-primary, .flex-column-center, .text-truncate, .text-center, .text-wrap-anywhere, .section-centered, .btn-transparent */
-
-.profileCard {
-  /* Component container */
-}
-
-.name {
-  font-size: var(--font-size-xl);
-  font-weight: 700;
-  line-height: var(--line-height-tight);
-  text-decoration: underline;
-  text-underline-offset: 0.2em;
-  margin: 0;
-  letter-spacing: var(--letter-spacing-wide);
-}
-
-.profile__actions {
-  color: var(--color-text-secondary);
-  font-size: var(--font-size-base, 1rem);
-  margin-bottom: var(--spacing-xs);
-}
-
-.buttonSubSection {
-  width: 100%;
-  min-width: 0;
-  display: grid;
-}
-
-.buttonSubSection button {
-  width: 100%;
-  min-width: 0;
-}
-
-/* Ensure prompt inputs stretch to fit their container */
-.add-friend-button-container input[type="text"] {
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.profile__qr-code {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 20px;
-  align-self: stretch;
-  /* OLD color: var(--color-text-secondary);
-  font-size: 1em;
-  margin-bottom: var(--spacing-xs); */
-}
-
-.details {
-  color: var(--color-text-muted);
-  font-size: var(--font-size-base);
-  line-height: var(--line-height-base);
-  max-width: 45ch;
-  margin-left: auto;
-  margin-right: auto;
-}
-
-/* ProfileCard styles as regular CSS */
-.profile-card {
-  border: 1px solid #ccc;
-  padding: 16px;
-  background: white;
-}
diff --git a/src/styles/ProfileView.css b/src/styles/ProfileView.css
deleted file mode 100644
index b2489a26..00000000
--- a/src/styles/ProfileView.css
+++ /dev/null
@@ -1,65 +0,0 @@
-/* ProfileView.css */
-/* Uses utilities: .section-bg, .text-center */
-
-
-.profile-grid .profile__main {
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  box-sizing: border-box;
-  margin-bottom: 0;
-  overflow-wrap: anywhere;
-  align-items: flex-start;
-}
-
-.profile-grid .profile__sidebar {
-  display: flex;
-  flex-direction: column;
-  align-items: stretch;
-  text-align: left;
-  border-radius: var(--border-radius-base);
-  background: var(--color-background, #F8F9FB);
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  box-sizing: border-box;
-  overflow-x: clip;
-}
-
-.profile-grid .profile__section {
-  padding: var(--spacing-lg);
-  border-radius: var(--border-radius-base);
-  background: var(--white, #FFF);
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  overflow-x: clip;
-}
-
-.profile-grid .profile__section--empty {
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  overflow-x: clip;
-}
-
-
-/* SAM Not sure this is needed, and potentially should be moved somewhere else */
-.profile-grid .phone-type {
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-base);
-  color: var(--color-text-secondary);
-}
-
-@container profile-pane (max-width: 1000px) {
-  #main-content.profile-grid {
-    width: 100%;
-    max-width: 100%;
-    box-sizing: border-box;
-    margin-inline: auto !important;
-    padding-inline: var(--spacing-sm, 0.75rem) !important;
-  }
-}
-
diff --git a/src/styles/ProjectsCard.css b/src/styles/ProjectsCard.css
deleted file mode 100644
index b732ab70..00000000
--- a/src/styles/ProjectsCard.css
+++ /dev/null
@@ -1,206 +0,0 @@
-/* The following are the original styles for the ProjectsCard section.  */
-.project-card__rail {
-  display: flex;
-  gap: 1rem;
-  overflow-x: auto;
-  padding: 0;
-  margin: 0;
-  list-style: none;
-  scroll-snap-type: x proximity;
-}
-.project-card__follow-button {
-  width: auto;
-  border-radius: var(--border-radius-md, 0.5rem);
-  border: var(--border-width-sm, 0.1rem) solid var(--color-primary, #7C4DFF);  
-  padding: 0.5rem 0.625rem; /* ~8px 10px, increased by ~2px in rem */
-  color: var(--color-primary, #7C4DFF);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  font-weight: var(--font-weight-md, 500);
-  background: var(--white, #FFF);
-  cursor: pointer;
-}
-
-.project-card__follow-button:hover {
-  background: var(--lavender-400, #cbb9ff);
-}
-
-.project-card__rail::-webkit-scrollbar {
-  height: 8px;
-}
-
-.project-card__rail::-webkit-scrollbar-thumb {
-  background: #b0b7c3;
-  border-radius: 999px;
-}
-
-.project-card {
-  flex: 0 0 min(420px, 88vw);
-  scroll-snap-align: start;
-  border-radius: var(--border-radius-md, 0.5rem);
-  border: var(--border-width-sm, 0.1rem) solid var(--gray-200, #E5E7EB);
-  padding: var(--spacing-md, 1.25rem);
-  justify-content: center;
-  align-items: flex-start;
-  gap: var(--spacing-sm, 0.938rem);
-  flex-shrink: 0;
-}
-
-.project-card__link {
-  display: block;
-  color: inherit;
-  text-decoration: none;
-}
-
-.project-card__link:hover .project-card__title,
-.project-card__link:focus-visible .project-card__title {
-  text-decoration: underline;
-}
-
-.project-card__wrapper {
-  display: grid;
-  grid-template-columns: 88px 1fr;
-  gap: 0.9rem;
-  align-items: start;
-  padding-bottom: 0.563rem;
-  border-radius: var(--border-radius-md, 0.5rem);
-  border-bottom: 1px solid var(--gray-200, #E5E7EB);
-}
-
-.project-card__thumb {
-  width: 66px;
-  height: 66px;
-  overflow: hidden;
-  border-radius: var(--border-radius-base, 0.3125rem);
-  background: var(--gray-200, #E5E7EB);
-  padding: 0.656rem var(--spacing-2xs, 0.625rem);
-  aspect-ratio: 1/1;
-}
-
-.project-card__thumb-image {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  display: block;
-}
-
-.project-card__thumb-fallback {
-  width: 100%;
-  height: 100%;
-  font-size: 0.72rem;
-  color: #5a6476;
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-}
-
-.project-card__content {
-  min-width: 0;
-}
-
-.project-card__title,
-.project-card__organization,
-.project-card__category,
-.project-card__meta,
-.project-card__description {
-  margin: 0;
-}
-
-.project-card__title {
-  overflow: hidden;
-  color: var(--gray-900, #101828);
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  font-size: var(--font-size-lg, 1.125rem);
-  font-weight: var(--font-weight-bold, 600);
-  align-self: stretch;
-}
-
-.project-card__organization {
-  margin-top: 0.35rem;
-  color: var(--gray-700, #364153);
-  font-size: var(--font-size-sm, 0.875rem);
-  font-weight: var(--font-weight-md, 500);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  display: block;
-  line-height: 1.35;
-  max-height: calc(1.35em * 2);
-  align-self: stretch;
-}
-
-.project-card__category {
-  font-size: var(--font-size-xxs, 0.75rem);
-  font-weight: var(--font-weight-md, 500);
-}
-
-.project-card__category--project {
-  color: var(--purple-500, #AD46FF);
- 
-}
-
-.project-card__category--community {
-  color: var(--yellow-700, #A65F00);
-}
-
-.project-card__category--unknown {
-  color: var(--slate-700, #314158);
-}
-
-.project-card__meta {
-  margin-top: 0.55rem;
-  overflow-wrap: anywhere;
-  font-size: 0.86rem;
-}
-
-.project-card__footer {
-  margin-top: 0.8rem;
-  padding: 0.75rem;
-
-}
-
-.project-card__more-button {
-  display: none;
-}
-
-@media (max-width: 640px) {
-  .project-card__rail {
-    flex-wrap: wrap;
-    overflow-x: visible;
-    scroll-snap-type: none;
-  }
-
-  .project-card {
-    flex: 1 1 100%;
-    max-width: 100%;
-  }
-
-  .profile-section-collapsible[data-mobile-expanded="false"] .project-card:nth-child(n + 3) {
-    display: none;
-  }
-
-  .project-card__more-button {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    gap: 0.375rem;
-    width: 100%;
-    margin-top: 0.75rem;
-    padding: 0;
-    border: 0;
-    background: transparent;
-    color: var(--color-primary, #7C4DFF);
-    font-size: var(--font-size-sm, 0.875rem);
-    font-weight: var(--font-weight-bold, 600);
-    cursor: pointer;
-  }
-
-  .project-card__more-button[data-mobile-expanded="true"] .project-card__more-icon {
-    transform: rotate(180deg);
-  }
-
-  .project-card__more-icon {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    transition: transform var(--animation-duration, 0.2s) ease;
-  }
-}
diff --git a/src/styles/QRCodeCard.css b/src/styles/QRCodeCard.css
deleted file mode 100644
index 68f31526..00000000
--- a/src/styles/QRCodeCard.css
+++ /dev/null
@@ -1,43 +0,0 @@
-/* QRCodeCard.css */
-/* Note: Uses utilities: .text-center */
-
-/* Caption under the QR code */
-.qrcode-card__caption {
-  text-align: center;
-  margin-top: 0;
-  padding-bottom: 0.25rem;
-  color: var(--gray-800, #1E2939);
-  font-size: var(--font-size-md, 1rem); /* 16px */
-  font-weight: var(--font-weight-md, 500);
-}
-
-.qrcode-card {
-  width: 136px;
-  margin: 0 auto;
-  height: auto;
-  flex-shrink: 0;
-}
-
-.qrcode-card__frame {
-  padding: 1rem 1rem 1.25rem 1.063rem; /* 16px 16px 20px 17px */
-  border-radius: var(--border-radius-base, 0.3125rem); /* 5px */
-  border: var(--border-width-thin, 0.1rem) solid var(--gray-200, #E5E7EB);
-  background: var(--gray-100, #F3F4F6);
-}
-
-.qrcode-card [role="img"]:focus {
-  outline: var(--border-width-medium, 2px) solid var(--color-primary, #7C4DFF);
-  outline-offset: 2px;
-  box-shadow: 0 0 0 2px rgba(124,77,255,0.2);
-}
-
-.qrcode-card [role="img"] {
-  width: 136px;
-  height: 136px;
-}
-
-.qrcode-card [role="img"] svg {
-  width: 100%;
-  height: 100%;
-  display: block;
-}
\ No newline at end of file
diff --git a/src/styles/SocialCard.css b/src/styles/SocialCard.css
deleted file mode 100644
index 4b2ad775..00000000
--- a/src/styles/SocialCard.css
+++ /dev/null
@@ -1,89 +0,0 @@
-/* SocialCard.css */
-/* Uses utilities: .list-reset, .text-wrap-anywhere, .flex, .gap-sm, .gap-lg, .rounded-sm */
-
-.socialList {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  gap: var(--spacing-xxs);
-  justify-content: flex-start;
-}
-
-.socialItem {
-  display: flex;
-  align-items: center;
-}
-
-.socialItem a {
-  color: var(--color-primary);
-  text-decoration: none;
-  display: flex;
-  align-items: center;
-  min-height: var(--min-touch-target);
-  padding: var(--spacing-xxs); 
-  border-radius: var(--border-radius-base);
-  transition: background-color var(--animation-duration) ease;
-  position: relative;
-  flex: 1;
-  min-width: 0;
-}
-
-.socialItem a:hover,
-.socialItem a:focus {
-  text-decoration: underline;
-  background-color: rgba(124, 77, 255, 0.1);
-}
-
-/* Screen reader only external link indication */
-.socialItem a[href^="http"]:after {
-  content: " (external link)";
-  position: absolute;
-  left: -10000px;
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
-}
-
-.socialIcon {
-  width: var(--icon-base);
-  height: var(--icon-base);
-  border-radius: var(--border-radius-base);
-  background: var(--color-card-bg);
-  flex-shrink: 0;
-}
-
-.socialCard__more-button {
-  display: none;
-}
-
-@media (max-width: 1000px) {
-  .socialCard .socialList {
-    display: grid;
-    grid-template-columns: repeat(5, max-content);
-    justify-content: flex-start;
-  }
-
-  .socialCard[data-mobile-expanded="true"] .socialList {
-    grid-template-columns: repeat(3, max-content);
-  }
-
-  .socialCard[data-mobile-expanded="false"] .socialItem:nth-child(n + 11) {
-    display: none;
-  }
-
-  .socialCard__more-button {
-    display: inline-flex;
-    margin-top: var(--spacing-xs);
-    padding: 0;
-    border: 0;
-    background: transparent;
-    color: var(--color-primary, #7C4DFF);
-    font: inherit;
-    font-weight: 600;
-    cursor: pointer;
-  }
-
-  .socialCard[data-mobile-expanded="true"] .socialCard__more-button {
-    display: none;
-  }
-}
diff --git a/src/styles/dialog.css b/src/styles/dialog.css
deleted file mode 100644
index ba6dd934..00000000
--- a/src/styles/dialog.css
+++ /dev/null
@@ -1,209 +0,0 @@
-/* CSS for the accessible modal dialogs created by dialog.ts */
-/* dialog host */
-#profile-modal {
-  margin: 0;
-  padding: 0;
-  border: none;
-  background: rgba(0, 0, 0, 0.5);
-  max-width: none;
-  max-height: none;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  position: fixed;
-  inset: 0;
-  display: grid;
-  place-items: center;
-  z-index: 9999;
-}
-
-#profile-modal:not([open]) {
-  display: none;
-}
-
-#profile-modal::backdrop {
-  background: rgba(0, 0, 0, 0.5);
-}
-
-#profile-modal .modal {
-  box-sizing: border-box;
-  margin: 0;
-  background: var(--color-background);
-  padding: var(--spacing-lg);
-  border-radius: var(--border-radius-base);
-  max-width: 100%;
-  width: min(640px, 92vw);
-  max-height: 85vh;
-  overflow: auto;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
-}
-
-#profile-modal .modal .modal-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: var(--spacing-lg);
-  margin: calc(-1 * var(--spacing-lg)) calc(-1 * var(--spacing-lg)) var(--spacing-sm) calc(-1 * var(--spacing-lg));
-  padding: var(--spacing-lg);
-  border-radius: var(--border-radius-base, 0.3125rem) var(--border-radius-base, 0.3125rem) 0 0;
-  border: var(--border-width-sm, 0.1rem) solid var(--slate-200, #E2E8F0);
-  background: var(--slate-50, #F8FAFC);
-}
-
-#profile-modal .modal #modal-title {
-  margin: 0;
-}
-
-#profile-modal .modal #modal-header-action > button[aria-label="Close dialog"] {
-  min-height: 2rem;
-  min-width: 2rem;
-  padding: 0;
-  border: none;
-  background: transparent;
-  color: var(--color-text);
-  font-size: 1.5rem;
-  line-height: 1;
-  cursor: pointer;
-}
-
-#profile-modal .modal #modal-header-action > button[aria-label="Close dialog"]:hover {
-  color: var(--color-primary);
-}
-
-#profile-modal .modal #modal-header-action {
-  display: flex;
-  align-items: center;
-}
-
-#profile-modal .modal .modal__header-action-button {
-  min-height: auto;
-  padding: var(--spacing-xxs);
-  border: none;
-  background: none;
-  color: var(--color-primary);
-  font-weight: 500;
-}
-
-#profile-modal .modal .modal__header-action-button:hover {
-  text-decoration: underline;
-}
-
-/* button container: center buttons horizontally (uses id in markup) */
-#profile-modal #modal-buttons {
-  display: flex;
-  padding: 20px 0 20px 30px;
-  justify-content: flex-end;
-  align-items: center;
-  gap: 15px;
-  align-self: stretch;
-  border-top: var(--border-width-sm, 0.1rem) solid var(--slate-200, #E2E8F0);
-  background: var(--gray-50, #F9FAFB);
-}
-
-#profile-modal #modal-buttons button {
-  width: 10.8rem;
-}
-
-#profile-modal .modal__error-section {
-  margin-top: var(--spacing-sm);
-}
-
-#profile-modal .modal__error-section[hidden] {
-  display: none !important;
-}
-
-
-/* buttons themselves use the shared btn-primary rules */
-#profile-modal .modal button {
-  min-height: var(--min-touch-target);
-  padding: var(--spacing-sm) var(--spacing-md);
-  border: 1px solid var(--color-primary);
-  border-radius: var(--border-radius-base);
-  font-weight: 600;
-  cursor: pointer;
-  transition: all var(--animation-duration) ease;
-}
-
-#profile-modal .modal button.btn-primary {
-  background: var(--color-primary);
-  color: var(--white, #FFF);
-  font-size: var(--font-size-lg, 1.125rem); /* 18px */
-  font-weight: var(--font-weight-bold, 600);
-}
-
-#profile-modal .modal button.btn-primary:hover {
-  background: color-mix(in srgb, var(--color-primary) 90%, black);
-  box-shadow: 0 2px 4px rgba(124, 77, 255, 0.2);
-}
-
-#profile-modal .modal button.btn-primary:active {
-  box-shadow: 0 1px 2px rgba(124, 77, 255, 0.2);
-}
-
-#profile-modal .modal button:disabled {
-  opacity: var(--opacity-disabled, 0.6);
-  cursor: not-allowed;
-  transform: none;
-}
-
-/* Keep text-style actions in section headers while preserving footer button styling. */
-#profile-modal .modal .profile__section-header .profile__action-button {
-  min-height: auto;
-  padding: var(--spacing-xxs);
-  border: none;
-  background: none;
-  color: var(--color-primary);
-  font-weight: 500;
-}
-
-#profile-modal .modal .profile__section-header .profile__action-button:hover {
-  text-decoration: underline;
-}
-
-@media (max-width: 640px) {
-  #profile-modal {
-    padding-top: max(var(--spacing-sm), env(safe-area-inset-top));
-    padding-right: var(--spacing-sm);
-    padding-bottom: max(var(--spacing-sm), env(safe-area-inset-bottom));
-    padding-left: var(--spacing-sm);
-    place-items: center;
-  }
-
-  #profile-modal .modal {
-    width: min(420px, calc(100% - 2 * var(--spacing-sm)));
-    max-width: 420px;
-    max-height: calc(100dvh - 2 * var(--spacing-sm));
-    padding: var(--spacing-md);
-    border-radius: calc(var(--border-radius-base) * 0.75);
-    overscroll-behavior: contain;
-    justify-self: center;
-    align-self: center;
-    margin: 0;
-  }
-
-  #profile-modal .modal .modal-header {
-    gap: var(--spacing-md);
-    margin: calc(-1 * var(--spacing-md)) calc(-1 * var(--spacing-md)) var(--spacing-sm) calc(-1 * var(--spacing-md));
-    padding: var(--spacing-md);
-  }
-
-  #profile-modal #modal-buttons {
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    gap: var(--spacing-sm, 0.938rem);
-    padding: var(--spacing-md) 0 0;
-    margin: var(--spacing-md) auto 0;
-    box-sizing: border-box;
-    width: 100%;
-  }
-
-  #profile-modal #modal-buttons button {
-    flex: 0 0 auto;
-    width: 10.8rem;
-    min-width: 8.5rem;
-    padding: var(--spacing-sm) var(--spacing-md);
-    font-size: var(--font-size-md, 1rem);
-  }
-
-}
diff --git a/src/styles/utilities.css b/src/styles/utilities.css
deleted file mode 100644
index 78ddd648..00000000
--- a/src/styles/utilities.css
+++ /dev/null
@@ -1,740 +0,0 @@
-/* Utility-first CSS classes for layout, spacing, and responsiveness */
-/* These utilities are designed specfically for the profile pane */
-/* Utilities that can be shared by all panes should be added to dev-globals.css 
-   and to mashlib repo mash-utilities.css and then updated accross all pane
-   development environments */
-:root {
-  --profile-image-size: 3em;
-}
-
-.profile-pane-host {
-  display: block;
-  width: 100%;
-  min-width: 100%;
-  max-width: none;
-  box-sizing: border-box;
-}
-
-@media (max-width: 768px) {
-  .profile-grid {
-    font-size: clamp(0.9rem, 1.1vw + 0.65rem, 1rem);
-  }
-
-  .profile-grid .profile__action-button,
-  .profile-grid .profile__actions button {
-    min-height: calc(var(--min-touch-target, 44px) + 0.5em) !important;
-    font-size: clamp(0.9rem, 2.1vw, 1rem) !important;
-    padding: 0.75em 0.9em !important;
-  }
-}
-
-/* ===========================================
-   PROFILE GRID LAYOUT
-   =========================================== */
-
-.profile-grid {
-  display: grid;
-  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
-  gap: var(--spacing-xxs, 0.3125rem);
-  background: var(--color-background, #F8F9FB);
-}
-
-.profile-grid > * {
-  min-width: 0;
-}
-
-.profile-pane-root {
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  display: block;
-  container-name: profile-pane;
-  container-type: inline-size;
-}
-
-/* Embedded rendering inside SolidOS outline table cells needs a single-column fallback.
-   The outline reserves space for icon/predicate columns, so the available content width
-   is effectively much narrower than the viewport. */
-td.obj .profile-pane-root {
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-}
-
-@container profile-pane (max-width: 768px) {
-  .profile-grid {
-    font-size: clamp(0.9rem, 1.1vw + 0.65rem, 1rem);
-  }
-
-  .profile-grid .profile__action-button,
-  .profile-grid .profile__actions button {
-    min-height: calc(var(--min-touch-target, 44px) + 0.5em) !important;
-    font-size: clamp(0.9rem, 2.1vw, 1rem) !important;
-    padding: 0.75em 0.9em !important;
-  }
-}
-
-@container profile-pane (max-width: 768px) {
-  .profile-grid {
-    grid-template-columns: 1fr;
-    gap: var(--spacing-xxs, 0.3125rem);
-    width: 100%;
-    max-width: 100%;
-    box-sizing: border-box;
-    margin: 0 auto;
-    padding-inline: var(--spacing-xxs, 0.3125rem);
-    overflow-x: clip;
-  }
-}
-
-@media (max-width: 768px) {
-  .profile-grid {
-    grid-template-columns: 1fr;
-    gap: var(--spacing-xxs, 0.3125rem);
-    width: 100%;
-    max-width: 100%;
-    box-sizing: border-box;
-    margin: 0 auto;
-    padding-inline: var(--spacing-xxs, 0.3125rem);
-    overflow-x: clip;
-  }
-}
-
-/* END GRID LAYOUT */
-
-.profile__section {
-  width: 100%;
-}
-
-.profile__section--empty {
-  padding: var(--spacing-1xl, 2.5rem) var(--spacing-lg, 1.5625rem); /* 40px 25px */
-  width: 100%;
-}
-
-.profile__section,
-.profile__section--empty,
-.profile__action-button--empty {
-  background: var(--color-card-bg, #fff);
-}
-
-/* Header row layout utility for profile section headers */
-.profile__section-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: var(--spacing-xs, 0.75rem);
-  width: 100%;
-}
-
-.profile__section-header h2,
-.profile__section-header h3,
-.profile__section-header h4 {
-  margin: 0;
-}
-
-.profile__action-button {
-  width: 100%;
-  min-width: 11.25rem; /* 180px */
-  max-width: 20rem; /* 320px */
-  box-sizing: border-box;
-  display: inline-block;
-}
-
-.profile__action-button--empty {
-  /*padding: 6px 8px; Note: these are the styles from new design
-  min-height: auto;   however they don't meet accessibility guidelines 
-  min-width: 0;       for touch target size */ 
-  width: fit-content;
-  min-width: fit-content;
-  max-width: fit-content;
-  white-space: nowrap;
-  box-sizing: border-box;
-  border: var(--border-width-sm, 1px) solid var(--color-border-darker, #4A5565);
-  color: var(--slate-700, #314158);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  font-weight: var(--font-weight-medium, 500);
-  line-height: var(--line-height-tight, 1.4);
-}
-.profile__empty-state-message {
-  color: #62748E;
-  text-align: center;
-  font-size: var(--font-size-xs, 0.813rem); /* 13px */
-  font-weight: var(--font-weight-normal, 400);
-  line-height: var(--line-height-tight, 1.4); /* 140% from design 18.2px */
-}
-.contact-info__icon-wrapper {
-  width: 36px;
-  height: 36px;
-  padding: 0 0.575rem; /* 9.2px - from design, but also ensures icons are centered in the circle */
-  flex-shrink: 0;
-}
-
-.contact-info__icon {
-  width: var(--icon-xxs, 1rem); /* 16px */
-  height: var(--icon-xxs, 1rem); /* 16px */
-  flex-shrink: 0;
-  stroke-width: 1.333px;
-  stroke: #90A1B9;
-}
-
-.contact-info__contact-point-value {
-  color: var(--slate-800, #1D293D);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  font-weight: var(--font-weight-bold, 600);
-  white-space: normal !important;
-  overflow-wrap: anywhere;
-  word-break: break-word;
-}
-
-.contact-info__contact-point-type {
-  color: var(--slate-500, #62748E);
-  font-size: var(--font-size-xxs, 0.75rem); /* 12px */
-  font-weight: var(--font-weight-md, 500);
-}
-
-.contact-info__address {
-  color: var(--slate-800, #1D293D);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  font-weight: var(--font-weight-bold, 600);
-}
-
-.contact-info__list {
-  list-style: none;
-  margin: 0;
-  padding: 0 0 var(--spacing-2xs, 0.625rem) 0;
-  gap: var(--spacing-2xs, 0.625rem);
-}
-
-.contact-info__list:last-of-type {
-  padding-bottom: 0;
-}
-
-.contact-info__list + .contact-info__list {
-  margin-top: var(--spacing-2xs, 0.625rem);
-}
-
-.contact-info__item {
-  margin-inline-start: 0;
-}
-
-.contact-info__empty-icon svg {
-  width: var(--icon-md, 2.5rem); /* 40px */
-  height: var(--icon-md, 2.5rem); /* 40px */
-  display: block;
-}
-
-.contact-info__empty-icon svg path {
-  stroke-width: 0.25rem; /* 4px */
-  stroke: #E5E7EB;
-}
-
-.contact-info__empty-message {
-  color: #9CA3AF;
-  text-align: center;
-  font-size: var(--font-size-xs, 0.813rem); /* 13px */
-  font-weight: var(--font-weight-normal, 400);
-  line-height: var(--line-height-tight, 1.4); /* design says 1.2 */
-}
-
-.contact-info__empty-icon-wrapper {
-  width: 3rem; /* 48px */
-  flex: 1 0 0;
-}
-.profile__empty-state-content {
-  gap: var(--spacing-2xs, 0.625rem); /* 10px */
-}
-
-.profile__empty-state-content > h2,
-.profile__empty-state-content > p {
-  margin: 0;
-}
-
-/* SAM - generated by ai below need to check design and change */
-.profile__action-button--empty:hover {
-  background: var(--color-primary, #7C4DFF);
-  border-color: var(--color-primary, #7C4DFF);
-  color: white;
-}
-
-.profile__add-more-content {
-  gap: var(--spacing-xxs, 0.3125rem);
-}
-
-.profile__add-more-icon {
-  width: var(--icon-xxxs, 0.75rem); /* 12px */
-  height: var(--icon-xxxs, 0.75rem); /* 12px */
-  line-height: 0;
-  flex: 0 0 auto;
-}
-
-.profile__add-more-icon svg {
-  width: 100%;
-  height: 100%;
-  display: block;
-}
-
-.skills__list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  align-items: flex-start;
-  gap: 0.5rem; /* 8px */
-}
-
-.skills__item {
-  gap: 0.2rem;
-}
-
-.skills__item-label {
-  color: var(--slate-900, #0F172B);
-  font-size: var(--font-size-sm, 0.875rem); /* 14px */
-  font-weight: var(--font-weight-md, 500);
-  line-height: 1.2;
-}
-
-.skills__remove-button {
-  border: none;
-  background: none;
-  cursor: pointer;
-  padding: 0;
-  margin: 0;
-  line-height: 1;
-}
-
-.languages__list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-
-.languages__item-label {
-  color: var(--gray-900, #101828);
-  font-size: var(--font-size-md, 1rem); /* 16px */
-  font-weight: var(--font-weight-md, 500);
-}
-
-.languages__empty-icon {
-  width: var(--icon-xs, 1.5rem); /* 24px new design uses this */
-  height: var(--icon-xs, 1.5rem); /* 24px new design uses this */
-  flex-shrink: 0;
-}
-/* Add-me-to-friends button style shared across profile sections. */
-.profile__btn-friends {
-  width: auto;
-  min-width: 0;
-  max-width: none;
-  padding: 0.375rem 0.75rem;
-  gap: var(--spacing-xxs, 0.3125rem);
-  border-radius: var(--border-radius-md, 0.5rem);
-  border: 1px solid var(--color-primary, #7C4DFF);
-  background: transparent;
-  color: var(--color-primary, #7C4DFF);
-}
-
-/* Text-style action button utility (used for section header/edit actions). */
-.profile-action-text {
-  width: auto;
-  min-width: 0;
-  max-width: none;
-  padding: var(--spacing-xxs, 0.3125rem);
-  border: none;
-  background: none;
-  color: var(--color-primary, #7C4DFF);
-  cursor: pointer;
-  font-size: var(--font-size-sm, 0.875rem);
-}
-
-.profile-action-text:hover {
-  text-decoration: underline;
-}
-
-.profile-section-collapsible {
-  display: block;
-}
-
-.profile-section-collapsible__header {
-  margin-bottom: 0;
-}
-
-.profile-section-collapsible__actions {
-  gap: var(--spacing-xs, 0.75rem);
-  margin-top: -0.25rem;
-}
-
-.profile-section-collapsible__edit-button {
-  min-width: 0;
-}
-
-.profile-section-collapsible__edit-icon {
-  display: none;
-}
-
-.profile-section-collapsible__actions > button.inline-flex-row {
-  display: none !important;
-  min-height: auto;
-  min-width: auto;
-  padding: var(--spacing-xxs, 0.3125rem);
-  border: none;
-  background: none;
-  color: var(--color-text, #1A1A1A);
-  cursor: pointer;
-}
-
-.profile-section-collapsible__chevron {
-  display: inline-block;
-  flex: 0 0 auto;
-  transition: transform var(--animation-duration, 0.2s) ease;
-}
-
-.profile-section-collapsible__content {
-  margin-top: var(--spacing-2xs, 0.625rem);
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  box-sizing: border-box;
-}
-
-.profile-section-collapsible__content > :first-child {
-  margin-top: 0;
-}
-
-.profile-section-collapsible__content > :last-child {
-  margin-bottom: 0;
-}
-
-.bioCard,
-.bioSection,
-.socialCard,
-.socialList,
-.skills__list,
-.languages__list,
-.contact-info__list {
-  width: 100%;
-  max-width: 100%;
-  min-width: 0;
-  box-sizing: border-box;
-}
-
-@media (min-width: 769px) {
-  .profile-section-collapsible > .profile-section-collapsible__content {
-    display: block;
-  }
-
-  .profile-section-collapsible__edit-label svg,
-  .profile__action-icon svg {
-    width: 0.875rem;
-    height: 0.875rem;
-  }
-
-  .profile-section-collapsible__edit-label svg path,
-  .profile__action-icon svg path {
-    fill: var(--color-primary, #7C4DFF);
-  }
-
-  .profile-section-collapsible__edit-label {
-    display: inline;
-    transform: translateY(-0.125rem);
-  }
-
-  .profile__add-more-icon {
-    transform: translateY(-0.125rem);
-  }
-
-  .profile-section-collapsible__edit-icon {
-    display: none;
-  }
-}
-
-@media (max-width: 576px) {
-  .profile-grid .profile__section-header h2,
-  .profile-grid .profile__section-header h3,
-  .profile-grid .profile__section-header h4,
-  .profile-grid .profile__empty-state-content > h2,
-  .profile-grid .cvSection h3,
-  .profile-grid .profile__name,
-  .profile-grid .friends-pane__header-name {
-    font-family: inherit !important;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions > .profile-section-collapsible__header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 0.5rem;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions > .profile-section-collapsible__header h2 {
-    margin: 0;
-    flex: 1 1 auto;
-    min-width: 0;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__actions {
-    display: inline-flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 0.25rem;
-    margin-top: 0;
-    flex: 0 0 auto;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
-    display: inline-flex !important;
-    order: 1;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:active,
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus,
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus-visible {
-    border: none !important;
-    outline: none !important;
-    box-shadow: none !important;
-    background: transparent !important;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__actions > button.inline-flex-row {
-    order: 2;
-  }
-
-  .profile__section-header h2,
-  .profile__section-header h3,
-  .profile__section-header h4 {
-    font-size: var(--font-size-lg, 1.125rem) !important;
-    line-height: 1.2 !important;
-  }
-
-  .profile-grid .profile__empty-state-content > h2,
-  .profile-grid .cvSection h3 {
-    font-size: var(--font-size-lg, 1.125rem) !important;
-    line-height: 1.2 !important;
-  }
-
-  .profile-grid .profile__name,
-  .profile-grid .friends-pane__header-name {
-    font-size: 1.5rem !important;
-    line-height: 1.15 !important;
-  }
-
-  .profile-grid .profile__pronouns,
-  .profile-grid .friends-pane__header-pronouns,
-  .profile-grid .friends-pane__friends-pronouns {
-    font-family: inherit !important;
-    font-size: 0.6875rem !important;
-    line-height: 1.1 !important;
-  }
-
-  .profile-section-collapsible[data-expanded="false"] .profile-section-collapsible__content {
-    display: none;
-  }
-
-  .profile-section-collapsible__actions.flex-column {
-    align-items: flex-end;
-    gap: 0.25rem;
-  }
-
-  /* Keep empty-section mobile header controls in the same order as regular sections: toggle first, add/edit below. */
-  .profile__section--empty .profile-section-collapsible__actions > button.inline-flex-row {
-    order: 1;
-  }
-
-  .profile__section--empty .profile-section-collapsible__actions > .profile-section-collapsible__edit-button {
-    order: 2;
-  }
-
-  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__chevron {
-    transform: rotate(180deg);
-  }
-
-  .profile-section-collapsible__edit-label {
-    display: none !important;
-  }
-
-  .profile-section-collapsible__edit-icon {
-    display: inline;
-  }
-
-  /* Empty-state action buttons use icon-only mobile controls (plus sign). */
-  .profile__section--empty .profile-section-collapsible__edit-label {
-    display: none !important;
-  }
-
-  .profile__section--empty .profile-section-collapsible__edit-icon {
-    display: inline !important;
-  }
-
-  .profile-section-collapsible .profile-section-collapsible__edit-button {
-    display: none !important;
-    order: 2;
-  }
-
-  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__edit-button {
-    display: inline-flex !important;
-  }
-  /* Reassert toggle button layout in collapsible action rows on mobile 
-  so utility resets never hide/misalign the control. */
-  .profile-section-collapsible__actions > button.inline-flex-row {
-    display: inline-flex !important;
-    align-items: center;
-    justify-content: center;
-  }
-
-  .profile-section-collapsible__edit-icon--add svg path {
-    fill: #1E2939 !important;
-    stroke: #1E2939 !important;
-  }
-
-  .profile-section-collapsible__edit-icon--projects svg path {
-    stroke-width: 1.714px !important;
-    stroke: var(--gray-800, #1E2939) !important;
-    fill: none !important;
-  }
-
-}
-
-@container profile-pane (max-width: 576px) {
-  .profile-grid .profile__section-header h2,
-  .profile-grid .profile__section-header h3,
-  .profile-grid .profile__section-header h4,
-  .profile-grid .profile__empty-state-content > h2,
-  .profile-grid .cvSection h3,
-  .profile-grid .profile__name,
-  .profile-grid .friends-pane__header-name {
-    font-family: inherit !important;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions > .profile-section-collapsible__header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 0.5rem;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions > .profile-section-collapsible__header h2 {
-    margin: 0;
-    flex: 1 1 auto;
-    min-width: 0;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__actions {
-    display: inline-flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 0.25rem;
-    margin-top: 0;
-    flex: 0 0 auto;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button {
-    order: 1;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:active,
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus,
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__edit-button:focus-visible {
-    border: none !important;
-    outline: none !important;
-    box-shadow: none !important;
-    background: transparent !important;
-  }
-
-  .profile-section-collapsible--inline-mobile-actions .profile-section-collapsible__actions > button.inline-flex-row {
-    order: 2;
-  }
-
-  .profile__section-header h2,
-  .profile__section-header h3,
-  .profile__section-header h4 {
-    font-size: var(--font-size-lg, 1.125rem) !important;
-    line-height: 1.2 !important;
-  }
-
-  .profile-grid .profile__empty-state-content > h2,
-  .profile-grid .cvSection h3 {
-    font-size: var(--font-size-lg, 1.125rem) !important;
-    line-height: 1.2 !important;
-  }
-
-  .profile-grid .profile__name,
-  .profile-grid .friends-pane__header-name {
-    font-size: 1.5rem !important;
-    line-height: 1.15 !important;
-  }
-
-  .profile-grid .profile__pronouns,
-  .profile-grid .friends-pane__header-pronouns,
-  .profile-grid .friends-pane__friends-pronouns {
-    font-family: inherit !important;
-    font-size: 0.6875rem !important;
-    line-height: 1.1 !important;
-  }
-
-  .profile-section-collapsible[data-expanded="false"] .profile-section-collapsible__content {
-    display: none;
-  }
-
-  .profile-section-collapsible__actions.flex-column {
-    align-items: flex-end;
-    gap: 0.25rem;
-  }
-
-  .profile__section--empty .profile-section-collapsible__actions > button.inline-flex-row {
-    order: 1;
-  }
-
-  .profile__section--empty .profile-section-collapsible__actions > .profile-section-collapsible__edit-button {
-    order: 2;
-  }
-
-  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__chevron {
-    transform: rotate(180deg);
-  }
-
-  .profile-section-collapsible__edit-label {
-    display: none !important;
-  }
-
-  .profile-section-collapsible__edit-icon {
-    display: inline;
-  }
-
-  .profile__section--empty .profile-section-collapsible__edit-label {
-    display: none !important;
-  }
-
-  .profile__section--empty .profile-section-collapsible__edit-icon {
-    display: inline !important;
-  }
-
-  .profile-section-collapsible .profile-section-collapsible__edit-button {
-    display: none !important;
-    order: 2;
-  }
-
-  .profile-section-collapsible[data-expanded="true"] .profile-section-collapsible__edit-button {
-    display: inline-flex !important;
-  }
-
-  .profile-section-collapsible__actions > button.inline-flex-row {
-    display: inline-flex !important;
-    align-items: center;
-    justify-content: center;
-  }
-
-  .profile-section-collapsible__edit-icon--add svg path {
-    fill: #1E2939 !important;
-    stroke: #1E2939 !important;
-  }
-
-  .profile-section-collapsible__edit-icon--projects svg path {
-    stroke-width: 1.714px !important;
-    stroke: var(--gray-800, #1E2939) !important;
-    fill: none !important;
-  }
-}
-
-/* Zebra Striping - used by FriendList, StuffCard tables */
-.zebra-stripe tr:nth-child(even),
-.zebra-stripe > *:nth-child(even) {
-  background-color: rgba(0, 0, 0, 0.02);
-}
-
diff --git a/src/texts.ts b/src/texts.ts
index 2557cce3..872b1d26 100644
--- a/src/texts.ts
+++ b/src/texts.ts
@@ -1,69 +1,6 @@
-// QR CODE
-export const scanQrToConnectText = 'Link to Profile'
-//ERRORS & SUCCESS
-//Same 'not logged in' error message like on 'Chat with me' button
-export const userNotLoggedInErrorMessage = 'Current user not found! Not logged in?'
-export const internalErrorMessage = 'An internal error occured!'
-export const friendWasAddedSuccesMessage = 'Friend was added!'
-
-//OTHER
-export const friendExistsMessage = 'Friend already exists'
-export const loadingMessage = 'Loading...'
-
-//BUTTONS
-export const addMeToYourFriendsButtonText = 'Add as friend'
-export const logInAddMeToYourFriendsButtonText = 'Log in to add as friend'
-export const logInToChatWithMeButtonText = 'Login to chat with me'
-export const friendExistsAlreadyButtonText = 'Already part of friends'
-export const chatWithMeButtonText = 'Chat with me'
-
-// Profile & Edit profile texts 
-export const yourContactInformationHeading = 'Your profile'
-export const otherPreferencesHeadingText = 'Other preferences'
-export const communitiesHeadingText = 'Your communities'
-export const resumeHeadingText = 'Resume'
-export const bioHeadingText = 'Bio'
-export const educationHeadingText = 'Education'
-export const skillsHeadingText = 'Skills'
-export const languagesHeadingText = 'Languages'
-export const projectsHeadingText = 'Projects & Communities'
-export const contactInfoHeadingText = 'More Contacts'
-export const contactInfoEmptyHeadingText = 'Contact Info'
-export const editSkillsDialogTitleText = 'Edit Skills'
-export const editLanguagesDialogTitleText = 'Edit Languages'
-export const editContactInfoDialogTitleText = 'Edit More Contacts'
-export const editResumeDialogTitleText = 'Edit Resume'
-export const editEducationDialogTitleText = 'Edit Education'
-export const editProjectsDialogTitleText = 'Edit Projects & Communities'
-export const editHeadingDialogTitleText = 'Edit Heading'
-export const editSocialDialogTitleText = 'Edit Social Accounts'
-export const editBioDialogTitleText = 'Edit Bio'
-export const dialogSubmitLabelText = 'Save Changes'
-export const dialogCancelLabelText = 'Cancel'
-export const pasteEntryButtonTitleText = 'Paste'
-export const deleteEntryButtonTitleText = 'Delete entry'
-export const ownerLoginRequiredDialogMessageText = 'You need to log in as the profile owner to save contact updates.'
-export const loginRequiredDialogTitleText = 'Login Required'
-export const saveFailedDialogTitleText = 'Save Failed'
-export const saveContactUpdatesFailedPrefixText = 'Could not save contact updates.'
-export const saveHeadingUpdatesFailedPrefixText = 'Could not save heading updates.'
-export const saveLanguageUpdatesFailedPrefixText = 'Could not save language updates.'
-export const saveResumeUpdatesFailedPrefixText = 'Could not save resume updates.'
-export const saveEducationUpdatesFailedPrefixText = 'Could not save education updates.'
-export const saveProjectsUpdatesFailedPrefixText = 'Could not save projects updates.'
-export const saveSocialUpdatesFailedPrefixText = 'Could not save social accounts updates.'
-export const saveBioUpdatesFailedPrefixText = 'Could not save bio updates.'
-export const mutationSaveContactInfoFailedPrefixText = 'Failed to save contact info:'
-export const mutationSaveLanguagesFailedPrefixText = 'Failed to save languages:'
-export const mutationSaveSkillsFailedPrefixText = 'Failed to save skills:'
-export const mutationSaveResumeFailedPrefixText = 'Failed to save resume:'
-export const mutationEducationFailedPrefixText = 'Failed to save education:'
-export const mutationBioFailedPrefixText = 'Failed to save bio:'
-export const resumeUpdateEntryNotFoundErrorMessageText = 'Could not find existing resume entry for update. Please reload profile data and try again.'
-export const bioUpdateEntryNotFoundErrorMessageText = 'Could not find existing bio entry for update. Please reload profile data and try again.'
-export const updaterUnsupportedStoreErrorMessageText = 'Store does not support updates'
-export const fallbackSaveUpdatesErrorMessageText = 'Failed to save updates'
-export const socialAccountsHeadingText = 'Follow me on'
-export const sharedItemsHeadingText = 'Shared items'
-export const friendsHeadingText = 'Friends'
-export const contactHeadingText = 'Contact'
\ No newline at end of file
+/* The text refactor was generated by AI Model: GPT-5.4-Copilot. */
+export * from './texts/buttonTexts'
+export * from './texts/dialogTexts'
+export * from './texts/messageTexts'
+export * from './texts/profileTexts'
+export * from './texts/qrCodeTexts'
\ No newline at end of file
diff --git a/src/texts/buttonTexts.ts b/src/texts/buttonTexts.ts
new file mode 100644
index 00000000..40b09675
--- /dev/null
+++ b/src/texts/buttonTexts.ts
@@ -0,0 +1,8 @@
+export const addMeToYourFriendsButtonText = 'Add as friend'
+export const logInAddMeToYourFriendsButtonText = 'Log in to add as friend'
+export const addMeToYourContactsButtonText = 'Add as Contact'
+export const logInAddMeToYourContactsButtonText = 'Login to add me to your contacts'
+export const logInToChatWithMeButtonText = 'Login to chat with me'
+export const friendExistsAlreadyButtonText = 'Already a friend'
+export const contactExistsAlreadyButtonText = 'Already part of contacts'
+export const contactExistsAlreadyByNameButtonText = 'Add webID to contact'
diff --git a/src/texts/dialogTexts.ts b/src/texts/dialogTexts.ts
new file mode 100644
index 00000000..d09dd97c
--- /dev/null
+++ b/src/texts/dialogTexts.ts
@@ -0,0 +1,13 @@
+export const editSkillsDialogTitleText = 'Edit Skills'
+export const editLanguagesDialogTitleText = 'Edit Languages'
+export const editContactInfoDialogTitleText = 'Edit More Contacts'
+export const editResumeDialogTitleText = 'Edit Resume'
+export const editEducationDialogTitleText = 'Edit Education'
+export const editProjectsDialogTitleText = 'Add Projects & Communities'
+export const editHeadingDialogTitleText = 'Edit Heading'
+export const editSocialDialogTitleText = 'Edit Social Links'
+export const editBioDialogTitleText = 'Edit Bio'
+export const dialogSubmitLabelText = 'Save Changes'
+export const dialogCancelLabelText = 'Cancel'
+export const pasteEntryButtonTitleText = 'Paste'
+export const deleteEntryButtonTitleText = 'Delete entry'
diff --git a/src/texts/messageTexts.ts b/src/texts/messageTexts.ts
new file mode 100644
index 00000000..f1a171c4
--- /dev/null
+++ b/src/texts/messageTexts.ts
@@ -0,0 +1,43 @@
+export const userNotLoggedInErrorMessage = 'Current user not found! Not logged in?'
+export const friendWasAddedSuccesMessage = 'Friend was added!'
+export const contactWasAddedSuccesMessage = 'Contact was added!'
+export const friendExistsMessage = 'Friend already exists'
+export const contactExistsMessage = 'Contact already exists'
+export const loadingMessage = 'Loading...'
+export const groupIsRequired = 'You need to either pick a group or enter one.'
+export const errorGroupCreation = 'Unable to create the group.'
+export const errorContactCreation = 'Unable to add the contact.'
+export const errorAddressBookCreation = 'Unable to create your address book.'
+export const errorReadingAddressBook = 'There was an error reading your address book.'
+export const errorLoadingContact = 'There was an error loading the contact: '
+export const errorGettingAddressBooks = 'There was an error getting your address books.'
+export const errorNotExistsAddressBookUri = 'Please enter an address book URI.'
+export const errorProcessingUriAddressBook = 'Unable to add your address book.'
+export const errorUnableToDetermineUserWorkspace = 'Unable to determine user workspace for new address book.'
+export const errorAddingContactWebIDToAddressBook = 'Contact webID was not saved.'
+export const ownerLoginRequiredDialogMessageText = 'You need to log in as the profile owner to save contact updates.'
+
+export const saveContactUpdatesFailedMessageText = 'Unable to save your contact information.'
+export const saveHeadingUpdatesFailedMessageText = 'Unable to save your heading information.'
+export const saveLanguageUpdatesFailedMessageText = 'Unable to save your languages.'
+export const saveSkillsUpdatesFailedMessageText = 'Unable to save your skills.'
+export const saveResumeUpdatesFailedMessageText = 'Unable to save your resume.'
+export const saveEducationUpdatesFailedMessageText = 'Unable to save your education history.'
+export const saveProjectsUpdatesFailedMessageText = 'Unable to save your project data.'
+export const unfollowProjectFailedMessageText = 'Unable to unfollow the project.'
+export const saveSocialUpdatesFailedMessageText = 'Unable to save your social accounts.'
+export const saveBioUpdatesFailedMessageText = 'Unable to save your bio.'
+
+export const bioMutationSaveFailedDebugText = 'Bio mutation save failed'
+export const addContactWebIdSaveFailedDebugText = 'Add contact WebID save failed'
+export const contactInfoMutationSaveFailedDebugText = 'Contact info mutation save failed'
+export const educationMutationSaveFailedDebugText = 'Education mutation save failed'
+export const headingMutationSaveFailedDebugText = 'Heading mutation save failed'
+export const languageMutationSaveFailedDebugText = 'Language mutation save failed'
+export const projectsMutationSaveFailedDebugText = 'Projects mutation save failed'
+export const resumeMutationSaveFailedDebugText = 'Resume mutation save failed'
+export const skillsMutationSaveFailedDebugText = 'Skills mutation save failed'
+export const socialMutationSaveFailedDebugText = 'Social mutation save failed'
+export const resumeUpdateEntryNotFoundErrorMessageText = 'Could not find existing resume entry for update. Please reload profile data and try again.'
+export const updaterUnsupportedStoreErrorMessageText = 'Store does not support updates'
+export const fallbackSaveUpdatesErrorMessageText = 'Failed to save updates'
diff --git a/src/texts/profileTexts.ts b/src/texts/profileTexts.ts
new file mode 100644
index 00000000..b79a42d1
--- /dev/null
+++ b/src/texts/profileTexts.ts
@@ -0,0 +1,13 @@
+export const yourContactInformationHeading = 'Your profile'
+export const otherPreferencesHeadingText = 'Other preferences'
+export const communitiesHeadingText = 'Your communities'
+export const resumeHeadingText = 'Resume'
+export const bioHeadingText = 'Bio'
+export const educationHeadingText = 'Education'
+export const skillsHeadingText = 'Skills'
+export const languagesHeadingText = 'Languages'
+export const projectsHeadingText = 'Projects & Communities'
+export const contactInfoHeadingText = 'More Contacts'
+export const contactInfoEmptyHeadingText = 'Contact Info'
+export const socialAccountsHeadingText = 'Follow me on'
+export const friendsHeadingText = 'Friends'
diff --git a/src/texts/qrCodeTexts.ts b/src/texts/qrCodeTexts.ts
new file mode 100644
index 00000000..bebf3b58
--- /dev/null
+++ b/src/texts/qrCodeTexts.ts
@@ -0,0 +1 @@
+export const scanQrToConnectText = 'Add to Contacts'
diff --git a/src/ui/dialog.css b/src/ui/dialog.css
new file mode 100644
index 00000000..7d8276d4
--- /dev/null
+++ b/src/ui/dialog.css
@@ -0,0 +1,233 @@
+@import './dialog.responsive.css';
+
+/* CSS for the accessible modal dialogs created by dialog.ts */
+/* dialog host */
+#profile-modal {
+  --profile-modal-backdrop: var(--overlay-bg-muted, rgba(0, 0, 0, 0.5));
+  --profile-modal-panel-inline-padding: var(--spacing-lg, 1.5625rem);
+  --profile-modal-panel-block-padding: var(--spacing-md, 1.25rem);
+  --profile-modal-compact-padding: var(--spacing-sm, 0.9375rem);
+  --profile-modal-button-gap: var(--spacing-sm, 0.938rem);
+  --profile-modal-error-padding: var(--spacing-xs, 0.75rem);
+  --profile-modal-panel-width: min(37.5rem, calc(100vw - 2rem));
+  --profile-modal-panel-max-width: 37.5rem;
+  --profile-modal-panel-max-height: calc(100dvh - 2rem);
+  margin: 0;
+  padding: 0;
+  border: none;
+  background: var(--profile-modal-backdrop);
+  max-width: none;
+  max-height: none;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  position: fixed;
+  inset: 0;
+  display: grid;
+  place-items: center;
+  padding-top: env(safe-area-inset-top);
+  padding-right: 0;
+  padding-bottom: max(var(--spacing-lg, 1.5625rem), env(safe-area-inset-bottom));
+  padding-left: 0;
+  z-index: 9999;
+}
+
+#profile-modal:not([open]) {
+  display: none;
+}
+
+#profile-modal::backdrop {
+  background: var(--profile-modal-backdrop);
+}
+
+#profile-modal .modal {
+  box-sizing: border-box;
+  position: relative;
+  display: grid;
+  grid-template-rows: auto minmax(0, 1fr) auto auto;
+  margin: 0;
+  background: var(--color-background);
+  border-radius: var(--border-radius-base);
+  max-width: var(--profile-modal-panel-max-width);
+  width: var(--profile-modal-panel-width);
+  max-height: var(--profile-modal-panel-max-height);
+  overflow: hidden;
+  box-shadow: var(--box-shadow-modal, 0 2px 10px rgba(0, 0, 0, 0.3));
+  align-self: center;
+}
+
+#profile-modal .modal .modal-header {
+  gap: var(--spacing-lg);
+  width: 100%;
+  min-width: 0;
+  padding: var(--profile-modal-panel-block-padding) var(--profile-modal-panel-inline-padding); 
+  box-sizing: border-box;
+  border-radius: var(--border-radius-base, 0.3125rem) var(--border-radius-base, 0.3125rem) 0 0;
+  border-bottom: var(--border-width-sm, 0.1rem) solid var(--color-border-lighter, var(--slate-200, #E2E8F0));
+  background: var(--color-surface-overlay-header, var(--slate-50, #F8FAFC));
+}
+
+#profile-modal .modal #modal-desc {
+  min-height: 0;
+  overflow: auto;
+  width: 100%;
+  min-width: 0;
+  padding: var(--profile-modal-panel-inline-padding);
+  box-sizing: border-box;
+}
+
+#profile-modal .modal #modal-desc:has(> .profile__edit-form--projects) {
+  padding: var(--spacing-2xs, 0.625rem) var(--profile-modal-panel-inline-padding);
+}
+
+#profile-modal .modal #modal-desc:has(> #contacts-addressbook-picker-dialog) {
+  padding-top: 0;
+}
+
+#profile-modal #modal-desc > .profile__edit-form--projects {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-2xs, 0.625rem);
+}
+
+#profile-modal .modal #modal-title {
+  margin: 0;
+  color: var(--color-text-subheading, var(--gray-900, #101828));
+}
+
+#profile-modal .modal #modal-header-action > solid-ui-button[aria-label="Close dialog"] {
+  --button-height-sm: var(--icon-base, 2rem);
+  --button-width-sm: var(--icon-base, 2rem);
+  --button-padding-sm: 0;
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-text: var(--color-text);
+  --button-border-radius: 999px;
+  --button-box-shadow: none;
+  --button-hover-background: rgba(0, 0, 0, 0.04);
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary);
+  --button-hover-box-shadow: none;
+  --button-active-box-shadow: none;
+  --button-active-transform: none;
+  --button-icon-size-sm: var(--icon-xxs, 1rem);
+}
+
+#profile-modal .modal #modal-header-action > solid-ui-button[aria-label="Close dialog"]:hover {
+  --button-hover-background: rgba(0, 0, 0, 0.04);
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary);
+}
+
+#profile-modal .modal #modal-header-action > solid-ui-button[aria-label="Close dialog"]:focus-visible::part(button) {
+  outline: var(--focus-indicator-width) solid var(--color-primary);
+  outline-offset: var(--outline-offset-sm);
+  box-shadow: var(--box-shadow-focus-accessible, 0 0 0 var(--focus-ring-width) var(--color-background), 0 0 0 calc(var(--focus-ring-width) + var(--focus-indicator-width)) var(--color-primary-alpha));
+}
+
+#profile-modal .modal:has(#modal-desc > .profile__edit-form--projects) #modal-header-action,
+#profile-modal .modal:has(#modal-desc > .profile__edit-form--contact-info) #modal-header-action {
+  display: none;
+}
+
+#profile-modal .modal solid-ui-button.modal__header-action-button {
+  --button-height-sm: 0;
+  --button-padding-sm: var(--spacing-xxs);
+  --button-background: transparent;
+  --button-border-width: 0;
+  --button-border: transparent;
+  --button-font-weight: var(--font-weight-md, 500);
+  --button-text: var(--color-primary);
+  --button-hover-background: transparent;
+  --button-hover-border: transparent;
+  --button-hover-text: var(--color-primary);
+}
+
+#profile-modal .modal solid-ui-button.modal__header-action-button:hover::part(button) {
+  text-decoration: underline;
+}
+
+/* button container: center buttons horizontally (uses id in markup) */
+#profile-modal #modal-buttons {
+  width: 100%;
+  min-width: 0;
+  padding: var(--profile-modal-panel-block-padding) calc(var(--profile-modal-panel-inline-padding) + var(--spacing-xxs, 0.3125rem)) var(--profile-modal-compact-padding);
+  gap: var(--profile-modal-button-gap);
+  align-self: stretch;
+  box-sizing: border-box;
+  border-top: var(--border-width-sm, 0.1rem) solid var(--color-border-lighter, var(--slate-200, #E2E8F0));
+  background: var(--color-surface-tertiary, var(--gray-50, #F9FAFB));
+}
+
+#profile-modal #modal-buttons[hidden] {
+  display: none !important;
+}
+
+#profile-modal #modal-buttons > solid-ui-button {
+  width: 10.8rem;
+}
+
+#profile-modal #modal-buttons solid-ui-button[data-dialog-primary='true'] {
+  --button-font-size-md: var(--font-size-md, 1rem);
+}
+
+#profile-modal #modal-buttons solid-ui-button[data-cancel='true'] {
+  --button-font-weight: var(--font-weight-normal, normal);
+  --button-text: var(--dialog-cancel-button-text, var(--gray-800, #1E2939));
+  --button-border: var(--dialog-cancel-button-border, var(--gray-300, #D1D5DC));
+  --button-background: var(--dialog-cancel-button-background, transparent);
+  --button-hover-background: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+  --button-hover-border: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+  --button-hover-text: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+  --button-font-size-md: var(--font-size-md, 1rem);
+}
+
+#profile-modal #modal-buttons solid-ui-button[data-cancel='true']:hover::part(button),
+#profile-modal #modal-buttons solid-ui-button[data-cancel='true']:focus-visible::part(button),
+#profile-modal #modal-buttons solid-ui-button[data-cancel='true']:focus-within::part(button) {
+  background: var(--dialog-cancel-button-hover-background, var(--blue-900, #083575));
+  border-color: var(--dialog-cancel-button-hover-border, var(--blue-900, #083575));
+  color: var(--dialog-cancel-button-hover-text, var(--color-text-on-action, var(--white, #FFF)));
+}
+
+#profile-modal .modal__error-section {
+  margin-top: var(--spacing-sm);
+  margin-bottom: 0;
+  padding: var(--profile-modal-error-padding);
+  border: 1px solid var(--dialog-error-border, var(--pink-700, #ff98b3));
+  border-radius: var(--border-radius-base);
+  background: var(--dialog-error-background, var(--pink-500, #ffdde6));
+  color: var(--dialog-error-text, var(--red-600, #B00020));
+  text-align: center;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+#profile-modal .modal__error-section[hidden] {
+  display: none !important;
+}
+
+#profile-modal #modal-saving-overlay {
+  position: absolute;
+  inset: 0;
+  display: grid;
+  place-items: center;
+  background: rgba(255, 255, 255, 0.78);
+  z-index: 10;
+}
+
+#profile-modal #modal-saving-overlay[hidden] {
+  display: none;
+}
+
+#profile-modal.modal--saving #modal-desc {
+  opacity: 0.45;
+  pointer-events: none;
+}
+
+#profile-modal .modal__saving-indicator {
+  gap: 0;
+}
+
+
diff --git a/src/ui/dialog.responsive.css b/src/ui/dialog.responsive.css
new file mode 100644
index 00000000..86fd8802
--- /dev/null
+++ b/src/ui/dialog.responsive.css
@@ -0,0 +1,206 @@
+/* Responsive dialog rules and mobile-affecting overrides live separately from the base modal layout. */
+
+#profile-modal .modal:has(.profile-edit-dialog__social-account-select[popup-open]) #modal-desc,
+#profile-modal .modal:has(#modal-desc > .profile__edit-form solid-ui-combobox:focus-within) #modal-desc {
+  padding-bottom: calc(var(--profile-modal-panel-inline-padding) + 1.875rem);
+}
+
+/* Keep text-style actions in section headers while preserving footer button styling. */
+#profile-modal .modal .profile__section-header .profile__action-button,
+#profile-modal .modal .profile__section-header solid-ui-button.profile__action-button::part(button) {
+  min-height: auto;
+  padding: var(--spacing-xxs);
+  border: none;
+  background: none;
+  color: var(--color-primary);
+  font-weight: var(--font-weight-md, 500);
+}
+
+#profile-modal .modal .profile__section-header .profile__action-button:hover,
+#profile-modal .modal .profile__section-header solid-ui-button.profile__action-button:hover::part(button) {
+  text-decoration: underline;
+}
+
+@media (max-width: 576px) {
+  #profile-modal {
+    --profile-modal-panel-max-height: calc(100dvh - 4 * var(--spacing-sm));
+    padding-top: env(safe-area-inset-top);
+    padding-right: 0;
+    padding-bottom: max(var(--spacing-sm), env(safe-area-inset-bottom));
+    padding-left: 0;
+    place-items: start center;
+  }
+
+  #profile-modal .modal {
+    min-width: 0;
+    padding: 0;
+    border-radius: calc(var(--border-radius-base) * 0.75);
+    overscroll-behavior: contain;
+    justify-self: center;
+    align-self: start;
+    margin: 0 auto;
+  }
+
+  #profile-modal .modal .modal-header {
+    gap: var(--spacing-lg, 1.5625rem);
+    padding: var(--spacing-sm, 0.938rem);
+  }
+
+  #profile-modal .modal #modal-title {
+    font-size: var(--font-size-lg, 1.125rem);
+    line-height: var(--line-height-tight, 1.4);
+  }
+
+  #profile-modal .modal #modal-desc {
+    padding: var(--spacing-sm, 0.938rem) var(--spacing-sm, 0.938rem) var(--spacing-lg, 1.5625rem);
+  }
+
+  #profile-modal .modal #modal-desc:has(> .profile__edit-form--projects) {
+    padding: var(--spacing-sm, 0.938rem) var(--spacing-sm, 0.938rem) var(--spacing-lg, 1.5625rem);
+  }
+
+  #profile-modal #modal-desc > .profile__edit-form--bio {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-md, 1.25rem);
+  }
+
+  #profile-modal #modal-buttons {
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-end;
+    gap: var(--profile-modal-button-gap);
+    padding: var(--profile-modal-compact-padding);
+    width: 100%;
+  }
+
+  #profile-modal #modal-buttons > solid-ui-button {
+    flex: 1 0 0;
+    width: auto;
+    min-width: 0;
+    --button-font-size-md: var(--font-size-md, 1rem);
+  }
+}
+
+html[data-layout='mobile'] #profile-modal {
+  --profile-modal-panel-max-height: calc(100dvh - 4 * var(--spacing-sm));
+  padding-top: env(safe-area-inset-top);
+  padding-right: 0;
+  padding-bottom: max(var(--spacing-sm), env(safe-area-inset-bottom));
+  padding-left: 0;
+  place-items: start center;
+}
+
+html[data-layout='mobile'] #profile-modal .modal {
+  width: 100%;
+  height: auto;
+  max-height: var(--profile-modal-panel-max-height);
+  min-width: 0;
+  padding: 0;
+  border-radius: 0;
+  overscroll-behavior: contain;
+  justify-self: center;
+  align-self: start;
+  margin: 0 auto;
+}
+
+html[data-layout='mobile'] #profile-modal .modal .modal-header {
+  gap: var(--spacing-lg, 1.5625rem);
+  padding: var(--spacing-sm, 0.938rem);
+}
+
+html[data-layout='mobile'] #profile-modal .modal #modal-title {
+  font-size: var(--font-size-lg, 1.125rem);
+  line-height: var(--line-height-tight, 1.4);
+}
+
+html[data-layout='mobile'] #profile-modal .modal #modal-desc {
+  padding: var(--spacing-sm, 0.938rem) var(--spacing-sm, 0.938rem) var(--spacing-lg, 1.5625rem);
+}
+
+html[data-layout='mobile'] #profile-modal .modal #modal-desc:has(> .profile__edit-form--projects) {
+  padding: var(--spacing-sm, 0.938rem) var(--spacing-sm, 0.938rem) var(--spacing-lg, 1.5625rem);
+}
+
+html[data-layout='mobile'] #profile-modal #modal-desc > .profile__edit-form--bio {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md, 1.25rem);
+}
+
+html[data-layout='mobile'] #profile-modal #modal-buttons {
+  flex-direction: row;
+  align-items: center;
+  justify-content: flex-end;
+  gap: var(--profile-modal-button-gap);
+  padding: var(--profile-modal-compact-padding);
+  width: 100%;
+}
+
+html[data-layout='mobile'] #profile-modal #modal-buttons > solid-ui-button {
+  flex: 1 0 0;
+  width: auto;
+  min-width: 0;
+  --button-font-size-md: var(--font-size-md, 1rem);
+}
+
+@container profile-pane (max-width: 576px) {
+  #profile-modal {
+    --profile-modal-panel-max-height: calc(100dvh - 4 * var(--spacing-sm));
+    padding-top: env(safe-area-inset-top);
+    padding-right: 0;
+    padding-bottom: max(var(--spacing-sm), env(safe-area-inset-bottom));
+    padding-left: 0;
+    place-items: start center;
+  }
+
+  #profile-modal .modal {
+    min-width: 0;
+    padding: 0;
+    border-radius: calc(var(--border-radius-base) * 0.75);
+    overscroll-behavior: contain;
+    justify-self: center;
+    align-self: start;
+    margin: 0 auto;
+  }
+
+  #profile-modal .modal .modal-header {
+    gap: var(--spacing-lg, 1.5625rem);
+    padding: var(--spacing-sm, 0.938rem);
+  }
+
+  #profile-modal .modal #modal-title {
+    font-size: var(--font-size-lg, 1.125rem);
+    line-height: var(--line-height-tight, 1.4);
+  }
+
+  #profile-modal .modal #modal-desc {
+    padding: var(--spacing-sm, 0.938rem) var(--spacing-sm, 0.938rem) var(--spacing-lg, 1.5625rem);
+  }
+
+  #profile-modal .modal #modal-desc:has(> .profile__edit-form--projects) {
+    padding: var(--spacing-sm, 0.938rem) var(--spacing-sm, 0.938rem) var(--spacing-lg, 1.5625rem);
+  }
+
+  #profile-modal #modal-desc > .profile__edit-form--bio {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacing-md, 1.25rem);
+  }
+
+  #profile-modal #modal-buttons {
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-end;
+    gap: var(--profile-modal-button-gap);
+    padding: var(--profile-modal-compact-padding);
+    width: 100%;
+  }
+
+  #profile-modal #modal-buttons > solid-ui-button {
+    flex: 1 0 0;
+    width: auto;
+    min-width: 0;
+    --button-font-size-md: var(--font-size-md, 1rem);
+  }
+}
\ No newline at end of file
diff --git a/src/ui/dialog.ts b/src/ui/dialog.ts
index a735b9db..4c0bca45 100644
--- a/src/ui/dialog.ts
+++ b/src/ui/dialog.ts
@@ -1,12 +1,19 @@
-import '../styles/dialog.css'
-import { render } from 'lit-html'
+import './dialog.css'
+import 'solid-ui/components/actions/button'
+import { html, render } from 'lit-html'
 import { closeIcon } from '../icons-svg/profileIcons'
+import { createSpinner } from './spinner'
+import { formatDisplayError } from '../utils/errorDisplay'
 
 /* Copied from issue-pane, minor typescript adjustments */
 /* Changed modal from div to dialog element */
 let modalDialog: HTMLDialogElement | null = null
 let previousFocus: Element | null = null
 
+function getDialogMountTarget(dom: Document): HTMLElement {
+  return (dom.querySelector('.profile-pane-root') as HTMLElement | null) || dom.body
+}
+
 type DialogButtonValue = boolean | 'save' | null
 type DialogButton = {
   label: string,
@@ -33,14 +40,74 @@ type DialogElements = {
   headerAction: HTMLDivElement,
   description: HTMLDivElement,
   error: HTMLElement,
-  buttons: HTMLDivElement
+  buttons: HTMLDivElement,
+  savingOverlay: HTMLDivElement
+}
+
+type DialogActionControl = HTMLElement & {
+  disabled?: boolean,
+  label?: string,
+  click: () => void,
+  shadowRoot?: ShadowRoot | null
+}
+
+function isSolidUiButton(control: Element | null): control is DialogActionControl {
+  return control?.tagName === 'SOLID-UI-BUTTON'
+}
+
+function focusDialogAction(control: Element | null): void {
+  if (!control) return
+
+  if (isSolidUiButton(control)) {
+    const innerButton = control.shadowRoot?.querySelector('button') as HTMLButtonElement | null
+    innerButton?.focus()
+    return
+  }
+
+  if (control instanceof HTMLElement) {
+    control.focus()
+  }
+}
+
+function setDialogActionDisabled(control: DialogActionControl | null, disabled: boolean): void {
+  if (!control) return
+  control.disabled = disabled
+  control.toggleAttribute('disabled', disabled)
+}
+
+function setDialogActionLabel(control: DialogActionControl | null, label: string): void {
+  if (!control) return
+
+  if (isSolidUiButton(control)) {
+    control.label = label
+    control.setAttribute('label', label)
+    control.textContent = label
+    return
+  }
+
+  ;(control as HTMLElement).textContent = label
+}
+
+export function getSharedDialogSaveButton(root: ParentNode): DialogActionControl | null {
+  return root.querySelector('#modal-buttons [data-dialog-primary="true"]') as DialogActionControl | null
+}
+
+export function getSharedDialogCancelButton(root: ParentNode): DialogActionControl | null {
+  return root.querySelector('#modal-buttons [data-cancel="true"]') as DialogActionControl | null
 }
 
 function ensureModalDialog (dom: Document): HTMLDialogElement {
+  const mountTarget = getDialogMountTarget(dom)
+
   // if we previously created a dialog but it was removed from the document
   // (tests clear body), rebuild it. Checking presence ensures our reference
   // doesn't point at a detached element.
-  if (modalDialog && dom.body.contains(modalDialog)) return modalDialog
+  if (modalDialog && dom.body.contains(modalDialog)) {
+    if (modalDialog.parentElement !== mountTarget) {
+      mountTarget.appendChild(modalDialog)
+    }
+    return modalDialog
+  }
 
   modalDialog = null
   modalDialog = dom.createElement('dialog')
@@ -51,17 +118,18 @@ function ensureModalDialog (dom: Document): HTMLDialogElement {
 
   modalDialog.innerHTML = `
     <div class="modal">
-      <div class="modal-header">
+      <div class="modal-header flex-row align-center justify-between">
         <h2 id="modal-title"></h2>
-        <div id="modal-header-action"></div>
+        <div id="modal-header-action" class="flex-row align-center"></div>
       </div>
       <div id="modal-desc"></div>
-      <section id="modal-error" class="modal__error-section" aria-live="assertive" role="alert" hidden></section>
-      <div id="modal-buttons"></div>
+      <section id="modal-error" class="modal__error-section" aria-live="assertive" aria-atomic="true" aria-hidden="true" role="alert" tabindex="-1" hidden></section>
+      <div id="modal-buttons" class="flex-row align-center justify-end"></div>
+      <div id="modal-saving-overlay" hidden></div>
     </div>
   `
 
-  dom.body.appendChild(modalDialog)
+  mountTarget.appendChild(modalDialog)
   return modalDialog
 }
 
@@ -72,18 +140,24 @@ function getDialogElements (dialog: HTMLDialogElement): DialogElements {
     headerAction: dialog.querySelector('#modal-header-action') as HTMLDivElement,
     description: dialog.querySelector('#modal-desc') as HTMLDivElement,
     error: dialog.querySelector('#modal-error') as HTMLElement,
-    buttons: dialog.querySelector('#modal-buttons') as HTMLDivElement
+    buttons: dialog.querySelector('#modal-buttons') as HTMLDivElement,
+    savingOverlay: dialog.querySelector('#modal-saving-overlay') as HTMLDivElement
   }
 }
 
 function clearModalError(elements: DialogElements): void {
   elements.error.textContent = ''
+  elements.error.setAttribute('aria-hidden', 'true')
   elements.error.hidden = true
 }
 
-function setModalError(elements: DialogElements, message: string): void {
-  elements.error.textContent = message
+function setModalError(elements: DialogElements, error: unknown, fallbackMessage?: string): void {
+  elements.error.textContent = formatDisplayError(error, fallbackMessage)
+  elements.error.setAttribute('aria-hidden', 'false')
   elements.error.hidden = false
+  if (elements.error instanceof HTMLElement) {
+    elements.error.focus()
+  }
 }
 
 function openDialogElement (dialog: HTMLDialogElement): void {
@@ -108,9 +182,23 @@ function closeDialogElement (dialog: HTMLDialogElement): void {
   dialog.removeAttribute('open')
 }
 
+function getInitialFocusTarget(element: HTMLElement): HTMLElement {
+  if (element.tagName === 'SOLID-UI-COMBOBOX') {
+    const input = element.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    if (input) return input
+  }
+
+  if (element.tagName === 'SOLID-UI-SELECT') {
+    const button = element.shadowRoot?.querySelector('button') as HTMLButtonElement | null
+    if (button) return button
+  }
+
+  return element
+}
+
 function findInitialContentFocusTarget(container: ParentNode): HTMLElement | null {
   const focusable = Array.from(
-    container.querySelectorAll('input, select, textarea, [contenteditable="true"], [tabindex]:not([tabindex="-1"])')
+    container.querySelectorAll('input, select, textarea, solid-ui-select, solid-ui-combobox, [contenteditable="true"], [tabindex]:not([tabindex="-1"])')
   ) as HTMLElement[]
 
   for (const el of focusable) {
@@ -125,15 +213,22 @@ function findInitialContentFocusTarget(container: ParentNode): HTMLElement | nul
 function focusInitialDialogTarget (description: HTMLDivElement, buttons: HTMLDivElement): void {
   const initialInput = findInitialContentFocusTarget(description)
   if (initialInput) {
-    initialInput.focus()
-    if (initialInput instanceof HTMLInputElement || initialInput instanceof HTMLTextAreaElement) {
-      initialInput.select()
+    const focusTarget = getInitialFocusTarget(initialInput)
+    focusTarget.focus()
+    if (focusTarget instanceof HTMLInputElement || focusTarget instanceof HTMLTextAreaElement) {
+      focusTarget.setSelectionRange(0, 0)
+      focusTarget.scrollLeft = 0
+      focusTarget.scrollTop = 0
+      requestAnimationFrame(() => {
+        focusTarget.scrollLeft = 0
+        focusTarget.scrollTop = 0
+      })
     }
     return
   }
 
-  const firstButton = buttons.querySelector('button') as HTMLButtonElement | null
-  if (firstButton) firstButton.focus()
+  const firstButton = buttons.querySelector('solid-ui-button, button') as HTMLElement | null
+  focusDialogAction(firstButton)
 }
 
 function collectFormValues (form: HTMLFormElement): InputDialogValues {
@@ -182,7 +277,7 @@ function openModal ({
     }
 
     const requestCancel = () => {
-      const cancelBtn = dialog.querySelector('button[data-cancel]') as HTMLButtonElement | null
+      const cancelBtn = getSharedDialogCancelButton(dialog)
       if (cancelBtn) {
         cancelBtn.click()
         return
@@ -199,17 +294,25 @@ function openModal ({
     elements.headerAction.innerHTML = ''
     const resolvedHeaderAction = headerAction || { type: 'close' as const }
     if (resolvedHeaderAction.type === 'close') {
-      const closeButton = dom.createElement('button')
+      const closeButton = dom.createElement('solid-ui-button') as DialogActionControl
       closeButton.setAttribute('type', 'button')
+      closeButton.setAttribute('variant', 'icon')
+      closeButton.setAttribute('size', 'sm')
       closeButton.setAttribute('aria-label', 'Close dialog')
-      render(closeIcon, closeButton)
+      const iconSlot = dom.createElement('span')
+      iconSlot.setAttribute('slot', 'icon')
+      render(closeIcon, iconSlot)
+      closeButton.appendChild(iconSlot)
       closeButton.onclick = () => requestCancel()
       elements.headerAction.appendChild(closeButton)
     } else if (resolvedHeaderAction.type === 'button') {
-      const actionButton = dom.createElement('button')
+      const actionButton = dom.createElement('solid-ui-button') as DialogActionControl
       actionButton.setAttribute('type', 'button')
+      actionButton.setAttribute('variant', 'secondary')
+      actionButton.setAttribute('size', 'sm')
       actionButton.className = resolvedHeaderAction.className || 'modal__header-action-button profile__action-button profile-action-text flex-center'
       actionButton.textContent = resolvedHeaderAction.label
+      actionButton.setAttribute('label', resolvedHeaderAction.label)
       actionButton.setAttribute('aria-label', resolvedHeaderAction.ariaLabel || resolvedHeaderAction.label)
       actionButton.onclick = async () => {
         if (resolvedHeaderAction.onClick) {
@@ -220,12 +323,16 @@ function openModal ({
     }
 
     buttons.forEach((btn) => {
-      const b = dom.createElement('button')
+      const b = dom.createElement('solid-ui-button') as DialogActionControl
       b.setAttribute('type', 'button')
+      b.setAttribute('label', btn.label)
+      b.setAttribute('size', 'md')
+      b.setAttribute('variant', btn.primary ? 'primary' : 'secondary')
       b.textContent = btn.label
-      if (btn.primary) b.classList.add('btn-primary')
+      if (btn.primary) {
+        b.setAttribute('data-dialog-primary', 'true')
+      }
       if (btn.cancel) {
-        b.classList.add('btn-light')
         b.setAttribute('data-cancel', 'true')
       }
       b.addEventListener('click', async () => {
@@ -252,6 +359,10 @@ function closeModal (_result: DialogButtonValue): void {
   }
 }
 
+export function closeSharedDialog(): void {
+  closeModal(null)
+}
+
 export function alertDialog (message: string, title = 'Information', dom: Document) {
   return openModal({
     title,
@@ -261,6 +372,49 @@ export function alertDialog (message: string, title = 'Information', dom: Docume
   })
 }
 
+function updateSavingUI (dialog: HTMLDialogElement, submitLabel: string, isSaving: boolean) {
+  const elements = getDialogElements(dialog)
+  const saveButton = getSharedDialogSaveButton(dialog)
+  const cancelButton = getSharedDialogCancelButton(dialog)
+
+  dialog.classList.toggle('modal--saving', isSaving)
+  dialog.setAttribute('aria-busy', String(isSaving))
+  elements.description.toggleAttribute('inert', isSaving)
+
+  if (isSaving) {
+    const activeElement = dialog.ownerDocument.activeElement as HTMLElement | null
+    if (activeElement && dialog.contains(activeElement)) {
+      activeElement.blur()
+    }
+  }
+
+  if (saveButton) {
+    setDialogActionDisabled(saveButton, isSaving)
+    saveButton.setAttribute('aria-busy', String(isSaving))
+    setDialogActionLabel(saveButton, submitLabel)
+  }
+
+  if (cancelButton) {
+    setDialogActionDisabled(cancelButton, isSaving)
+  }
+
+  elements.savingOverlay.hidden = !isSaving
+  if (isSaving) {
+    render(html`
+      <div class="modal__saving-indicator inline-flex-row justify-center" aria-live="polite" aria-label="Saving changes">
+        ${createSpinner()}
+      </div>
+    `, elements.savingOverlay)
+  } else {
+    render(html``, elements.savingOverlay)
+  }
+}
+
+export function setSharedDialogSavingState (dom: Document, isSaving: boolean, submitLabel = 'Saving Changes'): void {
+  const dialog = ensureModalDialog(dom)
+  updateSavingUI(dialog, submitLabel, isSaving)
+}
+
 type OpenInputDialogCustom = {
   title: string,
   dom: Document,
@@ -268,6 +422,9 @@ type OpenInputDialogCustom = {
   submitLabel?: string,
   cancelLabel?: string,
   headerAction?: DialogHeaderAction,
+  hideFooterButtons?: boolean,
+  onOpen?: () => void,
+  shouldCloseWithoutSave?: () => Promise<boolean> | boolean,
   validate?: () => Promise<string | null> | string | null,
   onSave?: () => Promise<void> | void,
   formatSaveError?: (error: unknown) => string
@@ -291,13 +448,13 @@ export function openInputDialog (options: OpenInputDialogCustom): Promise<InputD
 
   const handleSubmit = (event: SubmitEvent) => {
     event.preventDefault()
-    const saveButton = dialog.querySelector('#modal-buttons .btn-primary') as HTMLButtonElement | null
+    const saveButton = getSharedDialogSaveButton(dialog)
     saveButton?.click()
   }
 
   options.form.addEventListener('submit', handleSubmit)
 
-  return openModal({
+  const dialogPromise = openModal({
     title: options.title,
     message: options.form,
     headerAction: options.headerAction,
@@ -310,6 +467,10 @@ export function openInputDialog (options: OpenInputDialogCustom): Promise<InputD
         beforeClose: async () => {
           clearModalError(elements)
 
+          if (options.shouldCloseWithoutSave && await options.shouldCloseWithoutSave()) {
+            return true
+          }
+
           if (options.validate) {
             const validationMessage = await options.validate()
             if (validationMessage) {
@@ -321,12 +482,14 @@ export function openInputDialog (options: OpenInputDialogCustom): Promise<InputD
           if (!options.onSave) return true
 
           try {
+            updateSavingUI(dialog, submitLabel, true)
+
             await options.onSave()
             return true
           } catch (error) {
-            const fallback = error instanceof Error ? error.message : String(error)
-            const message = options.formatSaveError ? options.formatSaveError(error) : fallback
-            setModalError(elements, message)
+            updateSavingUI(dialog, submitLabel, false)
+            const fallback = options.formatSaveError ? options.formatSaveError(error) : undefined
+            setModalError(elements, error, fallback)
             return false
           }
         }
@@ -334,11 +497,25 @@ export function openInputDialog (options: OpenInputDialogCustom): Promise<InputD
     ],
     dom: options.dom
   })
+
+  const scheduleOpenCallback = options.dom.defaultView?.requestAnimationFrame
+    ? (callback: () => void) => options.dom.defaultView?.requestAnimationFrame(() => callback())
+    : (callback: () => void) => setTimeout(callback, 0)
+
+  if (options.onOpen) {
+    scheduleOpenCallback(options.onOpen)
+  }
+
+  elements.buttons.hidden = Boolean(options.hideFooterButtons)
+
+  return dialogPromise
     .then((result) => {
       if (result !== 'save') return null
       return collectFormValues(options.form)
     })
     .finally(() => {
+      elements.buttons.hidden = false
+      updateSavingUI(dialog, submitLabel, false)
       options.form.removeEventListener('submit', handleSubmit)
       submitProxy.remove()
     })
diff --git a/src/ui/errors.ts b/src/ui/errors.ts
index 7be3193e..e5c9b573 100644
--- a/src/ui/errors.ts
+++ b/src/ui/errors.ts
@@ -1,5 +1,6 @@
 import { widgets } from 'solid-ui'
+import { formatDisplayError } from '../utils/errorDisplay'
 
 export function complain (div: HTMLElement, d: Document, message: unknown): void {
-  div.appendChild(widgets.errorMessageBlock(d, message, 'pink'))
+  div.appendChild(widgets.errorMessageBlock(d, formatDisplayError(message), 'pink'))
 }
diff --git a/src/ui/spinner.ts b/src/ui/spinner.ts
new file mode 100644
index 00000000..5bf2c35c
--- /dev/null
+++ b/src/ui/spinner.ts
@@ -0,0 +1,8 @@
+import { html, TemplateResult } from 'lit-html'
+
+export function createSpinner (): TemplateResult {
+  return html`
+    <span class="loading-spinner" aria-hidden="true"></span>
+    <span class="sr-only">Saving...</span>
+  `
+}
\ No newline at end of file
diff --git a/src/utils/debug.ts b/src/utils/debug.ts
new file mode 100644
index 00000000..f48803b5
--- /dev/null
+++ b/src/utils/debug.ts
@@ -0,0 +1,17 @@
+/* eslint-disable no-console */
+
+export function log (...args) {
+  console.log(...args)
+}
+
+export function warn (...args) {
+  console.warn(...args)
+}
+
+export function error (...args) {
+  console.error(...args)
+}
+
+export function trace (...args) {
+  console.trace(...args)
+}
diff --git a/src/utils/errorDisplay.ts b/src/utils/errorDisplay.ts
new file mode 100644
index 00000000..da2722f7
--- /dev/null
+++ b/src/utils/errorDisplay.ts
@@ -0,0 +1,15 @@
+function stringifyUnknown(value: unknown): string {
+  if (typeof value === 'string') return value
+  if (value instanceof Error) return value.message || value.name
+  if (value == null) return ''
+
+  try {
+    return JSON.stringify(value)
+  } catch {
+    return String(value)
+  }
+}
+
+export function formatDisplayError(error: unknown, fallbackMessage?: string): string {
+  return (fallbackMessage || stringifyUnknown(error) || 'Something went wrong.').trim()
+}
\ No newline at end of file
diff --git a/test/CVPresenter.spec.ts b/test/CVPresenter.spec.ts
index b78f0421..e4b1a123 100644
--- a/test/CVPresenter.spec.ts
+++ b/test/CVPresenter.spec.ts
@@ -11,17 +11,25 @@ describe('CVPresenter', () => {
     store.removeDocument(doc)
   })
 
-  it.skip('presents minimum available info', () => {
+  it('returns an empty list when no memberships exist', () => {
     const result = presentCV(jane, store)
-    expect(result.rolesByType).toBeNull()
-    expect(result.skills).toBeNull()
+    expect(result).toEqual([])
   })
 
-  it.skip('presents minimum available info', () => {
+  it('presents a role entry from an org membership', () => {
+    const membership = blankNode()
     const organization = blankNode()
-    store.add(jane, ns.org('member'), organization, doc)
+
+    store.add(membership, ns.org('member'), jane, doc)
+    store.add(membership, ns.vcard('role'), 'Developer', doc)
+    store.add(membership, ns.schema('startDate'), '2024-01-01', doc)
+    store.add(membership, ns.org('organization'), organization, doc)
     store.add(organization, ns.schema('name'), 'Inrupt', doc)
+
     const result = presentCV(jane, store)
-    expect(result.rolesByType).toBe('Inrupt')
+
+    expect(result).toHaveLength(1)
+    expect(result[0].title).toBe('Developer')
+    expect(result[0].orgName).toBe('Inrupt')
   })
 })
diff --git a/test/SocialPresenter.spec.ts b/test/SocialPresenter.spec.ts
index 1e18f954..82cc7e97 100644
--- a/test/SocialPresenter.spec.ts
+++ b/test/SocialPresenter.spec.ts
@@ -1,35 +1,12 @@
+import { beforeAll, describe, expect, it } from '@jest/globals'
 import { presentSocial } from '../src/sections/social/selectors'
-import { presentCV } from '../src/sections/resume/selectors'
-import { blankNode, sym, parse } from 'rdflib'
-import { ns } from 'solid-ui'
+import { sym, parse } from 'rdflib'
 import { store } from 'solid-logic'
 import { subject, doc } from './setup'
 
-describe('CVPresenter', () => {
-  const jane = sym('https://jane.doe.example/profile/card#me')
-  const doc = jane.doc()
-
-  beforeEach(() => {
-    store.removeDocument(doc)
-  })
-
-  it.skip('presents minimum available info', () => {
-    const result = presentCV(jane, store)
-    expect(result).toEqual([])
-  })
-
-  it.skip('presents minimum available info', () => {
-    const organization = blankNode()
-    store.add(jane, ns.org('member'), organization, doc)
-    store.add(organization, ns.schema('name'), 'Inrupt', doc)
-    const result = presentCV(jane, store)
-    expect(result).toHaveLength(1)
-    expect(result[0].orgName).toBe('Inrupt')
-  })
-})
-
 describe('SocialPresenter', () => {
    beforeAll(async () => {
+        store.removeDocument(doc)
         const turtle = `
         @prefix : <#>.
         @prefix foaf: <http://xmlns.com/foaf/0.1/> .
@@ -97,6 +74,13 @@ describe('SocialPresenter', () => {
     `
         parse(turtle, store, doc.uri)
     })
+
+  it('returns an empty account list when no social accounts exist', () => {
+    const jane = sym('https://example.com/no-social#me')
+    const result = presentSocial(jane, store)
+    expect(result).toEqual({ accounts: [] })
+  })
+
   it('deduplicates accounts in presentSocial', () => {
     // Call presentSocial
     const result = presentSocial(subject, store)
diff --git a/test/add-me-to-your-contacts-functions.test.ts b/test/add-me-to-your-contacts-functions.test.ts
new file mode 100644
index 00000000..907a9daa
--- /dev/null
+++ b/test/add-me-to-your-contacts-functions.test.ts
@@ -0,0 +1,42 @@
+jest.mock('@solid-data-modules/contacts-rdflib', () => ({
+  __esModule: true,
+  default: jest.fn().mockImplementation(() => ({
+    listAddressBooks: jest.fn().mockResolvedValue({ publicUris: [], privateUris: [] }),
+    createNewContact: jest.fn()
+  }))
+}))
+
+import { context, subject } from './setup'
+import {
+  addMeToYourContactsDiv,
+  createAddMeToYourContactsButton,
+  saveNewContact
+} from '../src/specialButtons/addContact/addMeToYourContacts'
+
+describe('add-me-to-your-contacts functions', () => {
+  describe('addMeToYourContactsDiv', () => {
+    it('exists', () => {
+      expect(addMeToYourContactsDiv).toBeInstanceOf(Function)
+    })
+
+    it('runs', async () => {
+      await expect(addMeToYourContactsDiv(subject, context)).resolves.toBeTruthy()
+    })
+  })
+
+  describe('createAddMeToYourContactsButton', () => {
+    it('exists', () => {
+      expect(createAddMeToYourContactsButton).toBeInstanceOf(Function)
+    })
+
+    it('runs', async () => {
+      await expect(createAddMeToYourContactsButton(subject, context)).resolves.toBeTruthy()
+    })
+  })
+
+  describe('saveNewContact', () => {
+    it('exists', () => {
+      expect(saveNewContact).toBeInstanceOf(Function)
+    })
+  })
+})
diff --git a/test/add-me-to-your-contacts-mutation-errors.test.ts b/test/add-me-to-your-contacts-mutation-errors.test.ts
new file mode 100644
index 00000000..225e2593
--- /dev/null
+++ b/test/add-me-to-your-contacts-mutation-errors.test.ts
@@ -0,0 +1,155 @@
+import { fireEvent, waitFor } from '@testing-library/dom'
+
+import { context, fakeLogInAs, subject } from './setup'
+import { createAddressBookContactCreationDialog, createAddressBookContactCreationFooter } from '../src/specialButtons/addContact/ContactCreationDialog'
+import { closeSharedDialog, openInputDialog } from '../src/ui/dialog'
+import {
+  errorNotExistsAddressBookUri,
+  groupIsRequired
+} from '../src/texts'
+import type { AddressBooksData, ContactData } from '../src/specialButtons/addContact/contactsTypes'
+
+type MockContactsModule = {
+  createNewContact: jest.Mock
+}
+
+const addressBookUri = 'https://janedoe.example/contacts/index.ttl#this'
+const groupUri = 'https://janedoe.example/contacts/Group/friends.ttl#this'
+
+function createAddressBooksData(): AddressBooksData {
+  return {
+    public: new Map(),
+    private: new Map([
+      [addressBookUri, {
+        name: 'Friends',
+        groups: [{ name: 'Friends Group', uri: groupUri }],
+        contacts: []
+      }]
+    ]),
+    contactWebIDs: new Map(),
+    contactNames: new Map()
+  }
+}
+
+function createContactData(): ContactData {
+  return {
+    name: 'Jane Doe',
+    webID: 'https://jane.example/profile/card#me',
+    emails: [],
+    phoneNumbers: []
+  }
+}
+
+function createContactsModule(): MockContactsModule {
+  return {
+    createNewContact: jest.fn()
+  }
+}
+
+function mountDialog() {
+  document.body.innerHTML = ''
+
+  const form = createAddressBookContactCreationDialog(
+    context,
+    createContactsModule() as any,
+    createContactData(),
+    createAddressBooksData()
+  )
+
+  const footer = createAddressBookContactCreationFooter(
+    context,
+    createContactsModule() as any,
+    createAddressBooksData(),
+    createContactData()
+  )
+
+  void openInputDialog({
+    title: 'Add contact to address book',
+    dom: document,
+    form,
+    headerAction: { type: 'none' }
+  })
+
+  const buttonsContainer = document.querySelector('#modal-buttons') as HTMLDivElement | null
+  if (buttonsContainer) {
+    const sharedButtons = Array.from(buttonsContainer.querySelectorAll(':scope > solid-ui-button')) as HTMLElement[]
+    sharedButtons.forEach((button) => {
+      button.hidden = true
+      button.setAttribute('aria-hidden', 'true')
+    })
+
+    buttonsContainer.appendChild(footer)
+  }
+
+  return form
+}
+
+function getErrorMessage(): HTMLElement {
+  const error = document.querySelector('#profile-modal #modal-error') as HTMLElement | null
+  if (!error) throw new Error('Expected add-to-contact error message element to exist.')
+  return error
+}
+
+describe('add-to-contact dialog validation', () => {
+  beforeEach(() => {
+    fakeLogInAs(subject)
+  })
+
+  afterEach(() => {
+    closeSharedDialog()
+    document.body.innerHTML = ''
+    jest.clearAllMocks()
+  })
+
+  it('shows a validation error when adding a contact without selecting a group', async () => {
+    mountDialog()
+
+    const addressBookButton = document.getElementById(addressBookUri) as HTMLElement
+    fireEvent.click(addressBookButton)
+
+    const addContactButton = document.getElementById('contacts-submit-contact-button') as HTMLElement
+    fireEvent.click(addContactButton)
+
+    await waitFor(() => {
+      expect(getErrorMessage().textContent).toBe(groupIsRequired)
+    })
+  })
+
+  it('shows a validation error when the address-book URI is blank', async () => {
+    mountDialog()
+
+    const launchUriButton = document.getElementById('contacts-addressbook-uri-entry-button') as HTMLElement
+    fireEvent.click(launchUriButton)
+
+    const uriForm = document.getElementById('contacts-address-uri-entry-form') as HTMLFormElement
+    uriForm.dispatchEvent(new Event('submit', { bubbles: false, cancelable: true }))
+
+    await waitFor(() => {
+      expect(getErrorMessage().textContent).toBe(errorNotExistsAddressBookUri)
+    })
+  })
+
+  it('shows inline validation when the address-book name contains invalid characters', async () => {
+    mountDialog()
+
+    const launchAddressBookButton = document.getElementById('contacts-create-addressbook-button') as HTMLElement
+    fireEvent.click(launchAddressBookButton)
+
+    fireEvent.input(document.getElementById('addressBookContainerInput') as HTMLInputElement, {
+      target: { value: 'friends' }
+    })
+    fireEvent.input(document.getElementById('groupNameInput') as HTMLInputElement, {
+      target: { value: 'Friends Group' }
+    })
+    fireEvent.input(document.getElementById('addressBookNameInput') as HTMLInputElement, {
+      target: { value: '!!!' }
+    })
+
+    const validationMessage = document.querySelector('#new-addressbook-form .contacts-dialog__validation') as HTMLElement
+
+    await waitFor(() => {
+      expect(validationMessage.textContent).toBe('Only letters, numbers, and spaces are allowed.')
+      expect(validationMessage.getAttribute('aria-hidden')).toBe('false')
+    })
+  })
+})
\ No newline at end of file
diff --git a/test/add-me-to-your-contacts.accessibility.test.ts b/test/add-me-to-your-contacts.accessibility.test.ts
new file mode 100644
index 00000000..048960d9
--- /dev/null
+++ b/test/add-me-to-your-contacts.accessibility.test.ts
@@ -0,0 +1,190 @@
+import { afterEach, beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { fireEvent, waitFor } from '@testing-library/dom'
+
+import { createAddressBookContactCreationDialog, createAddressBookContactCreationFooter, handleContactExistsByName } from '../src/specialButtons/addContact/ContactCreationDialog'
+import type { AddressBooksData, ContactData } from '../src/specialButtons/addContact/contactsTypes'
+import { closeSharedDialog, openInputDialog } from '../src/ui/dialog'
+import { runAxe } from './helpers/runAxe'
+import { context, fakeLogInAs, subject } from './setup'
+
+type MockContactsModule = {
+  createNewContact: jest.Mock
+}
+
+const addressBookUri = 'https://janedoe.example/contacts/index.ttl#this'
+const groupUri = 'https://janedoe.example/contacts/Group/friends.ttl#this'
+
+function createAddressBooksData(): AddressBooksData {
+  return {
+    public: new Map(),
+    private: new Map([
+      [addressBookUri, {
+        name: 'Friends',
+        groups: [{ name: 'Friends Group', uri: groupUri }],
+        contacts: []
+      }]
+    ]),
+    contactWebIDs: new Map(),
+    contactNames: new Map()
+  }
+}
+
+function createContactData(): ContactData {
+  return {
+    name: 'Jane Doe',
+    webID: 'https://jane.example/profile/card#me',
+    emails: [],
+    phoneNumbers: []
+  }
+}
+
+function createContactsModule(): MockContactsModule {
+  return {
+    createNewContact: jest.fn()
+  }
+}
+
+function mountDialog(): HTMLFormElement {
+  document.body.innerHTML = ''
+
+  const form = createAddressBookContactCreationDialog(
+    context,
+    createContactsModule() as any,
+    createContactData(),
+    createAddressBooksData()
+  )
+
+  const footer = createAddressBookContactCreationFooter(
+    context,
+    createContactsModule() as any,
+    createAddressBooksData(),
+    createContactData()
+  )
+
+  void openInputDialog({
+    title: 'Add contact to address book',
+    dom: document,
+    form,
+    headerAction: { type: 'none' }
+  })
+
+  const buttonsContainer = document.querySelector('#modal-buttons') as HTMLDivElement | null
+  if (buttonsContainer) {
+    const sharedButtons = Array.from(buttonsContainer.querySelectorAll(':scope > solid-ui-button')) as HTMLElement[]
+    sharedButtons.forEach((button) => {
+      button.hidden = true
+      button.setAttribute('aria-hidden', 'true')
+    })
+
+    buttonsContainer.appendChild(footer)
+  }
+
+  return form
+}
+
+describe('Add me to your contacts accessibility', () => {
+  beforeEach(() => {
+    fakeLogInAs(subject)
+  })
+
+  afterEach(() => {
+    closeSharedDialog()
+    document.body.innerHTML = ''
+    jest.clearAllMocks()
+  })
+
+  it('has no accessibility violations for the chooser dialog', async () => {
+    const form = mountDialog()
+    const modal = document.getElementById('profile-modal') as HTMLElement
+
+    expect(form.getAttribute('aria-describedby')).toBe('contacts-dialog-description')
+
+    const results = await runAxe(modal)
+    expect(results.violations.length).toBe(0)
+  })
+
+  it('associates the address-book inline validation message with its inputs', () => {
+    const form = mountDialog()
+
+    const createButton = form.querySelector('#contacts-create-addressbook-button') as HTMLElement
+    fireEvent.click(createButton)
+
+    const validationMessage = form.querySelector('#contacts-addressbook-validation-message') as HTMLElement
+    const addressBookNameInput = form.querySelector('#addressBookNameInput') as HTMLInputElement
+    const addressBookContainerInput = form.querySelector('#addressBookContainerInput') as HTMLInputElement
+    const groupNameInput = form.querySelector('#groupNameInput') as HTMLInputElement
+
+    expect(validationMessage).not.toBeNull()
+    expect(addressBookNameInput.getAttribute('aria-describedby')).toBe('contacts-addressbook-validation-message')
+    expect(addressBookContainerInput.getAttribute('aria-describedby')).toBe('contacts-addressbook-validation-message')
+    expect(groupNameInput.getAttribute('aria-describedby')).toBe('contacts-addressbook-validation-message')
+
+    fireEvent.input(addressBookNameInput, { target: { value: 'Bad@@ Name!!' } })
+
+    expect(addressBookNameInput.getAttribute('aria-invalid')).toBe('true')
+    expect(validationMessage.textContent).toBe('Only letters, numbers, and spaces are allowed.')
+    expect(validationMessage.getAttribute('aria-hidden')).toBe('false')
+  })
+
+  it('announces shared errors accessibly and remains axe-clean when an error is visible', async () => {
+    const form = mountDialog()
+    const modal = document.getElementById('profile-modal') as HTMLElement
+
+    const addressBookButton = form.querySelector(`#${CSS.escape(addressBookUri)}`) as HTMLElement | null
+    if (addressBookButton) {
+      fireEvent.click(addressBookButton)
+    } else {
+      fireEvent.click(document.getElementById(addressBookUri) as HTMLElement)
+    }
+
+    fireEvent.click(document.getElementById('contacts-submit-contact-button') as HTMLElement)
+
+    const errorSection = modal.querySelector('#modal-error') as HTMLElement
+
+    await waitFor(() => {
+      expect(errorSection.hidden).toBe(false)
+      expect(errorSection.getAttribute('role')).toBe('alert')
+      expect(errorSection.getAttribute('aria-live')).toBe('assertive')
+      expect(errorSection.getAttribute('aria-atomic')).toBe('true')
+      expect(errorSection.getAttribute('aria-hidden')).toBe('false')
+      expect(document.activeElement).toBe(errorSection)
+      expect(errorSection.textContent).toBe('You need to either pick a group or enter one.')
+    })
+
+    const results = await runAxe(modal)
+    expect(results.violations.length).toBe(0)
+  })
+
+  it('treats the inline contact-exists confirmation as a modal alertdialog', async () => {
+    const form = mountDialog()
+
+    const handled = handleContactExistsByName(
+      context,
+      createAddressBooksData(),
+      createContactData(),
+      'https://janedoe.example/contacts/Person/alice.ttl#this',
+      false
+    )
+
+    expect(handled).toBe(true)
+
+    const popup = form.querySelector('.contacts-dialog__contact-exists') as HTMLElement
+    const overlay = form.querySelector('#contacts-popup-overlay') as HTMLElement
+    const description = form.querySelector('.contacts-dialog__description') as HTMLElement
+    const body = form.querySelector('.contacts-dialog__body') as HTMLElement
+
+    await waitFor(() => {
+      expect(popup.getAttribute('role')).toBe('alertdialog')
+      expect(popup.getAttribute('aria-modal')).toBe('true')
+      expect(popup.getAttribute('tabindex')).toBe('-1')
+      expect(description.getAttribute('aria-hidden')).toBe('true')
+      expect(body.getAttribute('aria-hidden')).toBe('true')
+      expect(overlay.getAttribute('aria-hidden')).toBe('true')
+      expect(overlay.hasAttribute('role')).toBe(false)
+      expect(document.activeElement).toBe(popup)
+    })
+
+    const results = await runAxe(form)
+    expect(results.violations.length).toBe(0)
+  })
+})
\ No newline at end of file
diff --git a/test/add-me-to-your-contacts.test.ts b/test/add-me-to-your-contacts.test.ts
new file mode 100644
index 00000000..705509e6
--- /dev/null
+++ b/test/add-me-to-your-contacts.test.ts
@@ -0,0 +1,34 @@
+jest.mock('@solid-data-modules/contacts-rdflib', () => ({
+  __esModule: true,
+  default: jest.fn().mockImplementation(() => ({
+    listAddressBooks: jest.fn().mockResolvedValue({ publicUris: [], privateUris: [] }),
+    createNewContact: jest.fn()
+  }))
+}))
+
+import { context, fakeLogInAs, subject } from './setup'
+import pane from '../src'
+import { queryByText, waitFor } from '@testing-library/dom'
+import { sym } from 'rdflib'
+import { addMeToYourContactsButtonText } from '../src/texts'
+
+describe('add-me-to-your-contacts pane', () => {
+  beforeEach(() => {
+    fakeLogInAs(subject)
+  })
+
+  it('renders the add-to-contacts button for an authenticated non-owner viewer', async () => {
+    const viewedSubject = sym('https://alice.example/profile/card#me')
+    const result = pane.render(viewedSubject, context)
+
+    await waitFor(() => {
+      expect(result.querySelector('#add-to-contacts-button')).not.toBeNull()
+    })
+  })
+
+  it('does not render the add-to-contacts button for the profile owner', () => {
+    const result = pane.render(subject, context)
+
+    expect(queryByText(result, addMeToYourContactsButtonText.toUpperCase())).toBeNull()
+  })
+})
diff --git a/test/add-me-to-your-friends-functions.test.ts b/test/add-me-to-your-friends-functions.test.ts
index ae43a403..b39283ed 100644
--- a/test/add-me-to-your-friends-functions.test.ts
+++ b/test/add-me-to-your-friends-functions.test.ts
@@ -1,14 +1,41 @@
+import { afterEach, beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { fireEvent, waitFor } from '@testing-library/dom'
+import { authn } from 'solid-logic'
+import { sym } from 'rdflib'
 import { context, subject } from './setup'
-import { addMeToYourFriendsDiv, checkIfThingExists, createAddMeToYourFriendsButton, saveNewThing } from '../src/addMeToYourFriends'
+import { addMeToYourFriendsDiv, checkIfThingExists, createAddMeToYourFriendsButton, saveNewThing } from '../src/specialButtons/addMeToYourFriends'
+import {
+  addMeToYourFriendsButtonText,
+  friendExistsAlreadyButtonText,
+  logInAddMeToYourFriendsButtonText
+} from '../src/texts'
 
 describe('add-me-to-your-friends functions', () => {
+    const baseStore = context.session.store as any
+    const me = sym('https://example.com/profile/card#me')
+
+    beforeEach(() => {
+      jest.restoreAllMocks()
+      baseStore.fetcher = {
+        load: jest.fn(async () => undefined)
+      }
+      baseStore.updater = {
+        update: jest.fn(async () => undefined)
+      }
+      baseStore.whether = jest.fn().mockReturnValue(0)
+    })
+
+    afterEach(() => {
+      jest.restoreAllMocks()
+    })
+
     describe('addMeToYourFriendsDiv', () => {
       it('exists', () => {
         expect(addMeToYourFriendsDiv).toBeInstanceOf(Function)
       })
   
       it('runs', () => {
-        expect(addMeToYourFriendsDiv(subject, context)).toBeTruthy()
+        expect(addMeToYourFriendsDiv(subject, context, 'authenticated')).toBeTruthy()
       })
     })
   
@@ -20,6 +47,38 @@ describe('add-me-to-your-friends functions', () => {
       it('runs', () => {
         expect(createAddMeToYourFriendsButton(subject, context)).toBeTruthy()
       })
+
+      it('disables the action and shows the logged-out label for anonymous users', () => {
+        jest.spyOn(authn, 'currentUser').mockReturnValue(null as any)
+
+        const button = createAddMeToYourFriendsButton(subject, context)
+
+        expect(button.disabled).toBe(true)
+        expect(button.textContent).toBe(logInAddMeToYourFriendsButtonText)
+      })
+
+      it('refreshes after a successful add and updates the label to already friends', async () => {
+        jest.spyOn(authn, 'currentUser').mockReturnValue(me as any)
+        const whetherMock = jest.fn()
+          .mockReturnValueOnce(0)
+          .mockReturnValueOnce(0)
+          .mockReturnValueOnce(1)
+        baseStore.whether = whetherMock
+
+        const button = createAddMeToYourFriendsButton(subject, context)
+
+        await waitFor(() => {
+          expect(button.textContent).toBe(addMeToYourFriendsButtonText)
+        })
+
+        fireEvent.click(button)
+
+        await waitFor(() => {
+          expect(button.textContent).toBe(friendExistsAlreadyButtonText)
+        })
+
+        expect(baseStore.updater.update).toHaveBeenCalledTimes(1)
+      })
     })
   
     describe('saveNewThing', () => {
diff --git a/test/add-me-to-your-friends.accessibility.test.ts b/test/add-me-to-your-friends.accessibility.test.ts
new file mode 100644
index 00000000..4d7d6577
--- /dev/null
+++ b/test/add-me-to-your-friends.accessibility.test.ts
@@ -0,0 +1,49 @@
+import { beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { render } from 'lit-html'
+import { authn } from 'solid-logic'
+import { sym } from 'rdflib'
+import { addMeToYourFriendsDiv } from '../src/specialButtons/addMeToYourFriends'
+import { runAxe } from './helpers/runAxe'
+import { context, subject } from './setup'
+
+describe('Add me to your friends accessibility', () => {
+  const baseStore = context.session.store as any
+  const me = sym('https://example.com/profile/card#me')
+
+  beforeEach(() => {
+    jest.restoreAllMocks()
+    baseStore.fetcher = {
+      load: jest.fn(async () => undefined)
+    }
+    baseStore.updater = {
+      update: jest.fn(async () => undefined)
+    }
+    baseStore.whether = jest.fn().mockReturnValue(0)
+  })
+
+  it('has no accessibility violations for anonymous users', async () => {
+    jest.spyOn(authn, 'currentUser').mockReturnValue(null as any)
+
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+    render(addMeToYourFriendsDiv(subject, context, 'anonymous'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
+
+  it('has no accessibility violations for authenticated users', async () => {
+    jest.spyOn(authn, 'currentUser').mockReturnValue(me as any)
+
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+    render(addMeToYourFriendsDiv(subject, context, 'authenticated'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
+})
diff --git a/test/add-me-to-your-friends.test.ts b/test/add-me-to-your-friends.test.ts
deleted file mode 100644
index ed2c1e53..00000000
--- a/test/add-me-to-your-friends.test.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { context, subject } from './setup'
-import pane from '../src'
-import { findByText, fireEvent } from '@testing-library/dom'
-import { logInAddMeToYourFriendsButtonText, userNotLoggedInErrorMessage } from '../src/texts'
-
-// TODO(refactor): Revisit once Intro action area wiring is finalized.
-describe.skip('add-me-to-your-friends pane', () => {
-  describe('saveNewFriend with NO logged in user', () => {
-    let result: HTMLElement
-    beforeAll(() => {
-      result = pane.render(subject, context)
-    })
-
-    it('renders the Add me to friends button', async () => {
-      const button = await findByText(result, logInAddMeToYourFriendsButtonText.toUpperCase())
-      expect(button).not.toBeNull()
-    })
-
-    it('saveNewFriend with user NOT logged in', async () => {
-      const button = await findByText(result, logInAddMeToYourFriendsButtonText.toUpperCase())
-      fireEvent.click(button)
-      const errorMessage = await findByText(result, userNotLoggedInErrorMessage)
-      expect(errorMessage).not.toBeNull() 
-    })
-  })
-})
-
diff --git a/test/chat-with-me.spec.ts b/test/chat-with-me.spec.ts
deleted file mode 100644
index fb7623b7..00000000
--- a/test/chat-with-me.spec.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-import {findByText} from '@testing-library/dom'
-import {parse} from 'rdflib'
-import {ChatLogic} from 'solid-logic'
-import pane from '../src'
-import {context, doc, subject} from './setup'
-import {logInToChatWithMeButtonText, loadingMessage} from '../src/texts'
-import {jest} from '@jest/globals'
-
-// TODO(refactor): Re-enable when chat action rendering in profile view is stabilized.
-describe.skip('chat with me', () => {
-
-    beforeAll(() => {
-        context.session.store.removeDocument(doc)
-        const turtle = `
-      @prefix : <#>.
-      @prefix foaf: <http://xmlns.com/foaf/0.1/> .
-      @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
-      :me foaf:name "Jane Doe";
-      .
-  `
-        parse(turtle, context.session.store, doc.uri)
-    })
-
-    describe('without a started chat and not logged in', () => {
-        let result: HTMLElement
-        beforeAll(() => {
-            context.session.logic.chat = {
-                getChat: jest.fn().mockReturnValue(null),
-            } as unknown as ChatLogic
-            result = pane.render(subject, context)
-        })
-
-         it('renders the Login to chat with me button', async () => {
-              const button = await findByText(result, logInToChatWithMeButtonText.toUpperCase())
-              expect(button).not.toBeNull()
-         })
-
-    })
-
-
-    describe('while chat loading', () => {
-        let result: HTMLElement
-        beforeAll(() => {
-            context.session.logic.chat = {
-                getChat: jest.fn().mockReturnValue(new Promise(() => null)),
-            } as unknown as ChatLogic
-            result = pane.render(subject, context)
-        })
-
-        it('renders a loading text', async () => {
-            const button = await findByText(result, loadingMessage.toUpperCase())
-            expect(button).not.toBeNull()
-        })
-
-    })
-
-    describe('with a started chat', () => {
-        let result: HTMLElement
-        beforeAll(() => {
-            context.session.logic.chat = {
-                getChat: jest.fn().mockReturnValue('https://pod.example/chat'),
-            } as unknown as ChatLogic
-            result = pane.render(subject, context)
-        })
-
-        it('renders the chat pane directly', async () => {
-            const chatPane = await findByText(result,'mock long chat pane')
-            expect(chatPane).not.toBeNull()
-        })
-
-    })
-})
diff --git a/test/contacts-card.test.ts b/test/contacts-card.test.ts
new file mode 100644
index 00000000..aaae9939
--- /dev/null
+++ b/test/contacts-card.test.ts
@@ -0,0 +1,179 @@
+jest.mock('../src/specialButtons/addContact/helpers', () => ({
+  addGroupToAddressBookData: jest.fn(),
+  refreshButton: jest.fn()
+}))
+
+jest.mock('../src/specialButtons/addContact/selectors', () => ({
+  checkIfContactExistsByName: jest.fn(() => null),
+  checkIfContactExistsByWebID: jest.fn(() => false)
+}))
+
+jest.mock('../src/specialButtons/addContact/mutations', () => ({
+  addANewAddressBookUriToAddressBooks: jest.fn(),
+  addWebIDToExistingContact: jest.fn(),
+  createContactInAddressBook: jest.fn(),
+  handleAddressBookCreation: jest.fn()
+}))
+
+jest.mock('contacts-pane', () => ({
+  __esModule: true,
+  default: {},
+  saveNewGroup: jest.fn()
+}))
+
+jest.mock('../src/buttonsHelper', () => ({
+  clearPreviousMessage: jest.fn(),
+  complain: jest.fn(),
+  mention: jest.fn()
+}))
+
+import { waitFor } from '@testing-library/dom'
+
+jest.mock('../src/specialButtons/addContact/contactsErrors', () => {
+  const actual = jest.requireActual('../src/specialButtons/addContact/contactsErrors')
+  return {
+    ...actual,
+    addErrorToErrorDisplay: jest.fn(),
+    checkAndAddErrorToDisplay: jest.fn(),
+    checkAndRemoveErrorDisplay: jest.fn()
+  }
+})
+
+import { createAddressBookContactCreationFooter, createAddressBookUriSelectorDialog } from '../src/specialButtons/addContact/ContactCreationDialog'
+import { closeSharedDialog, openInputDialog } from '../src/ui/dialog'
+
+describe('ContactCreationDialog', () => {
+  const context = { dom: document } as any
+  const contactsModule = {} as any
+  const contactData = {
+    name: 'Alice',
+    webID: 'https://alice.example/profile#me',
+    emails: [],
+    phoneNumbers: []
+  } as any
+
+  const addressBooksData = {
+    public: new Map(),
+    private: new Map(),
+    contactWebIDs: new Map(),
+    contactNames: new Map()
+  } as any
+
+  beforeEach(() => {
+    document.body.innerHTML = ''
+    const addButton = document.createElement('button')
+    addButton.id = 'add-to-contacts-button'
+    document.body.appendChild(addButton)
+
+    const buttonContainer = document.createElement('div')
+    buttonContainer.id = 'add-to-contacts-button-container'
+    document.body.appendChild(buttonContainer)
+  })
+
+  afterEach(() => {
+    closeSharedDialog()
+  })
+
+  function mountSharedDialog() {
+    const dialog = createAddressBookUriSelectorDialog(context, contactsModule, contactData, addressBooksData)
+    const footer = createAddressBookContactCreationFooter(context, contactsModule, addressBooksData, contactData)
+
+    void openInputDialog({
+      title: 'Add contact to address book',
+      dom: document,
+      form: dialog,
+      headerAction: { type: 'none' }
+    })
+
+    const buttonsContainer = document.querySelector('#modal-buttons') as HTMLDivElement | null
+    if (buttonsContainer) {
+      const sharedButtons = Array.from(buttonsContainer.querySelectorAll(':scope > solid-ui-button')) as HTMLElement[]
+      sharedButtons.forEach((button) => {
+        button.hidden = true
+        button.setAttribute('aria-hidden', 'true')
+      })
+
+      buttonsContainer.appendChild(footer)
+    }
+
+    return dialog
+  }
+
+  it('opens the new address-book form from create button', () => {
+    const dialog = mountSharedDialog()
+
+    const createButton = dialog.querySelector('#contacts-create-addressbook-button') as HTMLButtonElement
+    expect(createButton).toBeTruthy()
+
+    createButton.click()
+
+    const newForm = dialog.querySelector('#new-addressbook-form')
+    expect(newForm).toBeTruthy()
+    expect(newForm?.closest('#contacts-inline-panel-region')).toBeTruthy()
+    expect((document.getElementById('contacts-submit-contact-button') as HTMLButtonElement | null)?.disabled).toBe(true)
+  })
+
+  it('opens the address-book URI flow inside the inline panel region', () => {
+    const dialog = mountSharedDialog()
+
+    const uriButton = dialog.querySelector('#contacts-addressbook-uri-entry-button') as HTMLButtonElement
+    expect(uriButton).toBeTruthy()
+
+    uriButton.click()
+
+    const uriPanel = dialog.querySelector('#contacts-addressbook-uri-entry')
+    expect(uriPanel).toBeTruthy()
+    expect(uriPanel?.closest('#contacts-inline-panel-region')).toBeTruthy()
+  })
+
+  it('renders chooser content with footer actions', async () => {
+    const dialog = mountSharedDialog()
+
+    expect(dialog.querySelector('.contacts-dialog__description')?.textContent).toContain('Choose an address book and group')
+
+    await waitFor(() => {
+      expect(document.getElementById('contacts-submit-contact-button')?.textContent).toContain('Add Contact')
+      expect(Array.from(document.querySelectorAll('#modal-buttons button, #modal-buttons solid-ui-button')).some((button) => button.textContent?.trim() === 'Cancel')).toBe(true)
+    })
+  })
+
+  it('sanitizes invalid characters and toggles validation message visibility', () => {
+    const dialog = mountSharedDialog()
+
+    const createButton = dialog.querySelector('#contacts-create-addressbook-button') as HTMLButtonElement
+    createButton.click()
+
+    const nameInput = dialog.querySelector('#addressBookNameInput') as HTMLInputElement
+    const validationMessage = dialog.querySelector('.contacts-dialog__validation') as HTMLElement
+
+    expect(nameInput).toBeTruthy()
+    expect(validationMessage).toBeTruthy()
+
+    nameInput.value = 'Bad@@ Name!!'
+    nameInput.dispatchEvent(new Event('input', { bubbles: true }))
+
+    expect(nameInput.value).toBe('Bad Name')
+    expect(validationMessage.classList.contains('contacts-dialog__validation--visible')).toBe(true)
+    expect(validationMessage.getAttribute('aria-hidden')).toBe('false')
+
+    nameInput.value = 'Good Name'
+    nameInput.dispatchEvent(new Event('input', { bubbles: true }))
+
+    expect(validationMessage.classList.contains('contacts-dialog__validation--visible')).toBe(false)
+    expect(validationMessage.getAttribute('aria-hidden')).toBe('true')
+  })
+
+  it('preserves spaces while typing in address book inputs', () => {
+    const dialog = mountSharedDialog()
+
+    const createButton = dialog.querySelector('#contacts-create-addressbook-button') as HTMLButtonElement
+    createButton.click()
+
+    const nameInput = dialog.querySelector('#addressBookNameInput') as HTMLInputElement
+
+    nameInput.value = 'My Address Book '
+    nameInput.dispatchEvent(new Event('input', { bubbles: true }))
+
+    expect(nameInput.value).toBe('My Address Book ')
+  })
+})
diff --git a/test/contacts-helpers.test.ts b/test/contacts-helpers.test.ts
new file mode 100644
index 00000000..601bc3d5
--- /dev/null
+++ b/test/contacts-helpers.test.ts
@@ -0,0 +1,383 @@
+jest.mock('contacts-pane', () => ({
+	__esModule: true,
+	default: {
+		mintNew: jest.fn()
+	},
+	addWebIDToContacts: jest.fn()
+}))
+
+jest.mock('../src/specialButtons/addContact/contactsErrors', () => ({
+	addErrorToErrorDisplay: jest.fn()
+}))
+
+import {
+  getContactData,
+	checkIfContactExistsByName,
+	checkIfContactExistsByWebID
+} from '../src/specialButtons/addContact/selectors'
+import {
+	createContactInAddressBook,
+	addWebIDToExistingContact,
+	updateAddressBookName
+} from '../src/specialButtons/addContact/mutations'
+import { addGroupToAddressBookData } from '../src/specialButtons/addContact/helpers'
+import { namedNode, sym } from 'rdflib'
+import { addWebIDToContacts } from 'contacts-pane'
+import { errorAddingContactWebIDToAddressBook } from '../src/texts'
+
+function mockUpdaterUpdateSuccess() {
+	return jest.fn((_deletions, _insertions, callback) => {
+		callback('', true)
+	})
+}
+
+function mockUpdaterUpdateFailure(message: string) {
+	return jest.fn((_deletions, _insertions, callback) => {
+		callback('', false, message)
+	})
+}
+
+describe('contactsHelpers', () => {
+	beforeEach(() => {
+		jest.clearAllMocks()
+	})
+
+	describe('getContactData', () => {
+		it('exists', () => {
+			expect(getContactData).toBeInstanceOf(Function)
+		})
+
+		it('reads nickname and preferred pronouns from the profile subject', async () => {
+			const subject = sym('https://alice.example/profile/card#me')
+			const store = {
+				anyValue: jest.fn((node, predicate) => {
+					if (predicate.value.endsWith('foaf/0.1/nick')) return 'Ali'
+					if (predicate.value.endsWith('preferredSubjectPronoun')) return 'they'
+					if (predicate.value.endsWith('preferredObjectPronoun')) return 'them'
+					if (predicate.value.endsWith('preferredRelativePronoun')) return 'theirs'
+					return null
+				}),
+				each: jest.fn().mockReturnValue([]),
+				any: jest.fn()
+			} as any
+
+			const contactData = await getContactData(store, subject)
+
+			expect(contactData.nickname).toBe('Ali')
+			expect(contactData.preferredSubjectPronoun).toBe('they')
+			expect(contactData.preferredObjectPronoun).toBe('them')
+			expect(contactData.preferredRelativePronoun).toBe('theirs')
+		})
+	})
+
+	describe('createContactInAddressBook', () => {
+		it('exists', () => {
+			expect(createContactInAddressBook).toBeInstanceOf(Function)
+		})
+
+		it('persists nickname and preferred pronouns when present', async () => {
+			const createdContactUri = 'https://pod.example/address-book/index.ttl#new-contact'
+			const fetcherLoad = jest.fn().mockResolvedValue(undefined)
+			const updaterUpdate = mockUpdaterUpdateSuccess()
+			const bnode = jest.fn(() => namedNode('https://pod.example/address-book/index.ttl#webid-node'))
+			const context = {
+				session: {
+					store: {
+						fetcher: { load: fetcherLoad },
+						updater: { update: updaterUpdate },
+						bnode,
+						each: jest.fn().mockReturnValue([]),
+						statementsMatching: jest.fn().mockReturnValue([])
+					}
+				}
+			} as any
+
+			const contactsModule = {
+				createNewContact: jest.fn().mockResolvedValue(createdContactUri)
+			} as any
+
+			const contactData = {
+				name: 'Alice',
+				webID: 'https://alice.example/profile#me',
+				emails: [],
+				phoneNumbers: [],
+				nickname: 'Ali',
+				preferredSubjectPronoun: 'they',
+				preferredObjectPronoun: 'them',
+				preferredRelativePronoun: 'theirs'
+			} as any
+
+			await createContactInAddressBook(context, contactsModule, contactData, {
+				addressBookUri: 'https://pod.example/address-book/index.ttl#this',
+				groupUris: ['https://pod.example/address-book/index.ttl#friends']
+			})
+
+			expect(addWebIDToContacts).not.toHaveBeenCalled()
+			expect(updaterUpdate).toHaveBeenCalledTimes(2)
+
+			const [, webIdInsertions] = updaterUpdate.mock.calls[0]
+			expect(webIdInsertions.map((statement) => statement.predicate.value)).toEqual([
+				'http://www.w3.org/2006/vcard/ns#url',
+				'http://www.w3.org/1999/02/22-rdf-syntax-ns#type',
+				'http://www.w3.org/2006/vcard/ns#value'
+			])
+
+			const [, insertions] = updaterUpdate.mock.calls[1]
+			const predicates = insertions.map((statement) => statement.predicate.value)
+			expect(predicates).toContain('http://xmlns.com/foaf/0.1/nick')
+			expect(predicates).toContain('http://www.w3.org/ns/solid/terms#preferredSubjectPronoun')
+			expect(predicates).toContain('http://www.w3.org/ns/solid/terms#preferredObjectPronoun')
+			expect(predicates).toContain('http://www.w3.org/ns/solid/terms#preferredRelativePronoun')
+		})
+
+		it('only writes the webID link when there are no detail fields', async () => {
+			const context = {
+				session: {
+					store: {
+						fetcher: { load: jest.fn().mockResolvedValue(undefined) },
+						updater: { update: mockUpdaterUpdateSuccess() },
+						bnode: jest.fn(() => namedNode('https://pod.example/address-book/index.ttl#webid-node')),
+						each: jest.fn().mockReturnValue([]),
+						statementsMatching: jest.fn().mockReturnValue([])
+					}
+				}
+			} as any
+
+			const contactsModule = {
+				createNewContact: jest.fn().mockResolvedValue('https://pod.example/address-book/index.ttl#new-contact')
+			} as any
+
+			await createContactInAddressBook(context, contactsModule, {
+				name: 'Alice',
+				webID: 'https://alice.example/profile#me',
+				emails: [],
+				phoneNumbers: []
+			} as any, {
+				addressBookUri: 'https://pod.example/address-book/index.ttl#this',
+				groupUris: ['https://pod.example/address-book/index.ttl#friends']
+			})
+
+			expect(context.session.store.updater.update).toHaveBeenCalledTimes(1)
+		})
+	})
+
+	describe('checkIfContactExistsByWebID', () => {
+		it('exists', () => {
+			expect(checkIfContactExistsByWebID).toBeInstanceOf(Function)
+		})
+
+		it('returns true when trimmed webID exists in map', () => {
+			const addressBooksData = {
+				contactWebIDs: new Map([['https://alice.example/profile#me', 'https://pod.example/contacts#alice']])
+			} as any
+
+			expect(checkIfContactExistsByWebID(addressBooksData, '  https://alice.example/profile#me  ')).toBe(true)
+		})
+
+		it('returns false for empty or missing webID', () => {
+			const addressBooksData = {
+				contactWebIDs: new Map([['https://alice.example/profile#me', 'https://pod.example/contacts#alice']])
+			} as any
+
+			expect(checkIfContactExistsByWebID(addressBooksData, '')).toBe(false)
+			expect(checkIfContactExistsByWebID(addressBooksData, '   ')).toBe(false)
+			expect(checkIfContactExistsByWebID(addressBooksData, null as any)).toBe(false)
+			expect(checkIfContactExistsByWebID(addressBooksData, undefined as any)).toBe(false)
+		})
+	})
+
+	describe('checkIfContactExistsByName', () => {
+		it('exists', () => {
+			expect(checkIfContactExistsByName).toBeInstanceOf(Function)
+		})
+
+		it('matches contact names case-insensitively and ignores spaces', () => {
+			const addressBooksData = {
+				contactNames: new Map([
+					['Alice Smith', 'https://pod.example/contacts#alice'],
+					['Bob', 'https://pod.example/contacts#bob']
+				])
+			} as any
+
+			expect(checkIfContactExistsByName(addressBooksData, '  alice   smith ')).toBe('https://pod.example/contacts#alice')
+			expect(checkIfContactExistsByName(addressBooksData, 'BOB')).toBe('https://pod.example/contacts#bob')
+		})
+
+		it('returns null when no matching name exists', () => {
+			const addressBooksData = {
+				contactNames: new Map([['Alice Smith', 'https://pod.example/contacts#alice']])
+			} as any
+
+			expect(checkIfContactExistsByName(addressBooksData, 'Charlie')).toBeNull()
+		})
+	})
+
+	describe('addGroupToAddressBookData', () => {
+		it('exists', () => {
+			expect(addGroupToAddressBookData).toBeInstanceOf(Function)
+		})
+
+		it('adds a new group to a public address book and returns true', () => {
+			const addressBookUri = 'https://pod.example/address-book/#this'
+			const group = { name: 'Friends', uri: 'https://pod.example/address-book/groups#friends' }
+			const addressBooksData = {
+				public: new Map([
+					[addressBookUri, { name: 'Public Book', groups: [], contacts: [] }]
+				]),
+				private: new Map()
+			} as any
+
+			const result = addGroupToAddressBookData(addressBooksData, addressBookUri, group)
+
+			expect(result).toBe(true)
+			expect(addressBooksData.public.get(addressBookUri).groups).toHaveLength(1)
+			expect(addressBooksData.public.get(addressBookUri).groups[0]).toEqual(group)
+		})
+
+		it('does not add duplicate group URIs to a private address book', () => {
+			const addressBookUri = 'https://pod.example/private-address-book/#this'
+			const group = { name: 'Team', uri: 'https://pod.example/private-address-book/groups#team' }
+			const addressBooksData = {
+				public: new Map(),
+				private: new Map([
+					[addressBookUri, { name: 'Private Book', groups: [group], contacts: [] }]
+				])
+			} as any
+
+			const result = addGroupToAddressBookData(addressBooksData, addressBookUri, group)
+
+			expect(result).toBe(true)
+			expect(addressBooksData.private.get(addressBookUri).groups).toHaveLength(1)
+		})
+
+		it('returns false when address book URI is not found', () => {
+			const addressBooksData = {
+				public: new Map(),
+				private: new Map()
+			} as any
+
+			const result = addGroupToAddressBookData(addressBooksData, 'https://pod.example/missing#this', {
+				name: 'Any',
+				uri: 'https://pod.example/missing#group'
+			})
+
+			expect(result).toBe(false)
+		})
+	})
+
+	describe('updateAddressBookName', () => {
+		it('exists', () => {
+			expect(updateAddressBookName).toBeInstanceOf(Function)
+		})
+
+		it('updates title and fn statements with trimmed name', async () => {
+			const fetcherLoad = jest.fn().mockResolvedValue(undefined)
+			const statementsMatching = jest.fn().mockReturnValue([{ id: 'old' }])
+			const updaterUpdate = mockUpdaterUpdateSuccess()
+			const context = {
+				session: {
+					store: {
+						fetcher: { load: fetcherLoad },
+						statementsMatching,
+						updater: { update: updaterUpdate }
+					}
+				}
+			} as any
+
+			await updateAddressBookName(context, 'https://pod.example/address-book/index.ttl#this', '  My Address Book  ')
+
+			expect(fetcherLoad).toHaveBeenCalledTimes(1)
+			expect(statementsMatching).toHaveBeenCalledTimes(2)
+			expect(updaterUpdate).toHaveBeenCalledTimes(1)
+			const [deletions, insertions] = updaterUpdate.mock.calls[0]
+			expect(deletions).toHaveLength(2)
+			expect(insertions).toHaveLength(2)
+		})
+
+		it('does nothing when new name is empty after trim', async () => {
+			const fetcherLoad = jest.fn()
+			const updaterUpdate = jest.fn()
+			const context = {
+				session: {
+					store: {
+						fetcher: { load: fetcherLoad },
+						statementsMatching: jest.fn(),
+						updater: { update: updaterUpdate }
+					}
+				}
+			} as any
+
+			await updateAddressBookName(context, 'https://pod.example/address-book/index.ttl#this', '    ')
+
+			expect(fetcherLoad).not.toHaveBeenCalled()
+			expect(updaterUpdate).not.toHaveBeenCalled()
+		})
+
+		it('throws when updater fails', async () => {
+			const context = {
+				session: {
+					store: {
+						fetcher: { load: jest.fn().mockResolvedValue(undefined) },
+						statementsMatching: jest.fn().mockReturnValue([]),
+						updater: { update: mockUpdaterUpdateFailure('update failed') }
+					}
+				}
+			} as any
+
+			await expect(
+				updateAddressBookName(context, 'https://pod.example/address-book/index.ttl#this', 'Book')
+			).rejects.toThrow('update failed')
+		})
+	})
+
+	describe('addWebIDToExistingContact', () => {
+		it('exists', () => {
+			expect(addWebIDToExistingContact).toBeInstanceOf(Function)
+		})
+
+		it('loads contact and adds webID triple', async () => {
+			const fetcherLoad = jest.fn().mockResolvedValue(undefined)
+			const updaterUpdate = mockUpdaterUpdateSuccess()
+			const context = {
+				session: {
+					store: {
+						fetcher: { load: fetcherLoad },
+						updater: { update: updaterUpdate },
+						bnode: jest.fn(() => namedNode('https://pod.example/contacts#webid-node')),
+						each: jest.fn().mockReturnValue([]),
+						statementsMatching: jest.fn().mockReturnValue([])
+					}
+				}
+			} as any
+
+			await addWebIDToExistingContact(context, { webID: 'https://alice.example/profile#me' } as any, 'https://pod.example/contacts#alice')
+
+			expect(fetcherLoad).toHaveBeenCalledWith('https://pod.example/contacts#alice')
+			expect(addWebIDToContacts).not.toHaveBeenCalled()
+			expect(updaterUpdate).toHaveBeenCalledTimes(1)
+			const [, insertions] = updaterUpdate.mock.calls[0]
+			expect(insertions.map((statement) => statement.predicate.value)).toEqual([
+				'http://www.w3.org/2006/vcard/ns#url',
+				'http://www.w3.org/1999/02/22-rdf-syntax-ns#type',
+				'http://www.w3.org/2006/vcard/ns#value'
+			])
+		})
+
+		it('throws when loading contact fails', async () => {
+			const context = {
+				session: {
+					store: {
+						fetcher: { load: jest.fn().mockRejectedValue(new Error('load failed')) }
+					}
+				}
+			} as any
+
+			await expect(
+				addWebIDToExistingContact(context, { webID: 'https://alice.example/profile#me' } as any, 'https://pod.example/contacts#alice')
+			).rejects.toMatchObject({
+				message: errorAddingContactWebIDToAddressBook,
+				cause: expect.objectContaining({ message: 'load failed' })
+			})
+		})
+	})
+})
diff --git a/test/cv-card.accessibility.test.ts b/test/cv-card.accessibility.test.ts
index 9c02eb7e..888c9be5 100644
--- a/test/cv-card.accessibility.test.ts
+++ b/test/cv-card.accessibility.test.ts
@@ -1,46 +1,39 @@
+import { describe, expect, it } from '@jest/globals'
 import { render } from 'lit-html'
 import { CVCard } from '../src/sections/resume/ResumeSection'
-import axe from 'axe-core'
-import { Literal } from 'rdflib'
+import { literal, sym } from 'rdflib'
+import { runAxe } from './helpers/runAxe'
 
-// TODO(refactor): Update fixture shape and assertions for the current CVCard contract.
-describe.skip('CVCard accessibility', () => {
+describe('CVCard accessibility', () => {
   it('has no accessibility violations', async () => {
-    // Helper to create a fake Literal (rdflib Literal is a class, but for type check, a string cast is enough for tests)
-    const fakeLiteral = (val: string | undefined): Literal => val ? (val as unknown as Literal) : undefined as unknown as Literal
-
-    const cvData = {
-      rolesByType: {
-        FutureRole: [{
-          orgName: 'FutureOrg',
-          roleText: 'future developer',
-          dates: '2027-',
-          startDate: fakeLiteral('2027-01-01'),
-          endDate: undefined as unknown as Literal
-        }],
-        CurrentRole: [{
-          orgName: 'CurrentOrg',
-          roleText: 'developer',
-          dates: '2023-2026',
-          startDate: fakeLiteral('2023-01-01'),
-          endDate: fakeLiteral('2026-12-31')
-        }],
-        PastRole: [{
-          orgName: 'PastOrg',
-          roleText: 'junior dev',
-          dates: '2020-2022',
-          startDate: fakeLiteral('2020-01-01'),
-          endDate: fakeLiteral('2022-12-31')
-        }],
+    const cvData = [
+      {
+        entryNode: sym('https://example.com/profile#role-future'),
+        title: 'Future Developer',
+        orgName: 'FutureOrg',
+        startDate: literal('2027-01-01')
+      },
+      {
+        entryNode: sym('https://example.com/profile#role-current'),
+        title: 'Developer',
+        orgName: 'CurrentOrg',
+        startDate: literal('2023-01-01'),
+        endDate: literal('2026-12-31'),
+        description: 'Building accessible profile tooling.'
       },
-      skills: ['JavaScript', 'Accessibility'],
-      languages: ['English', 'German']
-    }
+      {
+        entryNode: sym('https://example.com/profile#role-past'),
+        title: 'Junior Dev',
+        orgName: 'PastOrg',
+        startDate: literal('2020-01-01'),
+        endDate: literal('2022-12-31')
+      }
+    ]
     const container = document.createElement('div')
     document.body.appendChild(container)
-    render(CVCard(cvData), container)
+    render(CVCard(cvData as any, 'anonymous'), container)
 
-    const results = await axe.run(container)
+    const results = await runAxe(container)
     expect(results.violations.length).toBe(0)
   })
 })
diff --git a/test/cv.spec.ts b/test/cv.spec.ts
index 35560bc8..1f5bbc35 100644
--- a/test/cv.spec.ts
+++ b/test/cv.spec.ts
@@ -1,6 +1,7 @@
+import { beforeEach, describe, expect, it } from '@jest/globals'
 import pane from '../src/index'
 import { parse } from 'rdflib'
-import { findByTestId } from '@testing-library/dom'
+import { waitFor } from '@testing-library/dom'
 import { store } from 'solid-logic'
 import { context, doc, subject } from './setup'
 
@@ -170,70 +171,23 @@ l:du schema:name "Dutch"@en.
     <http://www.w3.org/1999/02/22-rdf-syntax-ns#rest> :b5591_n3-000.
 
 `
-// TODO(refactor): Revisit CV assertions after resume data model and rendering are finalized.
-describe.skip('profile-pane', () => {
-  let element: HTMLElement
-
-  describe('curriculum vitae', () => {
-        it('returns the correct number of unique known languages', () => {
-          const { presentCV } = require('../src/legacy/CVPresenter')
-          const result = presentCV(subject, store)
-          // You can adjust the expected count if the profile changes
-          expect(result.languages.length).toBe(4)
-          expect(result.languages).toEqual(expect.arrayContaining([
-            expect.stringMatching(/French/i),
-            expect.stringMatching(/germano|german/i),
-            expect.stringMatching(/Spanish/i),
-            expect.stringMatching(/Dutch/i)
-          ]))
-        })
-    beforeAll(async () => {
-      store.removeDocument(doc)
-      parse(exampleProfile, store, doc.uri)
-      const result = pane.render(subject, context)
-      element = await findByTestId(result, 'curriculum-vitae')
-    })
+describe('profile pane curriculum vitae', () => {
+  beforeEach(() => {
+    store.removeDocument(doc)
+})
 
-    it('renders role testeuse d’accessibilité in bio', () => {
-      expect(element).toContainHTML('testeuse D’accessibilité')
-    })
-    it('renders organization Apple in list', () => {
-      expect(element).toContainHTML('Apple')
-    })
-    it('renders lone start date in list', () => {
-      expect(element).toContainHTML('(2021-04-01 to')
-    })
-    it('renders start and end dates in role', () => {
-      expect(element).toContainHTML('(1960-04-01 to 1963-04-01)')
-    })
-    it('renders skill 1 in CV', () => {
-      expect(element).toContainHTML('Tester Du Matériel D’instrumentation')
-    })
-    it('renders skill 2 in CV', () => {
-      expect(element).toContainHTML('Travailler Dans De Mauvaises Conditions')
-    })
-    it('renders skill 3 vcard role in CV', () => {
-      expect(element).toContainHTML('Sitting')
-    })
-    // If we have an empty skill node we do not display it at all ANYMORE
-    it('renders three skills in CV', () => {
-      const skills = element.querySelectorAll('.cvSkill')
-      expect(skills.length).toBe(3)
-    })
-    it('renders languages', () => {
-      expect(element).toContainHTML('Fr')
-    })
+  it('renders resume roles using the current CV section contract', async () => {
+    parse(exampleProfile, store, doc.uri)
+    const result = pane.render(subject, context)
 
-    it('renders languages', () => {
-      expect(element).toContainHTML('De')
-    })
-    
-    it('renders languages', () => {
-      expect(element).toContainHTML('Spanish')
+    await waitFor(() => {
+      const cv = result.querySelector('[data-testid="curriculum-vitae"]') as HTMLElement | null
+      expect(cv).not.toBeNull()
+      expect(cv?.textContent).toContain('Apple')
+      expect(cv?.textContent).toContain('The Beatles')
     })
-     it('renders languages', () => {
-      expect(element).toContainHTML('Dutch')
-    })
-  })
 
+        const roles = result.querySelectorAll('.resume-card__item')
+    expect(roles.length).toBe(4)
+  })
 })
diff --git a/test/dialog.accessibility.test.ts b/test/dialog.accessibility.test.ts
new file mode 100644
index 00000000..b5a9cfda
--- /dev/null
+++ b/test/dialog.accessibility.test.ts
@@ -0,0 +1,513 @@
+import { describe, expect, it } from '@jest/globals'
+import { graph, sym } from 'rdflib'
+import { ns } from 'solid-ui'
+import { createLanguageEditDialog } from '../src/sections/languages/LanguageEditDialog'
+import { createResumeEditDialog } from '../src/sections/resume/ResumeEditDialog'
+import { createSkillsEditDialog } from '../src/sections/skills/SkillsEditDialog'
+import { createSocialEditDialog } from '../src/sections/social/SocialEditDialog'
+import { getSharedDialogCancelButton, getSharedDialogSaveButton, openInputDialog } from '../src/ui/dialog'
+import { runAxe } from './helpers/runAxe'
+
+async function waitForFrame(): Promise<void> {
+  await new Promise<void>((resolve) => {
+    if (typeof window.requestAnimationFrame === 'function') {
+      window.requestAnimationFrame(() => resolve())
+      return
+    }
+
+    setTimeout(resolve, 0)
+  })
+}
+
+async function waitForDialogFocus(): Promise<void> {
+  await waitForFrame()
+  await waitForFrame()
+  await waitForFrame()
+}
+
+describe('Dialog accessibility', () => {
+  it('mounts the shared dialog inside the profile pane root when available', async () => {
+    const paneRoot = document.createElement('div')
+    paneRoot.className = 'profile-pane-root'
+    document.body.appendChild(paneRoot)
+
+    const form = document.createElement('form')
+    const input = document.createElement('input')
+    input.name = 'displayName'
+    form.appendChild(input)
+    paneRoot.appendChild(form)
+
+    const resultPromise = openInputDialog({
+      title: 'Edit display name',
+      dom: document,
+      form,
+      headerAction: { type: 'none' }
+    })
+
+    const dialog = paneRoot.querySelector('#profile-modal') as HTMLDialogElement | null
+    expect(dialog).not.toBeNull()
+    expect(document.body.querySelector(':scope > #profile-modal')).toBeNull()
+
+    getSharedDialogCancelButton(document)?.click()
+    await expect(resultPromise).resolves.toBeNull()
+  })
+
+  it('has no accessibility violations for the shared input dialog', async () => {
+    const form = document.createElement('form')
+    const label = document.createElement('label')
+    label.textContent = 'Display name'
+    const input = document.createElement('input')
+    input.name = 'displayName'
+    label.appendChild(input)
+    form.appendChild(label)
+
+    const resultPromise = openInputDialog({
+      title: 'Edit display name',
+      dom: document,
+      form,
+      headerAction: { type: 'none' }
+    })
+
+    const dialog = document.querySelector('#profile-modal') as HTMLDialogElement | null
+    expect(dialog).not.toBeNull()
+
+    const results = await runAxe(document.body)
+    expect(results.violations.length).toBe(0)
+
+    const cancelButton = getSharedDialogCancelButton(document)
+    cancelButton?.click()
+
+    await expect(resultPromise).resolves.toBeNull()
+  })
+
+  it('keeps the submit label singular after a failed save attempt', async () => {
+    const form = document.createElement('form')
+    const input = document.createElement('input')
+    input.name = 'displayName'
+    form.appendChild(input)
+
+    const resultPromise = openInputDialog({
+      title: 'Edit display name',
+      dom: document,
+      form,
+      headerAction: { type: 'none' },
+      onSave: async () => {
+        throw new Error('Save failed')
+      }
+    })
+
+    const saveButton = getSharedDialogSaveButton(document)
+    expect(saveButton?.textContent).toBe('Save Changes')
+
+    saveButton?.click()
+    await new Promise(resolve => setTimeout(resolve, 0))
+
+    const errorSection = document.querySelector('#modal-error') as HTMLElement | null
+    expect(errorSection).not.toBeNull()
+    expect(errorSection?.getAttribute('role')).toBe('alert')
+    expect(errorSection?.getAttribute('aria-live')).toBe('assertive')
+    expect(errorSection?.getAttribute('aria-atomic')).toBe('true')
+    expect(errorSection?.getAttribute('aria-hidden')).toBe('false')
+    expect(document.activeElement).toBe(errorSection)
+
+    expect(saveButton?.textContent).toBe('Save Changes')
+
+    const cancelButton = getSharedDialogCancelButton(document)
+    cancelButton?.click()
+
+    await expect(resultPromise).resolves.toBeNull()
+  })
+
+  it('announces validation errors accessibly and remains axe-clean while visible', async () => {
+    const form = document.createElement('form')
+    const input = document.createElement('input')
+    input.name = 'displayName'
+    form.appendChild(input)
+
+    const resultPromise = openInputDialog({
+      title: 'Edit display name',
+      dom: document,
+      form,
+      headerAction: { type: 'none' },
+      validate: () => 'Display name is required.'
+    })
+
+    const saveButton = getSharedDialogSaveButton(document)
+    saveButton?.click()
+    await new Promise(resolve => setTimeout(resolve, 0))
+
+    const errorSection = document.querySelector('#modal-error') as HTMLElement | null
+    expect(errorSection).not.toBeNull()
+    expect(errorSection?.textContent).toBe('Display name is required.')
+    expect(errorSection?.getAttribute('role')).toBe('alert')
+    expect(errorSection?.getAttribute('aria-live')).toBe('assertive')
+    expect(errorSection?.getAttribute('aria-atomic')).toBe('true')
+    expect(errorSection?.getAttribute('aria-hidden')).toBe('false')
+    expect(document.activeElement).toBe(errorSection)
+
+    const results = await runAxe(document.body)
+    expect(results.violations.length).toBe(0)
+
+    getSharedDialogCancelButton(document)?.click()
+    await expect(resultPromise).resolves.toBeNull()
+  })
+
+  it('announces save errors accessibly and remains axe-clean while visible', async () => {
+    const form = document.createElement('form')
+    const input = document.createElement('input')
+    input.name = 'displayName'
+    form.appendChild(input)
+
+    const resultPromise = openInputDialog({
+      title: 'Edit display name',
+      dom: document,
+      form,
+      headerAction: { type: 'none' },
+      onSave: async () => {
+        throw new Error('Save failed')
+      }
+    })
+
+    getSharedDialogSaveButton(document)?.click()
+    await new Promise(resolve => setTimeout(resolve, 0))
+
+    const errorSection = document.querySelector('#modal-error') as HTMLElement | null
+    expect(errorSection).not.toBeNull()
+    expect(errorSection?.textContent).toBe('Save failed')
+    expect(errorSection?.getAttribute('role')).toBe('alert')
+    expect(errorSection?.getAttribute('aria-live')).toBe('assertive')
+    expect(errorSection?.getAttribute('aria-atomic')).toBe('true')
+    expect(errorSection?.getAttribute('aria-hidden')).toBe('false')
+    expect(document.activeElement).toBe(errorSection)
+
+    const results = await runAxe(document.body)
+    expect(results.violations.length).toBe(0)
+
+    getSharedDialogCancelButton(document)?.click()
+    await expect(resultPromise).resolves.toBeNull()
+  })
+
+  it('makes the dialog body inert while save is in progress', async () => {
+    let resolveSave: (() => void) | undefined
+
+    const form = document.createElement('form')
+    const input = document.createElement('input')
+    input.name = 'displayName'
+    form.appendChild(input)
+
+    const resultPromise = openInputDialog({
+      title: 'Edit display name',
+      dom: document,
+      form,
+      headerAction: { type: 'none' },
+      onSave: () => new Promise<void>((resolve) => {
+        resolveSave = resolve
+      })
+    })
+
+    input.focus()
+
+    const dialog = document.querySelector('#profile-modal') as HTMLDialogElement | null
+    const description = document.querySelector('#modal-desc') as HTMLDivElement | null
+    const overlay = document.querySelector('#modal-saving-overlay') as HTMLDivElement | null
+    const saveButton = getSharedDialogSaveButton(document)
+
+    saveButton?.click()
+    await new Promise(resolve => setTimeout(resolve, 0))
+
+    expect(dialog?.classList.contains('modal--saving')).toBe(true)
+    expect(dialog?.getAttribute('aria-busy')).toBe('true')
+    expect(description?.hasAttribute('inert')).toBe(true)
+    expect(document.activeElement).not.toBe(input)
+    expect(overlay?.hidden).toBe(false)
+
+    if (resolveSave) {
+      resolveSave()
+    }
+    await expect(resultPromise).resolves.toEqual({ displayName: '' })
+  })
+
+  /* Function below generated by AI Model: GPT-5.4 */
+  /* Prompt: add keyboard interaction coverage for the shared dialog so we verify initial focus placement and focus restoration when the dialog is cancelled */
+  it('moves focus into the dialog and restores it after cancel', async () => {
+    const trigger = document.createElement('button')
+    trigger.textContent = 'Open dialog'
+    document.body.appendChild(trigger)
+    trigger.focus()
+
+    const form = document.createElement('form')
+    const label = document.createElement('label')
+    label.textContent = 'Display name'
+    const input = document.createElement('input')
+    input.name = 'displayName'
+    label.appendChild(input)
+    form.appendChild(label)
+
+    const resultPromise = openInputDialog({
+      title: 'Edit display name',
+      dom: document,
+      form,
+      headerAction: { type: 'none' }
+    })
+
+    expect(document.activeElement).toBe(input)
+
+    const dialog = document.querySelector('#profile-modal') as HTMLDialogElement | null
+    expect(dialog).not.toBeNull()
+
+    const cancelEvent = new Event('cancel', { bubbles: false, cancelable: true })
+    dialog?.dispatchEvent(cancelEvent)
+
+    await expect(resultPromise).resolves.toBeNull()
+    expect(document.activeElement).toBe(trigger)
+  })
+
+  it('opens social, skills, and language dialogs with focus on the first field while keeping popups closed', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const trigger = document.createElement('button')
+    trigger.textContent = 'Open dialog'
+    document.body.appendChild(trigger)
+
+    const socialPromise = createSocialEditDialog(
+      { currentTarget: trigger } as unknown as Event,
+      store,
+      subject,
+      [],
+      'owner'
+    )
+
+    await waitForDialogFocus()
+
+    const socialSelect = document.querySelector('solid-ui-select[data-social-account-row-index="0"]') as HTMLElement | null
+    expect(socialSelect).not.toBeNull()
+    expect(socialSelect?.shadowRoot?.activeElement?.tagName).toBe('BUTTON')
+    expect(socialSelect?.hasAttribute('popup-open')).toBe(false)
+
+    getSharedDialogCancelButton(document)?.click()
+    await expect(socialPromise).resolves.toBeUndefined()
+
+    const skillsPromise = createSkillsEditDialog(
+      { currentTarget: trigger } as unknown as Event,
+      store,
+      subject,
+      [],
+      'owner'
+    )
+
+    await waitForDialogFocus()
+
+    const skillsCombobox = document.querySelector('solid-ui-combobox[data-skill-row-index="0"]') as (HTMLElement & { _popupOpen?: boolean }) | null
+    expect(skillsCombobox).not.toBeNull()
+    expect(skillsCombobox?.shadowRoot?.activeElement?.tagName).toBe('INPUT')
+    expect(skillsCombobox?._popupOpen).toBe(false)
+
+    getSharedDialogCancelButton(document)?.click()
+    await expect(skillsPromise).resolves.toBeUndefined()
+
+    const languagePromise = createLanguageEditDialog(
+      { currentTarget: trigger } as unknown as Event,
+      store,
+      subject,
+      [],
+      'owner'
+    )
+
+    await waitForDialogFocus()
+
+    const languageCombobox = document.querySelector('solid-ui-combobox[data-language-row-index="0"]') as (HTMLElement & { _popupOpen?: boolean }) | null
+    expect(languageCombobox).not.toBeNull()
+    expect(languageCombobox?.shadowRoot?.activeElement?.tagName).toBe('INPUT')
+    expect(languageCombobox?._popupOpen).toBe(false)
+
+    getSharedDialogCancelButton(document)?.click()
+    await expect(languagePromise).resolves.toBeUndefined()
+  })
+
+  it('treats typed custom skills as changes and saves them from the dialog', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const trigger = document.createElement('button')
+    trigger.textContent = 'Open dialog'
+    document.body.appendChild(trigger)
+
+    store.fetcher = {
+      load: async () => undefined
+    }
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(statement.subject, statement.predicate, statement.object, statement.why))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    const skillsPromise = createSkillsEditDialog(
+      { currentTarget: trigger } as unknown as Event,
+      store,
+      subject,
+      [],
+      'owner'
+    )
+
+    await waitForDialogFocus()
+
+    const skillsCombobox = document.querySelector('solid-ui-combobox[data-skill-row-index="0"]') as HTMLElement | null
+    const skillsInput = skillsCombobox?.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    expect(skillsInput).not.toBeNull()
+
+    skillsInput!.value = 'Facilitation'
+    skillsInput!.dispatchEvent(new Event('input', { bubbles: true, composed: true }))
+
+    await waitForDialogFocus()
+
+    getSharedDialogSaveButton(document)?.click()
+    await expect(skillsPromise).resolves.toBeUndefined()
+
+    const skillLinks = store.statementsMatching(subject, ns.schema('skills'), null, doc)
+    expect(skillLinks).toHaveLength(1)
+
+    const entryNode = skillLinks[0].object
+    const publicIdLink = store.any(entryNode, ns.solid('publicId'), null, doc)
+    expect(publicIdLink?.termType).toBe('BlankNode')
+
+    const skillName = store.any(publicIdLink as any, ns.schema('name'), null, doc)
+    expect(skillName?.value).toBe('Facilitation')
+  })
+
+  it('keeps a typed custom skill when using Add More before saving', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const trigger = document.createElement('button')
+    trigger.textContent = 'Open dialog'
+    document.body.appendChild(trigger)
+
+    store.fetcher = {
+      load: async () => undefined
+    }
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(statement.subject, statement.predicate, statement.object, statement.why))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    const skillsPromise = createSkillsEditDialog(
+      { currentTarget: trigger } as unknown as Event,
+      store,
+      subject,
+      [],
+      'owner'
+    )
+
+    await waitForDialogFocus()
+
+    const firstSkillsCombobox = document.querySelector('solid-ui-combobox[data-skill-row-index="0"]') as HTMLElement | null
+    const firstSkillsInput = firstSkillsCombobox?.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    expect(firstSkillsInput).not.toBeNull()
+
+    firstSkillsInput!.value = 'Facilitation'
+    firstSkillsInput!.dispatchEvent(new Event('input', { bubbles: true, composed: true }))
+
+    const addMoreButton = document.querySelector('#modal-header-action solid-ui-button') as HTMLElement | null
+    expect(addMoreButton).not.toBeNull()
+    addMoreButton?.click()
+
+    await waitForDialogFocus()
+
+    const preservedCombobox = document.querySelector('solid-ui-combobox[data-skill-row-index="1"]') as HTMLElement | null
+    const preservedInput = preservedCombobox?.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    expect(preservedInput?.value).toBe('Facilitation')
+
+    getSharedDialogSaveButton(document)?.click()
+    await expect(skillsPromise).resolves.toBeUndefined()
+
+    const skillLinks = store.statementsMatching(subject, ns.schema('skills'), null, doc)
+    expect(skillLinks).toHaveLength(1)
+
+    const entryNode = skillLinks[0].object
+    const publicIdLink = store.any(entryNode, ns.solid('publicId'), null, doc)
+    const skillName = store.any(publicIdLink as any, ns.schema('name'), null, doc)
+    expect(skillName?.value).toBe('Facilitation')
+  })
+
+  it('treats typed custom resume organizations as changes and saves them from the dialog', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const trigger = document.createElement('button')
+    trigger.textContent = 'Open dialog'
+    document.body.appendChild(trigger)
+
+    store.fetcher = {
+      load: async () => undefined
+    }
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(statement.subject, statement.predicate, statement.object, statement.why))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    const resumePromise = createResumeEditDialog(
+      { currentTarget: trigger } as unknown as Event,
+      store,
+      subject,
+      [],
+      'owner',
+      async () => undefined
+    )
+
+    await waitForDialogFocus()
+
+    const titleInput = document.querySelector('[name="resume-title-0"]') as HTMLInputElement | null
+    const organizationCombobox = document.querySelector('solid-ui-combobox[data-resume-organization-index="0"]') as HTMLElement | null
+    const organizationInput = organizationCombobox?.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    const currentRoleCheckbox = document.querySelector('#resume-current-role-0') as HTMLInputElement | null
+    expect(titleInput).not.toBeNull()
+    expect(organizationInput).not.toBeNull()
+    expect(currentRoleCheckbox).not.toBeNull()
+
+    titleInput!.value = 'Engineer'
+    titleInput!.dispatchEvent(new Event('change', { bubbles: true }))
+
+    currentRoleCheckbox!.checked = true
+    currentRoleCheckbox!.dispatchEvent(new Event('change', { bubbles: true }))
+
+    organizationInput!.value = 'N'
+    organizationInput!.dispatchEvent(new Event('input', { bubbles: true, composed: true }))
+
+    await waitForDialogFocus()
+
+    const refreshedOrganizationCombobox = document.querySelector('solid-ui-combobox[data-resume-organization-index="0"]') as HTMLElement | null
+    const refreshedOrganizationInput = refreshedOrganizationCombobox?.shadowRoot?.querySelector('input') as HTMLInputElement | null
+    expect(refreshedOrganizationInput?.value).toBe('N')
+
+    refreshedOrganizationInput!.value = 'NASA'
+    refreshedOrganizationInput!.dispatchEvent(new Event('input', { bubbles: true, composed: true }))
+
+    await waitForDialogFocus()
+
+      const persistedOrganizationInput = document
+        .querySelector('solid-ui-combobox[data-resume-organization-index="0"]')
+        ?.shadowRoot?.querySelector('input') as HTMLInputElement | null
+      expect(persistedOrganizationInput?.value).toBe('NASA')
+
+    getSharedDialogSaveButton(document)?.click()
+    await expect(resumePromise).resolves.toBeUndefined()
+
+    const membershipLinks = store.statementsMatching(null, ns.org('member'), subject, doc)
+    expect(membershipLinks.length).toBeGreaterThan(0)
+
+    const membershipNode = membershipLinks[0].subject
+    const organizationNode = store.any(membershipNode as any, ns.org('organization'), null, doc)
+    expect(organizationNode).toBeTruthy()
+
+    const organizationName = store.any(organizationNode as any, ns.schema('name'), null, doc)
+    expect(organizationName?.value).toBe('NASA')
+  })
+})
diff --git a/test/edit-dialog-phone-values.test.ts b/test/edit-dialog-phone-values.test.ts
new file mode 100644
index 00000000..71732e63
--- /dev/null
+++ b/test/edit-dialog-phone-values.test.ts
@@ -0,0 +1,218 @@
+import { afterEach, beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { graph, sym } from 'rdflib'
+import { createHeadingEditDialog } from '../src/sections/heading/HeadingEditDialog'
+import { createContactInfoEditDialog } from '../src/sections/contactInfo/ContactInfoEditDialog'
+import type { ContactMutationPlan } from '../src/sections/contactInfo/types'
+import type { HeadingMutationPlan, ProfileDetails } from '../src/sections/heading/types'
+import { getSharedDialogCancelButton, getSharedDialogSaveButton } from '../src/ui/dialog'
+
+const mockProcessHeadingMutations = jest.fn<(_: unknown, __: unknown, plan: HeadingMutationPlan) => Promise<void>>()
+const mockProcessContactInfoMutations = jest.fn<(_: unknown, __: unknown, plan: ContactMutationPlan) => Promise<void>>()
+const mockUploadPhotoFile = jest.fn<(_: unknown, __: unknown, ___: File) => Promise<string>>()
+const mockDeletePhotoFile = jest.fn<(_: unknown, __: unknown, ___: string) => Promise<void>>()
+const mockResolvePhotoDisplaySrc = jest.fn<(_: unknown, __?: string) => Promise<string | undefined>>()
+
+jest.mock('../src/sections/heading/mutations', () => ({
+  processHeadingMutations: (...args: Parameters<typeof mockProcessHeadingMutations>) => mockProcessHeadingMutations(...args)
+}))
+
+jest.mock('../src/sections/contactInfo/mutations', () => ({
+  processContactInfoMutations: (...args: Parameters<typeof mockProcessContactInfoMutations>) => mockProcessContactInfoMutations(...args)
+}))
+
+jest.mock('../src/sections/heading/imageHelpers', () => ({
+  uploadPhotoFile: (...args: Parameters<typeof mockUploadPhotoFile>) => mockUploadPhotoFile(...args),
+  deletePhotoFile: (...args: Parameters<typeof mockDeletePhotoFile>) => mockDeletePhotoFile(...args),
+  resolvePhotoDisplaySrc: (...args: Parameters<typeof mockResolvePhotoDisplaySrc>) => mockResolvePhotoDisplaySrc(...args)
+}))
+
+function dispatchInput(input: HTMLInputElement, value: string) {
+  input.value = value
+  input.dispatchEvent(new Event('input', { bubbles: true }))
+}
+
+async function flushUi() {
+  await new Promise(resolve => setTimeout(resolve, 0))
+  await new Promise(resolve => setTimeout(resolve, 0))
+}
+
+function createDialogEvent() {
+  const trigger = document.createElement('button')
+  document.body.appendChild(trigger)
+  return new MouseEvent('click', { bubbles: true, composed: true })
+}
+
+describe('Edit dialog phone value regression', () => {
+  beforeEach(() => {
+    mockProcessHeadingMutations.mockReset()
+    mockProcessContactInfoMutations.mockReset()
+    mockUploadPhotoFile.mockReset()
+    mockDeletePhotoFile.mockReset()
+    mockResolvePhotoDisplaySrc.mockReset()
+    mockProcessHeadingMutations.mockResolvedValue(undefined)
+    mockProcessContactInfoMutations.mockResolvedValue(undefined)
+    mockUploadPhotoFile.mockResolvedValue('https://example.com/profile/avatar.png')
+    mockDeletePhotoFile.mockResolvedValue(undefined)
+    mockResolvePhotoDisplaySrc.mockImplementation(async (_store, imageSrc) => imageSrc)
+
+    Object.defineProperty(URL, 'createObjectURL', {
+      configurable: true,
+      value: jest.fn(() => 'blob:heading-preview')
+    })
+    Object.defineProperty(URL, 'revokeObjectURL', {
+      configurable: true,
+      value: jest.fn()
+    })
+  })
+
+  afterEach(() => {
+    document.body.innerHTML = ''
+  })
+
+  it('shows a numbered validation error when the heading phone contains spaces', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const profileData: ProfileDetails = {
+      entryNode: subject,
+      name: 'Jane Doe'
+    }
+
+    const resultPromise = createHeadingEditDialog(createDialogEvent(), store, subject, profileData, 'owner')
+    await flushUi()
+
+    const phoneInput = document.querySelector('input[name="phone-value"]') as HTMLInputElement | null
+    expect(phoneInput).not.toBeNull()
+
+    dispatchInput(phoneInput as HTMLInputElement, '555 123 4567')
+
+    getSharedDialogSaveButton(document)?.click()
+    await flushUi()
+
+    const errorBox = document.querySelector('#modal-error') as HTMLElement | null
+    expect(errorBox?.textContent).toBe('Phone Number 1 should contain only numbers.')
+    expect(mockProcessHeadingMutations).not.toHaveBeenCalled()
+
+    getSharedDialogCancelButton(document)?.click()
+    await resultPromise
+  })
+
+  it('keeps the uploaded heading photo visible in the preview frame', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const profileData: ProfileDetails = {
+      entryNode: subject,
+      name: 'Jane Doe',
+      imageSrc: 'https://example.com/profile/original.png'
+    }
+
+    const resultPromise = createHeadingEditDialog(createDialogEvent(), store, subject, profileData, 'owner')
+    await flushUi()
+
+    const uploadButton = document.querySelector('.profile-edit-dialog__image-upload-button') as HTMLElement | null
+    expect(uploadButton).not.toBeNull()
+
+    uploadButton?.click()
+    await flushUi()
+
+    const fileInput = document.querySelector('input[type="file"]') as HTMLInputElement | null
+    expect(fileInput).not.toBeNull()
+
+    const file = new File(['image-bytes'], 'avatar.png', { type: 'image/png' })
+    Object.defineProperty(fileInput as HTMLInputElement, 'files', {
+      configurable: true,
+      value: [file]
+    })
+
+    fileInput?.dispatchEvent(new Event('change', { bubbles: true }))
+    await flushUi()
+
+    const heroImage = document.querySelector('.profile-edit-dialog__image-frame .profile__hero') as HTMLImageElement | null
+    expect(mockUploadPhotoFile).toHaveBeenCalledTimes(1)
+    expect(URL.createObjectURL).toHaveBeenCalledWith(file)
+    expect(heroImage?.getAttribute('src')).toBe('blob:heading-preview')
+
+    getSharedDialogCancelButton(document)?.click()
+    await resultPromise
+  })
+
+  it('shows an existing heading photo in the edit dialog when the display source resolves', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const profileData: ProfileDetails = {
+      entryNode: subject,
+      name: 'Jane Doe',
+      imageSrc: 'https://example.com/profile/existing.png'
+    }
+    mockResolvePhotoDisplaySrc.mockResolvedValueOnce('blob:existing-heading-preview')
+
+    const resultPromise = createHeadingEditDialog(createDialogEvent(), store, subject, profileData, 'owner')
+    await flushUi()
+
+    const heroImage = document.querySelector('.profile-edit-dialog__image-frame .profile__hero') as HTMLImageElement | null
+    expect(mockResolvePhotoDisplaySrc).toHaveBeenCalledWith(store, 'https://example.com/profile/existing.png')
+    expect(heroImage?.getAttribute('src')).toBe('blob:existing-heading-preview')
+
+    getSharedDialogCancelButton(document)?.click()
+    await resultPromise
+  })
+
+  it('persists default heading phone and email types when existing values have no stored type', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const profileData: ProfileDetails = {
+      entryNode: subject,
+      name: 'Jane Doe',
+      primaryPhone: {
+        entryNode: sym('https://example.com/profile/card#phone'),
+        type: undefined as any,
+        valueNode: sym('tel:5551234567')
+      },
+      primaryEmail: {
+        entryNode: sym('https://example.com/profile/card#email'),
+        type: undefined as any,
+        valueNode: sym('mailto:jane@example.com')
+      }
+    }
+
+    const resultPromise = createHeadingEditDialog(createDialogEvent(), store, subject, profileData, 'owner')
+    await flushUi()
+
+    getSharedDialogSaveButton(document)?.click()
+    await resultPromise
+
+    expect(mockProcessHeadingMutations).toHaveBeenCalledTimes(1)
+    const plan = mockProcessHeadingMutations.mock.calls[0][2]
+    expect(plan.phoneOps.update).toHaveLength(1)
+    expect(plan.phoneOps.update[0]?.type).toBe('Cell')
+    expect(plan.emailOps.update).toHaveLength(1)
+    expect(plan.emailOps.update[0]?.type).toBe('Home')
+  })
+
+  it('shows a numbered validation error when the contact info phone contains spaces', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const resultPromise = createContactInfoEditDialog(
+      new MouseEvent('click', { bubbles: true, composed: true }),
+      store,
+      subject,
+      { emails: [], phones: [], addresses: [] },
+      'owner'
+    )
+    await flushUi()
+
+    const phoneInput = document.querySelector('input[name="phone-value-0"]') as HTMLInputElement | null
+    expect(phoneInput).not.toBeNull()
+
+    dispatchInput(phoneInput as HTMLInputElement, '555 123 4567')
+
+    getSharedDialogSaveButton(document)?.click()
+    await flushUi()
+
+    const errorBox = document.querySelector('#modal-error') as HTMLElement | null
+    expect(errorBox?.textContent).toBe('Phone Number 1 should contain only numbers.')
+    expect(mockProcessContactInfoMutations).not.toHaveBeenCalled()
+
+    getSharedDialogCancelButton(document)?.click()
+    await resultPromise
+  })
+})
\ No newline at end of file
diff --git a/test/edit-profile.spec.ts b/test/edit-profile.spec.ts
index eb20619d..ce1c10b2 100644
--- a/test/edit-profile.spec.ts
+++ b/test/edit-profile.spec.ts
@@ -1,58 +1,59 @@
+// Preserved for later reuse when the dedicated edit-profile pane entrypoint returns.
+// These skipped tests still capture the older editor-pane contract and can be adapted
+// once edit-profile rendering is wired back into the current surface.
+
+import { beforeAll, describe, expect, it } from '@jest/globals'
 import pane from '../src/index'
 import { parse } from 'rdflib'
-import { store, authn } from 'solid-logic'
-// import { findByTestId } from "@testing-library/dom";
+import { store } from 'solid-logic'
 import { context, doc, subject, fakeLogInAs } from './setup'
 
-
-// import exampleProfile from './examples/testingsolidos.ttl'
-
-
-function delay(ms) {
+function delay(ms: number) {
   return new Promise(resolve => setTimeout(resolve, ms))
 }
+
 const exampleProfile = `
              @prefix : <https://janedoe.example/profile/card#> .
     @prefix Ber: <https://www.w3.org/People/Berners-Lee/> .
     @prefix foaf: <http://xmlns.com/foaf/0.1/> .
     @prefix prof: <https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#> .
     @prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#> .
-    
+
     :id1729675527480     a prof:BlueSkyAccount;
          foaf:accountName "timbl.bsky.social" .
-    
+
     :id1729912807298     a prof:FacebookAccount;
          foaf:accountName "tim.bernerslee.9" .
-    
+
     :id1729912986863     a prof:InstagramAccount;
          foaf:accountName "timblee" .
-    
+
     :id1730055928507     a prof:MastodonAccount;
          foaf:accountName "@timbl@w3c.social" .
-    
+
     :id1730056067040     a prof:RedditAccount .
-    
+
     :id1730056125033     a prof:RedditAccount;
          foaf:accountName "timbl" .
-    
+
     :id1730056175230     a prof:TwitterAccount;
          foaf:accountName "@timberners_lee" .
-    
+
     :id1730056248989     a prof:OtherAccount;
          rdfs:label "My homepage at W3C";
          foaf:homepage Ber:;
          foaf:icon <https://www.w3.org/assets/logos/w3c/w3c-bars.svg> .
-    
+
     :id1730058497607     a prof:SnapchatAccount .
-    
+
     :id1730059685809     a prof:TiktokAccount .
-    
+
     :id1730387315524     a prof:GithubAccount;
          foaf:accountName "timbl" .
-    
+
     :id1730387353050     a prof:MatrixAccount;
          foaf:accountName " @timbl-54d26c98db8155e6700f7312:gitter.im" .
-    
+
     :me     foaf:account  (
         :id1729675527480
         :id1729912807298
@@ -65,56 +66,49 @@ const exampleProfile = `
         :id1730056248989
         :id1730058497607
         :id1730059685809 ) .
-    
 `
 
- // console.log('exampleProfile', exampleProfile)
+const editorPane = (pane as typeof pane & {
+  editor?: { render: (subject: unknown, context: unknown) => HTMLElement }
+}).editor
 
- const editorPane = pane.editor
- const user = authn.currentUser()
- console.log('Logged in user: ', user)
-
-// TODO(refactor): Re-enable after edit pane public entrypoint is finalized.
 describe.skip('edit-profile-pane', () => {
-  let element
+  let element: HTMLElement
 
   describe('edit social media (logged in)', () => {
     beforeAll(async () => {
+      if (!editorPane) return
+
       store.removeDocument(doc)
       parse(exampleProfile, store, doc.uri)
       fakeLogInAs(subject)
-      store.updater.editable = function () { console.log('nocked editable'); return 'SPARQL'}
+      store.updater.editable = function () { return 'SPARQL' }
       const result = editorPane.render(subject, context)
-      //console.log('editorPane name ', editorPane.name )
-      //console.log('editorPane rendered 1 <<< ', result.innerHTML , '>>>')
       await delay(3000)
-      //console.log('editorPane rendered later 1 <<< ', result.outerHTML , '>>>')
 
       element = result
     })
 
     it('renders the social networks', () => {
-      expect(element).toContainHTML('Edit your profile')
+      expect(element.innerHTML).toContain('Edit your profile')
     })
-
   })
 
   describe('edit social media (Not logged in)', () => {
     beforeAll(async () => {
+      if (!editorPane) return
+
       store.removeDocument(doc)
       parse(exampleProfile, store, doc.uri)
       fakeLogInAs(null)
-      store.updater.editable = function () { console.log('nocked editable'); return 'SPARQL'}
+      store.updater.editable = function () { return 'SPARQL' }
       const result = editorPane.render(subject, context)
       await delay(3000)
       element = result
-      // element = await findByTestId(result, "profile-editor");
     })
 
     it('gives you a log in button', () => {
-      expect(element).toContainHTML('Log in')
+      expect(element.innerHTML).toContain('Log in')
     })
-    
   })
-
-})
+})
\ No newline at end of file
diff --git a/test/heading-actions-layout.test.ts b/test/heading-actions-layout.test.ts
new file mode 100644
index 00000000..581023b7
--- /dev/null
+++ b/test/heading-actions-layout.test.ts
@@ -0,0 +1,90 @@
+jest.mock('@solid-data-modules/contacts-rdflib', () => ({
+  __esModule: true,
+  default: jest.fn().mockImplementation(() => ({
+    listAddressBooks: jest.fn(async () => ({ publicUris: [], privateUris: [] })),
+    createNewContact: jest.fn()
+  }))
+}))
+
+import { beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { waitFor } from '@testing-library/dom'
+import { parse, sym } from 'rdflib'
+import { store } from 'solid-logic'
+import pane from '../src/index'
+import { context, fakeLogInAs } from './setup'
+
+const viewedSubject = sym('https://alice.example/profile/card#me')
+const viewedDoc = viewedSubject.doc()
+
+const headingProfile = `
+  @prefix : <#>.
+  @prefix foaf: <http://xmlns.com/foaf/0.1/> .
+  @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
+
+  :me
+    a foaf:Person;
+    foaf:name "Alice Example";
+    vcard:role "Community Builder".
+`
+
+describe('heading action layout', () => {
+  const baseStore = context.session.store as any
+
+  beforeEach(() => {
+    store.removeDocument(viewedDoc)
+    parse(headingProfile, store, viewedDoc.uri, 'text/turtle')
+    baseStore.fetcher = {
+      ...baseStore.fetcher,
+      load: jest.fn(async () => undefined)
+    }
+    baseStore.updater = {
+      ...baseStore.updater,
+      update: jest.fn(async () => undefined)
+    }
+    baseStore.whether = jest.fn().mockReturnValue(0)
+  })
+
+  it('renders the add-friends action in the heading top-right action container for authenticated viewers', async () => {
+    fakeLogInAs(sym('https://viewer.example/profile/card#me'))
+
+    const result = pane.render(viewedSubject, context)
+    document.body.appendChild(result)
+
+    await waitFor(() => {
+      const headingSection = result.querySelector('[data-profile-section="heading"]') as HTMLElement | null
+      expect(headingSection).not.toBeNull()
+
+      const actions = headingSection?.querySelector('.profile__heading-actions') as HTMLElement | null
+      expect(actions).not.toBeNull()
+      expect(actions?.querySelector('.profile-friends-button__section')).not.toBeNull()
+      expect(actions?.querySelector('solid-ui-button.profile__btn-friends')).not.toBeNull()
+
+      const editAction = headingSection?.querySelector('.profile__heading-edit-action')
+      expect(editAction).toBeNull()
+    })
+
+    result.remove()
+  })
+
+  it('renders the edit action in the heading top-right edit container for the owner', async () => {
+    fakeLogInAs(viewedSubject)
+
+    const result = pane.render(viewedSubject, context)
+    document.body.appendChild(result)
+
+    await waitFor(() => {
+      const headingSection = result.querySelector('[data-profile-section="heading"]') as HTMLElement | null
+      expect(headingSection).not.toBeNull()
+
+      const editAction = headingSection?.querySelector('.profile__heading-edit-action') as HTMLElement | null
+      expect(editAction).not.toBeNull()
+      expect(editAction?.querySelector('solid-ui-button.profile__heading-action-button')).not.toBeNull()
+      expect(editAction?.querySelector('[aria-label="Add or edit heading information"]')).not.toBeNull()
+
+      const actions = headingSection?.querySelector('.profile__heading-actions')
+      expect(actions).toBeNull()
+    })
+
+    result.remove()
+  })
+})
\ No newline at end of file
diff --git a/test/helpers/runAxe.ts b/test/helpers/runAxe.ts
new file mode 100644
index 00000000..013146ab
--- /dev/null
+++ b/test/helpers/runAxe.ts
@@ -0,0 +1,51 @@
+import axe from 'axe-core'
+
+type RestorableAttribute = {
+  element: Element
+  name: string
+  value: string | null
+}
+
+function setTemporaryAttribute(
+  changes: RestorableAttribute[],
+  element: Element,
+  name: string,
+  value: string
+) {
+  changes.push({ element, name, value: element.getAttribute(name) })
+  element.setAttribute(name, value)
+}
+
+export async function runAxe(container: Element) {
+  const changes: RestorableAttribute[] = []
+
+  // JSDOM axe cannot inspect the native button inside solid-ui-button's shadow DOM,
+  // so tests temporarily mirror the host's button semantics before running axe.
+  container.querySelectorAll('solid-ui-button').forEach((button) => {
+    if (!button.hasAttribute('role')) {
+      setTemporaryAttribute(changes, button, 'role', 'button')
+    }
+
+    if (!button.hasAttribute('aria-label')) {
+      const fallbackLabel = button.getAttribute('label') || button.textContent?.trim()
+
+      if (fallbackLabel) {
+        setTemporaryAttribute(changes, button, 'aria-label', fallbackLabel)
+      }
+    }
+  })
+
+  try {
+    return await axe.run(container)
+  } finally {
+    for (let index = changes.length - 1; index >= 0; index -= 1) {
+      const change = changes[index]
+
+      if (change.value === null) {
+        change.element.removeAttribute(change.name)
+      } else {
+        change.element.setAttribute(change.name, change.value)
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/test/manual-axe-profile-card.ts b/test/manual-axe-profile-card.ts
index 020b9109..1348f571 100644
--- a/test/manual-axe-profile-card.ts
+++ b/test/manual-axe-profile-card.ts
@@ -15,9 +15,9 @@ import axe from 'axe-core';
 				<div class="details" role="text" aria-label="Pronouns: their/they/them">their/they/them</div>
 			</section>
 			<section class="profile__actions" aria-label="Actions" role="complementary">
-				<div class="center"><section class="buttonSubSection" aria-labelledby="add-me-to-your-friends-button-section" role="region" data-testid="button"><button class="profile__action-button">ADD ME TO YOUR FRIENDS</button></section></div>
+				<div class="center"><section class="profile-friends-button__section" aria-labelledby="add-me-to-your-friends-button-section" role="region" data-testid="button"><button class="profile__action-button">ADD ME TO YOUR FRIENDS</button></section></div>
 			</section>
-			<aside class="qrCodeSection" aria-label="Contact QR Code" role="complementary">
+			<aside class="profile__section profile__qr-code" aria-label="Contact QR Code" role="complementary">
 				<div>QR code here</div>
 			</aside>
 		</article>
diff --git a/test/profile-card.spec.ts b/test/profile-card.spec.ts
index fbd9bf06..b573a9a5 100644
--- a/test/profile-card.spec.ts
+++ b/test/profile-card.spec.ts
@@ -1,27 +1,22 @@
+import { describe, expect, it, beforeEach } from '@jest/globals'
 import pane from '../src/index'
 import { parse } from 'rdflib'
-import {
-  findByAltText,
-  findByTestId,
-  getByAltText,
-  queryByAltText,
-  waitFor,
-} from '@testing-library/dom'
+import { waitFor } from '@testing-library/dom'
 import { context, doc, subject } from './setup'
-import fetchMock from 'jest-fetch-mock'
 import { store } from 'solid-logic'
 
-// TODO(refactor): Revisit expectations after profile card/intro composition settles.
-describe.skip('profile-pane', () => { // alain
-  let result: HTMLElement
+describe('profile pane heading integration', () => {
+  beforeEach(() => {
+    store.removeDocument(doc)
+  })
 
-  describe('with full profile', () => {
-    beforeAll(async () => {
-      const turtle = `
+  it('renders the current heading contract for a populated profile', async () => {
+    const turtle = `
       @prefix : <#>.
       @prefix foaf: <http://xmlns.com/foaf/0.1/> .
       @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
       @prefix solid: <http://www.w3.org/ns/solid/terms#>.
+
       :me foaf:name "Jane Doe";
           foaf:img <https://janedoe.example/profile/me.jpg>;
           vcard:role "Test Double";
@@ -32,156 +27,20 @@ describe.skip('profile-pane', () => { // alain
           vcard:hasAddress [
             vcard:locality "Hamburg";
             vcard:country-name "Germany";
-          ];
-      .
-  `
-      parse(turtle, store, doc.uri)
-      result = pane.render(subject, context)
-      // Wait for async rendering to complete
-      await new Promise(resolve => setTimeout(resolve, 100))
-    })
-    // afterAll(() => { store.removeDocument(doc)})
-
-    it('renders the name', () =>
-      waitFor(() => {
-        const heading = result.querySelector('#profile-card-heading')
-        expect(heading).toHaveTextContent('Jane Doe') // Now uses proper foaf:name
-      })
-    )
-
-    it('renders the introduction', () =>
-      waitFor(() =>
-        expect(result).toContainHTML('Test Double at Solid Community')
-    ))
-
-    it('renders the location', () => {
-      expect(result).toContainHTML('🌐')
-      expect(result).toContainHTML('Hamburg, Germany')
-    })
-
-    it('renders the preferred Pronouns', () => {
-      expect(result).toContainHTML('their/they/them')
-    })
-
-    it('renders the image', () => {
-      // Check if any image is rendered first
-      const images = result.querySelectorAll('img')
-      if (images.length > 0) {
-        const image = getByAltText(result, 'Profile photo of Jane Doe')
-        expect(image).toHaveAttribute(
-          'src',
-          'https://janedoe.example/profile/me.jpg'
-        )
-      } else {
-        // If no image is rendered, that's also acceptable for now
-        expect(images.length).toBe(0)
-      }
-    })
-  })
-
-  describe.skip('with empty profile', () => { // alain
-    let card: HTMLElement
-    beforeAll(async () => {
-      result = pane.render(subject, context)
-      card = await findByTestId(result, 'profile-card')
-    })
-
-    it('renders only a makeshift name based on URI', () => {
-      expect(card.textContent.trim()).toContain('Jane Doe')
-    })
+          ].
+    `
 
-    it('does not render broken profile image', () => {
-      const image = queryByAltText(card, /.*/)
-      expect(image).toBeNull()
-    })
-  })
+    parse(turtle, store, doc.uri)
+    const result = pane.render(subject, context)
 
-  describe('with extended profile', () => {
-    beforeAll(async () => {
-      const turtle = `
-      @prefix : <#>.
-      @prefix foaf: <http://xmlns.com/foaf/0.1/> .
-      @prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#> .
-      :me foaf:name "Jane Doe";
-          rdfs:seeAlso <./more.ttl>, <./address.ttl>;
-      .`
-      parse(turtle, store, doc.uri)
-      fetchMock.mockOnceIf(
-        'https://janedoe.example/profile/more.ttl',
-        `
-              @prefix jane: </profile/card#>.
-      @prefix foaf: <http://xmlns.com/foaf/0.1/> .
-      @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
-      jane:me foaf:img <https://janedoe.example/profile/me.jpg>;
-          vcard:role "Test Double";
-          vcard:organization-name "Solid Community";
-      .
-      `,
-        {
-          headers: {
-            'Content-Type': 'text/turtle',
-          },
-        }
-      )
-      fetchMock.mockOnceIf(
-        'https://janedoe.example/profile/address.ttl',
-        `
-              @prefix jane: </profile/card#>.
-      @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
-      jane:me vcard:hasAddress [
-            vcard:locality "Hamburg";
-            vcard:country-name "Germany";
-          ];
-      .
-      `,
-        {
-          headers: {
-            'Content-Type': 'text/turtle',
-          },
-        }
-      )
-      result = pane.render(subject, context)
-      // Wait for async rendering to complete
-      await new Promise(resolve => setTimeout(resolve, 100))
+    await waitFor(() => {
+      expect(result.querySelector('#profile-name')?.textContent).toBe('Jane Doe')
+      expect(result.textContent).toContain('Test Double')
+      expect(result.textContent).toContain('Hamburg')
+      expect(result.textContent).toContain('Germany')
     })
-    // afterAll(() => { store.removeDocument(doc)})
 
-    it('renders the name', () =>
-      waitFor(() => {
-        const heading = result.querySelector('#profile-card-heading')
-        expect(heading).toHaveTextContent('Jane Doe') // Now uses proper foaf:name
-      }))
-
-    it('renders the introduction', () =>
-      waitFor(() =>
-        expect(result).toContainHTML('Test Double at Solid Community')
-      ))
-
-    it('renders the location', () =>
-      waitFor(() => {
-        expect(result).toContainHTML('🌐')
-        expect(result).toContainHTML('Hamburg, Germany')
-      }
-    ))
-
-    it('renders the image', async () => {
-      // Check if any image is rendered first
-      const images = result.querySelectorAll('img')
-      if (images.length > 0) {
-        try {
-          const image = await findByAltText(result, 'Profile photo of Jane Doe')
-          expect(image).toHaveAttribute(
-            'src',
-            'https://janedoe.example/profile/me.jpg'
-          )
-        } catch (e) {
-          // If alt text doesn't match, just check that an image exists
-          expect(images.length).toBeGreaterThan(0)
-        }
-      } else {
-        // If no image is rendered, that's also acceptable for now
-        expect(images.length).toBe(0)
-      }
-    })
+    const image = result.querySelector('img.profile__hero') as HTMLImageElement | null
+    expect(image?.getAttribute('src')).toBe('https://janedoe.example/profile/me.jpg')
   })
 })
diff --git a/test/profile-view-model-presenter.integration.test.ts b/test/profile-view-model-presenter.integration.test.ts
new file mode 100644
index 00000000..57231a71
--- /dev/null
+++ b/test/profile-view-model-presenter.integration.test.ts
@@ -0,0 +1,151 @@
+// This code was generated by GPT-5.4 in GitHub Copilot.git s
+import { beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { parse, sym } from 'rdflib'
+import { store } from 'solid-logic'
+import { presentProfileViewModel } from '../src/ProfileViewModelPresenter'
+import { presentProjects } from '../src/sections/projects/selectors'
+
+jest.mock('../src/sections/projects/selectors', () => {
+  const actual = jest.requireActual<typeof import('../src/sections/projects/selectors')>(
+    '../src/sections/projects/selectors'
+  )
+  return {
+    ...actual,
+    presentProjects: jest.fn(actual.presentProjects)
+  }
+})
+
+const actualProjectSelectors = jest.requireActual('../src/sections/projects/selectors') as typeof import('../src/sections/projects/selectors')
+const mockedPresentProjects = presentProjects as jest.MockedFunction<typeof presentProjects>
+
+const subject = sym('https://janedoe.example/profile/card#me')
+const profileDoc = subject.doc()
+const projectNode = sym('https://projects.example/community#profile-pane')
+const projectDoc = projectNode.doc()
+
+const profileTurtle = `
+  @prefix : <#>.
+  @prefix foaf: <http://xmlns.com/foaf/0.1/> .
+  @prefix org: <http://www.w3.org/ns/org#> .
+  @prefix schema: <http://schema.org/> .
+  @prefix soc: <https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#> .
+  @prefix solid: <http://www.w3.org/ns/solid/terms#> .
+  @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
+  @prefix xsd: <http://www.w3.org/2001/XMLSchema#> .
+
+  :me
+    a foaf:Person;
+    foaf:name "Jane Doe";
+    vcard:note "Builds profile features for SolidOS.";
+    vcard:role "Staff Engineer";
+    vcard:organization-name "SolidOS";
+    schema:skills :skill1;
+    schema:knowsLanguage ( <https://www.w3.org/ns/iana/language-code/en> );
+    foaf:account ( :account1 );
+    solid:community <https://projects.example/community#profile-pane>;
+    vcard:hasEmail [
+      a vcard:Work;
+      vcard:value <mailto:jane@example.com>
+    ];
+    vcard:hasTelephone [
+      a vcard:Work;
+      vcard:value <tel:+15551234567>
+    ];
+    vcard:hasAddress [
+      vcard:street-address "123 Solid Lane";
+      vcard:locality "Boston";
+      vcard:country-name "USA"
+    ].
+
+  :skill1 solid:publicId <http://data.europa.eu/esco/skill/1234> .
+  <http://data.europa.eu/esco/skill/1234> schema:name "TypeScript" .
+
+  :role1
+    a solid:CurrentRole;
+    org:member :me;
+    org:organization :org1;
+    vcard:role "Staff Engineer";
+    schema:startDate "2022-01-01"^^xsd:date;
+    schema:description "Ships profile features.".
+
+  :org1
+    schema:name "SolidOS";
+    org:location "Remote".
+
+  :education1
+    a schema:EducationalOccupationalCredential;
+    org:member :me;
+    schema:name "State University";
+    schema:educationalCredentialAwarded "BSc Computer Science";
+    schema:location "Boston";
+    schema:startDate "2018-09-01";
+    schema:endDate "2022-06-01";
+    schema:description "Learned software engineering.".
+
+  :account1
+    a soc:LinkedInAccount;
+    foaf:accountName "jane-doe".
+`
+
+const projectTurtle = `
+  @prefix : <#>.
+  @prefix foaf: <http://xmlns.com/foaf/0.1/> .
+  @prefix schema: <http://schema.org/> .
+  @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
+
+  :profile-pane
+    a schema:Project;
+    foaf:name "Profile Pane";
+    vcard:organization-name "SolidOS".
+`
+
+describe('presentProfileViewModel integration', () => {
+  beforeEach(() => {
+    store.removeDocument(profileDoc)
+    store.removeDocument(projectDoc)
+    ;(store as any).fetcher = {
+      ...((store as any).fetcher || {}),
+      load: jest.fn(async () => undefined)
+    }
+    mockedPresentProjects.mockImplementation(actualProjectSelectors.presentProjects)
+    parse(profileTurtle, store, profileDoc.uri, 'text/turtle')
+    parse(projectTurtle, store, projectDoc.uri, 'text/turtle')
+  })
+
+  it('returns the complete aggregated presenter contract from one profile fixture', async () => {
+    const viewModel = await presentProfileViewModel(subject, store as any)
+
+    expect(Object.keys(viewModel).sort()).toEqual([
+      'bioDetails',
+      'contactInfo',
+      'cvDetails',
+      'education',
+      'languages',
+      'profileDetails',
+      'projects',
+      'skills',
+      'social'
+    ])
+
+    expect(viewModel.profileDetails.name).toBe('Jane Doe')
+    expect(viewModel.profileDetails.jobTitle).toBe('Staff Engineer')
+    expect(viewModel.bioDetails.description).toBe('Builds profile features for SolidOS.')
+    expect(viewModel.cvDetails[0].orgName).toBe('SolidOS')
+    expect(viewModel.projects[0].title).toBe('Profile Pane')
+    expect(viewModel.skills[0].name).toBe('TypeScript')
+    expect(viewModel.languages[0].name).toBe('English')
+    expect(viewModel.education[0].school).toBe('State University')
+    expect(viewModel.contactInfo.emails[0].valueNode.value).toBe('mailto:jane@example.com')
+    expect(viewModel.contactInfo.phones[0].valueNode.value).toBe('tel:+15551234567')
+    expect(viewModel.contactInfo.addresses[0].locality).toBe('Boston')
+    expect(viewModel.social.accounts[0].homepage).toContain('linkedin.com')
+  })
+
+  it('surfaces async selector failures from the project branch', async () => {
+    mockedPresentProjects.mockRejectedValueOnce(new Error('project selector failed'))
+
+    await expect(presentProfileViewModel(subject, store as any)).rejects.toThrow(
+      'project selector failed'
+    )
+  })
+})
\ No newline at end of file
diff --git a/test/profile-view.accessibility.test.ts b/test/profile-view.accessibility.test.ts
index 272c22ff..557738ba 100644
--- a/test/profile-view.accessibility.test.ts
+++ b/test/profile-view.accessibility.test.ts
@@ -1,21 +1,34 @@
+import { afterEach, beforeEach, describe, expect, it } from '@jest/globals'
 import { ProfileView } from '../src/ProfileView'
 import { render } from 'lit-html'
-import axe from 'axe-core'
+import { runAxe } from './helpers/runAxe'
+import { createTestContext, resetTestSetup, subject } from './setup'
 
 describe('ProfileView accessibility', () => {
-  it('has no accessibility violations', async () => {
-    const container = document.createElement('div')
+  let container: HTMLDivElement
+
+  beforeEach(() => {
+    resetTestSetup()
+    container = document.createElement('div')
     document.body.appendChild(container)
-    // Use shared context and subject mocks
-    const { context, subject } = require('./setup')
+  })
+
+  afterEach(() => {
+    container.remove()
+    document.body.innerHTML = ''
+    resetTestSetup()
+  })
+
+  it('has no accessibility violations', async () => {
+    const context = createTestContext()
     // Render ProfileView (returns a Promise<TemplateResult>)
     const result = await ProfileView(subject, context)
     render(result, container)
-    const results = await axe.run(container)
+    const results = await runAxe(container)
     if (results.violations.length > 0) {
       // Print details for debugging
       console.log('Axe violations:', JSON.stringify(results.violations, null, 2))
     }
     expect(results.violations.length).toBe(0)
-  })
+  }, 15000)
 })
diff --git a/test/profile-view.composition.test.ts b/test/profile-view.composition.test.ts
new file mode 100644
index 00000000..53b512d0
--- /dev/null
+++ b/test/profile-view.composition.test.ts
@@ -0,0 +1,181 @@
+// This code was generated by GPT-5.4 in GitHub Copilot.
+import { beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { render } from 'lit-html'
+import { parse, sym } from 'rdflib'
+import type { DataBrowserContext } from 'pane-registry'
+import { store } from 'solid-logic'
+import { presentProfileViewModel } from '../src/ProfileViewModelPresenter'
+import { ProfileView } from '../src/ProfileView'
+import { scanQrToConnectText } from '../src/texts'
+
+const subject = sym('https://janedoe.example/profile/card#me')
+const profileDoc = subject.doc()
+const projectNode = sym('https://projects.example/community#profile-pane')
+const projectDoc = projectNode.doc()
+
+const profileTurtle = `
+  @prefix : <#>.
+  @prefix foaf: <http://xmlns.com/foaf/0.1/> .
+  @prefix org: <http://www.w3.org/ns/org#> .
+  @prefix schema: <http://schema.org/> .
+  @prefix soc: <https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#> .
+  @prefix solid: <http://www.w3.org/ns/solid/terms#> .
+  @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
+  @prefix xsd: <http://www.w3.org/2001/XMLSchema#> .
+
+  :me
+    a foaf:Person;
+    foaf:name "Jane Doe";
+    vcard:note "Builds profile features for SolidOS.";
+    vcard:role "Staff Engineer";
+    vcard:organization-name "SolidOS";
+    schema:skills :skill1;
+    schema:knowsLanguage ( <https://www.w3.org/ns/iana/language-code/en> );
+    foaf:account ( :account1 );
+    solid:community <https://projects.example/community#profile-pane>;
+    vcard:hasEmail [
+      a vcard:Work;
+      vcard:value <mailto:jane@example.com>
+    ];
+    vcard:hasTelephone [
+      a vcard:Work;
+      vcard:value <tel:+15551234567>
+    ];
+    vcard:hasAddress [
+      vcard:street-address "123 Solid Lane";
+      vcard:locality "Boston";
+      vcard:country-name "USA"
+    ].
+
+  :skill1 solid:publicId <http://data.europa.eu/esco/skill/1234> .
+  <http://data.europa.eu/esco/skill/1234> schema:name "TypeScript" .
+
+  :role1
+    a solid:CurrentRole;
+    org:member :me;
+    org:organization :org1;
+    vcard:role "Staff Engineer";
+    schema:startDate "2022-01-01"^^xsd:date;
+    schema:description "Ships profile features.".
+
+  :org1
+    schema:name "SolidOS";
+    org:location "Remote".
+
+  :education1
+    a schema:EducationalOccupationalCredential;
+    org:member :me;
+    schema:name "State University";
+    schema:educationalCredentialAwarded "BSc Computer Science";
+    schema:location "Boston";
+    schema:startDate "2018-09-01";
+    schema:endDate "2022-06-01";
+    schema:description "Learned software engineering.".
+
+  :account1
+    a soc:LinkedInAccount;
+    foaf:accountName "jane-doe".
+`
+
+const projectTurtle = `
+  @prefix : <#>.
+  @prefix foaf: <http://xmlns.com/foaf/0.1/> .
+  @prefix schema: <http://schema.org/> .
+  @prefix vcard: <http://www.w3.org/2006/vcard/ns#> .
+
+  :profile-pane
+    a schema:Project;
+    foaf:name "Profile Pane";
+    vcard:organization-name "SolidOS".
+`
+
+function createContext(): DataBrowserContext {
+  return {
+    dom: document,
+    getOutliner: () => null,
+    session: {
+      info: {
+        isLoggedIn: false,
+        webId: null,
+      },
+      paneRegistry: {
+        byName: () => ({
+          render: () => document.createElement('div')
+        })
+      },
+      store,
+      logic: {}
+    },
+  } as unknown as DataBrowserContext
+}
+
+describe('Profile view composition', () => {
+  let context: DataBrowserContext
+
+  beforeEach(() => {
+    store.removeDocument(profileDoc)
+    store.removeDocument(projectDoc)
+    ;(store as any).fetcher = {
+      ...((store as any).fetcher || {}),
+      load: jest.fn(async () => undefined)
+    }
+    parse(profileTurtle, store, profileDoc.uri, 'text/turtle')
+    parse(projectTurtle, store, projectDoc.uri, 'text/turtle')
+    context = createContext()
+  })
+
+  it('aggregates all major presenter branches from one profile fixture', async () => {
+    const viewModel = await presentProfileViewModel(subject, store as any)
+
+    expect(viewModel.profileDetails.name).toBe('Jane Doe')
+    expect(viewModel.profileDetails.jobTitle).toBe('Staff Engineer')
+
+    expect(viewModel.bioDetails.description).toBe('Builds profile features for SolidOS.')
+
+    expect(viewModel.cvDetails).toHaveLength(1)
+    expect(viewModel.cvDetails[0].title).toBe('Staff Engineer')
+    expect(viewModel.cvDetails[0].orgName).toBe('SolidOS')
+
+    expect(viewModel.projects).toHaveLength(1)
+    expect(viewModel.projects[0].title).toBe('Profile Pane')
+
+    expect(viewModel.skills).toHaveLength(1)
+    expect(viewModel.skills[0].name).toBe('TypeScript')
+
+    expect(viewModel.languages).toHaveLength(1)
+    expect(viewModel.languages[0].name).toBe('English')
+
+    expect(viewModel.contactInfo.emails).toHaveLength(1)
+    expect(viewModel.contactInfo.emails[0].valueNode.value).toBe('mailto:jane@example.com')
+    expect(viewModel.contactInfo.phones).toHaveLength(1)
+    expect(viewModel.contactInfo.phones[0].valueNode.value).toBe('tel:+15551234567')
+    expect(viewModel.contactInfo.addresses).toHaveLength(1)
+    expect(viewModel.contactInfo.addresses[0].locality).toBe('Boston')
+
+    expect(viewModel.social.accounts).toHaveLength(1)
+    expect(viewModel.social.accounts[0].homepage).toContain('linkedin.com')
+
+    expect(viewModel.education).toHaveLength(1)
+    expect(viewModel.education[0].school).toBe('State University')
+  })
+
+  it('renders the assembled profile view from the aggregated fixture', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const result = await ProfileView(subject, context)
+    render(result, container)
+
+    expect(container.querySelector('#profile-name')?.textContent).toBe('Jane Doe')
+    expect(container.textContent).toContain('Builds profile features for SolidOS.')
+    expect(container.textContent).toContain('Staff Engineer')
+    expect(container.textContent).toContain('Profile Pane')
+    expect(container.textContent).toContain('TypeScript')
+    expect(container.textContent).toContain('English')
+    expect(container.textContent).toContain('jane@example.com')
+    expect(container.textContent).toContain(scanQrToConnectText)
+    expect(container.querySelector('[data-testid="qrcode-card"]')).not.toBeNull()
+
+    container.remove()
+  })
+})
\ No newline at end of file
diff --git a/test/qrcode-card.accessibility.test.ts b/test/qrcode-card.accessibility.test.ts
index 87dd2237..b2d09d09 100644
--- a/test/qrcode-card.accessibility.test.ts
+++ b/test/qrcode-card.accessibility.test.ts
@@ -1,16 +1,16 @@
 import { render } from 'lit-html'
-import { QRCodeCard } from '../src/QRCodeCard'
+import { QRCodeCard } from '../src/sections/qrcode/QRCodeCard'
 import { NamedNode, graph, parse, sym } from 'rdflib'
-import axe from 'axe-core'
+import { runAxe } from './helpers/runAxe'
 
 describe('QRCodeCard accessibility', () => {
   it('has no accessibility violations', async () => {
     const subject = { uri: 'https://example.com', value: 'https://example.com' } as NamedNode
     const container = document.createElement('div')
     document.body.appendChild(container)
-    render(QRCodeCard('#000', '#fff', subject), container)
+    render(QRCodeCard(subject), container)
 
-    const results = await axe.run(container)
+    const results = await runAxe(container)
     expect(results.violations.length).toBe(0)
   })
 
@@ -18,12 +18,12 @@ describe('QRCodeCard accessibility', () => {
     const subject = { uri: 'https://example.com', value: 'https://example.com' } as NamedNode
     const container = document.createElement('div')
     document.body.appendChild(container)
-    render(QRCodeCard('#000', '#fff', subject), container)
+    render(QRCodeCard(subject), container)
 
-    // Find the inner focusable QR container used for keyboard accessibility
     const qr = container.querySelector('[data-testid="qrcode-card"] [role="img"][tabindex="0"]')
+
     expect(qr).not.toBeNull()
-    expect(qr.getAttribute('tabindex')).toBe('0')
+    expect(qr?.getAttribute('tabindex')).toBe('0')
   })
 
   it('uses linked contact values instead of contact entry node ids in the vCard payload', () => {
@@ -56,4 +56,16 @@ describe('QRCodeCard accessibility', () => {
     expect(payload).not.toContain('#emailEntry')
     expect(payload).not.toContain('#phoneEntry')
   })
-})
\ No newline at end of file
+
+  it('references its caption and description for accessibility', () => {
+    const subject = { uri: 'https://example.com', value: 'https://example.com' } as NamedNode
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+    render(QRCodeCard(subject), container)
+
+    const qrCard = container.querySelector('[data-testid="qrcode-card"]')
+
+    expect(qrCard?.getAttribute('aria-labelledby')).toBe('qr-code-caption')
+    expect(qrCard?.getAttribute('aria-describedby')).toBe('qr-code-description')
+  })
+})
diff --git a/test/qrcode.spec.ts b/test/qrcode.spec.ts
index 8638a50b..43475b09 100644
--- a/test/qrcode.spec.ts
+++ b/test/qrcode.spec.ts
@@ -1,8 +1,9 @@
+import { beforeEach, describe, expect, it } from '@jest/globals'
 import pane from '../src/index'
 import { parse } from 'rdflib'
 import { store } from 'solid-logic'
-import { findByTestId } from '@testing-library/dom'
-import { context, delay, doc, subject } from './setup'
+import { waitFor } from '@testing-library/dom'
+import { context, doc, subject } from './setup'
 
 // This was at testingsolidos.solidcommunity.net
 const exampleProfile = `@prefix : <#>.
@@ -158,29 +159,21 @@ l:de schema:name "germano"@ia.
 l:fr schema:name "French"@en.
 
 `
-// TODO(refactor): Re-enable after QR styling/color contract is finalized.
-describe.skip('profile-pane', () => {
-  let element: HTMLElement
-
-  describe('qrcode', () => {
-    beforeAll(async () => {
-      store.removeDocument(doc)
-      parse(exampleProfile, store, doc.uri)
-      const result = pane.render(subject, context)
-      await delay(3000)
-      element = await findByTestId(result, 'qrcode-card')
-    })
-
-    it('renders the QRCode element', () => {
-      expect(element.innerHTML).toContain('<svg')
-    })
+describe('profile pane qrcode integration', () => {
+    beforeEach(() => {
+        store.removeDocument(doc)
+})
 
-    it('renders the right QRCode colors', () => {
-      expect(element.innerHTML).toContain('stroke="#06b74a"')
-      expect(element.innerHTML).toContain('fill="#f4f5c2"')
+    it('renders the QR code card and injects SVG markup', async () => {
+        parse(exampleProfile, store, doc.uri)
+        const result = pane.render(subject, context)
+
+        await waitFor(() => {
+            const qrCard = result.querySelector('[data-testid="qrcode-card"]') as HTMLElement | null
+            expect(qrCard).not.toBeNull()
+            expect(qrCard?.getAttribute('data-value')).toContain('BEGIN:VCARD')
+            const qrImageContainer = qrCard?.querySelector('.qrcode-card__image') as HTMLElement | null
+            expect(qrImageContainer?.innerHTML).toContain('<svg')
+        })
     })
-
-
-  })
-
 })
diff --git a/test/sections/accessibility-variants.test.ts b/test/sections/accessibility-variants.test.ts
new file mode 100644
index 00000000..0a750028
--- /dev/null
+++ b/test/sections/accessibility-variants.test.ts
@@ -0,0 +1,68 @@
+import { describe, expect, it } from '@jest/globals'
+import { render } from 'lit-html'
+import { literal, sym } from 'rdflib'
+import { renderBioSection } from '../../src/sections/bio/BioSection'
+import { renderProjectSection } from '../../src/sections/projects/ProjectSection'
+import { renderSkillsSection } from '../../src/sections/skills/SkillsSection'
+import { renderContactInfoSection } from '../../src/sections/contactInfo/ContactInfoSection'
+import { renderEducationSection } from '../../src/sections/education/EducationSection'
+import { renderCVSection } from '../../src/sections/resume/ResumeSection'
+import { renderLanguageSection } from '../../src/sections/languages/LanguageSection'
+import { renderSocialSection } from '../../src/sections/social/SocialSection'
+import { runAxe } from '../helpers/runAxe'
+import { context, subject } from '../setup'
+
+describe('Section accessibility variants', () => {
+  it('has no accessibility violations for owner empty states', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(
+      renderBioSection(context.session.store, subject, { description: '', entryNode: '' } as any, 'owner'),
+      container
+    )
+    render(renderProjectSection(context.session.store, subject, [], 'owner'), container)
+    render(renderSkillsSection(context.session.store, subject, [], 'owner'), container)
+    render(renderContactInfoSection(context.session.store, subject, { phones: [], emails: [], addresses: [] } as any, 'owner'), container)
+    render(renderCVSection(context.session.store, subject, [], 'owner'), container)
+    render(renderLanguageSection(context.session.store, subject, [], 'owner'), container)
+    render(renderSocialSection(context.session.store as any, subject, { accounts: [] }, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
+
+  it('has no accessibility violations for anonymous populated states', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const bio = { entryNode: sym('https://example.com/profile#bio'), description: 'Public bio content.' }
+    const projects = [{ entryNode: sym('https://example.com/profile#project1'), url: 'https://example.com/project', title: 'Profile Pane', orgName: 'Open Source', category: 'project' }]
+    const skills = [{ name: 'typescript', publicId: 'https://www.wikidata.org/wiki/Q978185', entryNode: sym('https://example.com/profile/card#skill-typescript') }]
+    const contactInfo = {
+      phones: [{ entryNode: sym('https://example.com/profile#phone'), type: sym('http://www.w3.org/2006/vcard/ns#Home'), valueNode: sym('tel:+1555123456') }],
+      emails: [{ entryNode: sym('https://example.com/profile#email'), type: sym('http://www.w3.org/2006/vcard/ns#Work'), valueNode: sym('mailto:jane@example.com') }],
+      addresses: [{ entryNode: sym('https://example.com/profile#address'), streetAddress: 'Main Street 1', locality: 'Boston', countryName: 'USA' }]
+    }
+    const educationData = [{ entryNode: sym('https://example.com/profile#edu1'), school: 'University of Amsterdam', degree: 'BSc Computer Science', location: 'Amsterdam', endDate: '2022-06-01', description: 'Focused on software engineering.' }]
+    const roles = [{ entryNode: sym('https://example.com/profile#role1'), title: 'Software Engineer', orgName: 'SolidOS', orgLocation: 'Remote', startDate: literal('2021-01-01'), endDate: literal('2024-01-01'), description: 'Built profile pane features.' }]
+    const languages = [{ name: 'English', proficiency: 'Fluent', entryNode: sym('https://example.com/profile#lang1') }]
+    const social = { accounts: [{ entryNode: sym('https://example.com/profile/card#github'), homepage: 'https://github.com/example', name: 'GitHub', icon: 'https://example.com/github-icon.svg' }] }
+
+    render(renderBioSection(context.session.store, subject, bio as any, 'anonymous'), container)
+    render(renderProjectSection(context.session.store, subject, projects as any, 'anonymous'), container)
+    render(renderSkillsSection(context.session.store, subject, skills as any, 'anonymous'), container)
+    render(renderContactInfoSection(context.session.store, subject, contactInfo as any, 'anonymous'), container)
+    render(renderEducationSection(context.session.store, subject, educationData as any, 'anonymous'), container)
+    render(renderCVSection(context.session.store, subject, roles as any, 'anonymous'), container)
+    render(renderLanguageSection(context.session.store, subject, languages as any, 'anonymous'), container)
+    render(renderSocialSection(context.session.store as any, subject, social as any, 'anonymous'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
+})
diff --git a/test/sections/bio.section.test.ts b/test/sections/bio.section.test.ts
index fec1c89f..9033147c 100644
--- a/test/sections/bio.section.test.ts
+++ b/test/sections/bio.section.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
 import { renderBioSection } from '../../src/sections/bio/BioSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Bio section', () => {
@@ -21,4 +22,21 @@ describe('Bio section', () => {
 
     container.remove()
   })
+
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const bio = {
+      entryNode: sym('https://example.com/profile#bio'),
+      description: 'I enjoy building Solid applications and web components.'
+    }
+
+    render(renderBioSection(context.session.store, subject, bio as any, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
 })
diff --git a/test/sections/bio.selectors-mutations.test.ts b/test/sections/bio.selectors-mutations.test.ts
index 62e1567e..c03c6bf7 100644
--- a/test/sections/bio.selectors-mutations.test.ts
+++ b/test/sections/bio.selectors-mutations.test.ts
@@ -1,8 +1,9 @@
 import { describe, expect, it } from "@jest/globals"
-import { graph, sym } from 'rdflib'
+import { graph, literal, st, sym } from 'rdflib'
+import { ns } from 'solid-ui'
 import { presentBio } from '../../src/sections/bio/selectors'
 import { processBioMutations } from '../../src/sections/bio/mutations'
-import { saveBioUpdatesFailedPrefixText } from '../../src/texts'
+import { saveBioUpdatesFailedMessageText, updaterUnsupportedStoreErrorMessageText } from '../../src/texts'
 
 describe('Bio selectors and mutations', () => {
   it('selector returns empty bio details from empty store', () => {
@@ -14,13 +15,55 @@ describe('Bio selectors and mutations', () => {
     expect(result.description).toBeUndefined()
   })
 
-  it('mutation wraps updater errors with bio prefix', async () => {
+  it('mutation surfaces unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
     const plan = { create: [], update: [], remove: [] }
-    await expect(processBioMutations(store, subject, plan as any)).rejects.toThrow(
-      saveBioUpdatesFailedPrefixText
-    )
+    await expect(processBioMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveBioUpdatesFailedMessageText,
+      cause: expect.objectContaining({ message: updaterUnsupportedStoreErrorMessageText })
+    })
+  })
+
+  it('selector reads the stored bio note', () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    store.add(st(subject, ns.vcard('note'), literal('Building accessible Solid apps.'), doc))
+
+    const result = presentBio(subject, store)
+    expect(result.description).toBe('Building accessible Solid apps.')
+  })
+
+  it('mutation writes and removes the vcard:note literal', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    await processBioMutations(store, subject, {
+      create: [{ entryNode: subject.value, description: '  New bio text  ', status: 'new' }],
+      update: [],
+      remove: []
+    } as any)
+
+    expect(store.any(subject, ns.vcard('note'), null, doc)?.value).toBe('New bio text')
+
+    await processBioMutations(store, subject, {
+      create: [],
+      update: [],
+      remove: [{ entryNode: subject.value, description: '', status: 'deleted' }]
+    } as any)
+
+    expect(store.any(subject, ns.vcard('note'), null, doc)).toBeNull()
   })
 })
diff --git a/test/sections/contact-info.section.test.ts b/test/sections/contact-info.section.test.ts
index a1163b52..bc19c14a 100644
--- a/test/sections/contact-info.section.test.ts
+++ b/test/sections/contact-info.section.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
 import { renderContactInfoSection } from '../../src/sections/contactInfo/ContactInfoSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Contact info section', () => {
@@ -46,4 +47,44 @@ describe('Contact info section', () => {
 
     container.remove()
   })
+
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const contactInfo = {
+      phones: [
+        {
+          entryNode: sym('https://example.com/profile#phone'),
+          type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+          valueNode: sym('tel:+1555123456')
+        }
+      ],
+      emails: [
+        {
+          entryNode: sym('https://example.com/profile#email'),
+          type: sym('http://www.w3.org/2006/vcard/ns#Work'),
+          valueNode: sym('mailto:jane@example.com')
+        }
+      ],
+      addresses: [
+        {
+          entryNode: sym('https://example.com/profile#address'),
+          streetAddress: 'Main Street 1',
+          locality: 'Boston',
+          countryName: 'USA'
+        }
+      ]
+    }
+
+    render(
+      renderContactInfoSection(context.session.store, subject, contactInfo as any, 'owner'),
+      container
+    )
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
 })
diff --git a/test/sections/contact-info.selectors-mutations.test.ts b/test/sections/contact-info.selectors-mutations.test.ts
index bfb7315e..c96eb47a 100644
--- a/test/sections/contact-info.selectors-mutations.test.ts
+++ b/test/sections/contact-info.selectors-mutations.test.ts
@@ -1,9 +1,9 @@
 import { describe, expect, it } from "@jest/globals"
-import { graph, sym } from 'rdflib'
+import { graph, literal, st, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { presentContactInfo } from '../../src/sections/contactInfo/selectors'
 import { processContactInfoMutations } from '../../src/sections/contactInfo/mutations'
-import { mutationSaveContactInfoFailedPrefixText } from '../../src/texts'
+import { saveContactUpdatesFailedMessageText, updaterUnsupportedStoreErrorMessageText } from '../../src/texts'
 
 describe('Contact info selectors and mutations', () => {
   it('selector returns empty contact arrays from empty store', () => {
@@ -16,7 +16,7 @@ describe('Contact info selectors and mutations', () => {
     expect(result.addresses).toEqual([])
   })
 
-  it('mutation wraps updater errors with contact prefix', async () => {
+  it('mutation surfaces unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
@@ -26,9 +26,10 @@ describe('Contact info selectors and mutations', () => {
       addressOps: { create: [], update: [], remove: [] }
     }
 
-    await expect(processContactInfoMutations(store, subject, plan as any)).rejects.toThrow(
-      mutationSaveContactInfoFailedPrefixText
-    )
+    await expect(processContactInfoMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveContactUpdatesFailedMessageText,
+      cause: expect.objectContaining({ message: updaterUnsupportedStoreErrorMessageText })
+    })
   })
 
   it('creates phone/email/address entries with #id + 13 digits and URI values', async () => {
@@ -85,4 +86,55 @@ describe('Contact info selectors and mutations', () => {
     expect(phoneValue?.object?.termType).toBe('NamedNode')
     expect(phoneValue?.object?.value).toBe('tel:+1-111-222-3333')
   })
+
+  it('selector resolves direct entry-node values and address details while ignoring invalid points', () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const emailNode = sym('mailto:direct@example.com')
+    const phoneNode = sym('tel:+15551234567')
+    const invalidPhoneNode = sym(`${doc.value}#invalid-phone`)
+    const addressNode = sym(`${doc.value}#address-1`)
+
+    store.add(st(subject, ns.vcard('hasEmail'), emailNode, doc))
+    store.add(st(subject, ns.vcard('hasTelephone'), phoneNode, doc))
+    store.add(st(subject, ns.vcard('hasTelephone'), invalidPhoneNode, doc))
+    store.add(st(subject, ns.vcard('hasAddress'), addressNode, doc))
+    store.add(st(addressNode, ns.rdf('type'), ns.vcard('Home'), doc))
+    store.add(st(addressNode, ns.vcard('street-address'), literal('1 Main St'), doc))
+    store.add(st(addressNode, ns.vcard('locality'), literal('Boston'), doc))
+    store.add(st(addressNode, ns.vcard('country-name'), literal('US'), doc))
+
+    const result = presentContactInfo(subject, store)
+
+    expect(result.emails).toHaveLength(1)
+    expect(result.emails[0].valueNode.value).toBe('mailto:direct@example.com')
+    expect(result.phones).toHaveLength(1)
+    expect(result.phones[0].valueNode.value).toBe('tel:+15551234567')
+    expect(result.addresses).toHaveLength(1)
+    expect(result.addresses[0].type?.value).toBe(ns.vcard('Home').value)
+    expect(result.addresses[0].streetAddress).toBe('1 Main St')
+    expect(result.addresses[0].countryName).toBe('US')
+  })
+
+  it('selector falls back to vcard:value statements outside the subject document', () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const emailEntry = sym(`${doc.value}#email-1`)
+    const phoneEntry = sym(`${doc.value}#phone-1`)
+    const externalDoc = sym('https://example.com/other.ttl')
+
+    store.add(st(subject, ns.vcard('hasEmail'), emailEntry, doc))
+    store.add(st(subject, ns.vcard('hasTelephone'), phoneEntry, doc))
+    store.add(st(emailEntry, ns.vcard('value'), sym('mailto:external@example.com'), externalDoc))
+    store.add(st(phoneEntry, ns.vcard('value'), sym('tel:+19998887777'), externalDoc))
+
+    const result = presentContactInfo(subject, store)
+
+    expect(result.emails).toHaveLength(1)
+    expect(result.emails[0].valueNode.value).toBe('mailto:external@example.com')
+    expect(result.phones).toHaveLength(1)
+    expect(result.phones[0].valueNode.value).toBe('tel:+19998887777')
+  })
 })
diff --git a/test/sections/education.section.test.ts b/test/sections/education.section.test.ts
index a5da2c24..c3c69d5a 100644
--- a/test/sections/education.section.test.ts
+++ b/test/sections/education.section.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
 import { renderEducationSection } from '../../src/sections/education/EducationSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Education section', () => {
@@ -27,4 +28,28 @@ describe('Education section', () => {
 
     container.remove()
   })
+
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const educationData = [
+      {
+        entryNode: sym('https://example.com/profile#edu1'),
+        school: 'University of Amsterdam',
+        degree: 'BSc Computer Science',
+        location: 'Amsterdam',
+        endDate: '2022-06-01',
+        description: 'Focused on software engineering.'
+      }
+    ]
+
+    render(renderEducationSection(context.session.store, subject, educationData as any, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations).toHaveLength(1)
+    expect(results.violations[0]?.id).toBe('heading-order')
+
+    container.remove()
+  })
 })
diff --git a/test/sections/education.selectors-mutations.test.ts b/test/sections/education.selectors-mutations.test.ts
index 21ca2edb..51bb8062 100644
--- a/test/sections/education.selectors-mutations.test.ts
+++ b/test/sections/education.selectors-mutations.test.ts
@@ -1,8 +1,9 @@
 import { describe, expect, it } from "@jest/globals"
-import { graph, sym } from 'rdflib'
+import { blankNode, graph, literal, st, sym } from 'rdflib'
+import { ns } from 'solid-ui'
 import { presentEducation } from '../../src/sections/education/selectors'
 import { processEducationMutations } from '../../src/sections/education/mutations'
-import { mutationEducationFailedPrefixText } from '../../src/texts'
+import { saveEducationUpdatesFailedMessageText, updaterUnsupportedStoreErrorMessageText } from '../../src/texts'
 
 describe('Education selectors and mutations', () => {
   it('selector returns empty education list from empty store', () => {
@@ -12,13 +13,85 @@ describe('Education selectors and mutations', () => {
     expect(presentEducation(subject, store)).toEqual([])
   })
 
-  it('mutation wraps updater errors with education prefix', async () => {
+  it('mutation surfaces unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
     const plan = { create: [], update: [], remove: [] }
-    await expect(processEducationMutations(store, subject, plan as any)).rejects.toThrow(
-      mutationEducationFailedPrefixText
-    )
+    await expect(processEducationMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveEducationUpdatesFailedMessageText,
+      cause: expect.objectContaining({ message: updaterUnsupportedStoreErrorMessageText })
+    })
+  })
+
+  it('selector sorts current education first and dedupes blank nodes in favor of named nodes', () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const namedMembership = sym(`${doc.value}#education-1`)
+    const duplicateBlankMembership = blankNode()
+    const pastMembership = sym(`${doc.value}#education-2`)
+
+    ;[namedMembership, duplicateBlankMembership].forEach((node) => {
+      store.add(node, ns.org('member'), subject, doc)
+      store.add(node, ns.rdf('type'), ns.schema('EducationalOccupationalCredential'), doc)
+      store.add(node, ns.schema('name'), literal('Harvard'), doc)
+      store.add(node, ns.schema('educationalCredentialAwarded'), literal('BSc'), doc)
+      store.add(node, ns.schema('location'), literal('Cambridge'), doc)
+      store.add(node, ns.schema('startDate'), literal('2020-09-01'), doc)
+    })
+
+    store.add(pastMembership, ns.org('member'), subject, doc)
+    store.add(pastMembership, ns.rdf('type'), ns.schema('EducationalOccupationalCredential'), doc)
+    store.add(pastMembership, ns.schema('name'), literal('Oxford'), doc)
+    store.add(pastMembership, ns.schema('startDate'), literal('2015-09-01'), doc)
+    store.add(pastMembership, ns.schema('endDate'), literal('2019-06-01'), doc)
+
+    const result = presentEducation(subject, store)
+
+    expect(result).toHaveLength(2)
+    expect(result[0].school).toBe('Harvard')
+    expect(result[0].entryNode.value).toBe(namedMembership.value)
+    expect(result[1].school).toBe('Oxford')
+  })
+
+  it('mutation creates, updates, and removes education membership statements', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const existingMembership = sym(`${doc.value}#education-existing`)
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    store.add(existingMembership, ns.org('member'), subject, doc)
+    store.add(existingMembership, ns.rdf('type'), ns.schema('EducationalOccupationalCredential'), doc)
+    store.add(existingMembership, ns.schema('name'), literal('Old school'), doc)
+
+    await processEducationMutations(store, subject, {
+      create: [{ school: 'New school', degree: 'MSc', location: 'Boston', startDate: '2024-01-01', endDate: '', description: 'New cohort', entryNode: '', status: 'new' }],
+      update: [{ school: 'Updated school', degree: 'BA', location: 'London', startDate: '2020-01-01', endDate: '2023-01-01', description: 'Updated description', entryNode: existingMembership.value, status: 'modified' }],
+      remove: []
+    } as any)
+
+    expect(store.any(existingMembership, ns.schema('name'), null, doc)?.value).toBe('Updated school')
+    expect(store.any(existingMembership, ns.schema('description'), null, doc)?.value).toBe('Updated description')
+
+    const createdMemberships = store.each(null, ns.org('member'), subject, doc).filter((node) => node.value !== existingMembership.value)
+    expect(createdMemberships).toHaveLength(1)
+    expect(store.any(createdMemberships[0] as any, ns.schema('name'), null, doc)?.value).toBe('New school')
+
+    await processEducationMutations(store, subject, {
+      create: [],
+      update: [],
+      remove: [{ school: 'Updated school', degree: 'BA', location: 'London', startDate: '2020-01-01', endDate: '2023-01-01', description: 'Updated description', entryNode: existingMembership.value, status: 'deleted' }]
+    } as any)
+
+    expect(store.statementsMatching(existingMembership, null, null, doc)).toHaveLength(0)
   })
 })
diff --git a/test/sections/heading.image-helpers.test.ts b/test/sections/heading.image-helpers.test.ts
new file mode 100644
index 00000000..97988bd0
--- /dev/null
+++ b/test/sections/heading.image-helpers.test.ts
@@ -0,0 +1,87 @@
+import { describe, expect, it, jest, beforeEach } from '@jest/globals'
+import { sym } from 'rdflib'
+import { uploadPhotoFile } from '../../src/sections/heading/imageHelpers'
+
+const mockCurrentUser = jest.fn()
+const mockSetACLUserPublic = jest.fn()
+const mockDebugError = jest.fn()
+
+jest.mock('solid-logic', () => ({
+  authn: {
+    currentUser: () => mockCurrentUser()
+  },
+  solidLogicSingleton: {
+    acl: {
+      setACLUserPublic: (...args: unknown[]) => mockSetACLUserPublic(...args)
+    }
+  }
+}))
+
+jest.mock('../../src/utils/debug', () => ({
+  error: (...args: unknown[]) => mockDebugError(...args)
+}))
+
+describe('heading image helper uploads', () => {
+  beforeEach(() => {
+    mockCurrentUser.mockReset()
+    mockSetACLUserPublic.mockReset()
+    mockDebugError.mockReset()
+  })
+
+  function createImageFile() {
+    return {
+      name: 'avatar.png',
+      type: 'image/png',
+      arrayBuffer: jest.fn(async () => new ArrayBuffer(8))
+    } as unknown as File
+  }
+
+  it('attempts to make uploaded heading images public-read', async () => {
+    const subject = sym('https://example.com/profile/card#me')
+    const currentUser = sym('https://example.com/profile/card#me')
+    const webOperation = jest.fn(async (..._args: unknown[]) => ({ ok: true }))
+    const store = {
+      fetcher: { webOperation },
+      holds: jest.fn(() => false)
+    } as any
+    const file = createImageFile()
+
+    mockCurrentUser.mockReturnValue(currentUser)
+    mockSetACLUserPublic.mockImplementation(async () => sym('https://example.com/profile/avatar.png.acl'))
+
+    const uploadedUri = await uploadPhotoFile(store, subject, file)
+
+    expect(uploadedUri).toBe('https://example.com/profile/avatar.png')
+    expect(webOperation).toHaveBeenCalledWith('PUT', 'https://example.com/profile/avatar.png', expect.objectContaining({
+      contentType: 'image/png'
+    }))
+    expect(mockSetACLUserPublic).toHaveBeenCalledWith('https://example.com/profile/avatar.png', currentUser, {
+      public: ['Read']
+    })
+    expect(mockDebugError).not.toHaveBeenCalled()
+  })
+
+  it('keeps uploaded heading images when the public ACL write fails', async () => {
+    const subject = sym('https://example.com/profile/card#me')
+    const currentUser = sym('https://example.com/profile/card#me')
+    const webOperation = jest.fn(async (..._args: unknown[]) => ({ ok: true }))
+    const store = {
+      fetcher: { webOperation },
+      holds: jest.fn(() => false)
+    } as any
+    const file = createImageFile()
+
+    mockCurrentUser.mockReturnValue(currentUser)
+    mockSetACLUserPublic.mockImplementation(async () => {
+      throw new Error('ACL write failed')
+    })
+
+    const uploadedUri = await uploadPhotoFile(store, subject, file)
+
+    expect(uploadedUri).toBe('https://example.com/profile/avatar.png')
+    expect(mockSetACLUserPublic).toHaveBeenCalledWith('https://example.com/profile/avatar.png', currentUser, {
+      public: ['Read']
+    })
+    expect(mockDebugError).toHaveBeenCalledWith(expect.stringContaining('Error setting uploaded picture permissions:'))
+  })
+})
\ No newline at end of file
diff --git a/test/sections/heading.section.test.ts b/test/sections/heading.section.test.ts
index bfda9c2a..a0162a06 100644
--- a/test/sections/heading.section.test.ts
+++ b/test/sections/heading.section.test.ts
@@ -1,11 +1,35 @@
-import { describe, expect, it } from "@jest/globals"
+import { describe, expect, it, jest } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
 import { renderHeadingSection } from '../../src/sections/heading/HeadingSection'
-import { context, subject } from '../setup'
+import { addMeToYourContactsButtonText, addMeToYourFriendsButtonText } from '../../src/texts/buttonTexts'
+import { runAxe } from '../helpers/runAxe'
+import { context, fakeLogInAs, subject } from '../setup'
+
+jest.mock('../../src/specialButtons/addContact/addMeToYourContacts', () => ({
+  addMeToYourContactsDiv: jest.fn(async () => {
+    const { html } = require('lit-html')
+    return html`
+      <section class="profile-contacts-button__section">
+        <solid-ui-button type="button">Add as Contact</solid-ui-button>
+      </section>
+    `
+  })
+}))
+
+jest.mock('../../src/specialButtons/addMeToYourFriends', () => ({
+  addMeToYourFriendsDiv: jest.fn(() => {
+    const { html } = require('lit-html')
+    return html`
+      <section class="profile-friends-button__section">
+        <solid-ui-button type="button">Add as friend</solid-ui-button>
+      </section>
+    `
+  })
+}))
 
 describe('Intro section', () => {
-  it('renders basic profile info and owner action', () => {
+  it('renders basic profile info and owner action', async () => {
     const container = document.createElement('div')
     document.body.appendChild(container)
 
@@ -33,11 +57,207 @@ describe('Intro section', () => {
       }
     }
 
-    render(renderHeadingSection(context, subject, profile as any, 'owner'), container)
+    render(await renderHeadingSection(context, subject, profile as any, 'owner'), container)
 
     expect(container.querySelector('.profile__section')).toBeTruthy()
     expect(container.textContent).toContain('Jane Doe')
-    expect(container.querySelector('button[aria-label="Add or edit heading information"]')).toBeTruthy()
+    expect(container.querySelector('solid-ui-button[aria-label="Add or edit heading information"], button[aria-label="Add or edit heading information"]')).toBeTruthy()
+    expect(container.querySelector('.profile__heading-actions')).toBeNull()
+    expect(container.textContent).not.toContain(addMeToYourContactsButtonText)
+    expect(container.textContent).not.toContain(addMeToYourFriendsButtonText)
+    expect(container.querySelector('.profile__hero-alt')?.getAttribute('tabindex')).toBeNull()
+
+    container.remove()
+  })
+
+  it('renders saved heading photos through an authenticated blob url', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const fetchSpy = jest.spyOn((context.session.store.fetcher as any), '_fetch').mockResolvedValue({
+      ok: true,
+      blob: async () => new Blob(['image-bytes'], { type: 'image/png' })
+    } as Response)
+    const originalCreateObjectURL = URL.createObjectURL
+    const createObjectUrlMock = jest.fn(() => 'blob:heading-section-photo')
+    Object.defineProperty(URL, 'createObjectURL', {
+      configurable: true,
+      value: createObjectUrlMock
+    })
+
+    const profile = {
+      entryNode: sym('https://example.com/profile#entry'),
+      name: 'Jane Doe',
+      nickname: 'Jane',
+      imageSrc: 'https://example.com/private/avatar.png',
+      location: 'Amsterdam',
+      pronouns: 'She/Her',
+      jobTitle: 'Engineer',
+      orgName: 'SolidOS'
+    }
+
+    render(await renderHeadingSection(context, subject, profile as any, 'owner'), container)
+
+    const image = container.querySelector('img.profile__hero') as HTMLImageElement | null
+    expect(fetchSpy).toHaveBeenCalledWith('https://example.com/private/avatar.png')
+    expect(createObjectUrlMock).toHaveBeenCalled()
+    expect(image?.getAttribute('src')).toBe('blob:heading-section-photo')
+
+    fetchSpy.mockRestore()
+    Object.defineProperty(URL, 'createObjectURL', {
+      configurable: true,
+      value: originalCreateObjectURL
+    })
+    container.remove()
+  })
+
+  it('falls back to the default placeholder when a heading image fails to load', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const profile = {
+      entryNode: sym('https://example.com/profile#entry'),
+      name: 'Jane Doe',
+      nickname: 'Jane',
+      imageSrc: 'https://example.com/profile/broken.png',
+      location: 'Amsterdam',
+      pronouns: 'She/Her',
+      jobTitle: 'Engineer',
+      orgName: 'SolidOS'
+    }
+
+    render(await renderHeadingSection(context, subject, profile as any, 'owner'), container)
+
+    const image = container.querySelector('img.profile__hero') as HTMLImageElement | null
+    const fallback = container.querySelector('.profile__hero-alt') as HTMLElement | null
+    const frame = container.querySelector('.profile__image-frame') as HTMLElement | null
+
+    expect(image?.hidden).toBe(false)
+    expect(frame?.classList.contains('profile__image-frame--fallback')).toBe(false)
+
+    image?.dispatchEvent(new Event('error'))
+
+    expect(image?.hidden).toBe(true)
+    expect(frame?.classList.contains('profile__image-frame--fallback')).toBe(true)
+    expect(fallback?.getAttribute('aria-label')).toBe('Jane Doe')
+
+    container.remove()
+  })
+
+  it('renders add to contacts and add as friend actions for authenticated viewers only', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    fakeLogInAs(subject)
+
+    const profile = {
+      entryNode: sym('https://example.com/profile#entry'),
+      name: 'Jane Doe',
+      nickname: 'Jane',
+      imageSrc: '',
+      location: 'Amsterdam',
+      pronouns: 'She/Her',
+      jobTitle: 'Engineer',
+      orgName: 'SolidOS',
+      primaryPhone: {
+        entryNode: sym('https://example.com/profile#phone'),
+        type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+        valueNode: sym('tel:+123456789')
+      },
+      primaryEmail: {
+        entryNode: sym('https://example.com/profile#email'),
+        type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+        valueNode: sym('mailto:jane@example.com')
+      },
+      primaryAddress: {
+        entryNode: sym('https://example.com/profile#address')
+      }
+    }
+
+    render(await renderHeadingSection(context, subject, profile as any, 'authenticated'), container)
+
+    expect(container.querySelector('.profile__heading-actions')).toBeTruthy()
+    expect(container.textContent).toContain(addMeToYourContactsButtonText)
+    expect(container.textContent).toContain(addMeToYourFriendsButtonText)
+    expect(container.querySelector('solid-ui-button[aria-label="Add or edit heading information"], button[aria-label="Add or edit heading information"]')).toBeNull()
+    expect(container.querySelector('.profile__heading-edit-action')).toBeNull()
+
+    container.remove()
+  })
+
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const profile = {
+      entryNode: sym('https://example.com/profile#entry'),
+      name: 'Jane Doe',
+      nickname: 'Jane',
+      imageSrc: '',
+      location: 'Amsterdam',
+      pronouns: 'She/Her',
+      jobTitle: 'Engineer',
+      orgName: 'SolidOS',
+      primaryPhone: {
+        entryNode: sym('https://example.com/profile#phone'),
+        type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+        valueNode: sym('tel:+123456789')
+      },
+      primaryEmail: {
+        entryNode: sym('https://example.com/profile#email'),
+        type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+        valueNode: sym('mailto:jane@example.com')
+      },
+      primaryAddress: {
+        entryNode: sym('https://example.com/profile#address')
+      }
+    }
+
+    render(await renderHeadingSection(context, subject, profile as any, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
+
+  it('has no accessibility violations for anonymous viewers', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const profile = {
+      entryNode: sym('https://example.com/profile#entry'),
+      name: 'Jane Doe',
+      nickname: 'Jane',
+      imageSrc: '',
+      location: 'Amsterdam',
+      pronouns: 'She/Her',
+      jobTitle: 'Engineer',
+      orgName: 'SolidOS',
+      primaryPhone: {
+        entryNode: sym('https://example.com/profile#phone'),
+        type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+        valueNode: sym('tel:+123456789')
+      },
+      primaryEmail: {
+        entryNode: sym('https://example.com/profile#email'),
+        type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+        valueNode: sym('mailto:jane@example.com')
+      },
+      primaryAddress: {
+        entryNode: sym('https://example.com/profile#address')
+      }
+    }
+
+    render(await renderHeadingSection(context, subject, profile as any, 'anonymous'), container)
+
+    expect(container.querySelector('solid-ui-button[aria-label="Add or edit heading information"], button[aria-label="Add or edit heading information"]')).toBeNull()
+    expect(container.querySelector('.profile__heading-actions')).toBeNull()
+    expect(container.textContent).not.toContain(addMeToYourContactsButtonText)
+    expect(container.textContent).not.toContain(addMeToYourFriendsButtonText)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
 
     container.remove()
   })
diff --git a/test/sections/heading.selectors-mutations.test.ts b/test/sections/heading.selectors-mutations.test.ts
index eebb0e6f..9dfeee03 100644
--- a/test/sections/heading.selectors-mutations.test.ts
+++ b/test/sections/heading.selectors-mutations.test.ts
@@ -3,7 +3,7 @@ import { graph, st, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { presentProfile, pronounsAsText } from '../../src/sections/heading/selectors'
 import { processHeadingMutations } from '../../src/sections/heading/mutations'
-import { saveHeadingUpdatesFailedPrefixText } from '../../src/texts'
+import { saveHeadingUpdatesFailedMessageText, updaterUnsupportedStoreErrorMessageText } from '../../src/texts'
 
 describe('Intro selectors and mutations', () => {
   it('selectors return a stable profile shape from empty store', () => {
@@ -17,7 +17,7 @@ describe('Intro selectors and mutations', () => {
     expect(typeof profile.name).toBe('string')
   })
 
-  it('mutation wraps low-level updater errors', async () => {
+  it('mutation surfaces unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
@@ -28,9 +28,10 @@ describe('Intro selectors and mutations', () => {
       addressOps: { create: [], update: [], remove: [] }
     }
 
-    await expect(processHeadingMutations(store, subject, plan as any)).rejects.toThrow(
-      saveHeadingUpdatesFailedPrefixText
-    )
+    await expect(processHeadingMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveHeadingUpdatesFailedMessageText,
+      cause: expect.objectContaining({ message: updaterUnsupportedStoreErrorMessageText })
+    })
   })
 
   it('prefers work email and phone when present', () => {
@@ -96,4 +97,75 @@ describe('Intro selectors and mutations', () => {
     expect(profile.primaryEmail?.entryNode.value).toBe(firstEmail.value)
     expect(profile.primaryPhone?.entryNode.value).toBe(firstPhone.value)
   })
+
+  it('writes trimmed basic heading fields and keeps nicknames in sync', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    await processHeadingMutations(store, subject, {
+      basicOps: {
+        create: [{
+          entryNode: subject.value,
+          name: '  Jane Doe  ',
+          nickname: '  janey  ',
+          pronouns: '  She/Her  ',
+          dateOfBirth: '2000-01-01',
+          jobTitle: '  Engineer  ',
+          orgName: '  Inrupt  ',
+          imageSrc: 'https://example.com/jane.png',
+          status: 'new'
+        }],
+        update: [],
+        remove: []
+      },
+      phoneOps: { create: [], update: [], remove: [] },
+      emailOps: { create: [], update: [], remove: [] },
+      addressOps: { create: [], update: [], remove: [] }
+    } as any)
+
+    expect(store.any(subject, ns.vcard('fn'), null, doc)?.value).toBe('Jane Doe')
+    expect(store.any(subject, ns.foaf('nick'), null, doc)?.value).toBe('janey')
+    expect(store.any(subject, ns.vcard('nickname'), null, doc)?.value).toBe('janey')
+  expect(store.any(subject, ns.solid('preferredSubjectPronoun'), null, doc)?.value).toBe('She')
+  expect(store.any(subject, ns.solid('preferredObjectPronoun'), null, doc)?.value).toBe('Her')
+    expect(store.any(subject, ns.vcard('role'), null, doc)?.value).toBe('Engineer')
+    expect(store.any(subject, ns.vcard('organization-name'), null, doc)?.value).toBe('Inrupt')
+    expect(store.any(subject, ns.vcard('hasPhoto'), null, doc)?.termType).toBe('NamedNode')
+
+    await processHeadingMutations(store, subject, {
+      basicOps: {
+        create: [],
+        update: [],
+        remove: [{
+          entryNode: subject.value,
+          name: '',
+          nickname: '',
+          pronouns: '',
+          dateOfBirth: '',
+          jobTitle: '',
+          orgName: '',
+          imageSrc: '',
+          status: 'deleted'
+        }]
+      },
+      phoneOps: { create: [], update: [], remove: [] },
+      emailOps: { create: [], update: [], remove: [] },
+      addressOps: { create: [], update: [], remove: [] }
+    } as any)
+
+    expect(store.any(subject, ns.vcard('fn'), null, doc)).toBeNull()
+    expect(store.any(subject, ns.foaf('nick'), null, doc)).toBeNull()
+    expect(store.any(subject, ns.solid('preferredSubjectPronoun'), null, doc)).toBeNull()
+    expect(store.any(subject, ns.solid('preferredObjectPronoun'), null, doc)).toBeNull()
+    expect(store.any(subject, ns.vcard('hasPhoto'), null, doc)).toBeNull()
+  })
 })
diff --git a/test/sections/heading.viewer-actions.integration.test.ts b/test/sections/heading.viewer-actions.integration.test.ts
new file mode 100644
index 00000000..14a8ecae
--- /dev/null
+++ b/test/sections/heading.viewer-actions.integration.test.ts
@@ -0,0 +1,131 @@
+jest.mock('@solid-data-modules/contacts-rdflib', () => ({
+  __esModule: true,
+  default: jest.fn().mockImplementation(() => ({
+    listAddressBooks: jest.fn(async () => ({ publicUris: [], privateUris: [] })),
+    readAddressBook: jest.fn(async () => null),
+    createNewContact: jest.fn()
+  }))
+}))
+
+import { beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { render } from 'lit-html'
+import { authn } from 'solid-logic'
+import { sym } from 'rdflib'
+import { renderHeadingSection } from '../../src/sections/heading/HeadingSection'
+import { addMeToYourFriendsDiv } from '../../src/specialButtons/addMeToYourFriends'
+import {
+  addMeToYourContactsButtonText,
+  addMeToYourFriendsButtonText
+} from '../../src/texts/buttonTexts'
+import { context } from '../setup'
+
+const ownerSubject = sym('https://janedoe.example/profile/card#me')
+const authenticatedViewer = sym('https://alice.example/profile/card#me')
+
+const profile = {
+  entryNode: sym('https://example.com/profile#entry'),
+  name: 'Jane Doe',
+  nickname: 'Jane',
+  imageSrc: '',
+  location: 'Amsterdam',
+  pronouns: 'She/Her',
+  jobTitle: 'Engineer',
+  orgName: 'SolidOS',
+  primaryPhone: {
+    entryNode: sym('https://example.com/profile#phone'),
+    type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+    valueNode: sym('tel:+123456789')
+  },
+  primaryEmail: {
+    entryNode: sym('https://example.com/profile#email'),
+    type: sym('http://www.w3.org/2006/vcard/ns#Home'),
+    valueNode: sym('mailto:jane@example.com')
+  },
+  primaryAddress: {
+    entryNode: sym('https://example.com/profile#address')
+  }
+}
+
+describe('Heading viewer actions integration', () => {
+  const baseStore = context.session.store as any
+
+  beforeEach(() => {
+    jest.restoreAllMocks()
+    baseStore.fetcher = {
+      load: jest.fn(async () => undefined)
+    }
+    baseStore.updater = {
+      update: jest.fn(async () => undefined)
+    }
+    baseStore.whether = jest.fn().mockReturnValue(0)
+  })
+
+  it('renders the real contacts and friends actions for authenticated viewers', async () => {
+    jest.spyOn(authn, 'currentUser').mockReturnValue(authenticatedViewer as any)
+
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(await renderHeadingSection(context, ownerSubject, profile as any, 'authenticated'), container)
+
+    const contactsButtonSection = container.querySelector('.profile-contacts-button__section') as HTMLElement | null
+
+    expect(contactsButtonSection).not.toBeNull()
+    expect(contactsButtonSection?.hidden).toBe(true)
+    expect(container.querySelector('.profile-friends-button__section')).not.toBeNull()
+    expect(container.textContent).toContain(addMeToYourContactsButtonText)
+    expect(container.textContent).toContain(addMeToYourFriendsButtonText)
+    expect(container.querySelector('.profile__heading-edit-action')).toBeNull()
+
+    container.remove()
+  })
+
+  it('hides the friends button on mobile when the viewer is already a friend', async () => {
+    jest.spyOn(authn, 'currentUser').mockReturnValue(authenticatedViewer as any)
+    baseStore.whether = jest.fn().mockReturnValue(1)
+    context.environment = { layout: 'mobile' } as any
+
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(await addMeToYourFriendsDiv(ownerSubject, context, 'authenticated'), container)
+    await new Promise((resolve) => setTimeout(resolve, 0))
+
+    const friendsButtonSection = container.querySelector('.profile-friends-button__section')
+    expect(friendsButtonSection).not.toBeNull()
+    expect((friendsButtonSection as HTMLElement | null)?.hidden).toBe(true)
+
+    container.remove()
+    context.environment = undefined
+  })
+
+  it('renders only the edit action for owners', async () => {
+    jest.spyOn(authn, 'currentUser').mockReturnValue(ownerSubject as any)
+
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(await renderHeadingSection(context, ownerSubject, profile as any, 'owner'), container)
+
+    expect(container.querySelector('.profile__heading-edit-action')).not.toBeNull()
+    expect(container.querySelector('.profile-contacts-button__section')).toBeNull()
+    expect(container.querySelector('.profile-friends-button__section')).toBeNull()
+
+    container.remove()
+  })
+
+  it('renders no actions for anonymous viewers', async () => {
+    jest.spyOn(authn, 'currentUser').mockReturnValue(null as any)
+
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(await renderHeadingSection(context, ownerSubject, profile as any, 'anonymous'), container)
+
+    expect(container.querySelector('.profile__heading-edit-action')).toBeNull()
+    expect(container.querySelector('.profile-contacts-button__section')).toBeNull()
+    expect(container.querySelector('.profile-friends-button__section')).toBeNull()
+
+    container.remove()
+  })
+})
\ No newline at end of file
diff --git a/test/sections/languages.section.test.ts b/test/sections/languages.section.test.ts
index c4b0fa45..c27c1ce0 100644
--- a/test/sections/languages.section.test.ts
+++ b/test/sections/languages.section.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
 import { renderLanguageSection } from '../../src/sections/languages/LanguageSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Languages section', () => {
@@ -23,6 +24,23 @@ describe('Languages section', () => {
     container.remove()
   })
 
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const languages = [
+      { name: 'English', proficiency: 'Fluent', entryNode: sym('https://example.com/profile#lang1') },
+      { name: 'Spanish', proficiency: 'Intermediate', entryNode: sym('https://example.com/profile#lang2') }
+    ]
+
+    render(renderLanguageSection(context.session.store, subject, languages as any, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
+
   it('uses the shared collapsible toggle and keeps the add more action', () => {
     const container = document.createElement('div')
     document.body.appendChild(container)
@@ -34,13 +52,14 @@ describe('Languages section', () => {
     render(renderLanguageSection(context.session.store, subject, languages as any, 'owner'), container)
 
     const section = container.querySelector('.profile-section-collapsible') as HTMLElement | null
-    const toggleButton = container.querySelector('button[aria-controls="languages-panel"]') as HTMLButtonElement | null
+    const toggleButton = container.querySelector('solid-ui-button[aria-controls="languages-panel"], button[aria-controls="languages-panel"]') as HTMLElement | null
     const panel = container.querySelector('#languages-panel') as HTMLElement | null
     const addMoreLabel = container.querySelector('.profile-section-collapsible__edit-label')
 
     expect(section?.getAttribute('data-expanded')).toBe('false')
     expect(toggleButton?.getAttribute('aria-expanded')).toBe('false')
-    expect(panel?.getAttribute('aria-hidden')).toBe('true')
+    expect(panel?.hidden).toBe(false)
+    expect(panel?.getAttribute('aria-hidden')).toBeNull()
     expect(addMoreLabel?.textContent).toContain('Add More')
 
     toggleButton?.click()
@@ -49,6 +68,13 @@ describe('Languages section', () => {
     expect(toggleButton?.getAttribute('aria-expanded')).toBe('true')
     expect(panel?.getAttribute('aria-hidden')).toBe('false')
 
+    toggleButton?.click()
+
+    expect(section?.getAttribute('data-expanded')).toBe('false')
+    expect(toggleButton?.getAttribute('aria-expanded')).toBe('false')
+    expect(panel?.getAttribute('aria-hidden')).toBe('true')
+    expect(panel?.hidden).toBe(true)
+
     container.remove()
   })
 })
diff --git a/test/sections/languages.selectors-mutations.test.ts b/test/sections/languages.selectors-mutations.test.ts
index b8894df4..d80d3ddc 100644
--- a/test/sections/languages.selectors-mutations.test.ts
+++ b/test/sections/languages.selectors-mutations.test.ts
@@ -1,10 +1,9 @@
 import { describe, expect, it } from "@jest/globals"
-import { Collection, graph, literal, st, sym } from 'rdflib'
+import { Collection, graph, literal, NamedNode, st, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { presentLanguages } from '../../src/sections/languages/selectors'
 import { processLanguageMutations } from '../../src/sections/languages/mutations'
-import { mutationSaveLanguagesFailedPrefixText } from '../../src/texts'
-
+import { saveLanguageUpdatesFailedMessageText } from '../../src/texts'
 describe('Languages selectors and mutations', () => {
   it('selector returns empty list from empty store', () => {
     const store = graph() as any
@@ -13,7 +12,7 @@ describe('Languages selectors and mutations', () => {
     expect(presentLanguages(subject, store)).toEqual([])
   })
 
-  it('mutation wraps updater errors with language prefix', async () => {
+  it('mutation surfaces updater callback failures', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
     store.updater = {
@@ -25,9 +24,10 @@ describe('Languages selectors and mutations', () => {
       update: [],
       remove: []
     }
-    await expect(processLanguageMutations(store, subject, plan as any)).rejects.toThrow(
-      mutationSaveLanguagesFailedPrefixText
-    )
+    await expect(processLanguageMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveLanguageUpdatesFailedMessageText,
+      cause: expect.objectContaining({ message: 'boom' })
+    })
   })
 
   it('reads canonical id-node list with solid publicId URI and schema name', () => {
@@ -87,7 +87,7 @@ describe('Languages selectors and mutations', () => {
     expect(languages.map((item) => item.publicId)).toEqual(['fr', 'de'])
   })
 
-  it('reads cumulative legacy list snapshots and keeps longest ordered list', () => {
+  it('reads cumulative legacy list snapshots and keeps merged ordered languages', () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
     const doc = subject.doc()
@@ -112,7 +112,32 @@ describe('Languages selectors and mutations', () => {
     ])
   })
 
-  it('writes canonical id-node rdf:list model and removes legacy entry-node model statements', async () => {
+  it('merges fragmented knowsLanguage rdf lists before deduping', () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const id1 = sym('https://example.com/profile/card#id1')
+    const id2 = sym('https://example.com/profile/card#id2')
+    const id3 = sym('https://example.com/profile/card#id3')
+
+    store.add(subject, ns.schema('knowsLanguage'), new Collection([id1, id2]), doc)
+    store.add(subject, ns.schema('knowsLanguage'), new Collection([id2, id3]), doc)
+
+    store.add(id1, ns.solid('publicId'), sym('https://www.w3.org/ns/iana/language-code/en'), doc)
+    store.add(id2, ns.solid('publicId'), sym('https://www.w3.org/ns/iana/language-code/fr'), doc)
+    store.add(id3, ns.solid('publicId'), sym('https://www.w3.org/ns/iana/language-code/de'), doc)
+
+    const languages = presentLanguages(subject, store)
+
+    expect(languages).toHaveLength(3)
+    expect(languages.map((item) => item.publicId)).toEqual([
+      'https://www.w3.org/ns/iana/language-code/en',
+      'https://www.w3.org/ns/iana/language-code/fr',
+      'https://www.w3.org/ns/iana/language-code/de'
+    ])
+  })
+
+  it('writes canonical id-node Collection model and removes legacy entry-node model statements', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
     const doc = subject.doc()
@@ -147,19 +172,10 @@ describe('Languages selectors and mutations', () => {
 
     const knowsLanguageValues = store.statementsMatching(subject, ns.schema('knowsLanguage'), null, doc)
     expect(knowsLanguageValues).toHaveLength(1)
-    const listHead = knowsLanguageValues[0].object
-    expect(listHead.termType).toBe('BlankNode')
-
-    const firstEntry = store.any(listHead as any, ns.rdf('first'), null, doc)
-    expect(firstEntry?.termType).toBe('NamedNode')
-    const secondListNode = store.any(listHead as any, ns.rdf('rest'), null, doc)
-    expect(secondListNode?.termType).toBe('BlankNode')
-    const secondEntry = store.any(secondListNode as any, ns.rdf('first'), null, doc)
-    expect(secondEntry?.termType).toBe('NamedNode')
-    const tail = store.any(secondListNode as any, ns.rdf('rest'), null, doc)
-    expect(tail?.value).toBe(ns.rdf('nil').value)
-
-    const listElements = [firstEntry, secondEntry]
+    const listValue = knowsLanguageValues[0].object as Collection<NamedNode>
+    expect(listValue.termType).toBe('Collection')
+
+    const listElements = listValue.elements
     expect(listElements.every((node: any) => node?.termType === 'NamedNode')).toBe(true)
     expect(listElements.every((node: any) => node?.value.includes('#id'))).toBe(true)
 
@@ -184,6 +200,87 @@ describe('Languages selectors and mutations', () => {
     expect(store.statementsMatching(legacyEntry1, ns.rdf('type'), ns.schema('Language'), doc)).toHaveLength(0)
   })
 
+  it('returns reordered languages from the selector after saving orderedRows', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const englishEntry = sym('https://example.com/profile/card#id-en')
+    const frenchEntry = sym('https://example.com/profile/card#id-fr')
+
+    store.add(subject, ns.schema('knowsLanguage'), new Collection([englishEntry, frenchEntry]), doc)
+    store.add(englishEntry, ns.solid('publicId'), sym('https://www.w3.org/ns/iana/language-code/en'), doc)
+    store.add(sym('https://www.w3.org/ns/iana/language-code/en'), ns.schema('name'), literal('English', 'en'), doc)
+    store.add(frenchEntry, ns.solid('publicId'), sym('https://www.w3.org/ns/iana/language-code/fr'), doc)
+    store.add(sym('https://www.w3.org/ns/iana/language-code/fr'), ns.schema('name'), literal('French', 'en'), doc)
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    await processLanguageMutations(
+      store,
+      subject,
+      { create: [], update: [], remove: [] } as any,
+      [
+        { name: 'French', publicId: 'https://www.w3.org/ns/iana/language-code/fr', proficiency: '', entryNode: frenchEntry.value, status: 'existing' },
+        { name: 'English', publicId: 'https://www.w3.org/ns/iana/language-code/en', proficiency: '', entryNode: englishEntry.value, status: 'existing' }
+      ] as any
+    )
+
+    const languages = presentLanguages(subject, store)
+
+    expect(languages.map((item) => item.publicId)).toEqual([
+      'https://www.w3.org/ns/iana/language-code/fr',
+      'https://www.w3.org/ns/iana/language-code/en'
+    ])
+    expect(languages.map((item) => item.name)).toEqual(['French', 'English'])
+  })
+
+  it('preserves existing language entry nodes and unrelated statements on reorder', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const englishEntry = sym('https://example.com/profile/card#id-en')
+    const frenchEntry = sym('https://example.com/profile/card#id-fr')
+
+    store.add(subject, ns.schema('knowsLanguage'), new Collection([englishEntry, frenchEntry]), doc)
+    store.add(englishEntry, ns.solid('publicId'), sym('https://www.w3.org/ns/iana/language-code/en'), doc)
+    store.add(sym('https://www.w3.org/ns/iana/language-code/en'), ns.schema('name'), literal('English', 'en'), doc)
+    store.add(frenchEntry, ns.solid('publicId'), sym('https://www.w3.org/ns/iana/language-code/fr'), doc)
+    store.add(sym('https://www.w3.org/ns/iana/language-code/fr'), ns.schema('name'), literal('French', 'en'), doc)
+    store.add(englishEntry, ns.rdf('type'), ns.schema('Language'), doc)
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    await processLanguageMutations(
+      store,
+      subject,
+      { create: [], update: [], remove: [] } as any,
+      [
+        { name: 'French', publicId: 'https://www.w3.org/ns/iana/language-code/fr', proficiency: '', entryNode: frenchEntry.value, status: 'existing' },
+        { name: 'English', publicId: 'https://www.w3.org/ns/iana/language-code/en', proficiency: '', entryNode: englishEntry.value, status: 'existing' }
+      ] as any
+    )
+
+    const languages = presentLanguages(subject, store)
+
+    expect(languages.map((item) => item.entryNode.value)).toEqual([
+      frenchEntry.value,
+      englishEntry.value
+    ])
+    expect(store.statementsMatching(englishEntry, ns.rdf('type'), ns.schema('Language'), doc)).toHaveLength(1)
+  })
+
   it('falls back to updateDav when update fails with PATCH error', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
diff --git a/test/sections/projects.section.test.ts b/test/sections/projects.section.test.ts
index 0204bda1..fd97283b 100644
--- a/test/sections/projects.section.test.ts
+++ b/test/sections/projects.section.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
 import { renderProjectSection } from '../../src/sections/projects/ProjectSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Projects section', () => {
@@ -28,6 +29,29 @@ describe('Projects section', () => {
     container.remove()
   })
 
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const projects = [
+      {
+        entryNode: sym('https://example.com/profile#project1'),
+        url: 'https://example.com/project',
+        title: 'Profile Pane',
+        orgName: 'Open Source',
+        category: 'project',
+        description: 'A project to display profile data.'
+      }
+    ]
+
+    render(renderProjectSection(context.session.store, subject, projects as any, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
+
   it('shows a mobile view more button when there are more than two projects', () => {
     const container = document.createElement('div')
     document.body.appendChild(container)
@@ -70,4 +94,22 @@ describe('Projects section', () => {
 
     container.remove()
   })
+
+  it('renders the empty owner projects section as collapsible', () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(renderProjectSection(context.session.store, subject, [], 'owner'), container)
+
+    const section = container.querySelector('[data-profile-section="projects"]') as HTMLElement | null
+    const panel = container.querySelector('#projects-panel') as HTMLElement | null
+
+    expect(section?.classList.contains('profile-section-collapsible')).toBe(true)
+    expect(panel).toBeTruthy()
+    expect(panel?.hidden).toBe(false)
+    expect(panel?.hasAttribute('hidden')).toBe(false)
+    expect(panel?.getAttribute('aria-hidden')).toBeNull()
+
+    container.remove()
+  })
 })
diff --git a/test/sections/projects.selectors-mutations.test.ts b/test/sections/projects.selectors-mutations.test.ts
index f78d8160..1f0e8554 100644
--- a/test/sections/projects.selectors-mutations.test.ts
+++ b/test/sections/projects.selectors-mutations.test.ts
@@ -1,8 +1,9 @@
-import { describe, expect, it } from "@jest/globals"
+import { describe, expect, it, jest } from "@jest/globals"
 import { blankNode, graph, literal, st, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { presentProjects } from '../../src/sections/projects/selectors'
 import { processProjectsMutations } from '../../src/sections/projects/mutations'
+import { saveProjectsUpdatesFailedMessageText } from '../../src/texts'
 
 describe('Projects selectors and mutations', () => {
   it('selector returns empty projects from empty store', async () => {
@@ -12,12 +13,21 @@ describe('Projects selectors and mutations', () => {
     await expect(presentProjects(subject, store)).resolves.toEqual([])
   })
 
-  it('mutation wraps updater errors with projects prefix', async () => {
+  it('mutation surfaces unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
-    const plan = { create: [], update: [], remove: [] }
-    await expect(processProjectsMutations(store, subject, plan as any)).rejects.toThrow('Failed to save projects:')
+    const plan = {
+      create: [{ url: 'https://example.org/project-a', entryNode: '', status: 'new' }],
+      update: [],
+      remove: []
+    }
+    await expect(processProjectsMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveProjectsUpdatesFailedMessageText,
+      cause: expect.objectContaining({
+        message: 'Project updates are not supported by this store updater.'
+      })
+    })
   })
 
   it('selector reads projects from solid:community links', async () => {
@@ -66,6 +76,42 @@ describe('Projects selectors and mutations', () => {
     expect(projects.some((project) => project.url === 'https://example.org/project-list-item#me')).toBe(true)
   })
 
+  it('removes a project when solid:community is stored as an RDF list', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const listHead = blankNode()
+    const listTail = blankNode()
+    const keepProject = sym('https://example.org/keep-project#me')
+    const removeProject = sym('https://example.org/remove-project#me')
+
+    store.add(subject, ns.solid('community'), listHead, doc)
+    store.add(listHead, ns.rdf('first'), keepProject, doc)
+    store.add(listHead, ns.rdf('rest'), listTail, doc)
+    store.add(listTail, ns.rdf('first'), removeProject, doc)
+    store.add(listTail, ns.rdf('rest'), ns.rdf('nil'), doc)
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    await processProjectsMutations(store, subject, {
+      create: [],
+      update: [],
+      remove: [{ url: removeProject.value, entryNode: removeProject.value, status: 'deleted' }]
+    } as any)
+
+    const links = store.statementsMatching(subject, ns.solid('community'), null, doc)
+    expect(links).toHaveLength(1)
+    expect(links[0].object.value).toBe(keepProject.value)
+    expect(store.statementsMatching(listHead, null, null, doc)).toHaveLength(0)
+    expect(store.statementsMatching(listTail, null, null, doc)).toHaveLength(0)
+  })
+
   it('selector resolves literal URL values in community entries', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
@@ -104,4 +150,138 @@ describe('Projects selectors and mutations', () => {
     expect(links[0].object.value).toBe('https://example.org/project-a')
     expect(store.statementsMatching(subject, ns.schema('memberOf'), null, doc)).toHaveLength(0)
   })
+
+  it('dedupes created project URLs after normalization', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    await processProjectsMutations(store, subject, {
+      create: [
+        { url: ' https://example.org/project-a#first ', entryNode: '', status: 'new' },
+        { url: 'https://example.org/project-a#second', entryNode: '', status: 'new' },
+        { url: 'not a url', entryNode: '', status: 'new' }
+      ],
+      update: [],
+      remove: []
+    } as any)
+
+    const links = store.statementsMatching(subject, ns.solid('community'), null, doc)
+    expect(links).toHaveLength(1)
+    expect(links[0].object.value).toBe('https://example.org/project-a#first')
+  })
+
+  it('falls back to updateDav after a patch failure', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const existing = sym('https://example.org/project-a')
+
+    store.add(subject, ns.solid('community'), existing, doc)
+
+    const updateDav = jest.fn((passedDoc: any, deletions: any[], insertions: any[], callback: Function) => {
+      deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+      insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+      callback(passedDoc.value, true)
+    })
+
+    store.fetcher = {
+      load: jest.fn(async () => undefined)
+    }
+
+    store.updater = {
+      update: (_deletions: any[], _insertions: any[], callback: Function) => callback('', false, 'Web error: 405 on patch'),
+      updateDav
+    }
+
+    await processProjectsMutations(store, subject, {
+      create: [],
+      update: [{ url: 'https://example.org/project-b', entryNode: existing.value, status: 'modified' }],
+      remove: []
+    } as any)
+
+    expect(updateDav).toHaveBeenCalledTimes(1)
+    const links = store.statementsMatching(subject, ns.solid('community'), null, doc)
+    expect(links).toHaveLength(1)
+    expect(links[0].object.value).toBe('https://example.org/project-b')
+  })
+
+  it('falls back to updateDav after a fetch error for patch', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const existing = sym('https://example.org/project-a')
+
+    store.add(subject, ns.solid('community'), existing, doc)
+
+    const updateDav = jest.fn((passedDoc: any, deletions: any[], insertions: any[], callback: Function) => {
+      deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+      insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+      callback(passedDoc.value, true)
+    })
+
+    store.fetcher = {
+      load: jest.fn(async () => undefined)
+    }
+
+    store.updater = {
+      update: (_deletions: any[], _insertions: any[], callback: Function) => callback('', false, 'Fetch error for PATCH of <https://example.com/profile/card>:TypeError: Failed to fetch'),
+      updateDav
+    }
+
+    await processProjectsMutations(store, subject, {
+      create: [],
+      update: [{ url: 'https://example.org/project-b', entryNode: existing.value, status: 'modified' }],
+      remove: []
+    } as any)
+
+    expect(updateDav).toHaveBeenCalledTimes(1)
+    const links = store.statementsMatching(subject, ns.solid('community'), null, doc)
+    expect(links).toHaveLength(1)
+    expect(links[0].object.value).toBe('https://example.org/project-b')
+  })
+
+  it('removes an existing project link even when it is stored outside the profile document', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const profileDoc = subject.doc()
+    const externalDoc = sym('https://storage.example.com/settings.ttl')
+    const existing = sym('https://example.org/project-a')
+
+    store.add(subject, ns.solid('community'), existing, externalDoc)
+
+    const updateDav = jest.fn((passedDoc: any, deletions: any[], insertions: any[], callback: Function) => {
+      deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+      insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+      callback(passedDoc.value, true)
+    })
+
+    store.fetcher = {
+      load: jest.fn(async () => undefined)
+    }
+
+    store.updater = {
+      update: (_deletions: any[], _insertions: any[], callback: Function) => callback('', false, 'Web error: 405 on patch'),
+      updateDav
+    }
+
+    await processProjectsMutations(store, subject, {
+      create: [],
+      update: [],
+      remove: [{ url: existing.value, entryNode: existing.value, status: 'deleted' }]
+    } as any)
+
+    expect(updateDav).toHaveBeenCalledTimes(1)
+    expect(updateDav.mock.calls[0][0].value).toBe(externalDoc.value)
+    expect(store.statementsMatching(subject, ns.solid('community'), null, externalDoc)).toHaveLength(0)
+    expect(store.statementsMatching(subject, ns.solid('community'), null, profileDoc)).toHaveLength(0)
+  })
 })
diff --git a/test/sections/resume.section.test.ts b/test/sections/resume.section.test.ts
index fef145cf..b08962cf 100644
--- a/test/sections/resume.section.test.ts
+++ b/test/sections/resume.section.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { literal, sym } from 'rdflib'
 import { renderCVSection } from '../../src/sections/resume/ResumeSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Resume section', () => {
@@ -28,4 +29,47 @@ describe('Resume section', () => {
 
     container.remove()
   })
+
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const roles = [
+      {
+        entryNode: sym('https://example.com/profile#role1'),
+        title: 'Software Engineer',
+        orgName: 'SolidOS',
+        orgLocation: 'Remote',
+        startDate: literal('2021-01-01'),
+        endDate: literal('2024-01-01'),
+        description: 'Built profile pane features.'
+      }
+    ]
+
+    render(renderCVSection(context.session.store, subject, roles as any, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations).toHaveLength(1)
+    expect(results.violations[0]?.id).toBe('heading-order')
+
+    container.remove()
+  })
+
+  it('renders the empty owner resume section as collapsible', () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    render(renderCVSection(context.session.store, subject, [], 'owner'), container)
+
+    const section = container.querySelector('[data-profile-section="resume"]') as HTMLElement | null
+    const panel = container.querySelector('#cv-panel') as HTMLElement | null
+
+    expect(section?.classList.contains('profile-section-collapsible')).toBe(true)
+    expect(panel).toBeTruthy()
+    expect(panel?.hidden).toBe(false)
+    expect(panel?.hasAttribute('hidden')).toBe(false)
+    expect(panel?.getAttribute('aria-hidden')).toBeNull()
+
+    container.remove()
+  })
 })
diff --git a/test/sections/resume.selectors-mutations.test.ts b/test/sections/resume.selectors-mutations.test.ts
index 34f85561..89119ef7 100644
--- a/test/sections/resume.selectors-mutations.test.ts
+++ b/test/sections/resume.selectors-mutations.test.ts
@@ -3,7 +3,7 @@ import { graph, literal, sym } from 'rdflib'
 import { ns } from 'solid-ui'
 import { presentCV } from '../../src/sections/resume/selectors'
 import { processResumeMutations } from '../../src/sections/resume/mutations'
-import { mutationSaveResumeFailedPrefixText } from '../../src/texts'
+import { saveResumeUpdatesFailedMessageText, updaterUnsupportedStoreErrorMessageText } from '../../src/texts'
 
 describe('Resume selectors and mutations', () => {
   it('selector returns empty roles from empty store', () => {
@@ -13,14 +13,15 @@ describe('Resume selectors and mutations', () => {
     expect(presentCV(subject, store)).toEqual([])
   })
 
-  it('mutation wraps updater errors with resume prefix', async () => {
+  it('mutation surfaces unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
     const plan = { create: [], update: [], remove: [] }
-    await expect(processResumeMutations(store, subject, plan as any)).rejects.toThrow(
-      mutationSaveResumeFailedPrefixText
-    )
+    await expect(processResumeMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveResumeUpdatesFailedMessageText,
+      cause: expect.objectContaining({ message: updaterUnsupportedStoreErrorMessageText })
+    })
   })
 
   it('creates resume membership and organization nodes with #id + 13 digits', async () => {
@@ -168,6 +169,27 @@ describe('Resume selectors and mutations', () => {
     expect(roles[0].roleType).toBe('PastRole')
   })
 
+  it('selector includes linked organization solid publicId', () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    const membership = sym('https://example.com/profile/card#id123')
+    const organization = sym('https://example.com/profile/card#id456')
+    const publicId = sym('https://example.com/catalog/org/nasa')
+
+    store.add(membership, ns.org('member'), subject, doc)
+    store.add(membership, ns.rdf('type'), ns.solid('PastRole'), doc)
+    store.add(membership, ns.vcard('role'), literal('Engineer'), doc)
+    store.add(membership, ns.org('organization'), organization, doc)
+    store.add(organization, ns.schema('name'), literal('NASA'), doc)
+    store.add(organization, ns.solid('publicId'), publicId, doc)
+
+    const roles = presentCV(subject, store)
+    expect(roles).toHaveLength(1)
+    expect(roles[0].orgPublicId).toBe(publicId.value)
+  })
+
   it('does not write role classes as organization rdf:type', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
@@ -214,6 +236,53 @@ describe('Resume selectors and mutations', () => {
     expect(organizationTypeValues).not.toContain(ns.solid('PastRole').value)
   })
 
+  it('writes organization solid publicId when provided', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const insertionsCaptured: any[] = []
+
+    store.updater = {
+      update: (_deletions: any[], insertions: any[], callback: Function) => {
+        insertionsCaptured.push(...insertions)
+        callback('', true)
+      }
+    }
+
+    const plan = {
+      create: [{
+        title: 'Engineer',
+        startDate: undefined,
+        endDate: undefined,
+        isCurrentRole: true,
+        orgName: 'NASA',
+        orgPublicId: 'https://example.com/catalog/org/nasa',
+        orgType: 'GovernmentOrganization',
+        orgLocation: '',
+        orgHomePage: 'ww:;',
+        description: '',
+        entryNode: '',
+        status: 'new'
+      }],
+      update: [],
+      remove: []
+    }
+
+    await processResumeMutations(store, subject, plan as any)
+
+    const organizationLink = insertionsCaptured.find(
+      (statement) => statement.predicate.value === ns.org('organization').value
+    )
+    expect(organizationLink).toBeTruthy()
+
+    const publicIdStatement = insertionsCaptured.find(
+      (statement) =>
+        statement.subject.value === organizationLink.object.value &&
+        statement.predicate.value === ns.solid('publicId').value
+    )
+
+    expect(publicIdStatement?.object.value).toBe('https://example.com/catalog/org/nasa')
+  })
+
   it('uses explicit roleType when persisting membership type', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
diff --git a/test/sections/shared.helpers.test.ts b/test/sections/shared.helpers.test.ts
new file mode 100644
index 00000000..5f5d3f08
--- /dev/null
+++ b/test/sections/shared.helpers.test.ts
@@ -0,0 +1,339 @@
+import { afterEach, beforeEach, describe, expect, it, jest } from '@jest/globals'
+import { graph, literal, st, sym } from 'rdflib'
+import { ns } from 'solid-ui'
+import {
+  applyRowFieldChange,
+  applyRowSelectChange,
+  deleteRow,
+  summarizeRowOps,
+  type EditableRow
+} from '../../src/sections/shared/rowState'
+import {
+  applyUpdaterPatch,
+  collectLinkedNodeStatements,
+  findExistingNode,
+  runUpdateTransport,
+  replacePredicateStatements
+} from '../../src/sections/shared/rdfMutationHelpers'
+import { createIdNode } from '../../src/sections/shared/idNodeFactory'
+import {
+  sanitizeAddressFieldValue,
+  sanitizeBasicInputFieldValue,
+  sanitizeEmailValue,
+  sanitizePhoneLocalValue
+} from '../../src/sections/shared/sanitizeUtils'
+import { combinePhoneValue, splitPhoneValue } from '../../src/sections/shared/phoneCountries'
+import {
+  normalizeEmailTypeForContactInfoEdit,
+  normalizeEmailTypeForEdit,
+  normalizePhoneTypeForContactInfoEdit,
+  normalizePhoneTypeForEdit,
+  toSavedHeadingEmailType,
+  toSavedHeadingPhoneType
+} from '../../src/sections/shared/contactTypeUtils'
+import {
+  datesAsText,
+  formatMonthYear,
+  toggleDescription,
+  updateDescriptionOverflow
+} from '../../src/sections/shared/sectionCardHelpers'
+import { toggleCollapsibleSection } from '../../src/sections/shared/collapsibleSection'
+import {
+  fallbackSaveUpdatesErrorMessageText,
+  updaterUnsupportedStoreErrorMessageText
+} from '../../src/texts'
+
+type TestRow = EditableRow & {
+  label: string
+}
+
+describe('shared helper utilities', () => {
+  afterEach(() => {
+    document.body.innerHTML = ''
+    jest.restoreAllMocks()
+  })
+
+  describe('rowState', () => {
+    it('marks persisted rows as deleted and removes unsaved rows', () => {
+      const existingRow: TestRow = { entryNode: 'https://example.com#1', status: 'existing', label: 'keep' }
+      const newRow: TestRow = { entryNode: '', status: 'new', label: 'remove' }
+      const rows = [existingRow, newRow]
+
+      deleteRow(rows, 0)
+      deleteRow(rows, 1)
+
+      expect(existingRow.status).toBe('deleted')
+      expect(rows).toHaveLength(1)
+      expect(rows[0]).toBe(existingRow)
+    })
+
+    it('trims select values and updates status for existing and new rows', () => {
+      const existingRow: TestRow = { entryNode: 'https://example.com#1', status: 'existing', label: '' }
+      const newRow: TestRow = { entryNode: '', status: 'new', label: '' }
+
+      applyRowSelectChange(existingRow, 'label', '  Work  ')
+      applyRowSelectChange(newRow, 'label', '  Home  ')
+
+      expect(existingRow.label).toBe('Work')
+      expect(existingRow.status).toBe('modified')
+      expect(newRow.label).toBe('Home')
+      expect(newRow.status).toBe('new')
+    })
+
+    it('summarizes create, update, and remove operations using row content', () => {
+      const result = summarizeRowOps<TestRow>([
+        { entryNode: '', status: 'new', label: 'Create me' },
+        { entryNode: '', status: 'new', label: '   ' },
+        { entryNode: 'https://example.com#2', status: 'modified', label: 'Update me' },
+        { entryNode: 'https://example.com#3', status: 'modified', label: '' },
+        { entryNode: 'https://example.com#4', status: 'deleted', label: '' }
+      ], (row) => row.label.trim().length > 0)
+
+      expect(result.create).toHaveLength(1)
+      expect(result.update).toHaveLength(1)
+      expect(result.remove).toHaveLength(1)
+    })
+
+    it('marks empty persisted rows as deleted in field changes', () => {
+      const row: TestRow = { entryNode: 'https://example.com#1', status: 'existing', label: 'Before' }
+
+      applyRowFieldChange(row, 'label', '', (currentRow) => currentRow.label.trim().length > 0)
+
+      expect(row.status).toBe('deleted')
+    })
+  })
+
+  describe('rdfMutationHelpers', () => {
+    it('throws when updater support is unavailable', async () => {
+      const store = graph() as any
+
+      expect(() => applyUpdaterPatch(store, [], [])).toThrow(updaterUnsupportedStoreErrorMessageText)
+    })
+
+    it('filters invalid statements before calling updater', async () => {
+      const store = graph() as any
+      const subject = sym('https://example.com/profile#me')
+      const doc = subject.doc()
+      const existing = st(subject, ns.vcard('fn'), literal('Jane'), doc)
+      store.add(existing.subject, existing.predicate, existing.object, existing.why)
+
+      const update = jest.fn((_deletions: any[], _insertions: any[], callback: Function) => callback('', true))
+      store.updater = { update }
+
+      await applyUpdaterPatch(
+        store,
+        [existing, st(subject, ns.vcard('role'), literal('Missing'), doc)],
+        [st(subject, ns.vcard('role'), literal('Engineer'), doc), { subject } as any]
+      )
+
+      expect(update).toHaveBeenCalledTimes(1)
+      const [deletions, insertions] = update.mock.calls[0]
+      expect(deletions).toEqual([existing])
+      expect(insertions).toHaveLength(1)
+      expect(insertions[0].object.value).toBe('Engineer')
+    })
+
+    it('uses the fallback save error message when updater returns no message', async () => {
+      const store = graph() as any
+      const subject = sym('https://example.com/profile#me')
+      const doc = subject.doc()
+      store.updater = {
+        update: (_deletions: any[], _insertions: any[], callback: Function) => callback('', false)
+      }
+
+      await expect(
+        applyUpdaterPatch(store, [], [st(subject, ns.vcard('role'), literal('Engineer'), doc)])
+      ).rejects.toThrow(fallbackSaveUpdatesErrorMessageText)
+    })
+
+    it('registers standard RDF prefixes before updater-backed mutations run', async () => {
+      const store = graph() as any
+      const subject = sym('https://example.com/profile#me')
+      const doc = subject.doc()
+      const updaterStore: Record<string, unknown> = {}
+      const update = jest.fn((_deletions: any[], _insertions: any[], callback: Function) => callback('', true))
+      store.updater = { update, store: updaterStore }
+
+      await applyUpdaterPatch(store, [], [st(subject, ns.org('location'), literal('San Diego'), doc)])
+
+      expect(store.namespaces?.org).toBe('http://www.w3.org/ns/org#')
+      expect(store.namespaces?.schema).toBe('http://schema.org/')
+      expect(store.updater.namespaces?.vcard).toBe('http://www.w3.org/2006/vcard/ns#')
+      expect((store.updater.store as any).namespaces?.solid).toBe('http://www.w3.org/ns/solid/terms#')
+      expect((store.updater.store as any).namespaces?.foaf).toBe('http://xmlns.com/foaf/0.1/')
+      expect(update).toHaveBeenCalledTimes(1)
+    })
+
+    it('keeps standard prefixes available for PUT fallback serialization', async () => {
+      const store = graph() as any
+      const subject = sym('https://example.com/profile#me')
+      const doc = subject.doc()
+      const serialize = jest.fn(() => '@prefix org: <http://www.w3.org/ns/org#>.')
+      const webOperation = jest.fn(async () => ({ ok: true, status: 200 }))
+
+      store.updater = {
+        update: (_deletions: any[], _insertions: any[], callback: Function) => callback('', false, 'Fetch error for patch'),
+        serialize,
+        store: {}
+      }
+      store.fetcher = { webOperation }
+
+      await runUpdateTransport(
+        store,
+        doc,
+        [],
+        [st(subject, ns.org('location'), literal('San Diego'), doc)],
+        {
+          unsupportedMessage: updaterUnsupportedStoreErrorMessageText,
+          failureMessage: fallbackSaveUpdatesErrorMessageText,
+          usePutFallback: true
+        }
+      )
+
+      expect(store.updater.namespaces?.org).toBe('http://www.w3.org/ns/org#')
+      expect((store.updater.store as any).namespaces?.org).toBe('http://www.w3.org/ns/org#')
+      expect(serialize).toHaveBeenCalledTimes(1)
+      expect(webOperation).toHaveBeenCalledTimes(1)
+    })
+
+    it('replaces predicate statements and finds linked statements by normalized node ids', () => {
+      const store = graph() as any
+      const subject = sym('https://example.com/profile#me')
+      const doc = subject.doc()
+      const linkedNode = store.bnode()
+      const oldRole = st(subject, ns.vcard('role'), literal('Old role'), doc)
+      store.add(oldRole.subject, oldRole.predicate, oldRole.object, oldRole.why)
+      store.add(subject, ns.vcard('hasAddress'), linkedNode, doc)
+      store.add(linkedNode, ns.vcard('locality'), literal('Hamburg'), doc)
+
+      const deletions: any[] = []
+      const insertions: any[] = []
+      replacePredicateStatements(store, subject, ns.vcard('role'), doc, deletions, insertions, literal('New role'))
+
+      expect(deletions).toEqual([oldRole])
+      expect(insertions).toHaveLength(1)
+      expect(insertions[0].object.value).toBe('New role')
+
+      const linked = collectLinkedNodeStatements(store, subject, ns.vcard('hasAddress'), doc)
+      expect(linked.linkedNodes).toHaveLength(1)
+      expect(linked.linkedStatements).toHaveLength(1)
+      expect(linked.linkStatements).toHaveLength(1)
+      expect(findExistingNode(linked.linkedNodes, `_:${linkedNode.value}`)).toBe(linkedNode)
+    })
+  })
+
+  describe('id and input normalization helpers', () => {
+    it('creates monotonically increasing id nodes even within the same millisecond', () => {
+      const nowSpy = jest.spyOn(Date, 'now')
+      nowSpy.mockReturnValue(1700000000000)
+      const doc = sym('https://example.com/profile/card')
+
+      const first = createIdNode(doc)
+      const second = createIdNode(doc)
+
+      expect(first.value).toBe('https://example.com/profile/card#id1700000000000')
+      expect(second.value).toBe('https://example.com/profile/card#id1700000000001')
+    })
+
+    it('normalizes email, phone, and basic text inputs', () => {
+      expect(sanitizeEmailValue('  Jane.Doe @Example.COM  ')).toBe('jane.doe@example.com')
+      expect(sanitizePhoneLocalValue(' +1 (555) ABC-123.45 ')).toBe('1 (555) -123.45')
+      expect(sanitizeAddressFieldValue('  10 Downing St  ')).toBe('10 Downing St')
+      expect(sanitizeBasicInputFieldValue('  Hello world  ')).toBe('Hello world')
+    })
+
+    it('does not inject a default country code into phone values', () => {
+      expect(splitPhoneValue('555 123 4567')).toEqual({ dialCode: '', localNumber: '555 123 4567' })
+      expect(combinePhoneValue('', '555 123 4567')).toBe('555 123 4567')
+      expect(combinePhoneValue('', '+44 20 7946 0958')).toBe('+44 20 7946 0958')
+      expect(splitPhoneValue('+44 20 7946 0958')).toEqual({ dialCode: '+44', localNumber: ' 20 7946 0958' })
+    })
+
+    it('normalizes phone and email types for both edit surfaces', () => {
+      expect(normalizePhoneTypeForEdit('mobile')).toBe('Mobile')
+      expect(normalizePhoneTypeForContactInfoEdit('office')).toBe('Work')
+      expect(normalizeEmailTypeForEdit('home')).toBe('Personal')
+      expect(normalizeEmailTypeForContactInfoEdit('work')).toBe('Office')
+      expect(toSavedHeadingPhoneType('Mobile')).toBe('Cell')
+      expect(toSavedHeadingEmailType('Personal')).toBe('Home')
+    })
+  })
+
+  describe('shared section card behavior', () => {
+    beforeEach(() => {
+      jest.spyOn(window, 'requestAnimationFrame').mockImplementation((callback: FrameRequestCallback) => {
+        callback(0)
+        return 1
+      })
+    })
+
+    it('formats month text and date ranges', () => {
+      expect(formatMonthYear('2024-03-15')).toBe('Mar, 2024')
+      expect(formatMonthYear()).toBe('')
+      expect(datesAsText('2024-03-15', '2025-01-01')).toBe('Mar, 2024 to Jan, 2025')
+      expect(datesAsText('2024-03-15')).toBe('Mar, 2024 to Present')
+    })
+
+    it('shows and toggles description overflow controls', () => {
+      document.body.innerHTML = `
+        <div class="resume-card__description-wrap">
+          <div id="desc" class="resume-card__description-text"></div>
+          <button class="resume-card__description-toggle" aria-controls="desc" aria-expanded="false" hidden>...more</button>
+        </div>
+      `
+
+      const textEl = document.getElementById('desc') as HTMLElement
+      const button = document.querySelector('.resume-card__description-toggle') as HTMLButtonElement
+
+      Object.defineProperty(textEl, 'clientHeight', { configurable: true, value: 40 })
+      Object.defineProperty(textEl, 'clientWidth', { configurable: true, value: 320 })
+      Object.defineProperty(textEl, 'getBoundingClientRect', {
+        configurable: true,
+        value: () => ({ height: 80, width: 320, top: 0, left: 0, right: 320, bottom: 80, x: 0, y: 0, toJSON: () => ({}) })
+      })
+
+      updateDescriptionOverflow(document)
+      expect(button.hidden).toBe(false)
+
+      const event = new MouseEvent('click', { bubbles: true, cancelable: true })
+      Object.defineProperty(event, 'currentTarget', { configurable: true, value: button })
+
+      toggleDescription(event)
+  expect(textEl.classList.contains('resume-card__description-text--expanded')).toBe(true)
+      expect(button.getAttribute('aria-expanded')).toBe('true')
+      expect(button.textContent).toBe('...less')
+
+      toggleDescription(event)
+  expect(textEl.classList.contains('resume-card__description-text--expanded')).toBe(false)
+      expect(button.getAttribute('aria-expanded')).toBe('false')
+      expect(button.textContent).toBe('...more')
+    })
+
+    it('toggles collapsible sections and hides the panel when collapsed', () => {
+      document.body.innerHTML = `
+        <section class="profile-section-collapsible" data-expanded="false">
+          <button type="button" aria-expanded="false"></button>
+          <div class="profile-section-collapsible__content" aria-hidden="true" hidden></div>
+        </section>
+      `
+
+      const button = document.querySelector('button') as HTMLButtonElement
+      const section = document.querySelector('.profile-section-collapsible') as HTMLElement
+      const panel = document.querySelector('.profile-section-collapsible__content') as HTMLElement
+      const event = new MouseEvent('click', { bubbles: true })
+      Object.defineProperty(event, 'currentTarget', { configurable: true, value: button })
+
+      toggleCollapsibleSection(event)
+      expect(section.getAttribute('data-expanded')).toBe('true')
+      expect(button.getAttribute('aria-expanded')).toBe('true')
+      expect(panel.getAttribute('aria-hidden')).toBe('false')
+      expect(panel.hidden).toBe(false)
+
+      toggleCollapsibleSection(event)
+      expect(section.getAttribute('data-expanded')).toBe('false')
+      expect(button.getAttribute('aria-expanded')).toBe('false')
+      expect(panel.getAttribute('aria-hidden')).toBe('true')
+      expect(panel.hidden).toBe(true)
+    })
+  })
+})
\ No newline at end of file
diff --git a/test/sections/skills.section.test.ts b/test/sections/skills.section.test.ts
index c654085a..3ea5c898 100644
--- a/test/sections/skills.section.test.ts
+++ b/test/sections/skills.section.test.ts
@@ -2,6 +2,7 @@ import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
 import { renderSkillsSection } from '../../src/sections/skills/SkillsSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Skills section', () => {
@@ -31,4 +32,29 @@ describe('Skills section', () => {
 
     container.remove()
   })
+
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const skills = [
+      {
+        name: 'typescript',
+        publicId: 'https://www.wikidata.org/wiki/Q978185',
+        entryNode: sym('https://example.com/profile/card#skill-typescript')
+      },
+      {
+        name: 'solid',
+        publicId: 'https://www.wikidata.org/wiki/Q858775',
+        entryNode: sym('https://example.com/profile/card#skill-solid')
+      }
+    ]
+
+    render(renderSkillsSection(context.session.store, subject, skills, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
 })
diff --git a/test/sections/skills.selectors-mutations.test.ts b/test/sections/skills.selectors-mutations.test.ts
index 5196bf4a..0a4f35e4 100644
--- a/test/sections/skills.selectors-mutations.test.ts
+++ b/test/sections/skills.selectors-mutations.test.ts
@@ -1,9 +1,9 @@
-import { describe, expect, it } from "@jest/globals"
+import { describe, expect, it, jest } from "@jest/globals"
 import { graph, st, sym, literal } from 'rdflib'
 import { ns } from 'solid-ui'
-import { presentSkills } from '../../src/sections/skills/selectors'
+import { presentSkillDetails, presentSkills } from '../../src/sections/skills/selectors'
 import { processSkillsMutations } from '../../src/sections/skills/mutations'
-import { mutationSaveSkillsFailedPrefixText } from '../../src/texts'
+import { saveSkillsUpdatesFailedMessageText } from '../../src/texts'
 
 describe('Skills selectors and mutations', () => {
   it('selector returns empty skills from empty store', () => {
@@ -27,7 +27,27 @@ describe('Skills selectors and mutations', () => {
     expect(presentSkills(subject, store)).toEqual(['TypeScript'])
   })
 
-  it('mutation wraps updater errors with skills prefix', async () => {
+  it('selector reads names from blank-node publicId and preserves blank-node identifier', () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+    const skillEntry = sym(`${doc.value}#id1`)
+    const skillPublicId = store.bnode('custom-skill')
+
+    store.add(subject, ns.schema('skills'), skillEntry, doc)
+    store.add(skillEntry, ns.solid('publicId'), skillPublicId, doc)
+    store.add(skillPublicId, ns.schema('name'), 'Facilitation', doc)
+
+    expect(presentSkills(subject, store)).toEqual(['Facilitation'])
+    expect(presentSkillDetails(subject, store)).toEqual([
+      expect.objectContaining({
+        name: 'Facilitation',
+        publicId: '_:custom-skill'
+      })
+    ])
+  })
+
+  it('mutation surfaces section-specific unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
@@ -36,9 +56,12 @@ describe('Skills selectors and mutations', () => {
       update: [],
       remove: []
     }
-    await expect(processSkillsMutations(store, subject, plan as any)).rejects.toThrow(
-      mutationSaveSkillsFailedPrefixText
-    )
+    await expect(processSkillsMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveSkillsUpdatesFailedMessageText,
+      cause: expect.objectContaining({
+        message: 'Skill updates are not supported by this store updater.'
+      })
+    })
   })
 
   it('writes created skills with skill: node publicId and name on the publicId node', async () => {
@@ -77,6 +100,82 @@ describe('Skills selectors and mutations', () => {
     expect(legacyNameOnEntry).toBeNull()
   })
 
+  it('writes created custom skills with blank-node publicId and name on that blank node', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    const plan = {
+      create: [{ name: 'Facilitation', publicId: '', entryNode: '', status: 'new' }],
+      update: [],
+      remove: []
+    }
+
+    await processSkillsMutations(store, subject, plan as any)
+
+    const skillLinks = store.statementsMatching(subject, ns.schema('skills'), null, doc)
+    expect(skillLinks).toHaveLength(1)
+
+    const entryNode = skillLinks[0].object
+    const publicIdLink = store.any(entryNode, ns.solid('publicId'), null, doc)
+    expect(publicIdLink?.termType).toBe('BlankNode')
+
+    const skillName = store.any(publicIdLink as any, ns.schema('name'), null, doc)
+    expect(skillName?.value).toBe('Facilitation')
+
+    const legacyNameOnEntry = store.any(entryNode, ns.schema('name'), null, doc)
+    expect(legacyNameOnEntry).toBeNull()
+  })
+
+  it('falls back to updateDav for custom skills when PATCH fails', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    const updateDav = jest.fn((passedDoc: any, deletions: any[], insertions: any[], callback: Function) => {
+      deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+      insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+      callback(passedDoc.value, true)
+    })
+
+    store.fetcher = {
+      load: jest.fn(async () => undefined)
+    }
+
+    store.updater = {
+      update: (_deletions: any[], _insertions: any[], callback: Function) => callback('', false, 'Web error: 501 on PATCH'),
+      updateDav
+    }
+
+    const plan = {
+      create: [{ name: 'Facilitation', publicId: '', entryNode: '', status: 'new' }],
+      update: [],
+      remove: []
+    }
+
+    await processSkillsMutations(store, subject, plan as any)
+
+    expect(updateDav).toHaveBeenCalledTimes(1)
+
+    const skillLinks = store.statementsMatching(subject, ns.schema('skills'), null, doc)
+    expect(skillLinks).toHaveLength(1)
+
+    const entryNode = skillLinks[0].object
+    const publicIdLink = store.any(entryNode, ns.solid('publicId'), null, doc)
+    expect(publicIdLink?.termType).toBe('BlankNode')
+
+    const skillName = store.any(publicIdLink as any, ns.schema('name'), null, doc)
+    expect(skillName?.value).toBe('Facilitation')
+  })
+
   it('deletes both skill entry triples and schema:skills pointer', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
diff --git a/test/sections/social.section.test.ts b/test/sections/social.section.test.ts
index 4bc1794c..dc2170e9 100644
--- a/test/sections/social.section.test.ts
+++ b/test/sections/social.section.test.ts
@@ -1,7 +1,8 @@
 import { describe, expect, it } from "@jest/globals"
 import { render } from 'lit-html'
 import { sym } from 'rdflib'
-import { renderSocialAccounts } from '../../src/sections/social/SocialSection'
+import { renderSocialSection } from '../../src/sections/social/SocialSection'
+import { runAxe } from '../helpers/runAxe'
 import { context, subject } from '../setup'
 
 describe('Social section', () => {
@@ -20,11 +21,40 @@ describe('Social section', () => {
       ]
     }
 
-    render(renderSocialAccounts(context.session.store, subject, socialPresentation as any, 'owner'), container)
+    render(renderSocialSection(context.session.store as any, subject, socialPresentation as any, 'owner'), container)
 
     expect(container.querySelector('#social-heading')).toBeTruthy()
     expect(container.querySelector('a[href="https://github.com/janedoe"]')).toBeTruthy()
 
     container.remove()
   })
+
+  it('has no accessibility violations', async () => {
+    const container = document.createElement('div')
+    document.body.appendChild(container)
+
+    const socialPresentation = {
+      accounts: [
+        {
+          entryNode: sym('https://example.com/profile#social1'),
+          name: 'GitHub',
+          icon: 'https://example.com/icon.svg',
+          homepage: 'https://github.com/janedoe'
+        },
+        {
+          entryNode: sym('https://example.com/profile#social2'),
+          name: 'Mastodon',
+          icon: 'https://example.com/mastodon.svg',
+          homepage: 'https://social.example/@janedoe'
+        }
+      ]
+    }
+
+    render(renderSocialSection(context.session.store as any, subject, socialPresentation as any, 'owner'), container)
+
+    const results = await runAxe(container)
+    expect(results.violations.length).toBe(0)
+
+    container.remove()
+  })
 })
diff --git a/test/sections/social.selectors-mutations.test.ts b/test/sections/social.selectors-mutations.test.ts
index c49507be..1a216883 100644
--- a/test/sections/social.selectors-mutations.test.ts
+++ b/test/sections/social.selectors-mutations.test.ts
@@ -4,11 +4,11 @@ import { ns } from 'solid-ui'
 import { presentSocial } from '../../src/sections/social/selectors'
 import { processSocialMutations } from '../../src/sections/social/mutations'
 import { findSocialAccountOption, getSocialAccountOptions, homepageForAccount } from '../../src/sections/social/helpers'
-import { saveSocialUpdatesFailedPrefixText } from '../../src/texts'
+import { saveSocialUpdatesFailedMessageText } from '../../src/texts'
 import { expandRdfList } from '../../src/sections/shared/rdfList'
 
 jest.mock('../../src/sections/social/helpers', () => {
-  const actual = jest.requireActual('../../src/sections/social/helpers')
+  const actual = jest.requireActual('../../src/sections/social/helpers') as Record<string, unknown>
   return {
     ...actual,
     ensureSocialOntologyLoaded: jest.fn()
@@ -41,14 +41,17 @@ describe('Social selectors and mutations', () => {
     expect(presentSocial(subject, store)).toEqual({ accounts: [] })
   })
 
-  it('mutation wraps updater errors with social prefix', async () => {
+  it('mutation surfaces unsupported store updater errors', async () => {
     const store = graph() as any
     const subject = sym('https://example.com/profile/card#me')
 
     const plan = { create: [], update: [], remove: [] }
-    await expect(processSocialMutations(store, subject, plan as any)).rejects.toThrow(
-      saveSocialUpdatesFailedPrefixText
-    )
+    await expect(processSocialMutations(store, subject, plan as any)).rejects.toMatchObject({
+      message: saveSocialUpdatesFailedMessageText,
+      cause: expect.objectContaining({
+        message: 'Social updates are not supported by this store updater.'
+      })
+    })
   })
 
   it('writes new social entry as id node with foaf account structure', async () => {
@@ -218,4 +221,152 @@ describe('Social selectors and mutations', () => {
 
     expect(expanded.map((node: any) => node.value)).toEqual([instagramNode.value, facebookNode.value])
   })
+
+  it('returns reordered social accounts from the selector after saving orderedRows', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    const facebookNode = sym('https://example.com/profile/card#id1111111111111')
+    const instagramNode = sym('https://example.com/profile/card#id2222222222222')
+    const facebookClass = sym('https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#FacebookAccount')
+    const instagramClass = sym('https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#InstagramAccount')
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    store.add(subject, ns.foaf('account'), new Collection([facebookNode, instagramNode]), doc)
+    store.add(facebookNode, ns.rdf('type'), facebookClass, doc)
+    store.add(facebookNode, ns.foaf('accountName'), literal('sharon-facebook'), doc)
+    store.add(instagramNode, ns.rdf('type'), instagramClass, doc)
+    store.add(instagramNode, ns.foaf('accountName'), literal('sharon-instagram'), doc)
+
+    await processSocialMutations(
+      store,
+      subject,
+      { create: [], update: [], remove: [] } as any,
+      [
+        { name: 'Instagram', icon: '', homepage: 'https://www.instagram.com/sharon-instagram', entryNode: instagramNode.value, status: 'existing' },
+        { name: 'Facebook', icon: '', homepage: 'https://www.facebook.com/sharon-facebook', entryNode: facebookNode.value, status: 'existing' }
+      ] as any
+    )
+
+    const accounts = presentSocial(subject, store).accounts
+
+    expect(accounts.map((account) => account.entryNode.value)).toEqual([instagramNode.value, facebookNode.value])
+    expect(accounts.map((account) => account.homepage)).toEqual([
+      'https://www.instagram.com/sharon-instagram',
+      'https://www.facebook.com/sharon-facebook'
+    ])
+  })
+
+  it('preserves unrelated statements on reused social entry nodes', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    const facebookNode = sym('https://example.com/profile/card#id1111111111111')
+    const instagramNode = sym('https://example.com/profile/card#id2222222222222')
+    const facebookClass = sym('https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#FacebookAccount')
+    const instagramClass = sym('https://solidos.github.io/profile-pane/src/ontology/socialMedia.ttl#InstagramAccount')
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    store.add(subject, ns.foaf('account'), new Collection([facebookNode, instagramNode]), doc)
+    store.add(facebookNode, ns.rdf('type'), facebookClass, doc)
+    store.add(facebookNode, ns.foaf('accountName'), literal('sharon-facebook'), doc)
+    store.add(instagramNode, ns.rdf('type'), instagramClass, doc)
+    store.add(instagramNode, ns.foaf('accountName'), literal('sharon-instagram'), doc)
+    store.add(instagramNode, ns.rdfs('comment'), literal('keep-me'), doc)
+
+    await processSocialMutations(
+      store,
+      subject,
+      { create: [], update: [], remove: [] } as any,
+      [
+        { name: 'Instagram', icon: '', homepage: 'https://www.instagram.com/sharon-instagram', entryNode: instagramNode.value, status: 'existing' },
+        { name: 'Facebook', icon: '', homepage: 'https://www.facebook.com/sharon-facebook', entryNode: facebookNode.value, status: 'existing' }
+      ] as any
+    )
+
+    expect(store.any(instagramNode, ns.rdfs('comment'), null, doc)?.value).toBe('keep-me')
+    expect(presentSocial(subject, store).accounts.map((account) => account.entryNode.value)).toEqual([
+      instagramNode.value,
+      facebookNode.value
+    ])
+  })
+
+  it('writes other accounts with homepage and icon instead of accountName', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    store.updater = {
+      update: (deletions: any[], insertions: any[], callback: Function) => {
+        deletions.forEach((statement) => store.remove(st(statement.subject, statement.predicate, statement.object, statement.why)))
+        insertions.forEach((statement) => store.add(statement.subject, statement.predicate, statement.object, statement.why))
+        callback('', true)
+      }
+    }
+
+    await processSocialMutations(store, subject, {
+      create: [{
+        name: 'Other',
+        icon: 'https://example.com/icon.svg',
+        homepage: 'https://example.com/custom-profile',
+        entryNode: '',
+        status: 'new'
+      }],
+      update: [],
+      remove: []
+    } as any)
+
+    const accountLinks = store.statementsMatching(subject, ns.foaf('account'), null, doc)
+    const expandedAccounts = accountLinks
+      .flatMap((statement: any) => expandRdfList(store, statement.object))
+      .filter((node: any) => node.termType === 'NamedNode')
+    const entryNode = expandedAccounts[0]
+
+    expect(store.any(entryNode, ns.foaf('homepage'), null, doc)?.value).toBe('https://example.com/custom-profile')
+    expect(store.any(entryNode, ns.foaf('icon'), null, doc)?.value).toBe('https://example.com/icon.svg')
+    expect(store.any(entryNode, ns.foaf('accountName'), null, doc)).toBeNull()
+  })
+
+  it('falls back to PUT when patch update fails with a supported patch error', async () => {
+    const store = graph() as any
+    const subject = sym('https://example.com/profile/card#me')
+    const doc = subject.doc()
+
+    const serialize = jest.fn((_docValue: string, _statements: any[], _contentType: string) => 'serialized-body')
+    const webOperation = jest.fn(async (..._args: unknown[]) => ({ ok: true, status: 200 }))
+
+    store.fetcher = { webOperation }
+    store.updater = {
+      update: (_deletions: any[], _insertions: any[], callback: Function) => callback('', false, 'Web error: 405 on patch'),
+      serialize
+    }
+
+    await processSocialMutations(store, subject, {
+      create: [{ name: 'Github', icon: '', homepage: 'https://github.com/sharon', entryNode: '', status: 'new' }],
+      update: [],
+      remove: []
+    } as any)
+
+    expect(serialize).toHaveBeenCalledTimes(1)
+    expect(webOperation as any).toHaveBeenCalledWith('PUT', doc.value, expect.objectContaining({
+      contentType: 'text/turtle',
+      body: 'serialized-body'
+    }))
+  })
 })
diff --git a/test/setup.ts b/test/setup.ts
index b2913da9..c8603a04 100644
--- a/test/setup.ts
+++ b/test/setup.ts
@@ -16,30 +16,40 @@ export function fakeLogInAs (subject) {
  }
  }
 
+export function resetTestSetup() {
+    store.removeDocument(doc)
+    delete (window as any).$SolidTestEnvironment
+}
+
 export function delay(ms) {
     return new Promise(resolve => setTimeout(resolve, ms))
 }
-export const context = {
-    dom: document,
-    getOutliner: () => null,
-    session: {
-        info: {
-            isLoggedIn: true,  // Added for editProofilepane
-            webId: subject.value,
-        },
-        paneRegistry: {
-            byName: (name: string) => {
-                return {
-                    render: () => {
-                        return document.createElement('div')
-                            .appendChild(
-                                document.createTextNode(`mock ${name} pane`)
-                            )
+
+export function createTestContext() {
+    return {
+        dom: document,
+        getOutliner: () => null,
+        session: {
+            info: {
+                isLoggedIn: true,  // Added for editProofilepane
+                webId: subject.value,
+            },
+            paneRegistry: {
+                byName: (name: string) => {
+                    return {
+                        render: () => {
+                            return document.createElement('div')
+                                .appendChild(
+                                    document.createTextNode(`mock ${name} pane`)
+                                )
+                        }
                     }
                 }
-            }
-        } as PaneRegistry,
-        store: store,
-        logic: {} as SolidLogic,
-    },
-} as unknown as DataBrowserContext
+            } as PaneRegistry,
+            store: store,
+            logic: {} as SolidLogic,
+        },
+    } as unknown as DataBrowserContext
+}
+
+export const context = createTestContext()
diff --git a/test/social-card.accessibility.test.ts b/test/social-card.accessibility.test.ts
index 021c0792..3b8fc2e9 100644
--- a/test/social-card.accessibility.test.ts
+++ b/test/social-card.accessibility.test.ts
@@ -1,7 +1,7 @@
 import { render } from 'lit-html'
 import { SocialCard } from '../src/sections/social/SocialSection'
-import axe from 'axe-core'
 import { sym } from 'rdflib'
+import { runAxe } from './helpers/runAxe'
 
 describe('SocialCard accessibility', () => {
   it('has no accessibility violations', async () => {
@@ -25,7 +25,7 @@ describe('SocialCard accessibility', () => {
     document.body.appendChild(container)
     render(SocialCard(SocialData, 'anonymous'), container)
 
-    const results = await axe.run(container)
+    const results = await runAxe(container)
     expect(results.violations.length).toBe(0)
   })
 
@@ -43,12 +43,12 @@ describe('SocialCard accessibility', () => {
     document.body.appendChild(container)
     render(SocialCard(SocialData, 'anonymous'), container)
 
-    const moreButton = container.querySelector('.socialCard__more-button') as HTMLButtonElement | null
+    const moreButton = container.querySelector('.social-card__more-button') as HTMLButtonElement | null
     expect(moreButton?.textContent).toContain('1 more')
 
     moreButton?.click()
 
-    const socialCard = container.querySelector('.socialCard') as HTMLElement | null
+    const socialCard = container.querySelector('.social-card') as HTMLElement | null
     expect(socialCard?.getAttribute('data-mobile-expanded')).toBe('true')
 
     container.remove()
diff --git a/test/social.spec.ts b/test/social.spec.ts
index d3d7055d..3c0e2a92 100644
--- a/test/social.spec.ts
+++ b/test/social.spec.ts
@@ -1,7 +1,7 @@
 import pane from '../src/index'
 import { parse } from 'rdflib'
 import { store } from 'solid-logic'
-import { findByTestId } from '@testing-library/dom'
+import { waitFor } from '@testing-library/dom'
 import { context, doc, subject } from './setup'
 
 
@@ -79,12 +79,15 @@ describe('profile-pane', () => {
       parse(exampleProfile, store, doc.uri)
       const result = pane.render(subject, context)
       console.log('Pane rendered <<< ', result.innerHTML , '>>>')
-      // Wait for async rendering to complete
-      element = await findByTestId(result, 'social-media', {}, { timeout: 5000 })
+      element = await waitFor(() => {
+        const socialMedia = result.querySelector('#social-media') as HTMLElement | null
+        expect(socialMedia).not.toBeNull()
+        return socialMedia
+      }, { timeout: 5000 })
     })
 
     it('renders link to Facebook', () => {
-      expect(element).toContainHTML('Facebook')
+      expect(element.querySelector('a[aria-label*="Facebook"]')).toBeTruthy()
     })
 
     /*
diff --git a/tsconfig.json b/tsconfig.json
index 36e8f97e..35bc1dba 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -10,7 +10,8 @@
     /* Crucial for library compatibility END */
     "lib": [
       "DOM",
-      "ES2019"
+	  "ES2019",
+	  "ES2022.Error"
     ] /* Specify library files to be included in the compilation. */,
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
diff --git a/webpack.dev.config.mjs b/webpack.dev.config.mjs
index 9e632d08..342defe4 100644
--- a/webpack.dev.config.mjs
+++ b/webpack.dev.config.mjs
@@ -92,6 +92,10 @@ export default [
           publicPath: '/node_modules'
         }
       ],
+      watchFiles: [
+        './src/**/*',
+        '../solid-ui/dist/**/*'
+      ]
     },
     devtool: "source-map",
   },