@flood-md/react 0.2.10 → 0.2.12

package/dist/foundations.css

@@ -13,7 +13,7 @@
 .flood-root .flood-list[data-marker="false"] { list-style: none; padding: 0; }
 .flood-root .flood-empty-state { box-sizing: border-box; align-items: center; text-align: center; padding-block: var(--flood-sys-space-8); padding-inline: min(var(--flood-sys-space-8), 8%); }
 .flood-root .flood-empty-state[data-density="compact"] { padding-block: var(--flood-sys-space-6); padding-inline: min(var(--flood-sys-space-6), 8%); }
-.flood-root .flood-empty-state__icon { display:grid; place-items:center; flex:none; padding: var(--flood-sys-space-3); border-radius: var(--flood-sys-radius-action); background: var(--flood-sys-color-surface-default); }
+.flood-root .flood-empty-state__icon { display:grid; place-items:center; flex:none; padding: var(--flood-sys-space-3); border-radius: var(--flood-sys-radius-action); background: var(--flood-sys-color-surface-muted); }
 .flood-root .flood-empty-state__actions { justify-content: center; }
 .flood-root :is(.flood-container, .flood-grid, .flood-aspect-ratio, .flood-list, .flood-image, .flood-empty-state)[hidden] { display: none; }
 
@@ -29,11 +29,15 @@
 .flood-root .flood-card[hidden] { display: none; }
 @media (forced-colors: active) { .flood-root .flood-card { border: var(--flood-sys-stroke-width) solid CanvasText; background: Canvas !important; color: CanvasText; } }
 
-.flood-root .flood-kbd { display: inline-flex; flex: none; align-items: center; justify-content: center; vertical-align: middle; box-sizing: border-box; min-inline-size: var(--flood-sys-size-keycap-sm); min-block-size: var(--flood-sys-size-keycap-sm); padding-inline: var(--flood-sys-space-1); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-indicator); background: var(--flood-sys-color-surface-default); color: var(--flood-sys-color-content-subtle); font-family: var(--flood-sys-font-mono); font-size: var(--flood-sys-type-helper-size); font-weight: var(--flood-sys-type-helper-weight); line-height: var(--flood-sys-type-helper-line-height); white-space: nowrap; }
+.flood-root .flood-kbd { display: inline-flex; flex: none; align-items: center; justify-content: center; vertical-align: middle; box-sizing: border-box; min-inline-size: var(--flood-sys-size-keycap-sm); min-block-size: var(--flood-sys-size-keycap-sm); padding-inline: var(--flood-sys-space-1); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-indicator); background: var(--flood-sys-color-surface-muted); color: var(--flood-sys-color-content-subtle); font-family: var(--flood-sys-font-mono); font-size: var(--flood-sys-type-helper-size); font-weight: var(--flood-sys-type-helper-weight); line-height: var(--flood-sys-type-helper-line-height); white-space: nowrap; }
 .flood-root .flood-kbd[data-size="md"] { min-inline-size: var(--flood-sys-size-keycap-md); min-block-size: var(--flood-sys-size-keycap-md); font-size: var(--flood-sys-type-compact-size); }
 .flood-root .flood-kbd[data-size="lg"] { min-inline-size: var(--flood-sys-size-keycap-lg); min-block-size: var(--flood-sys-size-keycap-lg); font-size: var(--flood-sys-type-body-size); }
 .flood-root .flood-toolbar { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--flood-sys-space-1); box-sizing: border-box; inline-size: fit-content; max-inline-size: 100%; min-inline-size: 0; padding: var(--flood-sys-space-1); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-field); background: var(--flood-sys-color-surface-default); }
 .flood-root .flood-toolbar[data-orientation="vertical"] { flex-direction: column; align-items: stretch; }
+.flood-root .flood-toolbar[data-shape="pill"] { border-radius: var(--flood-sys-radius-action); }
+.flood-root .flood-toolbar[data-shape="pill"][data-orientation="vertical"] { flex-wrap: nowrap; align-items: center; }
+.flood-root .flood-toolbar[data-variant="plain"] { padding:0; border:0; background:transparent; }
+.flood-root .flood-toolbar[data-shape="pill"][data-orientation="horizontal"] { flex-wrap: nowrap; overflow: auto; }
 .flood-root .flood-toolbar:focus-visible { outline: var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset: calc(-1 * var(--flood-sys-focus-width)); }
 .flood-root .flood-toolbar[data-orientation="horizontal"] > .flood-divider { align-self: stretch; inline-size: var(--flood-sys-stroke-width); block-size: auto; border: 0; border-inline-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); margin-inline: var(--flood-sys-space-1); margin-block: var(--flood-sys-space-1); }
 .flood-root .flood-toolbar[data-orientation="vertical"] > .flood-divider { align-self: stretch; inline-size: 100%; block-size: var(--flood-sys-stroke-width); border: 0; border-block-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); margin-block: var(--flood-sys-space-1); }
@@ -79,23 +83,33 @@
 .flood-root .flood-table caption { text-align: start; padding-block-end: var(--flood-sys-space-3); font-weight: var(--flood-sys-type-label-weight); color: var(--flood-sys-color-content-default); }
 .flood-root .flood-table :is(th, td) { text-align: start; vertical-align: middle; padding: var(--flood-data-padding) var(--flood-sys-space-3); overflow-wrap: break-word; }
 .flood-root .flood-table :is(th, td)[data-wrap="anywhere"] { overflow-wrap: anywhere; }
-.flood-root .flood-table[data-cell-vertical-align="top"] :is(th, td) { vertical-align: top; }
-.flood-root .flood-table[data-cell-vertical-align="middle"] :is(th, td) { vertical-align: middle; }
-.flood-root .flood-table[data-cell-vertical-align="bottom"] :is(th, td) { vertical-align: bottom; }
+.flood-root .flood-table[data-cell-vertical-align="top"] > :where(thead, tbody, tfoot) > :where(tr) > :is(th, td) { vertical-align: top; }
+.flood-root .flood-table[data-cell-vertical-align="bottom"] > :where(thead, tbody, tfoot) > :where(tr) > :is(th, td) { vertical-align: bottom; }
 .flood-root .flood-table th { font-weight: var(--flood-sys-type-label-weight); }
-.flood-root .flood-table thead th { color: var(--flood-sys-color-content-subtle); border-block-end: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
-.flood-root .flood-table tbody > tr:not(:last-child) > :is(th, td) { border-block-end: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
-.flood-root .flood-table tfoot > tr:first-child > :is(th, td) { border-block-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
-.flood-root .flood-table tfoot { background: color-mix(in srgb, var(--flood-sys-color-content-default) 8%, transparent); }
-.flood-root .flood-table tfoot :is(th, td) { font-weight: var(--flood-sys-type-label-weight); }
-.flood-root .flood-table[data-striped="true"] tbody > tr:nth-child(even) { background: color-mix(in srgb, var(--flood-sys-color-content-default) 4%, transparent); }
+.flood-root .flood-table > thead > :where(tr) > th { color: var(--flood-sys-color-content-subtle); border-block-end: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
+.flood-root .flood-table[data-sticky-header] > thead {
+  position: sticky;
+  inset-block-start: 0;
+  z-index: 2;
+  background-color: var(--flood-sys-color-surface-canvas);
+  background-image: linear-gradient(var(--flood-sys-color-surface-current), var(--flood-sys-color-surface-current));
+}
+.flood-root .flood-table[data-sticky-header] > thead > tr:last-child > :is(th, td) {
+  box-shadow: inset 0 calc(-1 * var(--flood-sys-stroke-width)) var(--flood-sys-color-divider-decorative);
+}
+.flood-root .flood-table > tbody > tr:not(:last-child) > :is(th, td) { border-block-end: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
+.flood-root .flood-table > tfoot > tr:first-child > :is(th, td) { border-block-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
+.flood-root .flood-table > tfoot { background: color-mix(in srgb, var(--flood-sys-color-content-default) 8%, transparent); }
+.flood-root .flood-table > tfoot > :where(tr) > :is(th, td) { font-weight: var(--flood-sys-type-label-weight); }
+.flood-root .flood-table[data-striped="true"] > tbody > :where(tr:nth-child(even of :not(.flood-data-table__expanded-row))) { background: color-mix(in srgb, var(--flood-sys-color-content-default) 4%, transparent); }
 .flood-root .flood-table [data-numeric] { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
 .flood-root .flood-table [data-align="center"] { text-align: center; }
 .flood-root .flood-table [data-align="end"] { text-align: end; }
 .flood-root .flood-table [data-align="start"] { text-align: start; }
 .flood-root :is(.flood-description-list, .flood-table-container, .flood-table)[hidden] { display: none; }
 @media (forced-colors: active) {
-  .flood-root .flood-table[data-striped="true"] tbody > tr:nth-child(even) { background: Canvas; }
+  .flood-root .flood-table[data-sticky-header] > thead { background: Canvas; }
+  .flood-root .flood-table[data-striped="true"] > tbody > :where(tr:nth-child(even of :not(.flood-data-table__expanded-row))) { background: Canvas; }
   .flood-root .flood-table tfoot { background: Canvas; }
   .flood-root .flood-table :is(th, td), .flood-root .flood-description-list[data-dividers="true"] > .flood-description-list__item { border-color: CanvasText; }
 }
@@ -114,11 +128,19 @@
 .flood-root .flood-indicator__fill { display: block; flex: none; block-size: 100%; border-radius: inherit; background: var(--flood-indicator-color); transition: inline-size var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing); }
 .flood-root .flood-indicator[data-indeterminate="true"] .flood-indicator__fill { inline-size: 100%; background: linear-gradient(90deg, transparent, var(--flood-indicator-color), transparent); background-size: 200% 100%; animation: flood-indeterminate 1.4s linear infinite; }
 @keyframes flood-indeterminate { from { background-position: 200% 0; } to { background-position: -200% 0; } }
-.flood-root .flood-alert { --flood-alert-color: var(--flood-sys-color-content-subtle); position: relative; display: flex; align-items: flex-start; gap: var(--flood-sys-space-3); box-sizing: border-box; min-inline-size: 0; padding: var(--flood-sys-space-4); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-field); background: color-mix(in srgb, var(--flood-alert-color) 4%, var(--flood-sys-color-surface-canvas)); color: var(--flood-sys-color-content-default); }
+.flood-root .flood-alert { --flood-alert-color: var(--flood-sys-color-content-subtle); position: relative; display: flex; align-items: flex-start; gap: var(--flood-sys-space-3); box-sizing: border-box; min-inline-size: 0; padding: var(--flood-sys-space-4); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-field); background: color-mix(in srgb, var(--flood-alert-color) 4%, var(--flood-sys-color-surface-current)); color: var(--flood-sys-color-content-default); }
 .flood-root .flood-alert[data-tone="info"] { --flood-alert-color: var(--flood-sys-color-feedback-info); }
 .flood-root .flood-alert[data-tone="success"] { --flood-alert-color: var(--flood-sys-color-feedback-success); }
 .flood-root .flood-alert[data-tone="warning"] { --flood-alert-color: var(--flood-sys-color-feedback-warning); }
 .flood-root .flood-alert[data-tone="error"] { --flood-alert-color: var(--flood-sys-color-feedback-error); }
+.flood-root .flood-alert:not([data-tone="neutral"]) {
+  --flood-sys-color-action-subtle-rest: color-mix(in srgb, var(--flood-sys-color-surface-current), var(--flood-alert-color) 8%);
+  --flood-sys-color-action-subtle-hover: color-mix(in srgb, var(--flood-sys-color-surface-current), var(--flood-alert-color) 14%);
+  --flood-sys-color-action-subtle-pressed: color-mix(in srgb, var(--flood-sys-color-surface-current), var(--flood-alert-color) 20%);
+  --flood-sys-color-action-ghost-hover: var(--flood-sys-color-action-subtle-hover);
+  --flood-sys-color-action-ghost-pressed: var(--flood-sys-color-action-subtle-pressed);
+}
+.flood-root .flood-alert:not(:has(> .flood-alert__content > .flood-alert__title)):has(> .flood-alert__content > .flood-alert__body > .flood-inline:only-child) { align-items: center; }
 .flood-root .flood-alert__icon { display: inline-flex; flex: none; inline-size: var(--flood-sys-control-md-icon-size); block-size: var(--flood-sys-control-md-icon-size); color: var(--flood-alert-color); }
 .flood-root .flood-alert__icon > svg { inline-size: 100%; block-size: 100%; }
 .flood-root .flood-alert__content { flex: 1 1 auto; min-inline-size: 0; overflow-wrap: break-word; font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); }
@@ -140,7 +162,7 @@
   .flood-root :is(.flood-alert__icon, .flood-alert__body) { color: CanvasText; }
 }
 
-.flood-root .flood-badge { --flood-badge-color: var(--flood-sys-color-content-default); display: inline-flex; align-items: center; vertical-align: middle; gap: var(--flood-sys-space-1); box-sizing: border-box; max-inline-size: 100%; min-inline-size: 0; padding: var(--flood-sys-space-1) var(--flood-sys-space-2); border: var(--flood-sys-stroke-width) solid transparent; border-radius: var(--flood-sys-radius-action); background: color-mix(in srgb, var(--flood-badge-color) 9%, var(--flood-sys-color-surface-canvas)); color: var(--flood-badge-color); font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); font-weight: var(--flood-sys-type-label-weight); letter-spacing: var(--flood-sys-type-helper-tracking); overflow-wrap: break-word; }
+.flood-root .flood-badge { --flood-badge-color: var(--flood-sys-color-content-default); display: inline-flex; align-items: center; vertical-align: middle; gap: var(--flood-sys-space-1); box-sizing: border-box; max-inline-size: 100%; min-inline-size: 0; padding: var(--flood-sys-space-1) var(--flood-sys-space-2); border: var(--flood-sys-stroke-width) solid transparent; border-radius: var(--flood-sys-radius-action); background: color-mix(in srgb, var(--flood-badge-color) 9%, var(--flood-sys-color-surface-current)); color: var(--flood-badge-color); font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); font-weight: var(--flood-sys-type-label-weight); letter-spacing: var(--flood-sys-type-helper-tracking); overflow-wrap: break-word; }
 .flood-root .flood-badge[data-size="sm"] { padding-block: 0; }
 .flood-root .flood-badge[data-size="lg"] { padding-inline: var(--flood-sys-space-3); font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); }
 .flood-root .flood-badge[data-tone="accent"] { --flood-badge-color: var(--flood-sys-color-accent-content); }
@@ -155,7 +177,7 @@
 .flood-root .flood-skeleton[data-shape="circle"] { inline-size: 2.5rem; block-size: 2.5rem; border-radius: var(--flood-sys-radius-action); }
 .flood-root .flood-skeleton[data-animate="true"] { animation: flood-skeleton-pulse 1.8s ease-in-out infinite; }
 @keyframes flood-skeleton-pulse { 50% { opacity: .5; } }
-.flood-root .flood-avatar { --flood-avatar-size: var(--flood-sys-control-md-height); position: relative; display: inline-grid; place-items: center; vertical-align: middle; flex: none; inline-size: var(--flood-avatar-size); block-size: var(--flood-avatar-size); box-sizing: border-box; overflow: hidden; border-radius: var(--flood-sys-radius-action); background: var(--flood-sys-color-surface-overlay); color: var(--flood-sys-color-content-subtle); font-size: var(--flood-sys-type-compact-size); font-weight: var(--flood-sys-type-label-weight); line-height: 1; user-select: none; }
+.flood-root .flood-avatar { --flood-avatar-size: var(--flood-sys-control-md-height); position: relative; display: inline-grid; place-items: center; vertical-align: middle; flex: none; inline-size: var(--flood-avatar-size); block-size: var(--flood-avatar-size); box-sizing: border-box; overflow: hidden; border-radius: var(--flood-sys-radius-action); background: var(--flood-sys-color-surface-avatar); color: var(--flood-sys-color-content-subtle); font-size: var(--flood-sys-type-compact-size); font-weight: var(--flood-sys-type-label-weight); line-height: 1; user-select: none; }
 .flood-root .flood-avatar[data-size="sm"] { --flood-avatar-size: var(--flood-sys-control-sm-height); font-size: var(--flood-sys-type-helper-size); }
 .flood-root .flood-avatar[data-size="lg"] { --flood-avatar-size: var(--flood-sys-control-xl-height); }
 .flood-root .flood-avatar[data-shape="rounded"] { border-radius: var(--flood-sys-radius-field); }
@@ -186,6 +208,31 @@
 .flood-root .flood-tabs__panel { min-inline-size: 0; padding: var(--flood-sys-space-4); font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); overflow-wrap: break-word; }
 .flood-root .flood-tabs__panel[hidden] { display: none; }
 .flood-root .flood-tabs__panel:focus-visible { outline: var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset: calc(-1 * var(--flood-sys-focus-width)); }
+.flood-root .flood-tabs[data-variant="line"] {
+  gap: var(--flood-sys-space-4);
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+.flood-root .flood-tabs[data-variant="line"] .flood-tabs__scroll { background: transparent; }
+.flood-root .flood-tabs[data-variant="line"] .flood-tab { position: relative; }
+.flood-root .flood-tabs[data-variant="line"] .flood-tab[aria-selected="true"] { background: transparent; }
+.flood-root .flood-tabs[data-variant="line"] .flood-tab[aria-selected="true"]::after {
+  position: absolute;
+  inset-inline: var(--flood-sys-space-2);
+  inset-block-end: 0;
+  block-size: var(--flood-sys-focus-width);
+  background: currentColor;
+  content: "";
+  pointer-events: none;
+}
+.flood-root .flood-tabs[data-variant="line"] .flood-tabs__panel { padding: 0; }
+.flood-root .flood-tabs[data-variant="line"][data-orientation="vertical"] .flood-tab[aria-selected="true"]::after {
+  inset-inline: auto 0;
+  inset-block: var(--flood-sys-space-2);
+  inline-size: var(--flood-sys-focus-width);
+  block-size: auto;
+}
 .flood-root :is(.flood-breadcrumb, .flood-pagination) { min-inline-size: 0; max-inline-size: 100%; font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); }
 .flood-root :is(.flood-breadcrumb ol, .flood-pagination ul) { display: flex; flex-wrap: wrap; align-items: center; padding: 0; margin: 0; list-style: none; gap: var(--flood-sys-space-2); }
 .flood-root .flood-breadcrumb { inline-size: max-content; }
@@ -229,13 +276,25 @@
 .flood-root .flood-disclosure__heading { margin: 0; padding: 0; font: inherit; }
 .flood-root .flood-disclosure .flood-disclosure__trigger { inline-size: 100%; max-inline-size: none; justify-content: space-between; text-align: start; border-radius: calc(var(--flood-sys-radius-field) - var(--flood-sys-stroke-width)); }
 .flood-root .flood-disclosure__title { min-inline-size: 0; }
-.flood-root .flood-disclosure__indicator { flex: none; inline-size: calc(var(--flood-control-icon) * .4); block-size: calc(var(--flood-control-icon) * .4); border-right: var(--flood-sys-stroke-width) solid currentColor; border-block-end: var(--flood-sys-stroke-width) solid currentColor; transform: rotate(45deg); transition: transform var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing); margin-inline: var(--flood-sys-space-1); }
-.flood-root .flood-disclosure[data-open="true"] > .flood-disclosure__heading .flood-disclosure__indicator { transform: rotate(225deg); }
+.flood-root .flood-disclosure__indicator { transition: transform var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing); }
+.flood-root .flood-disclosure[data-open="true"] > .flood-disclosure__heading .flood-disclosure__indicator { transform: rotate(180deg); }
 .flood-root .flood-disclosure__panel { padding: 0 var(--flood-control-padding) var(--flood-control-padding); font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); overflow-wrap: break-word; }
 .flood-root .flood-disclosure__panel[hidden] { display: none; }
+.flood-root .flood-disclosure:not(.flood-accordion > .flood-disclosure, .flood-navigation-group__disclosure) {
+  --flood-disclosure-header-inset: var(--flood-sys-space-1);
+  --flood-disclosure-content-inset: calc(var(--flood-control-padding) + var(--flood-disclosure-header-inset));
+}
+.flood-root .flood-disclosure:not(.flood-accordion > .flood-disclosure, .flood-navigation-group__disclosure) > .flood-disclosure__heading {
+  padding: var(--flood-disclosure-header-inset);
+}
+.flood-root .flood-disclosure:not(.flood-accordion > .flood-disclosure, .flood-navigation-group__disclosure) > .flood-disclosure__heading > .flood-disclosure__trigger {
+  border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-sys-stroke-width) - var(--flood-disclosure-header-inset)));
+}
+.flood-root .flood-disclosure:not(.flood-accordion > .flood-disclosure, .flood-navigation-group__disclosure) > .flood-disclosure__panel {
+  padding: var(--flood-sys-space-2) var(--flood-disclosure-content-inset) var(--flood-disclosure-content-inset);
+}
 .flood-root .flood-accordion > .flood-disclosure { border: 0; border-radius: 0; background: transparent; }
 .flood-root .flood-accordion > .flood-disclosure + .flood-disclosure { border-block-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
-.flood-root .flood-disclosure[data-open="true"] > .flood-disclosure__heading > .flood-disclosure__trigger { border-end-start-radius: 0; border-end-end-radius: 0; }
 .flood-root .flood-accordion > .flood-disclosure > .flood-disclosure__heading > .flood-disclosure__trigger { border-radius: 0; }
 .flood-root .flood-accordion > .flood-disclosure:first-child > .flood-disclosure__heading > .flood-disclosure__trigger { border-start-start-radius: calc(var(--flood-sys-radius-field) - var(--flood-sys-stroke-width)); border-start-end-radius: calc(var(--flood-sys-radius-field) - var(--flood-sys-stroke-width)); }
 .flood-root .flood-accordion > .flood-disclosure:last-child[data-open="false"] > .flood-disclosure__heading > .flood-disclosure__trigger { border-end-start-radius: calc(var(--flood-sys-radius-field) - var(--flood-sys-stroke-width)); border-end-end-radius: calc(var(--flood-sys-radius-field) - var(--flood-sys-stroke-width)); }
@@ -326,8 +385,6 @@
   box-sizing: border-box;
   border-radius: var(--flood-sys-radius-block);
   min-inline-size: 0;
-  --flood-surface-action-rest: var(--flood-sys-color-action-on-surface-rest);
-  --flood-surface-action-hover: var(--flood-sys-color-action-on-surface-hover);
 }
 .flood-root .flood-divider { border: 0; border-block-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); margin: 0; inline-size: 100%; }
 .flood-root .flood-button {
@@ -354,18 +411,6 @@
 .flood-root .flood-button:active:not(:disabled) { background: var(--flood-action-pressed); }
 .flood-root .flood-button:disabled { background: var(--flood-action-disabled); color: var(--flood-action-disabled-content); opacity: 1; }
 .flood-root .flood-button[aria-pressed="true"]:not(:disabled) { background: var(--flood-sys-color-selection-background); color: var(--flood-sys-color-selection-content); }
-.flood-root .flood-surface .flood-button--subtle {
-  --flood-action-rest: var(--flood-surface-action-rest);
-  --flood-action-hover: var(--flood-surface-action-hover);
-  --flood-action-pressed: var(--flood-sys-color-action-on-surface-pressed);
-  --flood-action-content: var(--flood-sys-color-action-on-surface-content);
-  --flood-action-disabled: var(--flood-sys-color-action-on-surface-disabled);
-  --flood-action-disabled-content: var(--flood-sys-color-action-on-surface-disabled-content);
-}
-.flood-root .flood-surface[data-flood-elevation="overlay"] {
-  --flood-surface-action-rest: var(--flood-sys-color-action-on-surface-hover);
-  --flood-surface-action-hover: var(--flood-sys-color-action-on-surface-pressed);
-}
 .flood-root .flood-button--outline { border-color: var(--flood-sys-color-field-border); }
 .flood-root .flood-icon-button { min-inline-size: var(--flood-control-height); padding: var(--flood-sys-space-1); }
 .flood-root .flood-icon { display: inline-flex; align-items: center; justify-content: center; line-height: 1; flex: none; inline-size: var(--flood-icon-size); block-size: var(--flood-icon-size); color: inherit; }
@@ -387,6 +432,8 @@
   font-weight: var(--flood-sys-type-compact-weight);
 }
 .flood-root .flood-number-input > .flood-input { text-align: center; appearance: textfield; font-variant-numeric: tabular-nums; }
+.flood-root .flood-input-group.flood-number-input { flex-wrap: nowrap; min-inline-size: calc(2 * var(--flood-group-height) + 2 * var(--flood-control-gap) + 2ch); }
+.flood-root .flood-input-group.flood-number-input > .flood-input { flex: 1 1 4ch; min-inline-size: 2ch; }
 .flood-root .flood-number-input > .flood-input::-webkit-inner-spin-button,
 .flood-root .flood-number-input > .flood-input::-webkit-outer-spin-button { appearance: none; margin: 0; }
 .flood-root .flood-slider { --flood-slider-thumb: var(--flood-control-icon); min-inline-size: 0; inline-size: 100%; }
@@ -419,7 +466,7 @@
 .flood-root .flood-input::placeholder { color: var(--flood-sys-color-field-placeholder); opacity: 1; }
 .flood-root .flood-input[aria-invalid="true"] { border-color: var(--flood-sys-color-feedback-error); }
 .flood-root .flood-input[readonly] { cursor: text; }
-.flood-root .flood-input[readonly]:not(:disabled) { background: var(--flood-sys-color-surface-canvas); }
+.flood-root .flood-input[readonly]:not(:disabled) { background: var(--flood-sys-color-field-readonly); }
 .flood-root .flood-input[readonly]:not(:disabled):not(:focus-visible) { border-style: dashed; }
 .flood-root [data-status="error"] { --flood-field-feedback: var(--flood-sys-color-feedback-error); }
 .flood-root [data-status="warning"] { --flood-field-feedback: var(--flood-sys-color-feedback-warning); }
@@ -459,6 +506,7 @@
 .flood-root .flood-select[hidden] { display: none; }
 .flood-root .flood-select--custom .flood-select__control { position: relative; text-align: start; font-family: inherit; }
 .flood-root .flood-select--custom .flood-select__control::after { content: ""; box-sizing: border-box; position: absolute; pointer-events: none; inset-inline-end: var(--flood-control-padding); inset-block-start: 50%; inline-size: var(--flood-sys-space-2); block-size: var(--flood-sys-space-2); border-right: var(--flood-sys-focus-width) solid currentColor; border-bottom: var(--flood-sys-focus-width) solid currentColor; transform: translateY(-75%) rotate(45deg); }
+.flood-root .flood-select--custom .flood-select__control[aria-expanded="true"]::after { transform: translateY(-25%) rotate(225deg); }
 .flood-root .flood-select__value { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .flood-root .flood-select__native[hidden] { display: none; }
 .flood-root .flood-select__menu {
@@ -550,7 +598,7 @@
 .flood-root .flood-switch-input:disabled::before { background: var(--flood-sys-color-field-disabled-content); }
 .flood-root .flood-link { font-size: inherit; color: var(--flood-sys-color-content-default); text-underline-offset: var(--flood-sys-space-1); }
 .flood-root .flood-link--button { font-size: var(--flood-control-text); color: var(--flood-action-content); text-decoration: none; }
-.flood-root .flood-link--button[aria-current="page"] { background: var(--flood-sys-color-selection-background); color: var(--flood-sys-color-selection-content); }
+.flood-root .flood-link--button:is([aria-current="page"],[aria-current="location"]) { background: var(--flood-sys-color-selection-background); color: var(--flood-sys-color-selection-content); }
 .flood-root :where(.flood-button, .flood-check, .flood-switch-input, .flood-link):focus-visible { outline: var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset: var(--flood-sys-focus-offset); }
 .flood-root .flood-spinner { inline-size: var(--flood-control-icon); block-size: var(--flood-control-icon); border-width: var(--flood-sys-focus-width); }
 @media (pointer: coarse) {
@@ -615,6 +663,12 @@
   --flood-type-tracking: var(--flood-sys-type-section-tracking);
   --flood-type-weight: var(--flood-sys-type-section-weight);
 }
+.flood-root .flood-type--group {
+  --flood-type-size: var(--flood-sys-type-group-title-size);
+  --flood-type-line: var(--flood-sys-type-group-title-line-height);
+  --flood-type-tracking: var(--flood-sys-type-group-title-tracking);
+  --flood-type-weight: var(--flood-sys-type-group-title-weight);
+}
 .flood-root .flood-type--body {
   --flood-type-size: var(--flood-sys-type-body-size);
   --flood-type-line: var(--flood-sys-type-body-line-height);
@@ -763,7 +817,7 @@
 .flood-root .flood-button-group[data-orientation="vertical"] > .flood-button:nth-last-child(1 of .flood-button:not([hidden])) { border-end-start-radius: var(--flood-sys-radius-field); border-end-end-radius: var(--flood-sys-radius-field); }
 .flood-root .flood-input-group { flex-wrap: wrap; --flood-group-stroke: var(--flood-sys-stroke-width); --flood-group-height: var(--flood-control-height); --flood-group-inset: max(var(--flood-sys-space-1), var(--flood-sys-focus-width)); box-sizing: border-box; display: flex; align-items: center; gap: var(--flood-control-gap); min-inline-size: 0; inline-size: 100%; min-block-size: var(--flood-group-height); padding-inline: calc(var(--flood-control-padding) - var(--flood-group-stroke)); padding-block: calc(var(--flood-group-inset) - var(--flood-group-stroke)); border: var(--flood-group-stroke) solid var(--flood-sys-color-field-border); border-radius: var(--flood-sys-radius-field); background: var(--flood-sys-color-field-background); color: var(--flood-sys-color-field-content); }
 .flood-root .flood-input-group[data-status] { border-color: var(--flood-field-feedback); }
-.flood-root .flood-input-group[data-readonly="true"] { background: var(--flood-sys-color-surface-canvas); border-style: dashed; }
+.flood-root .flood-input-group[data-readonly="true"] { background: var(--flood-sys-color-field-readonly); border-style: dashed; }
 .flood-root .flood-input-group[data-disabled="true"] { background: var(--flood-sys-color-field-disabled); border-color: var(--flood-sys-color-field-border); color: var(--flood-sys-color-field-disabled-content); }
 .flood-root .flood-input-group:has(> .flood-input:focus-visible) { --flood-group-stroke: var(--flood-sys-focus-width); border-color: var(--flood-sys-color-focus-ring); border-style: solid; }
 .flood-root .flood-input-group > .flood-input { flex: 1 1 4rem; align-self: stretch; inline-size: 0; min-inline-size: min(100%, 4rem); min-block-size: calc(var(--flood-group-height) - 2 * var(--flood-group-inset)); border: 0; border-radius: 0; background: transparent; padding-inline: 0; padding-block: max(0px, calc((var(--flood-control-height) - var(--flood-control-text) * var(--flood-control-line)) / 2 - var(--flood-group-inset))); }
@@ -794,6 +848,8 @@
 .flood-root .flood-segmented .flood-choice-group[data-orientation="vertical"] > .flood-choice { inline-size: 100%; }
 .flood-root .flood-segmented--icons .flood-choice { padding-inline: var(--flood-sys-space-1); min-inline-size: calc(var(--flood-control-height) - 2 * var(--flood-sys-space-1)); }
 .flood-root .flood-segmented .flood-choice > span { display: inline-flex; align-items: center; justify-content: center; gap: var(--flood-control-gap); }
+.flood-root .flood-segmented__counted-label { display: inline-flex; align-items: baseline; gap: var(--flood-sys-space-1); }
+.flood-root .flood-segmented__count { font-size: min(var(--flood-control-text), var(--flood-sys-type-helper-size)); font-variant-numeric: tabular-nums; white-space: nowrap; }
 .flood-root .flood-segmented .flood-choice > .flood-check { position: absolute; inset: 0; inline-size: 100%; min-inline-size: 0; max-inline-size: none; block-size: 100%; margin: 0; border: 0; opacity: 0; cursor: inherit; }
 .flood-root .flood-segmented .flood-choice > .flood-check::before { display: none; }
 .flood-root .flood-segmented .flood-choice:has(input:checked) { background: var(--flood-sys-color-selection-background); color: var(--flood-sys-color-selection-content); }
@@ -831,11 +887,13 @@
 .flood-root .flood-combobox__control > .flood-input-group__addon--end { flex: none; max-inline-size: 100%; margin-inline-start: auto; }
 .flood-root .flood-combobox__control:has(> .flood-input-group__addon--end .flood-combobox__actions) { padding-inline-end: calc(var(--flood-group-inset) - var(--flood-group-stroke)); }
 .flood-root .flood-combobox__actions > .flood-button { --flood-control-height: calc(var(--flood-group-height) - 2 * var(--flood-group-inset)); border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-group-inset))); }
+/* Nested icon actions budget their inset against the reduced inner target. */
+.flood-root :is(.flood-input-group__addon, .flood-combobox__actions) > .flood-icon-button { padding:max(0px,calc((var(--flood-control-height) - var(--flood-control-icon) - 2 * var(--flood-sys-stroke-width)) / 2)); }
 .flood-root .flood-combobox__clear-empty { visibility: hidden; }
 .flood-root .flood-combobox__option-text { display: grid; gap: var(--flood-sys-space-1); min-inline-size: 0; }
 .flood-root .flood-combobox__description { color: var(--flood-sys-color-content-subtle); font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); }
 @media (forced-colors: active) { .flood-root .flood-combobox__description { color: inherit; } }
-.flood-root .flood-tag { --flood-tag-height: var(--flood-sys-control-xs-height); display: inline-flex; align-items: center; gap: var(--flood-sys-space-1); box-sizing: border-box; min-inline-size: 0; max-inline-size: 100%; min-block-size: var(--flood-tag-height); padding: calc(var(--flood-sys-space-1) / 2) var(--flood-sys-space-2); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-action); background: var(--flood-sys-color-surface-raised); color: var(--flood-sys-color-content-default); font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); letter-spacing: var(--flood-sys-type-compact-tracking); vertical-align: middle; }
+.flood-root .flood-tag { --flood-tag-height: var(--flood-sys-control-xs-height); display: inline-flex; align-items: center; gap: var(--flood-sys-space-1); box-sizing: border-box; min-inline-size: 0; max-inline-size: 100%; min-block-size: var(--flood-tag-height); padding: calc(var(--flood-sys-space-1) / 2) var(--flood-sys-space-2); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-action); background: var(--flood-sys-color-surface-supporting); color: var(--flood-sys-color-content-default); font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); letter-spacing: var(--flood-sys-type-compact-tracking); vertical-align: middle; }
 .flood-root .flood-tag[data-size="sm"] { --flood-tag-height: var(--flood-sys-control-2xs-height); font-size: var(--flood-sys-type-helper-size); }
 .flood-root .flood-tag[data-size="lg"] { --flood-tag-height: var(--flood-sys-control-sm-height); font-size: var(--flood-sys-type-body-size); }
 .flood-root .flood-tag__label { min-inline-size: 0; overflow-wrap: break-word; }
@@ -843,8 +901,10 @@
 .flood-root .flood-tag > .flood-tag__remove { --flood-control-height: calc(var(--flood-tag-height) - var(--flood-sys-space-1) - 2 * var(--flood-sys-stroke-width)); min-block-size: var(--flood-control-height); min-inline-size: var(--flood-control-height); flex: none; padding: 0; border-radius: var(--flood-sys-radius-action); }
 .flood-root .flood-tag[data-disabled="true"] { color: var(--flood-sys-color-content-subtle); }
 .flood-root .flood-tag[hidden] { display: none; }
-.flood-root .flood-multi-select__control { padding: calc(var(--flood-group-inset) - var(--flood-group-stroke)); gap: var(--flood-sys-space-1); }
+.flood-root .flood-multi-select__control { --flood-multi-select-action-count:1; padding: calc(var(--flood-group-inset) - var(--flood-group-stroke)); gap: var(--flood-sys-space-1); }
+.flood-root .flood-multi-select__control.flood-control--sm { gap:calc(var(--flood-sys-space-1) / 2); }
 .flood-root .flood-multi-select__control > .flood-tag { --flood-tag-height: calc(var(--flood-group-height) - 2 * var(--flood-group-inset)); border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-group-inset))); font-size: var(--flood-control-text); line-height: var(--flood-control-line); }
+.flood-root .flood-multi-select__control > .flood-tag { padding-block:max(0px,min(calc(var(--flood-sys-space-1) / 2),calc((var(--flood-tag-height) - var(--flood-control-text) * var(--flood-control-line) - 2 * var(--flood-sys-stroke-width)) / 2))); }
 @media (pointer: coarse) {
   .flood-root .flood-tag:has(> .flood-tag__remove) { padding-block: 0; }
   .flood-root .flood-tag > .flood-tag__remove { min-block-size: var(--flood-sys-size-touch); min-inline-size: var(--flood-sys-size-touch); }
@@ -856,6 +916,10 @@
 .flood-root .flood-multi-select__editor { display: flex; align-items: center; gap: var(--flood-sys-space-1); flex: 1 1 10rem; min-inline-size: min(100%, calc(var(--flood-group-height) + 4rem)); max-inline-size: 100%; }
 .flood-root .flood-multi-select__editor > .flood-input { inline-size: 0; min-inline-size: 0; flex: 1 1 0; min-block-size: calc(var(--flood-group-height) - 2 * var(--flood-group-inset)); border: 0; border-radius: 0; background: transparent; padding: 0 var(--flood-sys-space-2); }
 .flood-root .flood-multi-select__editor > .flood-input:focus-visible { outline: none; border: 0; padding: 0 var(--flood-sys-space-2); }
+.flood-root .flood-multi-select__control[data-has-selection="true"]:not([data-query]) { --flood-multi-select-idle-width:calc((var(--flood-group-height) - 2 * var(--flood-group-inset) + var(--flood-sys-space-1)) * var(--flood-multi-select-action-count) + 1px); }
+.flood-root .flood-multi-select__control[data-clearable="true"] { --flood-multi-select-action-count:2; }
+.flood-root .flood-multi-select__control[data-has-selection="true"]:not([data-query]) .flood-multi-select__editor { flex-basis:var(--flood-multi-select-idle-width); min-inline-size:min(100%,var(--flood-multi-select-idle-width)); }
+.flood-root .flood-multi-select__control[data-has-selection="true"]:not([data-query]) .flood-multi-select__editor > .flood-input { padding-inline:0; }
 .flood-root .flood-multi-select__control:has(.flood-multi-select__editor > .flood-input:focus-visible) { --flood-group-stroke: var(--flood-sys-focus-width); border-color: var(--flood-sys-color-focus-ring); border-style: solid; }
 
 /* Flood owns the single clear action; suppress duplicate browser decoration. */
@@ -893,6 +957,7 @@
 .flood-root .flood-file-input__file > .flood-icon-button { flex: none; }
 
 .flood-root .flood-alert-dialog { inline-size: min(26rem, calc(100% - var(--flood-sys-space-8))); }
+.flood-root .flood-alert-dialog > .flood-overlay-description { white-space: pre-line; }
 .flood-root .flood-alert-dialog__actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: var(--flood-sys-space-2); margin-block-start: var(--flood-sys-space-6); }
 .flood-root .flood-alert-dialog__actions > .flood-button { max-inline-size: 100%; overflow-wrap: break-word; }
 @media (max-width: 32rem) {
@@ -910,19 +975,33 @@
 .flood-root .flood-drawer:is([data-side="top"], [data-side="bottom"]) { left: 0; right: auto; inline-size: 100vw; block-size: min(var(--flood-drawer-size), 100dvh); }
 .flood-root .flood-drawer[data-side="top"] { inset-block-start: 0; inset-block-end: auto; border-end-start-radius: var(--flood-sys-radius-block); border-end-end-radius: var(--flood-sys-radius-block); --flood-drawer-y: -100%; }
 .flood-root .flood-drawer[data-side="bottom"] { inset-block-start: auto; inset-block-end: 0; border-start-start-radius: var(--flood-sys-radius-block); border-start-end-radius: var(--flood-sys-radius-block); --flood-drawer-y: 100%; }
+.flood-root .flood-drawer.flood-sheet[data-side="bottom"] {
+  inset-inline: 0;
+  margin-inline: auto;
+  inline-size: min(100%, 36rem);
+  block-size: auto;
+  max-block-size: min(var(--flood-drawer-size), calc(100dvh - max(var(--flood-sys-space-4), env(safe-area-inset-top))));
+  grid-template-rows: auto auto minmax(0, 1fr) auto;
+}
 .flood-root .flood-drawer > .flood-overlay-header { grid-area: header; }
 .flood-root .flood-drawer > .flood-overlay-description { grid-area: description; }
 .flood-root .flood-drawer__body { grid-area: body; min-block-size: 0; min-inline-size: 0; margin-block-start: var(--flood-sys-space-4); }
+.flood-root .flood-drawer > .flood-overlay-description + .flood-drawer__body { margin-block-start: min(var(--flood-sys-space-6), 5dvh); }
 .flood-root .flood-drawer .flood-overlay-body { margin: 0; }
 .flood-root .flood-drawer__footer { grid-area: footer; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--flood-sys-space-2); margin-block-start: min(var(--flood-sys-space-4), 2dvh); padding-block-start: min(var(--flood-sys-space-4), 2dvh); border-block-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); }
 .flood-root .flood-drawer__footer > * { max-inline-size: 100%; }
-@keyframes flood-drawer-enter { from { transform: translate(var(--flood-drawer-x), var(--flood-drawer-y)); } to { transform: translate(0, 0); } }
-@media (prefers-reduced-motion: no-preference) { .flood-root .flood-drawer[open] { animation: flood-drawer-enter var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing); } }
 
 .flood-root .flood-drawer__body > .flood-scroll-area { block-size: 100%; }
 .flood-root .flood-drawer > .flood-overlay-header { position: relative; padding-inline-end: calc(max(var(--flood-sys-control-sm-height), var(--flood-sys-size-touch)) + var(--flood-sys-space-2)); align-items: flex-start; }
 .flood-root .flood-drawer > .flood-overlay-header > .flood-overlay-close { position: absolute; inset-block-start: 0; inset-inline-end: 0; }
 .flood-root .flood-drawer > .flood-overlay-description { margin-block-start: var(--flood-sys-space-1); padding-inline-end: calc(max(var(--flood-sys-control-sm-height), var(--flood-sys-size-touch)) + var(--flood-sys-space-2)); }
+.flood-root .flood-sheet > .flood-overlay-header { align-items: center; padding-inline-end: 0; }
+.flood-root .flood-sheet > .flood-overlay-header > .flood-overlay-close { position: static; align-self: center; }
+.flood-root .flood-sheet > .flood-overlay-description { padding-inline-end: 0; }
+.flood-root .flood-sheet > .flood-drawer__body { margin-block-start: var(--flood-sys-space-2); }
+.flood-root .flood-sheet { --flood-sheet-scroll-offset: calc(var(--flood-sys-scrollbar-size) + var(--flood-sys-scrollbar-inset) + var(--flood-sys-stroke-width)); }
+.flood-root .flood-sheet:dir(rtl) { --flood-sheet-scroll-offset: calc(-1 * (var(--flood-sys-scrollbar-size) + var(--flood-sys-scrollbar-inset) + var(--flood-sys-stroke-width))); }
+.flood-root .flood-sheet > .flood-drawer__body > .flood-scroll-area > .flood-scroll-area__track--vertical { translate: var(--flood-sheet-scroll-offset); }
 @container flood-drawer (max-width:20rem) {
   .flood-root .flood-drawer > .flood-overlay-description { padding-inline-end: 0; }
 }
@@ -945,8 +1024,8 @@
 .flood-root .flood-avatar-group { display: flex; flex-wrap: wrap; align-items: center; padding: 0; margin: 0; list-style: none; gap: 0; }
 .flood-root .flood-avatar-group > li { display: flex; min-inline-size: 0; }
 .flood-root .flood-avatar-group > li + li { margin-inline-start: calc(-1 * var(--flood-sys-space-2)); }
-.flood-root .flood-avatar-group .flood-avatar { border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); box-shadow: 0 0 0 var(--flood-sys-stroke-width) var(--flood-sys-color-surface-canvas); }
-.flood-root .flood-avatar-group__overflow { color: var(--flood-sys-color-content-default); background: var(--flood-sys-color-surface-raised); font-size: var(--flood-sys-type-helper-size); font-variant-numeric: tabular-nums; }
+.flood-root .flood-avatar-group .flood-avatar { border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); box-shadow: 0 0 0 var(--flood-sys-stroke-width) var(--flood-sys-color-surface-current); }
+.flood-root .flood-avatar-group__overflow { color: var(--flood-sys-color-content-default); background: var(--flood-sys-color-surface-supporting); font-size: var(--flood-sys-type-helper-size); font-variant-numeric: tabular-nums; }
 .flood-root .flood-status-indicator { --flood-status-color: var(--flood-sys-color-content-subtle); display: inline-flex; align-items: center; gap: var(--flood-sys-space-2); max-inline-size: 100%; min-inline-size: 0; font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); overflow-wrap: break-word; }
 .flood-root .flood-status-indicator[data-size="sm"] { font-size: var(--flood-sys-type-helper-size); }
 .flood-root .flood-status-indicator[data-size="lg"] { font-size: var(--flood-sys-type-body-size); }
@@ -964,7 +1043,7 @@
 .flood-root .flood-blockquote__quote > :first-child { margin-block-start: 0; }
 .flood-root .flood-blockquote__quote > :last-child { margin-block-end: 0; }
 .flood-root .flood-blockquote__attribution { margin-block-start: var(--flood-sys-space-2); color: var(--flood-sys-color-content-subtle); font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); overflow-wrap: break-word; }
-.flood-root .flood-inline-code { border-radius: var(--flood-sys-radius-field); background: var(--flood-sys-color-surface-raised); color: var(--flood-sys-color-content-default); font-family: var(--flood-sys-font-mono); font-size: .875em; line-height: inherit; padding: .125em var(--flood-sys-space-2); box-decoration-break: clone; -webkit-box-decoration-break: clone; overflow-wrap: anywhere; white-space: break-spaces; }
+.flood-root .flood-inline-code { border-radius: var(--flood-sys-radius-field); background: var(--flood-sys-color-surface-supporting); color: var(--flood-sys-color-content-default); font-family: var(--flood-sys-font-mono); font-size: .875em; line-height: inherit; padding: .125em var(--flood-sys-space-2); box-decoration-break: clone; -webkit-box-decoration-break: clone; overflow-wrap: anywhere; white-space: break-spaces; }
 .flood-root .flood-inline-code[data-size="sm"] { font-size: var(--flood-sys-type-helper-size); }
 .flood-root .flood-inline-code[data-size="lg"] { font-size: var(--flood-sys-type-body-size); }
 .flood-root .flood-inline-code[data-wrap="false"] { white-space: pre; overflow-wrap: normal; }
@@ -985,7 +1064,7 @@
 .flood-root .flood-timeline__item { position: relative; display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: var(--flood-sys-space-3); padding-block-end: var(--flood-sys-space-4); }
 .flood-root .flood-timeline__item:last-child { padding-block-end: 0; }
 .flood-root .flood-timeline__item:not(:last-child)::before { content: ""; position: absolute; inset-inline-start: calc(.625rem - var(--flood-sys-stroke-width) / 2); inset-block-start: 1.25rem; inset-block-end: 0; inline-size: var(--flood-sys-stroke-width); background: var(--flood-sys-color-border-decorative); }
-.flood-root .flood-timeline__marker { z-index: 1; box-sizing: border-box; display: grid; place-items: center; inline-size: 1.25rem; block-size: 1.25rem; border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-action); color: var(--flood-sys-color-content-subtle); background: var(--flood-sys-color-surface-default); }
+.flood-root .flood-timeline__marker { z-index: 1; box-sizing: border-box; display: grid; place-items: center; inline-size: 1.25rem; block-size: 1.25rem; border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-action); color: var(--flood-sys-color-content-subtle); background: var(--flood-sys-color-surface-muted); }
 .flood-root .flood-timeline__marker > svg { inline-size: 100%; block-size: 100%; }
 .flood-root .flood-timeline__item[data-state="current"] .flood-timeline__marker { color: var(--flood-sys-color-accent-content); }
 .flood-root .flood-timeline__item[data-state="current"] .flood-timeline__marker > span { inline-size: .375rem; block-size: .375rem; background: currentColor; border-radius: var(--flood-sys-radius-action); }
@@ -1002,26 +1081,20 @@
   .flood-root .flood-timeline__marker { color: CanvasText; background: Canvas; border-color: CanvasText; }
 }
 
-.flood-root .flood-navigation-list { min-inline-size: 0; }
-.flood-root .flood-navigation-list :is(ul, li) { padding: 0; margin: 0; list-style: none; }
-.flood-root .flood-navigation-list__group + .flood-navigation-list__group { margin-block-start: var(--flood-sys-space-4); }
-.flood-root .flood-navigation-list__group-title { margin: 0; padding: var(--flood-sys-space-2) var(--flood-sys-space-3); color: var(--flood-sys-color-content-subtle); font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); }
-.flood-root .flood-navigation-list__link { display: flex; align-items: center; gap: var(--flood-sys-space-2); box-sizing: border-box; min-inline-size: 0; min-block-size: var(--flood-sys-control-md-height); padding: var(--flood-sys-space-2) var(--flood-sys-space-3); border-radius: var(--flood-sys-radius-field); color: var(--flood-sys-color-content-default); text-decoration: none; font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); }
-.flood-root .flood-navigation-list[data-size="sm"] .flood-navigation-list__link { min-block-size: var(--flood-sys-control-sm-height); }
-.flood-root .flood-navigation-list[data-size="lg"] .flood-navigation-list__link { min-block-size: var(--flood-sys-control-lg-height); }
-.flood-root .flood-navigation-list__link:hover { background: var(--flood-sys-color-surface-raised); }
-.flood-root .flood-navigation-list__link[aria-current="page"] { background: var(--flood-sys-color-selection-background); color: var(--flood-sys-color-selection-content); }
-.flood-root :is(.flood-navigation-list__text,.flood-steps__text) { display: grid; min-inline-size: 0; gap: var(--flood-sys-space-1); }
-.flood-root :is(.flood-navigation-list__label,.flood-steps__title) { overflow-wrap: break-word; }
-.flood-root :is(.flood-navigation-list__description,.flood-steps__description) { color: var(--flood-sys-color-content-subtle); font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); overflow-wrap: break-word; }
-.flood-root .flood-navigation-list__link > .flood-icon { flex: none; }
-.flood-root :is(.flood-navigation-list__link,.flood-steps__action):focus-visible { outline: var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset: var(--flood-sys-focus-offset); }
+.flood-root .flood-navigation-list { min-inline-size:0; }
+.flood-root .flood-navigation-list :is(ul,li) { padding:0; margin:0; list-style:none; min-inline-size:0; }
+.flood-root .flood-navigation-list ul { display:grid; row-gap:var(--flood-sys-space-1); }
+.flood-root .flood-navigation-list__group + .flood-navigation-list__group { margin-block-start:var(--flood-sys-space-4); }
+.flood-root .flood-steps__text { display:grid; min-inline-size:0; gap:var(--flood-sys-space-1); }
+.flood-root .flood-steps__title { overflow-wrap:break-word; }
+.flood-root .flood-steps__description { color:var(--flood-sys-color-content-subtle); font-size:var(--flood-sys-type-helper-size); line-height:var(--flood-sys-type-helper-line-height); overflow-wrap:break-word; }
+.flood-root .flood-steps__action:focus-visible { outline:var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset:var(--flood-sys-focus-offset); }
 
 .flood-root .flood-steps { display: flex; align-items: flex-start; gap: var(--flood-sys-space-4); padding: 0; margin: 0; min-inline-size: 0; list-style: none; }
 .flood-root .flood-steps > li { flex: 1 1 0; min-inline-size: 0; }
 .flood-root .flood-steps__content { display: flex; gap: var(--flood-sys-space-2); align-items: flex-start; min-inline-size: 0; box-sizing: border-box; font: inherit; color: var(--flood-sys-color-content-default); text-align: start; }
 .flood-root .flood-steps__action { inline-size: 100%; min-block-size: var(--flood-sys-control-md-height); padding: var(--flood-sys-space-1); border: 0; border-radius: var(--flood-sys-radius-field); background: transparent; cursor: pointer; }
-.flood-root .flood-steps__action:hover:not(:disabled) { background: var(--flood-sys-color-surface-raised); }
+.flood-root .flood-steps__action:hover:not(:disabled) { background: var(--flood-sys-color-action-ghost-hover); }
 .flood-root .flood-steps__action:disabled { color: var(--flood-sys-color-field-disabled-content); cursor: not-allowed; }
 .flood-root .flood-steps__indicator { display: inline-grid; place-items: center; flex: none; inline-size: var(--flood-sys-control-xs-height); block-size: var(--flood-sys-control-xs-height); box-sizing: border-box; border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-action); font-size: var(--flood-sys-type-helper-size); font-weight: var(--flood-sys-type-label-weight); color: var(--flood-sys-color-content-subtle); }
 .flood-root .flood-steps__indicator > svg { inline-size: var(--flood-sys-control-xs-icon-size); block-size: var(--flood-sys-control-xs-icon-size); }
@@ -1041,7 +1114,43 @@
 .flood-root .flood-section__description > :first-child { margin-block-start: 0; }
 .flood-root .flood-section__description > :last-child { margin-block-end: 0; }
 .flood-root .flood-section__actions { display: flex; flex-wrap: wrap; gap: var(--flood-sys-space-2); max-inline-size: 100%; }
+.flood-root .flood-page-header { align-items: center; min-inline-size: 0; }
+.flood-root .flood-page-header .flood-section__heading { gap: var(--flood-sys-space-2); flex-basis: 16rem; }
+.flood-root .flood-page-header .flood-section__description { font-size: var(--flood-sys-type-body-size); line-height: var(--flood-sys-type-body-line-height); }
+
+.flood-root .flood-app-shell { display: flex; min-inline-size: 0; min-block-size: 0; }
+.flood-root .flood-app-shell[data-scroll="content"] { block-size: 100dvh; }
+.flood-root .flood-app-shell__navigation { display: flex; flex: none; min-block-size: 0; min-inline-size: 0; }
+.flood-root .flood-app-shell__workspace { display: flex; flex: 1 1 0; flex-direction: column; min-block-size: 0; min-inline-size: 0; }
+.flood-root .flood-app-shell__main { flex: 1 1 auto; min-block-size: 0; min-inline-size: 0; }
+.flood-root .flood-app-shell[data-scroll="content"] .flood-app-shell__main { display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); }
+.flood-root .flood-app-shell__scroll { block-size: 100%; overscroll-behavior: contain; }
+.flood-root .flood-app-top-bar {
+  position: relative;
+  display: flex;
+  flex: none;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--flood-sys-space-2) var(--flood-sys-space-4);
+  min-block-size: calc(var(--flood-sys-control-md-height) + 2 * var(--flood-sys-space-2));
+  padding: var(--flood-sys-space-2) var(--flood-sys-space-4);
+  box-sizing: border-box;
+}
+.flood-root .flood-app-top-bar[data-bordered]::after {
+  content: "";
+  position: absolute;
+  inset-inline: 0;
+  inset-block-end: 0;
+  border-block-end: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative);
+  pointer-events: none;
+}
+.flood-root .flood-app-top-bar__start, .flood-root .flood-app-top-bar__end { min-inline-size: 0; max-inline-size: 100%; }
+.flood-root .flood-app-top-bar__end { margin-inline-start: auto; }
+.flood-root :is(.flood-app-shell, .flood-app-top-bar)[hidden] { display: none; }
 .flood-root .flood-section__body { margin-block-start: var(--flood-sys-space-4); min-inline-size: 0; }
+.flood-root .flood-section:has(> .flood-section__header .flood-type--group) > .flood-section__body {
+  margin-block-start: var(--flood-sys-space-3);
+}
 
 .flood-root .flood-split { container: flood-split / inline-size; min-inline-size: 0; inline-size: 100%; }
 .flood-root .flood-split__layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--flood-layout-gap); align-items: start; min-inline-size: 0; }
@@ -1060,9 +1169,9 @@
 .flood-root .flood-skip-link { position: fixed; inset-block-start: var(--flood-sys-space-3); inset-inline-start: var(--flood-sys-space-3); z-index: var(--flood-sys-layer-popover); padding: var(--flood-sys-space-2) var(--flood-sys-space-4); border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-action); background: var(--flood-sys-color-surface-raised); color: var(--flood-sys-color-content-default); font-size: var(--flood-sys-type-compact-size); line-height: var(--flood-sys-type-compact-line-height); }
 .flood-root .flood-skip-link:not(:focus) { inline-size: 1px; block-size: 1px; padding: 0; margin: 0; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
 .flood-root .flood-skip-link:focus-visible { outline: var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset: var(--flood-sys-focus-offset); }
-.flood-root :is(.flood-navigation-list,.flood-steps,.flood-section,.flood-split,.flood-center,.flood-skip-link)[hidden] { display: none; }
-@media (pointer: coarse) { .flood-root .flood-navigation-list__link, .flood-root .flood-steps__action { min-block-size: var(--flood-sys-size-touch); } }
-@media (forced-colors: active) { .flood-root .flood-navigation-list__link[aria-current="page"] { background: Highlight; color: HighlightText; forced-color-adjust: none; } .flood-root .flood-steps__indicator { border-color: CanvasText; } .flood-root :is(.flood-navigation-list__link,.flood-steps__action,.flood-skip-link):focus-visible { outline-color: Highlight; } }
+.flood-root :is(.flood-navigation-list,.flood-steps,.flood-section,.flood-page-header,.flood-split,.flood-center,.flood-skip-link)[hidden] { display: none; }
+@media (pointer: coarse) { .flood-root .flood-steps__action { min-block-size: var(--flood-sys-size-touch); } }
+@media (forced-colors: active) { .flood-root .flood-steps__indicator { border-color: CanvasText; } .flood-root :is(.flood-steps__action,.flood-skip-link):focus-visible { outline-color: Highlight; } }
 
 /* Relationships: labels → controls use .25rem; rows own their compact hit areas. */
 .flood-root .flood-form-control__label { display: block; margin: 0 0 var(--flood-sys-space-1); padding: 0; color: var(--flood-sys-color-content-default); font-size: var(--flood-sys-type-label-size); line-height: var(--flood-sys-type-label-line-height); font-weight: var(--flood-sys-type-label-weight); }
@@ -1072,7 +1181,7 @@
 .flood-root .flood-list-box:focus-visible { outline: var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset: calc(-1 * var(--flood-sys-focus-width)); }
 .flood-root .flood-list-box-field { position:relative; }
 .flood-root .flood-list-box[data-status] { border-color:var(--flood-field-feedback); }
-.flood-root .flood-list-box[aria-readonly="true"][data-appearance="surface"] { background:var(--flood-sys-color-surface-canvas); border-style:dashed; }
+.flood-root .flood-list-box[aria-readonly="true"][data-appearance="surface"] { background:var(--flood-sys-color-field-readonly); border-style:dashed; }
 .flood-root .flood-list-box__feedback { margin-block-start:var(--flood-sys-space-1); }
 .flood-root .flood-list-box[data-appearance="plain"] { max-block-size:none; overflow:visible; padding:0; border:0; border-radius:0; background:transparent; }
 .flood-root .flood-list-box__option { display: flex; align-items: center; justify-content: space-between; gap: var(--flood-sys-space-2); padding: var(--flood-sys-space-2) var(--flood-sys-space-3); min-block-size: var(--flood-control-height); box-sizing: border-box; border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-sys-space-1) - var(--flood-sys-stroke-width))); cursor: pointer; font-size: var(--flood-control-text); line-height: var(--flood-control-line); }
@@ -1087,7 +1196,7 @@
 .flood-root .flood-pin-input__slot { box-sizing: border-box; flex: 0 1 var(--flood-control-height); min-inline-size: 0; inline-size: var(--flood-control-height); block-size: var(--flood-control-height); display: grid; place-items: center; border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-field-border); border-radius: var(--flood-sys-radius-field); background: var(--flood-sys-color-field-background); font-size: var(--flood-control-text); line-height: var(--flood-control-line); font-variant-numeric: tabular-nums; pointer-events: none; }
 .flood-root .flood-pin-input:has(.flood-pin-input__editor:focus-visible) .flood-pin-input__slot[data-active] { border: var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); }
 .flood-root .flood-pin-input[data-status] .flood-pin-input__slot { border-color: var(--flood-field-feedback); }
-.flood-root .flood-pin-input[data-readonly] .flood-pin-input__slot { background: var(--flood-sys-color-surface-canvas); border-style: dashed; }
+.flood-root .flood-pin-input[data-readonly] .flood-pin-input__slot { background: var(--flood-sys-color-field-readonly); border-style: dashed; }
 .flood-root .flood-pin-input:has(.flood-pin-input__editor:disabled) .flood-pin-input__slot { background: var(--flood-sys-color-field-disabled); color: var(--flood-sys-color-field-disabled-content); }
 .flood-root .flood-rating { display: block; min-inline-size: 0; max-inline-size: 100%; border: 0; padding: 0; margin: 0; }
 .flood-root .flood-rating__choices { display: flex; align-items: center; flex-wrap: wrap; gap: var(--flood-sys-space-1); }
@@ -1095,7 +1204,7 @@
 .flood-root .flood-rating--sm .flood-rating__choice { inline-size: var(--flood-sys-control-xs-height); block-size: var(--flood-sys-control-xs-height); }
 .flood-root .flood-rating--lg .flood-rating__choice { inline-size: var(--flood-sys-control-md-height); block-size: var(--flood-sys-control-md-height); }
 .flood-root .flood-rating__choice > input { position: absolute; inset: 0; margin: 0; inline-size: 100%; block-size: 100%; opacity: 0; cursor: inherit; }
-.flood-root .flood-rating__choice > svg { inline-size: 1.25rem; block-size: 1.25rem; pointer-events: none; }
+.flood-root .flood-rating__choice > svg { inline-size: 1.25rem; block-size: 1.25rem; pointer-events: none; fill: transparent; }
 .flood-root .flood-rating--sm .flood-rating__choice > svg { inline-size: 1rem; block-size: 1rem; }
 .flood-root .flood-rating--lg .flood-rating__choice > svg { inline-size: 1.5rem; block-size: 1.5rem; }
 .flood-root .flood-rating__choice[data-filled] > svg { fill: currentColor; }
@@ -1154,8 +1263,35 @@
 .flood-root .flood-editable__preview { justify-content: space-between; min-inline-size: 0; inline-size: 100%; text-align: start; gap: var(--flood-sys-space-2); }
 .flood-root .flood-editable__value { flex: 1 1 0; min-inline-size: 0; overflow-wrap: break-word; }
 .flood-root .flood-editable__value[data-empty] { color: var(--flood-sys-color-content-subtle); }
+.flood-root .flood-editable__error { margin: 0; white-space: normal; overflow-wrap: break-word; }
+.flood-root .flood-editable__preview[aria-hidden="true"] { visibility: hidden; }
+.flood-root .flood-overlay-panel.flood-editable__overlay {
+  padding: 0;
+  border: 0;
+  background: var(--flood-sys-color-surface-floating);
+  backdrop-filter: none;
+}
+.flood-root .flood-editable__overlay > .flood-editable__error { padding: var(--flood-sys-space-2) var(--flood-sys-space-3); }
+.flood-root .flood-table td[data-numeric] .flood-editable :is(.flood-editable__preview, input) { text-align: end; }
 .flood-root .flood-editable__preview > .flood-icon { flex: none; color: var(--flood-sys-color-content-subtle); }
-.flood-root .flood-editable .flood-input-group:has(.flood-editable__actions) { padding-inline-end: calc(var(--flood-group-inset) - var(--flood-group-stroke)); }
+.flood-root .flood-editable .flood-input-group:has(.flood-editable__actions) {
+  flex-wrap: nowrap;
+  padding-inline-end: calc(var(--flood-group-inset) - var(--flood-group-stroke));
+}
+.flood-root .flood-editable .flood-input-group:has(.flood-editable__actions) > .flood-input {
+  flex: 1 1 0;
+  min-inline-size: 0;
+}
+.flood-root .flood-editable__overlay[data-fit-draft] .flood-input-group > .flood-input {
+  flex: 1 1 auto;
+  inline-size: auto;
+  min-inline-size: 4ch;
+  field-sizing: content;
+}
+.flood-root .flood-editable .flood-input-group__addon:has(> .flood-editable__actions) {
+  flex: none;
+  max-inline-size: none;
+}
 .flood-root .flood-editable__actions { display: inline-flex; align-items: center; gap: var(--flood-sys-space-1); flex: none; }
 .flood-root .flood-editable__actions > .flood-button { --flood-control-height: calc(var(--flood-group-height) - 2 * var(--flood-group-inset)); min-inline-size: var(--flood-control-height); flex: none; border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-group-inset))); }
 @media (forced-colors: active) { .flood-root .flood-editable__value[data-empty] { color: CanvasText; } }
@@ -1172,7 +1308,7 @@
 .flood-root .flood-command-list { display: grid; min-inline-size: 0; gap: var(--flood-sys-space-1); }
 .flood-root .flood-command-list[hidden] { display: none; }
 .flood-root .flood-command-list > .flood-command-list__surface { border: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius: var(--flood-sys-radius-field); }
-.flood-root .flood-command-list__viewport { border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-sys-space-1) - var(--flood-sys-stroke-width))); }
+.flood-root .flood-command-list__viewport { max-block-size: 18rem; border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-sys-space-1) - var(--flood-sys-stroke-width))); }
 .flood-root .flood-command-list__option { box-sizing: border-box; display: grid; align-content: center; min-inline-size: 0; min-block-size: var(--flood-control-height); padding: var(--flood-sys-space-2) var(--flood-sys-space-3); gap: calc(var(--flood-sys-space-1) / 2); border-radius: max(0px, calc(var(--flood-sys-radius-field) - var(--flood-sys-space-1) - var(--flood-sys-stroke-width))); color: var(--flood-sys-color-content-default); font-size: var(--flood-control-text); line-height: var(--flood-control-line); overflow-wrap: break-word; cursor: pointer; }
 .flood-root .flood-command-list__option[data-active="true"] { background: var(--flood-sys-color-selection-background); color: var(--flood-sys-color-selection-content); }
 .flood-root .flood-command-list__description { font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); color: var(--flood-sys-color-content-subtle); }
@@ -1188,6 +1324,68 @@
   .flood-root .flood-command-list__option[aria-disabled="true"], .flood-root .flood-command-list__option[aria-disabled="true"] .flood-command-list__description { color: GrayText; }
 }
 
+.flood-root .flood-dialog.flood-command-palette {
+  --flood-palette-search-height: 3.5rem;
+  padding: 0;
+  inset-block-start: min(12dvh, 6rem);
+  inset-block-end: auto;
+  margin-block: 0;
+  max-block-size: calc(100dvh - min(12dvh, 6rem) - var(--flood-sys-space-4));
+}
+.flood-root .flood-command-palette > .flood-overlay-header {
+  position: absolute;
+  inset-block-start: 0;
+  inset-inline-end: var(--flood-sys-space-3);
+  block-size: var(--flood-palette-search-height);
+  align-items: center;
+  z-index: 1;
+}
+.flood-root .flood-command-palette .flood-overlay-title {
+  position: absolute;
+  inline-size: 1px;
+  block-size: 1px;
+  overflow: hidden;
+  clip-path: inset(50%);
+}
+.flood-root .flood-command-palette .flood-overlay-close { align-self: center; }
+.flood-root .flood-dialog.flood-command-palette > .flood-overlay-body { margin: 0; }
+.flood-root .flood-command-palette__search-icon {
+  position: absolute;
+  z-index: 1;
+  inset-block-start: 0;
+  inset-inline-start: var(--flood-sys-space-4);
+  block-size: var(--flood-palette-search-height);
+  display: grid;
+  place-items: center;
+  color: var(--flood-sys-color-content-subtle);
+  pointer-events: none;
+}
+.flood-root .flood-command-palette .flood-command-list { gap: 0; }
+.flood-root .flood-command-palette .flood-command-list > .flood-input {
+  block-size: var(--flood-palette-search-height);
+  padding-inline: var(--flood-sys-space-12) calc(var(--flood-sys-space-12) + var(--flood-sys-space-2));
+  padding-block: 0;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+.flood-root .flood-command-palette .flood-command-list > .flood-command-list__surface {
+  border: 0;
+  border-block-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative);
+  border-radius: 0;
+}
+.flood-root .flood-command-palette .flood-command-list__viewport {
+  min-block-size: 5rem;
+  max-block-size: min(18rem, calc(100dvh - min(12dvh, 6rem) - var(--flood-palette-search-height) - var(--flood-sys-space-8)));
+}
+@media (forced-colors: active) {
+  .flood-root .flood-command-palette .flood-command-list > .flood-command-list__surface { border-block-start-color: CanvasText; }
+  .flood-root .flood-command-palette .flood-command-list > .flood-input:focus-visible {
+    outline: var(--flood-sys-focus-width) solid Highlight;
+    outline-offset: calc(-1 * var(--flood-sys-focus-width));
+  }
+}
+
 .flood-root .flood-date-field { display:grid; gap:var(--flood-sys-space-1); min-inline-size:0; inline-size:100%; container-type:inline-size; container-name:flood-date; }
 .flood-root .flood-date-field[hidden] { display:none; }
 .flood-root .flood-date-field > .flood-label { margin:0; }
@@ -1206,7 +1404,7 @@
 .flood-root .flood-date-field__control[data-status="warning"] { --flood-field-feedback:var(--flood-sys-color-feedback-warning); }
 .flood-root .flood-date-field__control[data-status="success"] { --flood-field-feedback:var(--flood-sys-color-feedback-success); }
 .flood-root .flood-date-field__control[data-status="info"] { --flood-field-feedback:var(--flood-sys-color-feedback-info); }
-.flood-root .flood-date-field__control[data-readonly] { background:var(--flood-sys-color-surface-canvas); border-style:dashed; }
+.flood-root .flood-date-field__control[data-readonly] { background:var(--flood-sys-color-field-readonly); border-style:dashed; }
 .flood-root .flood-date-field__control:has(.flood-date-field__segment:focus-visible) { border-color:var(--flood-sys-color-focus-ring); border-style:solid; }
 .flood-root .flood-date-field__control[data-disabled] { background:var(--flood-sys-color-field-disabled); color:var(--flood-sys-color-field-disabled-content); border-color:var(--flood-sys-color-field-border); }
 .flood-root .flood-date-field__description,.flood-root .flood-date-field__error { font-size:var(--flood-sys-type-helper-size); line-height:var(--flood-sys-type-helper-line-height); }
@@ -1235,7 +1433,7 @@
 .flood-root .flood-time-field__segment::placeholder { color: var(--flood-sys-color-field-placeholder); opacity: 1; }
 .flood-root .flood-time-field__separator { padding-inline: var(--flood-sys-space-1); color: var(--flood-sys-color-content-subtle);  font-size:var(--flood-control-text); line-height:var(--flood-control-line); }
 .flood-root .flood-time-field__control[data-status] { border-color: var(--flood-field-feedback); }
-.flood-root .flood-time-field__control[data-readonly] { background: var(--flood-sys-color-surface-canvas); border-style: dashed; }
+.flood-root .flood-time-field__control[data-readonly] { background: var(--flood-sys-color-field-readonly); border-style: dashed; }
 .flood-root .flood-time-field__control:has(.flood-time-field__segment:focus-visible) { --flood-time-stroke: var(--flood-sys-focus-width); border-color: var(--flood-sys-color-focus-ring); border-style: solid; }
 .flood-root .flood-time-field__control[data-disabled] { border-color: var(--flood-sys-color-field-border); background: var(--flood-sys-color-field-disabled); color: var(--flood-sys-color-field-disabled-content); }
 .flood-root .flood-time-field__description, .flood-root .flood-time-field__error { font-size: var(--flood-sys-type-helper-size); line-height: var(--flood-sys-type-helper-line-height); }
@@ -1389,27 +1587,26 @@
 @media(pointer:coarse){.flood-root .flood-tree__row { min-block-size:max(var(--flood-control-height),var(--flood-sys-size-touch)); }}
 @media(forced-colors:active){.flood-root .flood-tree__row[data-selected]{background:Highlight;color:HighlightText;forced-color-adjust:none;}.flood-root .flood-tree__item:focus-visible>.flood-tree__row{border-color:Highlight;}.flood-root .flood-tree__item[data-disabled]>.flood-tree__row{color:GrayText;}.flood-root .flood-tree__description,.flood-root .flood-tree__disclosure,.flood-root .flood-tree__icon{color:inherit;}}
 
-.flood-root .flood-navigation-tree { min-inline-size:0; --flood-navigation-row:var(--flood-sys-control-md-height); --flood-navigation-text:var(--flood-sys-control-md-text-size); --flood-navigation-line:var(--flood-sys-control-md-line-height); --flood-navigation-padding:var(--flood-sys-control-md-padding-inline); }
-.flood-root .flood-navigation-tree[data-size="sm"] { --flood-navigation-row:var(--flood-sys-control-sm-height); --flood-navigation-text:var(--flood-sys-control-sm-text-size); --flood-navigation-line:var(--flood-sys-control-sm-line-height); --flood-navigation-padding:var(--flood-sys-control-sm-padding-inline); }
-.flood-root .flood-navigation-tree[data-size="lg"] { --flood-navigation-row:var(--flood-sys-control-lg-height); --flood-navigation-text:var(--flood-sys-control-lg-text-size); --flood-navigation-line:var(--flood-sys-control-lg-line-height); --flood-navigation-padding:var(--flood-sys-control-lg-padding-inline); }
-.flood-root .flood-navigation-tree ul { list-style:none; padding:0; margin:0; }
-.flood-root .flood-navigation-tree li { min-inline-size:0; }
-.flood-root .flood-navigation-tree__row { display:flex; align-items:center; gap:var(--flood-sys-space-1); min-inline-size:0; border-radius:var(--flood-sys-radius-action); }
-.flood-root .flood-navigation-tree__row[data-current] { background:var(--flood-sys-color-action-on-surface-hover); }
-.flood-root .flood-navigation-tree__row .flood-navigation-tree__link,
-.flood-root .flood-navigation-tree__text { display:flex; flex:1; justify-content:flex-start; align-items:center; gap:var(--flood-sys-space-2); min-inline-size:0; min-block-size:var(--flood-navigation-row); box-sizing:border-box; white-space:normal; text-align:start; color:var(--flood-sys-color-content-default); }
-.flood-root .flood-navigation-tree__text { padding-inline:var(--flood-navigation-padding); font-size:var(--flood-navigation-text); line-height:var(--flood-navigation-line); font-weight:var(--flood-sys-type-control-weight); letter-spacing:var(--flood-sys-type-control-tracking); }
-.flood-root .flood-navigation-tree__text[aria-disabled] { color:var(--flood-sys-color-field-disabled-content); }
-.flood-root .flood-navigation-tree__label { overflow-wrap: break-word; min-inline-size:0; }
-.flood-root .flood-navigation-tree__row .flood-navigation-tree__disclosure { flex:none; }
-.flood-root .flood-navigation-tree__disclosure svg { rotate:0deg; }
-.flood-root .flood-navigation-tree:dir(rtl) .flood-navigation-tree__disclosure svg { rotate:180deg; }
-.flood-root .flood-navigation-tree__disclosure[aria-expanded="true"] svg { rotate:90deg; }
-.flood-root .flood-navigation-tree__branch { padding-inline-start:var(--flood-sys-space-4); }
+.flood-root .flood-navigation-tree { min-inline-size:0; --flood-navigation-icon:var(--flood-sys-control-md-icon-size); --flood-navigation-guide:none; }
+.flood-root .flood-navigation-tree[data-branch-guides] { --flood-navigation-guide:""; }
+.flood-root .flood-navigation-tree[data-size="sm"] { --flood-navigation-icon:var(--flood-sys-control-sm-icon-size); }
+.flood-root .flood-navigation-tree[data-size="lg"] { --flood-navigation-icon:var(--flood-sys-control-lg-icon-size); }
+.flood-root :is(.flood-navigation-tree,.flood-navigation-tree__branch) > ul { display:grid; row-gap:var(--flood-sys-space-1); list-style:none; padding:0; margin:0; }
+.flood-root :is(.flood-navigation-tree,.flood-navigation-tree__branch) > ul > li { min-inline-size:0; }
+.flood-root .flood-navigation-tree__branch { padding-inline-start:calc(var(--flood-navigation-icon) + var(--flood-sys-space-2)); padding-block-start:var(--flood-sys-space-1); }
+.flood-root .flood-navigation-tree__branch:has(> ul) { position:relative; }
+.flood-root .flood-navigation-tree__branch:has(> ul)::before {
+  content:var(--flood-navigation-guide);
+  position:absolute;
+  inset-block:0 var(--flood-sys-space-1);
+  inset-inline-start:calc(var(--flood-sys-space-3) + (var(--flood-navigation-icon) - var(--flood-sys-stroke-width)) / 2);
+  border-inline-start:var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative);
+  pointer-events:none;
+}
 .flood-root .flood-navigation-tree__content { padding:var(--flood-sys-space-2) var(--flood-sys-space-3); color:var(--flood-sys-color-content-subtle); font-size:var(--flood-sys-type-helper-size); line-height:var(--flood-sys-type-helper-line-height); }
 .flood-root .flood-navigation-tree:focus-visible { outline:var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); outline-offset:0; }
-@media(pointer:coarse) { .flood-root .flood-navigation-tree__row { min-block-size:var(--flood-sys-size-touch); } .flood-root .flood-navigation-tree__text { min-block-size:var(--flood-sys-size-touch); } }
-@media(forced-colors:active) { .flood-root .flood-navigation-tree__row[data-current] { outline:1px solid Highlight; } .flood-root .flood-navigation-tree__text[aria-disabled] { color:GrayText; } .flood-root .flood-navigation-tree:focus-visible { outline-color:Highlight; } }
+.flood-root .flood-navigation-tree__flyout { inline-size:16rem; max-inline-size:calc(100vw - 2rem); }
+@media(forced-colors:active) { .flood-root .flood-navigation-tree:focus-visible { outline-color:Highlight; } }
 
 [data-flood-foundations="neutral"] .flood-date-time-picker { min-inline-size:0; inline-size:100%; }
 [data-flood-foundations="neutral"] .flood-date-time-picker__fields { display:grid; grid-template-columns:minmax(0, 1.5fr) minmax(0, 1fr); align-items:start; gap:var(--flood-sys-space-3); }
@@ -1444,7 +1641,7 @@
 .flood-root .flood-tree-select[hidden] { display:none; }
 .flood-root .flood-tree-select>.flood-label { margin:0; }
 .flood-root .flood-tree-select [data-placeholder] { color:var(--flood-sys-color-field-placeholder); }
-.flood-root .flood-tree-select [data-readonly]:not(:focus-visible) { background:var(--flood-sys-color-surface-canvas); border-style:dashed; cursor:default; }
+.flood-root .flood-tree-select [data-readonly]:not(:focus-visible) { background:var(--flood-sys-color-field-readonly); border-style:dashed; cursor:default; }
 .flood-root .flood-tree-select__panel { inline-size:min(var(--flood-tree-select-width,22rem),var(--flood-overlay-available-width,calc(100dvw - 1rem))); padding:var(--flood-sys-space-1); }
 .flood-root .flood-tree-select__panel>.flood-overlay-header { display:none; }
 .flood-root .flood-tree-select__panel>.flood-overlay-body { margin-block-start:0; }
@@ -1485,19 +1682,300 @@
 @media(max-width:30rem) { .flood-root .flood-data-list-item { flex-wrap:wrap; } .flood-root .flood-data-list-item__trailing { max-inline-size:100%; } }
 
 .flood-root .flood-data-table { min-inline-size:0; inline-size:100%; }
+.flood-root .flood-data-table[data-inset="roomy"] { --flood-data-table-edge:var(--flood-sys-space-6); }
+.flood-root .flood-data-table__toolbar {
+  padding:var(--flood-sys-space-4) var(--flood-data-table-edge,var(--flood-sys-space-3));
+}
+.flood-root .flood-data-table__toolbar-content { flex: 1 1 auto; min-inline-size: 0; }
+.flood-root .flood-data-table__columns { margin-inline-start: auto; max-inline-size: 100%; }
+.flood-root .flood-data-table__table { --flood-data-table-edge:var(--flood-sys-space-3); }
+.flood-root .flood-data-table__table[data-inset="roomy"] { --flood-data-table-edge:var(--flood-sys-space-6); }
+.flood-root .flood-data-table__table[data-inset="roomy"] > :is(thead,tbody) > tr > :first-child { padding-inline-start:var(--flood-data-table-edge); }
+.flood-root .flood-data-table__table[data-inset="roomy"] > :is(thead,tbody) > tr > :last-child { padding-inline-end:var(--flood-data-table-edge); }
+.flood-root .flood-data-table__table[data-inset="roomy"] > thead > tr > th[data-sortable]:first-child { padding-inline-start:calc(var(--flood-data-table-edge) - var(--flood-sys-space-2)); }
+.flood-root .flood-data-table__table[data-inset="roomy"] > thead > tr > th[data-sortable]:last-child { padding-inline-end:calc(var(--flood-data-table-edge) - var(--flood-sys-space-2)); }
+.flood-root .flood-data-table[data-inset="roomy"] .flood-data-table__footer { padding-inline:var(--flood-data-table-edge); }
+.flood-root .flood-data-table .flood-data-table__primary-action {
+  min-block-size:0;
+  padding:0;
+  border:0;
+  border-radius:var(--flood-sys-radius-indicator);
+  background:transparent;
+  color:inherit;
+  text-align:inherit;
+  font-size:inherit;
+  line-height:inherit;
+  white-space:normal;
+  overflow-wrap:anywhere;
+}
+.flood-root .flood-data-table .flood-data-table__primary-action:is(:hover,:active) { background:transparent; }
+.flood-root .flood-data-table .flood-data-table__primary-action:disabled,
+.flood-root .flood-data-table .flood-data-table__primary-action[aria-disabled="true"] { color:var(--flood-sys-color-field-disabled-content); }
+.flood-root .flood-data-table__table > tbody > tr[data-primary-action] { cursor:pointer; }
+.flood-root .flood-data-table__table > tbody > tr[data-primary-action]:not([data-selected]):focus-within { background:var(--flood-sys-color-action-on-surface-hover); }
+@media (hover:hover) {
+  .flood-root .flood-data-table__table > tbody > tr[data-primary-action]:not([data-selected]):hover { background:var(--flood-sys-color-action-on-surface-hover); }
+}
 .flood-root .flood-data-table[hidden] { display:none; }
-.flood-root .flood-data-table thead th { vertical-align:middle; }
-.flood-root .flood-data-table thead th[data-sortable] { padding-inline:max(0px,calc(var(--flood-data-padding) - var(--flood-sys-space-2))); }
-.flood-root .flood-data-table__sort { gap:var(--flood-sys-space-2); min-block-size:var(--flood-sys-control-sm-height); padding-inline:calc(var(--flood-sys-space-2) - var(--flood-sys-stroke-width)); color:inherit; font:inherit; font-weight:500; }
+.flood-root .flood-data-table__table > thead > tr > th { vertical-align:middle; }
+.flood-root .flood-data-table__table > thead > tr > th[data-sortable] { padding-inline:max(0px,calc(var(--flood-data-padding) - var(--flood-sys-space-2))); }
+.flood-root .flood-data-table__sort { gap:var(--flood-sys-space-1); min-block-size:var(--flood-sys-control-sm-height); padding-inline:calc(var(--flood-sys-space-2) - var(--flood-sys-stroke-width)); color:inherit; font:inherit; font-weight:500; }
+.flood-root .flood-data-table__header-content { display:inline-flex; align-items:center; gap:var(--flood-sys-space-1); max-inline-size:100%; vertical-align:middle; }
+.flood-root .flood-data-table__header-content:focus-visible { outline:var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring); border-radius:var(--flood-sys-radius-indicator); }
+.flood-root .flood-data-table__header-label { min-inline-size:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
+.flood-root .flood-data-table__table:not([data-fixed-columns]) .flood-data-table__header-label { min-inline-size:max-content; }
+.flood-root .flood-data-table__header-unit { flex:none; color:var(--flood-sys-color-content-subtle); }
 .flood-root .flood-data-table__choice { inline-size:1%; white-space:nowrap; }
 .flood-root .flood-data-table__choice .flood-choice { min-block-size:var(--flood-sys-control-sm-height); }
-.flood-root .flood-data-table tr[data-selected] { background:var(--flood-sys-color-selection-background); }
+.flood-root .flood-data-table__table > tbody > tr[data-selected] { background:var(--flood-sys-color-selection-background); }
+.flood-root .flood-data-table th[aria-sort="descending"] .flood-data-table__sort svg { rotate:180deg; }
 .flood-root .flood-data-table .flood-data-table__state { padding-block:var(--flood-sys-space-8); text-align:center; }
 .flood-root .flood-data-table__state>.flood-stack { align-items:center; }
 .flood-root .flood-data-table__footer { display:flex; align-items:center; flex-wrap:wrap; gap:var(--flood-sys-space-3); padding:var(--flood-sys-space-3) var(--flood-sys-space-4); border-block-start:var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); background:var(--flood-sys-color-surface-default); border-end-start-radius:var(--flood-sys-radius-field); border-end-end-radius:var(--flood-sys-radius-field); }
 .flood-root .flood-data-table__footer p { margin:0; }
 .flood-root .flood-data-table__footer nav { margin-inline-start:auto; max-inline-size:100%; }
-@media(forced-colors:active) { .flood-root .flood-data-table tr[data-selected] { outline:1px solid Highlight; } }
+@media(forced-colors:active) { .flood-root .flood-data-table__table > tbody > tr[data-selected] { outline:1px solid Highlight; } }
+
+.flood-root .flood-data-table__table[data-fixed-columns] > thead > tr > th { box-sizing:border-box; }
+.flood-root .flood-data-table__table[data-fixed-columns] > :is(thead,tbody) > tr > [data-data-table-column] {
+  overflow:hidden;
+  overflow-wrap:anywhere;
+}
+.flood-root .flood-data-table__table[data-fixed-columns] > thead > tr > th > .flood-data-table__sort {
+  max-inline-size:100%;
+  text-align:inherit;
+}
+.flood-root .flood-data-table__table > thead > tr > th[data-resize-edge] {
+  --flood-data-table-resize-hit:var(--flood-sys-space-6);
+  --flood-data-table-resize-inset:var(--flood-sys-space-1);
+  position:relative;
+}
+.flood-root .flood-data-table__table > thead > tr > th[data-resize-edge="end"] {
+  padding-inline-end:max(calc(var(--flood-data-table-resize-hit) + 2 * var(--flood-data-table-resize-inset)),var(--flood-data-table-edge));
+}
+.flood-root .flood-data-table__table > thead > tr > th[data-resize-edge="start"] {
+  padding-inline-start:max(calc(var(--flood-data-table-resize-hit) + 2 * var(--flood-data-table-resize-inset)),var(--flood-data-table-edge));
+}
+.flood-root .flood-data-table__resize {
+  position:absolute;
+  inset-block:0;
+  inset-inline-end:0;
+  inline-size:calc(var(--flood-data-table-resize-hit) + var(--flood-data-table-resize-inset));
+  padding-inline-end:var(--flood-data-table-resize-inset);
+  box-sizing:border-box;
+  display:grid;
+  place-items:center;
+  cursor:col-resize;
+  touch-action:none;
+  user-select:none;
+}
+.flood-root .flood-data-table__resize-icon {
+  box-sizing:border-box;
+  inline-size:var(--flood-data-table-resize-hit);
+  block-size:var(--flood-data-table-resize-hit);
+  display:grid;
+  place-items:center;
+  color:var(--flood-sys-color-content-default);
+  background:var(--flood-sys-color-action-on-surface-hover);
+  border:var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative);
+  border-radius:var(--flood-sys-radius-action);
+}
+.flood-root th[data-resize-edge="start"] > .flood-data-table__resize {
+  inset-inline:0 auto;
+  padding-inline:var(--flood-data-table-resize-inset) 0;
+}
+.flood-root .flood-data-table__resize:is(:hover,:focus-visible,[data-dragging]) > .flood-data-table__resize-icon {
+  background:var(--flood-sys-color-surface-supporting);
+  border-color:var(--flood-sys-color-content-subtle);
+}
+.flood-root .flood-data-table__resize:focus-visible { outline:none; }
+.flood-root .flood-data-table__resize:focus-visible > .flood-data-table__resize-icon {
+  outline:var(--flood-sys-focus-width) solid var(--flood-sys-color-focus-ring);
+  outline-offset:calc(-1 * var(--flood-sys-focus-width));
+}
+@media (hover:hover) and (pointer:fine) {
+  .flood-root .flood-data-table__resize:not(:hover,:focus-visible,[data-dragging]) > .flood-data-table__resize-icon { opacity:0; }
+}
+.flood-root .flood-data-table__resize[aria-disabled="true"] { visibility:hidden; }
+@media (pointer:coarse) {
+  .flood-root .flood-data-table__table > thead > tr > th[data-resize-edge] {
+    --flood-data-table-resize-hit:var(--flood-sys-space-8);
+  }
+}
+.flood-root .flood-data-table__table > :is(thead,tbody) > tr > :is(th,td)[data-pin-edge] {
+  --flood-data-table-pin-state:transparent;
+  position:sticky;
+  z-index:1;
+  background-color:var(--flood-sys-color-surface-canvas);
+  background-image:
+    linear-gradient(var(--flood-data-table-pin-state),var(--flood-data-table-pin-state)),
+    linear-gradient(var(--flood-sys-color-surface-current),var(--flood-sys-color-surface-current));
+}
+.flood-root .flood-data-table__table > :is(thead,tbody) > tr > [data-pin-edge="start"] {
+  inset-inline-start:var(--flood-data-table-pin-offset);
+}
+.flood-root .flood-data-table__table > :is(thead,tbody) > tr > [data-pin-edge="end"] {
+  inset-inline-end:calc(var(--flood-data-table-pin-offset) + var(--flood-scroll-content-inline, 0px));
+}
+.flood-root .flood-data-table__table > :is(thead,tbody) > tr > [data-pin-boundary="true"]::before {
+  content:"";
+  position:absolute;
+  inset-block:0;
+  inset-inline-end:0;
+  inline-size:var(--flood-sys-stroke-width);
+  background:var(--flood-sys-color-divider-decorative);
+  pointer-events:none;
+}
+.flood-root .flood-data-table__table > :is(thead,tbody) > tr > [data-pin-edge="end"][data-pin-boundary="true"]::before {
+  inset-inline:0 auto;
+}
+.flood-root .flood-data-table__table[data-striped="true"] > tbody > :where(tr:nth-child(even of :not(.flood-data-table__expanded-row))) > [data-pin-edge] {
+  --flood-data-table-pin-state:color-mix(in srgb,var(--flood-sys-color-content-default) 4%,transparent);
+}
+.flood-root .flood-data-table__table > tbody > tr[data-primary-action]:not([data-selected]):focus-within > [data-pin-edge] {
+  --flood-data-table-pin-state:var(--flood-sys-color-action-on-surface-hover);
+}
+@media (hover:hover) {
+  .flood-root .flood-data-table__table > tbody > tr[data-primary-action]:not([data-selected]):hover > [data-pin-edge] {
+    --flood-data-table-pin-state:var(--flood-sys-color-action-on-surface-hover);
+  }
+}
+.flood-root .flood-data-table__table > tbody > tr[data-selected] > [data-pin-edge] {
+  --flood-data-table-pin-state:var(--flood-sys-color-selection-background);
+}
+@media (forced-colors:active) {
+  .flood-root .flood-data-table__resize-icon { color:CanvasText; }
+  .flood-root .flood-data-table__resize:focus-visible > .flood-data-table__resize-icon { outline-color:Highlight; }
+  .flood-root .flood-data-table__table > :is(thead,tbody) > tr > [data-pin-edge] { background:Canvas; }
+}
+
+.flood-root .flood-table :is(th, td).flood-data-table__expand {
+  inline-size: 1%;
+  padding-block: 0;
+  padding-inline: var(--flood-data-table-edge);
+  text-align: center;
+  white-space: nowrap;
+}
+.flood-root .flood-data-table__expand:not([data-pin-edge]) { position: relative; }
+.flood-root .flood-data-table__expand[data-detail-visible]::after {
+  content: "";
+  position: absolute;
+  inset-block: calc(50% + var(--flood-sys-space-2)) 0;
+  inset-inline-start: calc(50% - var(--flood-sys-stroke-width) / 2);
+  border-inline-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative);
+  pointer-events: none;
+}
+.flood-root .flood-data-table__disclosure[aria-expanded="true"] svg { rotate: 180deg; }
+.flood-root .flood-data-table__expanded-row > td {
+  padding-block: 0;
+  background: color-mix(in srgb, var(--flood-sys-color-content-default) 3%, transparent);
+}
+.flood-root .flood-data-table__detail-reveal {
+  display: grid;
+  grid-template-rows: 0fr;
+}
+.flood-root .flood-data-table__detail-reveal[data-open] { grid-template-rows: 1fr; }
+.flood-root .flood-data-table__detail-clip { min-block-size: 0; overflow: clip; }
+.flood-root .flood-data-table__expanded-content {
+  --flood-data-table-branch-start: max(0px, calc(var(--flood-data-table-disclosure-center, var(--flood-data-table-edge)) - var(--flood-data-table-edge)));
+  --flood-data-table-branch-arm: var(--flood-sys-space-3);
+  contain: inline-size;
+  position: sticky;
+  inset-inline-start: var(--flood-data-table-edge);
+  box-sizing: border-box;
+  padding-block: var(--flood-sys-space-3) var(--flood-sys-space-4);
+  padding-inline: calc(var(--flood-data-table-branch-start) + var(--flood-data-table-branch-arm) + var(--flood-sys-space-2)) var(--flood-sys-space-2);
+}
+.flood-root .flood-data-table__expanded-content::before {
+  content: "";
+  position: absolute;
+  inset-block-start: 0;
+  inset-inline-start: calc(var(--flood-data-table-branch-start) - var(--flood-sys-stroke-width) / 2);
+  inline-size: var(--flood-data-table-branch-arm);
+  box-sizing: border-box;
+  block-size: calc(var(--flood-data-table-branch-target, var(--flood-sys-space-6)) + var(--flood-sys-stroke-width) / 2);
+  border-inline-start: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative);
+  border-block-end: var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative);
+  border-end-start-radius: var(--flood-sys-radius-indicator);
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .flood-root .flood-data-table__detail-reveal:not([data-flood-motion="reduce"] *) {
+    transition: grid-template-rows var(--flood-sys-motion-duration-exit) var(--flood-sys-motion-easing);
+  }
+  .flood-root .flood-data-table__detail-reveal[data-open]:not([data-flood-motion="reduce"] *) {
+    transition-duration: var(--flood-sys-motion-duration-enter);
+  }
+  @starting-style {
+    .flood-root .flood-data-table__detail-reveal[data-open]:not([data-flood-motion="reduce"] *) {
+      grid-template-rows: 0fr;
+    }
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-data-table__disclosure:not(:where([data-flood-motion="reduce"] *)) svg {
+    transition: rotate var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing);
+  }
+}
+
+.flood-root .flood-sparkline {
+  --flood-sparkline-color: var(--flood-sys-color-content-subtle);
+  --flood-sparkline-height: var(--flood-sys-space-8);
+  display: inline-grid;
+  gap: var(--flood-sys-space-1);
+  inline-size: 6rem;
+  max-inline-size: 100%;
+  min-inline-size: 0;
+  vertical-align: middle;
+}
+
+.flood-root .flood-sparkline[data-size="sm"] {
+  --flood-sparkline-height: var(--flood-sys-space-6);
+  inline-size: 5rem;
+}
+
+.flood-root .flood-sparkline[data-tone="success"] { --flood-sparkline-color: var(--flood-sys-color-feedback-success); }
+.flood-root .flood-sparkline[data-tone="accent"] { --flood-sparkline-color: var(--flood-sys-color-accent-content); }
+.flood-root .flood-sparkline[data-tone="warning"] { --flood-sparkline-color: var(--flood-sys-color-feedback-warning); }
+.flood-root .flood-sparkline[data-tone="error"] { --flood-sparkline-color: var(--flood-sys-color-feedback-error); }
+
+.flood-root .flood-sparkline__plot {
+  display: block;
+  inline-size: 100%;
+  block-size: var(--flood-sparkline-height);
+  color: var(--flood-sparkline-color);
+  overflow: visible;
+}
+
+.flood-root :is(.flood-sparkline__line, .flood-sparkline__point, .flood-sparkline__halo) {
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  vector-effect: non-scaling-stroke;
+}
+
+.flood-root .flood-sparkline__line { stroke-width: calc(1.5 * var(--flood-sys-stroke-width)); }
+.flood-root .flood-sparkline__point { stroke-width: calc(3 * var(--flood-sys-stroke-width)); }
+.flood-root .flood-sparkline__point[data-latest] { stroke-width: calc(4 * var(--flood-sys-stroke-width)); }
+.flood-root .flood-sparkline__halo { stroke-width: calc(8 * var(--flood-sys-stroke-width)); opacity: .16; }
+.flood-root .flood-sparkline__area { opacity: .88; }
+.flood-root .flood-sparkline__label { overflow-wrap: anywhere; }
+
+@media (hover: hover) {
+  .flood-root .flood-sparkline:hover .flood-sparkline__halo { opacity: .34; }
+  .flood-root .flood-sparkline:hover .flood-sparkline__area { opacity: 1; }
+}
+@media (hover: hover) and (prefers-reduced-motion: no-preference) {
+  .flood-root:not([data-flood-motion="reduce"]) :is(.flood-sparkline__halo, .flood-sparkline__area):not(:where([data-flood-motion="reduce"] *)) {
+    transition: opacity var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing);
+  }
+}
+.flood-root .flood-sparkline__empty { display: grid; place-items: center; min-block-size: var(--flood-sparkline-height); }
+
+@media (forced-colors: active) {
+  .flood-root .flood-sparkline__plot { color: CanvasText; }
+  .flood-root :is(.flood-sparkline__area, .flood-sparkline__halo) { display: none; }
+}
 
 .flood-root .flood-file-list { box-sizing:border-box; padding-inline:var(--flood-sys-space-4); border:var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); border-radius:var(--flood-sys-radius-field); background:var(--flood-sys-color-surface-default); container-type:inline-size; container-name:flood-files; }
 .flood-root .flood-file-item__thumbnail { display:grid; place-items:center; flex:none; inline-size:var(--flood-sys-control-md-height); block-size:var(--flood-sys-control-md-height); border-radius:var(--flood-sys-radius-action); color:var(--flood-sys-color-content-subtle); overflow:hidden; background:var(--flood-sys-color-field-background); }
@@ -1535,3 +2013,563 @@
 .flood-root .flood-time-picker__scroll { max-block-size:min(15rem,calc(var(--flood-overlay-available-height,60dvh) - 1rem)); }
 
 .flood-root .flood-date-time-range-picker { min-inline-size:0; inline-size:100%; }
+
+.flood-root .flood-overflow-actions { position:relative; inline-size:100%; min-inline-size:0; }
+.flood-root .flood-overflow-actions__bar { display:flex; flex-wrap:nowrap; gap:var(--flood-sys-space-2); inline-size:fit-content; max-inline-size:100%; min-inline-size:0; overflow:auto; }
+.flood-root .flood-overflow-actions__bar > button { flex:none; }
+.flood-root :is(.flood-overflow-actions__leading,.flood-overflow-actions__trailing) { display:flex; align-items:center; flex:none; min-inline-size:0; }
+.flood-root .flood-overflow-actions__trailing { margin-inline-start:auto; }
+.flood-root .flood-overflow-actions__measure { position:absolute; visibility:hidden; pointer-events:none; inline-size:max-content; block-size:0; overflow:hidden; display:flex; gap:var(--flood-sys-space-2); }
+.flood-root .flood-menubar { display:flex; align-items:center; gap:var(--flood-sys-space-1); min-inline-size:0; max-inline-size:100%; overflow:auto; }
+.flood-root .flood-menubar > button { flex:none; }
+.flood-root .flood-button[data-tone="danger"] { --flood-action-content:var(--flood-sys-color-action-danger-content); }
+.flood-root .flood-button--solid[data-tone="danger"] {
+  --flood-action-rest:var(--flood-sys-color-action-danger-content);
+  --flood-action-hover:color-mix(in srgb,var(--flood-sys-color-action-danger-content),white 10%);
+  --flood-action-pressed:color-mix(in srgb,var(--flood-sys-color-action-danger-content),black 10%);
+  --flood-action-content:var(--flood-sys-color-surface-canvas);
+}
+
+/* BulkActionBar shares Toolbar geometry and adaptive command ownership. */
+.flood-root .flood-bulk-action-bar { inline-size:100%; max-inline-size:32rem; }
+.flood-root .flood-bulk-action-bar > .flood-overflow-actions__bar { inline-size:100%; background:var(--flood-sys-color-surface-floating); border-color:var(--flood-sys-color-border-floating); box-shadow:0 var(--flood-sys-effect-floating-shadow-offset) var(--flood-sys-effect-floating-shadow-blur) var(--flood-sys-color-shadow-floating); }
+.flood-root .flood-bulk-action-bar > .flood-overflow-actions__bar > .flood-overflow-actions__leading { max-inline-size:35%; }
+.flood-root .flood-bulk-action-bar__selection { box-sizing:border-box; inline-size:7rem; max-inline-size:100%; padding-inline:var(--flood-sys-space-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums; }
+.flood-root .flood-bulk-action-bar__selection[data-counter="number"] { inline-size:3rem; text-align:center; }
+@media(forced-colors:active) { .flood-root .flood-bulk-action-bar > .flood-overflow-actions__bar { background:Canvas; border-color:CanvasText; box-shadow:none; } }
+
+/* Nearest material owners establish their own inherited recipes. Absolute surface
+   palette roles stay unchanged; descendants consume the existing semantic roles. */
+.flood-root :where(.flood-surface, .flood-dialog, .flood-overlay-panel,
+  .flood-select__menu, .flood-toast, .flood-toolbar:not([data-variant="plain"]), .flood-calendar:not(.flood-date-picker__panel .flood-calendar):not(.flood-date-range-picker__panel .flood-calendar),
+  .flood-file-list, .flood-color-picker__panel, .flood-bulk-action-bar,
+  .flood-tabs:not([data-variant="line"]), .flood-disclosure:not(.flood-accordion > .flood-disclosure), .flood-accordion,
+  .flood-segmented .flood-choice-group, .flood-data-table__footer, .flood-code-snippet),
+.flood-root :where([data-flood-surface="filled"], [data-flood-surface="floating"]),
+.flood-root:is([data-flood-surface="filled"], [data-flood-surface="floating"]) {
+  --flood-sys-color-action-subtle-rest: var(--flood-sys-color-context-filled-action-rest);
+  --flood-sys-color-action-subtle-hover: var(--flood-sys-color-context-filled-action-hover);
+  --flood-sys-color-action-subtle-pressed: var(--flood-sys-color-context-filled-action-pressed);
+  --flood-sys-color-action-subtle-disabled: var(--flood-sys-color-context-filled-action-disabled);
+  --flood-sys-color-action-ghost-hover: var(--flood-sys-color-context-filled-action-hover);
+  --flood-sys-color-action-ghost-pressed: var(--flood-sys-color-context-filled-action-pressed);
+  --flood-sys-color-action-on-surface-rest: var(--flood-sys-color-context-filled-action-rest);
+  --flood-sys-color-action-on-surface-hover: var(--flood-sys-color-context-filled-action-hover);
+  --flood-sys-color-action-on-surface-pressed: var(--flood-sys-color-context-filled-action-pressed);
+  --flood-sys-color-action-on-surface-disabled: var(--flood-sys-color-context-filled-action-disabled);
+  --flood-sys-color-field-background: var(--flood-sys-color-context-filled-field-background);
+  --flood-sys-color-field-border: var(--flood-sys-color-context-filled-field-border);
+  --flood-sys-color-field-readonly: var(--flood-sys-color-context-filled-field-readonly);
+  --flood-sys-color-field-disabled: var(--flood-sys-color-context-filled-field-disabled);
+  --flood-sys-color-selection-background: var(--flood-sys-color-context-filled-selection-background);
+  --flood-sys-color-border-decorative: var(--flood-sys-color-context-filled-border-decorative);
+  --flood-sys-color-divider-decorative: var(--flood-sys-color-context-filled-divider-decorative);
+  --flood-sys-color-surface-supporting: var(--flood-sys-color-context-filled-supporting-background);
+  --flood-sys-color-surface-avatar: var(--flood-sys-color-context-filled-avatar-background);
+  --flood-sys-color-surface-muted: var(--flood-sys-color-context-filled-muted-background);
+  --flood-sys-color-indicator-track: var(--flood-sys-color-context-filled-indicator-track);
+  --flood-sys-color-loading-placeholder: var(--flood-sys-color-context-filled-loading-placeholder);
+}
+
+.flood-root[data-flood-surface="filled"],
+.flood-root :where([data-flood-surface="filled"], .flood-surface[data-flood-elevation="default"], .flood-toolbar:not([data-variant="plain"]), .flood-file-list, .flood-color-picker__panel,
+  .flood-tabs:not([data-variant="line"]), .flood-disclosure:not(.flood-accordion > .flood-disclosure), .flood-accordion,
+  .flood-segmented .flood-choice-group, .flood-data-table__footer, .flood-code-snippet) {
+  --flood-sys-color-surface-current: var(--flood-sys-color-surface-default);
+}
+.flood-root :where(.flood-surface[data-flood-elevation="raised"], .flood-calendar:not(.flood-date-picker__panel .flood-calendar):not(.flood-date-range-picker__panel .flood-calendar)) {
+  --flood-sys-color-surface-current: var(--flood-sys-color-surface-raised);
+}
+.flood-root :where(.flood-surface[data-flood-elevation="overlay"], .flood-dialog) {
+  --flood-sys-color-surface-current: var(--flood-sys-color-surface-overlay);
+}
+.flood-root[data-flood-surface="floating"],
+.flood-root :where(.flood-overlay-panel, .flood-select__menu, .flood-toast, .flood-bulk-action-bar,
+  .flood-bulk-action-bar > .flood-overflow-actions__bar, [data-flood-surface="floating"]) {
+  --flood-sys-color-surface-current: var(--flood-sys-color-surface-floating);
+}
+/* Picker calendars shed their standalone material; the popup is their owner. */
+.flood-root :where(.flood-date-picker__panel, .flood-date-range-picker__panel) .flood-calendar {
+  --flood-sys-color-surface-current: inherit;
+}
+
+/* Explicit canvas scopes reset every role after automatic material owners. */
+.flood-root[data-flood-surface="base"],
+.flood-root :where([data-flood-surface="base"], .flood-dropzone,
+  .flood-tabs:not([data-variant="line"]) > .flood-tabs__scroll) {
+  --flood-sys-color-action-subtle-rest: var(--flood-sys-color-context-base-action-rest);
+  --flood-sys-color-action-subtle-hover: var(--flood-sys-color-context-base-action-hover);
+  --flood-sys-color-action-subtle-pressed: var(--flood-sys-color-context-base-action-pressed);
+  --flood-sys-color-action-subtle-disabled: var(--flood-sys-color-context-base-action-disabled);
+  --flood-sys-color-action-ghost-hover: var(--flood-sys-color-context-base-action-hover);
+  --flood-sys-color-action-ghost-pressed: var(--flood-sys-color-context-base-action-pressed);
+  --flood-sys-color-action-on-surface-rest: var(--flood-sys-color-context-base-on-surface-action-rest);
+  --flood-sys-color-action-on-surface-hover: var(--flood-sys-color-context-base-on-surface-action-hover);
+  --flood-sys-color-action-on-surface-pressed: var(--flood-sys-color-context-base-on-surface-action-pressed);
+  --flood-sys-color-action-on-surface-disabled: var(--flood-sys-color-context-base-on-surface-action-disabled);
+  --flood-sys-color-field-background: var(--flood-sys-color-context-base-field-background);
+  --flood-sys-color-field-border: var(--flood-sys-color-context-base-field-border);
+  --flood-sys-color-field-readonly: var(--flood-sys-color-context-base-field-readonly);
+  --flood-sys-color-field-disabled: var(--flood-sys-color-context-base-field-disabled);
+  --flood-sys-color-selection-background: var(--flood-sys-color-context-base-selection-background);
+  --flood-sys-color-border-decorative: var(--flood-sys-color-context-base-border-decorative);
+  --flood-sys-color-divider-decorative: var(--flood-sys-color-context-base-divider-decorative);
+  --flood-sys-color-surface-supporting: var(--flood-sys-color-context-base-supporting-background);
+  --flood-sys-color-surface-avatar: var(--flood-sys-color-context-base-avatar-background);
+  --flood-sys-color-surface-muted: var(--flood-sys-color-context-base-muted-background);
+  --flood-sys-color-indicator-track: var(--flood-sys-color-context-base-indicator-track);
+  --flood-sys-color-loading-placeholder: var(--flood-sys-color-context-base-loading-placeholder);
+  --flood-sys-color-surface-current: var(--flood-sys-color-surface-canvas);
+}
+
+/* Explicit host preference also works in engines without the media feature. */
+.flood-root[data-flood-transparency="reduced"] :is(.flood-overlay-panel, .flood-select__menu),
+.flood-root [data-flood-transparency="reduced"] :is(.flood-overlay-panel, .flood-select__menu),
+.flood-root :is(.flood-overlay-panel, .flood-select__menu)[data-flood-transparency="reduced"] {
+  background: var(--flood-sys-color-surface-floating);
+  backdrop-filter: none;
+}
+
+@media (forced-colors: active) {
+  .flood-root[data-flood-transparency="reduced"] :is(.flood-overlay-panel, .flood-select__menu),
+  .flood-root [data-flood-transparency="reduced"] :is(.flood-overlay-panel, .flood-select__menu),
+  .flood-root :is(.flood-overlay-panel, .flood-select__menu)[data-flood-transparency="reduced"] {
+    background: Canvas;
+  }
+  .flood-root, .flood-root :where(.flood-surface, .flood-dialog, .flood-overlay-panel,
+    .flood-select__menu, .flood-toast, .flood-toolbar:not([data-variant="plain"]), .flood-calendar:not(.flood-date-picker__panel .flood-calendar):not(.flood-date-range-picker__panel .flood-calendar),
+    .flood-file-list, .flood-color-picker__panel, .flood-bulk-action-bar,
+    .flood-tabs:not([data-variant="line"]), .flood-disclosure:not(.flood-accordion > .flood-disclosure), .flood-accordion,
+    .flood-segmented .flood-choice-group, .flood-data-table__footer, .flood-code-snippet,
+    .flood-dropzone, .flood-tabs:not([data-variant="line"]) > .flood-tabs__scroll, [data-flood-surface]) {
+    --flood-sys-color-surface-current: Canvas;
+    --flood-sys-color-surface-supporting: Canvas;
+    --flood-sys-color-surface-avatar: Canvas;
+    --flood-sys-color-surface-muted: Canvas;
+    --flood-sys-color-field-readonly: Canvas;
+  }
+}
+
+.flood-root .flood-filter-condition { container: flood-filter-condition / inline-size; min-inline-size:0; }
+.flood-root .flood-filter-condition__row { grid-template-columns:minmax(7rem,.9fr) minmax(8rem,1fr) minmax(10rem,1.6fr); align-items:center; }
+.flood-root .flood-filter-condition[data-removable="true"] .flood-filter-condition__row { grid-template-columns:minmax(7rem,.9fr) minmax(8rem,1fr) minmax(10rem,1.6fr) auto; }
+.flood-root .flood-filter-condition__values { min-inline-size:0; }
+@container flood-filter-condition (max-width:34rem) {
+  .flood-root .flood-filter-condition__row,
+  .flood-root .flood-filter-condition[data-removable="true"] .flood-filter-condition__row { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
+  .flood-root .flood-filter-condition[data-removable="true"] .flood-filter-condition__row { grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; }
+  .flood-root .flood-filter-condition__values { grid-column:1 / -1; }
+  .flood-root .flood-filter-condition[data-removable="true"] .flood-filter-condition__values { grid-column:1 / 3; }
+  .flood-root .flood-filter-condition__remove { grid-column:3; grid-row:2; }
+}
+@container flood-filter-condition (max-width:22rem) {
+  .flood-root .flood-filter-condition__row,
+  .flood-root .flood-filter-condition[data-removable="true"] .flood-filter-condition__row { grid-template-columns:minmax(0,1fr); }
+  .flood-root .flood-filter-condition__row > :is(.flood-field,.flood-filter-condition__values) { grid-column:1 / -1; }
+  .flood-root .flood-filter-condition__remove { grid-column:1; grid-row:auto; justify-self:end; }
+}
+.flood-root .flood-filter-group .flood-segmented > .flood-fieldset__body { grid-template-columns: minmax(0, 1fr); }
+.flood-root .flood-filter-group .flood-segmented .flood-choice-group { max-inline-size: 100%; }
+.flood-root .flood-filter-group .flood-segmented .flood-choice { flex: 1 1 auto; min-inline-size: 0; }
+
+.flood-root .flood-collection-toolbar { inline-size:100%; min-inline-size:0; container-type:inline-size; }
+.flood-root .flood-collection-toolbar__row { min-inline-size:0; display:grid; grid-template-columns:minmax(12rem,24rem) minmax(0,1fr) auto; }
+.flood-root .flood-collection-toolbar__search { min-inline-size:0; max-inline-size:100%; }
+.flood-root .flood-collection-toolbar__summaries { min-inline-size:0; max-inline-size:100%; }
+.flood-root .flood-collection-toolbar__commands { margin-inline-start:auto; max-inline-size:100%; justify-content:flex-end; }
+.flood-root .flood-collection-toolbar__clear[data-visible="false"] { visibility:hidden; }
+.flood-root .flood-collection-toolbar__commands { grid-column:3; }
+@container (max-width:46rem) {
+  .flood-root .flood-collection-toolbar__row { grid-template-columns:minmax(0,1fr) auto; }
+  .flood-root .flood-collection-toolbar__commands { grid-column:2; grid-row:1; }
+  .flood-root .flood-collection-toolbar__summaries { grid-column:1 / -1; grid-row:2; }
+}
+@container (max-width:28rem) {
+  .flood-root .flood-collection-toolbar__row { grid-template-columns:minmax(0,1fr); }
+  .flood-root .flood-collection-toolbar__commands { grid-column:1; grid-row:2; }
+  .flood-root .flood-collection-toolbar__summaries { grid-row:3; }
+}
+
+.flood-root .flood-collection-view-switcher { min-inline-size:0; }
+.flood-root .flood-collection-view-switcher__select { flex:0 1 13rem; min-inline-size:0; max-inline-size:100%; }
+.flood-root .flood-collection-view-switcher__actions { flex:1 1 16rem; min-inline-size:0; max-inline-size:36rem; }
+.flood-root .flood-collection-view-switcher[hidden] { display:none; }
+
+.flood-root .flood-sidebar { display:flex; flex-direction:column; box-sizing:border-box; inline-size:var(--flood-sidebar-width,16rem); max-inline-size:100%; block-size:100%; min-block-size:0; min-inline-size:0; flex-shrink:0; padding-block:var(--flood-sys-space-3); padding-inline:0; gap:var(--flood-sys-space-4); background:var(--flood-sys-color-surface-default); border-inline-end:var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); }
+.flood-root .flood-sidebar { --flood-sidebar-edge:var(--flood-sys-space-3); --flood-sidebar-icon:var(--flood-sys-control-md-icon-size); --flood-sidebar-row:var(--flood-sys-control-md-height); --flood-sidebar-rail-width:4.5rem; }
+.flood-root .flood-sidebar[data-size="sm"] { --flood-sidebar-icon:var(--flood-sys-control-sm-icon-size); --flood-sidebar-row:var(--flood-sys-control-sm-height); }
+.flood-root .flood-sidebar[data-size="lg"] { --flood-sidebar-icon:var(--flood-sys-control-lg-icon-size); --flood-sidebar-row:var(--flood-sys-control-lg-height); }
+.flood-root .flood-sidebar[data-variant="quiet"] { --flood-sys-color-surface-default:var(--flood-sys-color-surface-canvas); }
+.flood-root .flood-sidebar[data-side="end"] { border-inline-end:0; border-inline-start:var(--flood-sys-stroke-width) solid var(--flood-sys-color-border-decorative); }
+.flood-root .flood-sidebar[data-collapsed="true"] { --flood-sidebar-edge:var(--flood-sys-space-2); inline-size:var(--flood-sidebar-rail-width); }
+.flood-root .flood-sidebar__header { display:flex; align-items:center; gap:var(--flood-sys-space-2); min-inline-size:0; min-block-size:var(--flood-sidebar-row); box-sizing:border-box; flex:none; padding-inline:calc(var(--flood-sidebar-edge) + var(--flood-sys-space-3)); }
+.flood-root .flood-sidebar__identity { flex:1; min-inline-size:0; overflow-wrap:anywhere; }
+.flood-root .flood-sidebar[data-collapsed="true"] .flood-sidebar__header { flex-direction:column; justify-content:center; padding-inline:var(--flood-sidebar-edge); }
+.flood-root .flood-sidebar[data-collapsed="true"] > .flood-sidebar__header[data-collapsible="false"] > .flood-sidebar__identity { flex:none; }
+.flood-root .flood-sidebar__header[data-collapsible="true"] { display:grid; }
+.flood-root .flood-sidebar[data-header-layout="inline"][data-collapsed="false"] > .flood-sidebar__header[data-collapsible="true"] { grid-template-columns:minmax(0,1fr) auto; padding-inline-end:calc(var(--flood-sidebar-edge) + var(--flood-sys-space-1)); }
+.flood-root .flood-sidebar[data-header-layout="inline"][data-collapsed="false"] .flood-sidebar__toggle { grid-area:1 / 2; margin-inline-start:0; }
+.flood-root .flood-sidebar[data-header-layout="inline"][data-collapsed="false"] .flood-sidebar__identity { grid-area:1 / 1; }
+.flood-root .flood-sidebar[data-collapsed="true"] .flood-sidebar__header[data-collapsible="true"] { justify-items:center; }
+.flood-root .flood-sidebar:not([data-collapsed="true"]) .flood-sidebar__toggle {
+  justify-self:start;
+  margin-inline-start:calc((var(--flood-sidebar-rail-width) - var(--flood-sys-stroke-width) - var(--flood-sidebar-row)) / 2 - var(--flood-sidebar-edge) - var(--flood-sys-space-3));
+}
+@media (forced-colors: none) {
+  .flood-root .flood-sidebar__toggle.flood-icon-button:focus-visible {
+    outline:none;
+    background:var(--flood-sys-color-selection-background);
+    color:var(--flood-sys-color-selection-content);
+  }
+}
+@media(pointer:coarse) {
+  .flood-root .flood-sidebar { --flood-sidebar-rail-width:5rem; }
+  .flood-root .flood-sidebar:not([data-collapsed="true"]) .flood-sidebar__toggle {
+    margin-inline-start:calc((var(--flood-sidebar-rail-width) - var(--flood-sys-stroke-width) - max(var(--flood-sidebar-row), var(--flood-sys-size-touch))) / 2 - var(--flood-sidebar-edge) - var(--flood-sys-space-3));
+  }
+}
+.flood-root .flood-sidebar > .flood-scroll-area { flex:1; min-block-size:0; min-inline-size:0; }
+.flood-root .flood-sidebar__body { block-size:100%; min-block-size:0; min-inline-size:0; }
+.flood-root .flood-sidebar__navigation { padding-inline:var(--flood-sidebar-edge); }
+.flood-root .flood-sidebar__navigation :is(.flood-navigation-group__label,.flood-navigation-item__label,.flood-navigation-item__description) {
+  min-inline-size:0;
+  overflow:hidden;
+  text-overflow:ellipsis;
+  white-space:nowrap;
+}
+.flood-root .flood-sidebar__group-label { padding-inline:var(--flood-sys-space-3); }
+.flood-root .flood-sidebar__group[data-icon-column] .flood-navigation-group__label { padding-inline-start:calc(var(--flood-sys-space-3) + var(--flood-sidebar-icon) + var(--flood-sys-space-2)); }
+.flood-root .flood-sidebar__footer { display:flex; flex-direction:column; align-items:stretch; gap:var(--flood-sys-space-1); flex:none; min-inline-size:0; padding-block-start:var(--flood-sys-space-3); padding-inline:var(--flood-sidebar-edge); }
+.flood-root .flood-sidebar[data-footer-separator="true"] .flood-sidebar__footer { border-block-start:var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
+.flood-root .flood-sidebar[data-collapsed="true"] .flood-sidebar__footer { align-items:center; }
+.flood-root .flood-sidebar[data-collapsed="true"] .flood-sidebar__navigation { padding-inline:var(--flood-sidebar-edge); }
+.flood-root .flood-sidebar[hidden] { display:none; }
+@media(forced-colors:active) { .flood-root .flood-sidebar { background:Canvas; border-color:CanvasText; } }
+
+.flood-root .flood-sidebar[data-header-separator="true"] .flood-sidebar__header { padding-block-end:var(--flood-sys-space-3); border-block-end:var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
+
+.flood-root .flood-navigation-item { --flood-navigation-item-height:var(--flood-sys-control-md-height); --flood-navigation-item-target:var(--flood-navigation-item-height); --flood-navigation-item-text:var(--flood-sys-control-md-text-size); --flood-navigation-item-line:var(--flood-sys-control-md-line-height); --flood-navigation-item-inset:var(--flood-sys-space-3); display:flex; align-items:center; min-inline-size:0; box-sizing:border-box; border-radius:var(--flood-sys-radius-indicator); color:var(--flood-sys-color-content-subtle); }
+.flood-root .flood-navigation-item[data-size="sm"] { --flood-navigation-item-height:var(--flood-sys-control-sm-height); --flood-navigation-item-text:var(--flood-sys-control-sm-text-size); --flood-navigation-item-line:var(--flood-sys-control-sm-line-height); }
+.flood-root .flood-navigation-item[data-size="lg"] { --flood-navigation-item-height:var(--flood-sys-control-lg-height); --flood-navigation-item-text:var(--flood-sys-control-lg-text-size); --flood-navigation-item-line:var(--flood-sys-control-lg-line-height); }
+.flood-root .flood-navigation-item[data-variant="standard"] { color:var(--flood-sys-color-content-default); border-radius:var(--flood-sys-radius-action); }
+.flood-root .flood-navigation-item[data-current] { background:var(--flood-sys-color-selection-background); color:var(--flood-sys-color-selection-content); }
+.flood-root .flood-navigation-item[data-ancestor-current]:not([data-current],[data-disabled]) { color:var(--flood-sys-color-content-default); box-shadow:inset 0 0 0 var(--flood-sys-stroke-width) var(--flood-sys-color-divider-decorative); }
+@media (hover:hover) {
+  .flood-root .flood-navigation-item:not([data-disabled],[data-current]):hover { background:var(--flood-sys-color-action-on-surface-hover); }
+}
+.flood-root .flood-navigation-item:not([data-disabled],[data-current]):has(> :is(a,button).flood-navigation-item__control:active) { background:var(--flood-sys-color-selection-background); }
+.flood-root .flood-navigation-item[data-disabled] { color:var(--flood-sys-color-field-disabled-content); }
+.flood-root .flood-navigation-item .flood-navigation-item__control { display:flex; flex:1; justify-content:flex-start; align-items:center; min-inline-size:0; min-block-size:var(--flood-navigation-item-target); box-sizing:border-box; padding:var(--flood-sys-space-1) var(--flood-navigation-item-inset); gap:var(--flood-sys-space-2); border:0; border-radius:inherit; background:transparent; color:inherit; font-size:var(--flood-navigation-item-text); line-height:var(--flood-navigation-item-line); font-weight:var(--flood-sys-type-body-weight); letter-spacing:var(--flood-sys-type-control-tracking); white-space:normal; text-align:start; text-decoration:none; }
+.flood-root .flood-navigation-item[data-variant="standard"] .flood-navigation-item__control { font-weight:var(--flood-sys-type-control-weight); }
+.flood-root .flood-navigation-item .flood-navigation-item__control:is(:hover,:active,[aria-current],[disabled]),.flood-root .flood-navigation-item .flood-navigation-item__disclosure:is(:hover,:active,[disabled]) { background:transparent; color:inherit; }
+.flood-root .flood-navigation-item__content { display:flex; flex:1; flex-direction:column; min-inline-size:0; }
+.flood-root .flood-navigation-item .flood-navigation-item__label { color:inherit; font-size:inherit; font-weight:inherit; line-height:inherit; letter-spacing:inherit; overflow-wrap:anywhere; }
+.flood-root .flood-navigation-item__description { overflow-wrap:anywhere; }
+.flood-root .flood-navigation-item__trailing,.flood-root .flood-navigation-item__indicator { display:flex; flex:none; justify-content:center; align-items:center; min-inline-size:var(--flood-navigation-item-target); margin-inline-start:auto; }
+.flood-root .flood-navigation-item:is([data-disclosure],[data-trailing-action]),
+.flood-root .flood-navigation-item .flood-navigation-item__control:has(> :is(.flood-navigation-item__trailing,.flood-navigation-item__indicator)) { padding-inline-end:var(--flood-sys-space-1); }
+.flood-root .flood-navigation-item:is([data-disclosure],[data-trailing-action]) .flood-navigation-item__control { padding-inline-end:0; }
+.flood-root .flood-navigation-item__accessories { display:grid; grid-auto-flow:column; column-gap:var(--flood-sys-space-1); align-items:center; justify-items:center; flex:none; min-inline-size:var(--flood-navigation-item-target); }
+.flood-root .flood-navigation-item__action { display:flex; align-items:center; justify-content:center; min-inline-size:var(--flood-navigation-item-target); }
+.flood-root .flood-navigation-item__action .flood-icon-button:not(:disabled,[aria-disabled="true"]):is(:hover,:active) {
+  background:transparent;
+  color:var(--flood-sys-color-content-default);
+}
+.flood-root .flood-navigation-item .flood-navigation-item__disclosure { flex:none; inline-size:var(--flood-navigation-item-target); min-block-size:var(--flood-navigation-item-target); background:transparent; color:inherit; }
+.flood-root .flood-navigation-item :is(.flood-navigation-item__indicator,.flood-navigation-item__disclosure) svg { rotate:0deg; }
+.flood-root .flood-navigation-item:dir(rtl) :is(.flood-navigation-item__indicator,.flood-navigation-item__disclosure) svg { rotate:180deg; }
+.flood-root .flood-navigation-item[data-expanded="true"] :is(.flood-navigation-item__indicator,.flood-navigation-item__disclosure) svg { rotate:90deg; }
+.flood-root .flood-navigation-item[data-compact] { inline-size:var(--flood-navigation-item-target); margin-inline:auto; }
+.flood-root .flood-navigation-item[data-compact] .flood-navigation-item__control { flex:none; justify-content:center; inline-size:var(--flood-navigation-item-target); padding-inline:0; }
+.flood-root .flood-navigation-item[data-compact] .flood-navigation-item__content { position:absolute; inline-size:1px; block-size:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
+@media(pointer:coarse) { .flood-root .flood-navigation-item { --flood-navigation-item-target:max(var(--flood-navigation-item-height),var(--flood-sys-size-touch)); } }
+@media(forced-colors:active) { .flood-root .flood-navigation-item[data-current] { outline:1px solid Highlight; color:Highlight; } .flood-root .flood-navigation-item[data-disabled] { color:GrayText; } }
+.flood-root .flood-navigation-item[hidden] { display:none; }
+
+.flood-root .flood-navigation-group { display:grid; row-gap:var(--flood-sys-space-2); min-inline-size:0; }
+.flood-root .flood-navigation-group[data-separator] { padding-block-start:var(--flood-sys-space-3); border-block-start:var(--flood-sys-stroke-width) solid var(--flood-sys-color-divider-decorative); }
+.flood-root .flood-navigation-group__heading { display:flex; align-items:center; justify-content:space-between; gap:var(--flood-sys-space-2); min-inline-size:0; }
+.flood-root .flood-navigation-group__label { padding-inline:var(--flood-sys-space-3); min-inline-size:0; overflow-wrap:anywhere; }
+.flood-root .flood-navigation-group__action { display:flex; align-items:center; justify-content:center; flex:none; }
+.flood-root .flood-navigation-group:not([data-compact]) > .flood-navigation-group__heading > .flood-navigation-group__action {
+  margin-inline-start:auto;
+  padding-inline-end:var(--flood-sys-space-1);
+}
+.flood-root .flood-navigation-group__body { display:grid; row-gap:var(--flood-sys-space-1); min-inline-size:0; }
+.flood-root .flood-disclosure__heading:has(> .flood-disclosure__action) { display:flex; align-items:center; gap:var(--flood-sys-space-2); }
+.flood-root .flood-disclosure__heading:has(> .flood-disclosure__action) > .flood-disclosure__trigger { flex:1; min-inline-size:0; }
+.flood-root .flood-disclosure__action { display:flex; align-items:center; flex:none; padding-inline-end:var(--flood-sys-space-2); }
+.flood-root .flood-navigation-group > .flood-navigation-group__disclosure { display:grid; border:0; border-radius:0; background:transparent; }
+.flood-root .flood-navigation-group__disclosure > .flood-disclosure__heading > .flood-disclosure__trigger { border-radius:var(--flood-sys-radius-indicator); padding-inline:var(--flood-sys-space-3); color:var(--flood-sys-color-content-subtle); font-size:var(--flood-sys-type-helper-size); line-height:var(--flood-sys-type-helper-line-height); font-weight:var(--flood-sys-type-body-weight); }
+.flood-root .flood-navigation-group__disclosure > .flood-disclosure__heading > .flood-disclosure__action { padding-inline-end:var(--flood-sys-space-1); }
+.flood-root .flood-navigation-group__disclosure > .flood-disclosure__panel { padding:var(--flood-sys-space-2) 0 0; }
+.flood-root .flood-navigation-group[data-hide-label] > .flood-navigation-group__disclosure > .flood-disclosure__heading .flood-disclosure__title { position:absolute; inline-size:1px; block-size:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
+.flood-root .flood-navigation-group[data-hide-label] > .flood-navigation-group__disclosure > .flood-disclosure__heading > .flood-disclosure__trigger { justify-content:flex-end; }
+.flood-root .flood-navigation-group[data-compact] > .flood-navigation-group__heading { justify-content:center; }
+.flood-root .flood-navigation-group[data-compact] > .flood-navigation-group__disclosure > .flood-disclosure__heading { display:contents; }
+.flood-root .flood-navigation-group[data-compact] > .flood-navigation-group__disclosure > .flood-disclosure__heading > .flood-disclosure__trigger { display:none; }
+.flood-root .flood-navigation-group[data-compact] > .flood-navigation-group__disclosure > .flood-disclosure__heading > .flood-disclosure__action { justify-content:center; padding:0 0 var(--flood-sys-space-2); }
+.flood-root .flood-navigation-group[data-compact] > .flood-navigation-group__disclosure > .flood-disclosure__panel { display:grid; gap:var(--flood-sys-space-2); padding:0; }
+.flood-root .flood-navigation-group[hidden] { display:none; }
+@media(forced-colors:active) { .flood-root .flood-navigation-group[data-separator] { border-color:CanvasText; } }
+
+/* Shared visual owners keep motion separate from form, focus and layout state. */
+@media (prefers-reduced-motion: no-preference) and (forced-colors: none) {
+  .flood-root .flood-sidebar:not(:where([data-flood-motion="reduce"] *)) {
+    transition: inline-size var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing);
+  }
+
+  .flood-root:not([data-flood-motion="reduce"]) :is(
+    .flood-navigation-item,
+    .flood-tree__row,
+    .flood-select__option,
+    .flood-command-list__option,
+    .flood-list-box__option,
+    .flood-calendar__day,
+    .flood-steps__action,
+    .flood-choice-card,
+    .flood-scroll-area__thumb,
+    .flood-data-table tbody > tr,
+    .flood-menu__item,
+    .flood-segmented .flood-choice
+  ):not(:where([data-flood-motion="reduce"] *)) {
+    transition: background-color var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing);
+  }
+
+  .flood-root:not([data-flood-motion="reduce"]) .flood-check:not(:where([data-flood-motion="reduce"] *))::before {
+    transition: opacity var(--flood-sys-motion-duration-press) var(--flood-sys-motion-easing);
+  }
+  .flood-root .flood-rating__choice > svg:not(:where([data-flood-motion="reduce"] *)) {
+    transition: fill var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing),
+      color var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing);
+  }
+  .flood-root .flood-data-table__sort svg:not(:where([data-flood-motion="reduce"] *)) {
+    transition: rotate var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing);
+  }
+  .flood-root .flood-select--custom .flood-select__control:not(:where([data-flood-motion="reduce"] *))::after {
+    transition: transform var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing);
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-switch-input:not(:where([data-flood-motion="reduce"] *))::before {
+    transition: inset-inline-start var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing);
+  }
+
+  .flood-root:not([data-flood-motion="reduce"]) :is(
+    .flood-tree__chevron,
+    .flood-navigation-item__indicator svg,
+    .flood-navigation-item__disclosure svg
+  ):not(:where([data-flood-motion="reduce"] *)) {
+    transition: rotate var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing);
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-disclosure__indicator:not(:where([data-flood-motion="reduce"] *)) {
+    transition-duration: var(--flood-sys-motion-duration-normal);
+  }
+  .flood-root:not([data-flood-motion="reduce"]) :is(.flood-disclosure__panel, .flood-tabs__panel):not(:where([data-flood-motion="reduce"] *)):not([hidden]) {
+    animation: flood-reveal-content var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing-enter) both;
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-navigation-tree__branch:not(:where([data-flood-motion="reduce"] *)) {
+    animation: flood-reveal-navigation-branch var(--flood-sys-motion-duration-enter) var(--flood-sys-motion-easing-enter);
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-tabs[data-variant="line"] .flood-tab[aria-selected="true"]:not(:where([data-flood-motion="reduce"] *))::after {
+    animation: flood-reveal-mark var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing-enter) both;
+  }
+
+  .flood-root:not([data-flood-motion="reduce"]) .flood-copy-button__labels > span[data-visible]:not(:first-child) > .flood-icon:not(:where([data-flood-motion="reduce"] *)) {
+    animation: flood-reveal-mark var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing-enter) both;
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-avatar .flood-avatar__image:not(:where([data-flood-motion="reduce"] *)) {
+    transition: opacity var(--flood-sys-motion-duration-normal) var(--flood-sys-motion-easing-enter);
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-spinner:not(:where([data-flood-motion="reduce"] *)) {
+    animation-duration: var(--flood-sys-motion-duration-loop);
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-indicator[data-indeterminate="true"] .flood-indicator__fill:not(:where([data-flood-motion="reduce"] *)) {
+    animation-duration: var(--flood-sys-motion-duration-loop);
+  }
+  .flood-root:not([data-flood-motion="reduce"]) .flood-skeleton[data-animate="true"]:not(:where([data-flood-motion="reduce"] *)) {
+    animation-duration: calc(2 * var(--flood-sys-motion-duration-loop));
+  }
+  .flood-root :is(
+    button.flood-button:not(.flood-button-group > .flood-button, .flood-disclosure__trigger, .flood-navigation-item__control),
+    .flood-check:not(.flood-segmented .flood-check),
+    .flood-switch-input,
+    .flood-segmented .flood-choice
+  ):not(:where([data-flood-motion="reduce"] *, :disabled, [aria-disabled="true"], [aria-busy="true"], :has(input:disabled))) {
+    transition: scale var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing-enter),
+      background-color var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing);
+  }
+  .flood-root :is(
+    button.flood-button:not(.flood-button-group > .flood-button, .flood-disclosure__trigger, .flood-navigation-item__control):active,
+    .flood-choice:active > :is(.flood-check:not(.flood-segmented .flood-check), .flood-switch-input),
+    .flood-segmented .flood-choice:active
+  ):not(:where([data-flood-motion="reduce"] *, :disabled, [aria-disabled="true"], [aria-busy="true"], :has(input:disabled))) {
+    scale: .96;
+    transition-duration: var(--flood-sys-motion-duration-press);
+  }
+}
+
+@media (prefers-reduced-motion: no-preference) and (forced-colors: none) and (hover: hover) {
+  .flood-root:not([data-flood-motion="reduce"]) :is(
+    .flood-input,
+    .flood-input-group,
+    .flood-date-field__control,
+    .flood-time-field__control
+  ):not(:where([data-flood-motion="reduce"] *)) {
+    transition: background-color var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing);
+  }
+}
+
+@media (hover: hover) and (forced-colors: none) {
+  .flood-root :is(
+    .flood-input:not(.flood-input-group > .flood-input, .flood-command-palette .flood-input),
+    .flood-input-group:not(:has(input:disabled)),
+    .flood-date-field__control,
+    .flood-time-field__control
+  ):not(:disabled, [readonly], [aria-readonly="true"], [aria-disabled="true"], [data-readonly], [data-disabled]):hover {
+    background-color: color-mix(in srgb, var(--flood-sys-color-field-background) 95%, var(--flood-sys-color-field-content));
+  }
+  .flood-root .flood-segmented .flood-choice:not(:has(input:is(:checked, :disabled))):hover {
+    background-color: var(--flood-sys-color-action-on-surface-hover);
+  }
+}
+
+@keyframes flood-reveal-content {
+  from { opacity: .84; }
+  to { opacity: 1; }
+}
+@keyframes flood-reveal-mark {
+  from { opacity: .55; }
+  to { opacity: 1; }
+}
+@keyframes flood-reveal-navigation-branch {
+  from { opacity:0; translate:0 calc(-1 * var(--flood-sys-motion-distance-small)); }
+  to { opacity:1; translate:0 0; }
+}
+
+@keyframes flood-motion-layer-in {
+  from { opacity: .72; }
+}
+
+@keyframes flood-motion-hint-in {
+  from { opacity: .85; }
+}
+
+@keyframes flood-motion-layer-content-in {
+  from { translate: var(--flood-motion-layer-x, 0) var(--flood-motion-layer-y, 0); }
+}
+
+@keyframes flood-toast-enter {
+  from { opacity: .35; translate: 0 var(--flood-toast-entry-offset, 0px); }
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  /* The native layer owns open state and positioning. Its measured box stays still. */
+  .flood-root :where(.flood-overlay-panel, .flood-select__menu, .flood-dialog) {
+    --flood-motion-layer-x: 0;
+    --flood-motion-layer-y: 0;
+  }
+
+  .flood-root :is(.flood-overlay-panel, .flood-select__menu):not(.flood-tooltip,.flood-menu,[data-chrome="title-only"]):popover-open:not([data-flood-motion="reduce"] *),
+  .flood-root .flood-dialog[open]:not([data-flood-motion="reduce"] *) {
+    --flood-motion-layer-duration: var(--flood-sys-motion-duration-enter);
+    animation: flood-motion-layer-in var(--flood-motion-layer-duration) var(--flood-sys-motion-easing-enter);
+  }
+
+  .flood-root .flood-tooltip:popover-open:not([data-flood-motion="reduce"] *) {
+    animation: flood-motion-hint-in var(--flood-sys-motion-duration-fast) var(--flood-sys-motion-easing-enter);
+  }
+
+  .flood-root .flood-dialog[open]:not([data-flood-motion="reduce"] *) {
+    --flood-motion-layer-duration: var(--flood-sys-motion-duration-layer);
+  }
+
+  .flood-root .flood-dialog[open]:not([data-flood-motion="reduce"] *)::backdrop {
+    animation: flood-motion-layer-in var(--flood-motion-layer-duration) var(--flood-sys-motion-easing-enter);
+  }
+
+  .flood-root :is(.flood-overlay-panel, .flood-select__menu)[data-side="bottom"] { --flood-motion-layer-y: calc(-1 * var(--flood-sys-motion-distance-small)); }
+  .flood-root :is(.flood-overlay-panel, .flood-select__menu)[data-side="top"] { --flood-motion-layer-y: var(--flood-sys-motion-distance-small); }
+  .flood-root :is(.flood-overlay-panel, .flood-select__menu)[data-side="left"] { --flood-motion-layer-x: var(--flood-sys-motion-distance-small); }
+  .flood-root :is(.flood-overlay-panel, .flood-select__menu)[data-side="right"] { --flood-motion-layer-x: calc(-1 * var(--flood-sys-motion-distance-small)); }
+
+  .flood-root .flood-drawer:is([data-side="start"][data-drawer-direction="ltr"], [data-side="end"][data-drawer-direction="rtl"]) { --flood-motion-layer-x: calc(-1 * var(--flood-sys-motion-distance-panel)); }
+  .flood-root .flood-drawer:is([data-side="end"][data-drawer-direction="ltr"], [data-side="start"][data-drawer-direction="rtl"]) { --flood-motion-layer-x: var(--flood-sys-motion-distance-panel); }
+  .flood-root .flood-drawer[data-side="top"] { --flood-motion-layer-y: calc(-1 * var(--flood-sys-motion-distance-panel)); }
+  .flood-root .flood-drawer[data-side="bottom"] { --flood-motion-layer-y: var(--flood-sys-motion-distance-panel); }
+
+  .flood-root :is(.flood-overlay-panel, .flood-select__menu)[data-side]:popover-open > :is(.flood-overlay-body, .flood-hover-card__body, .flood-scroll-area):not([data-flood-motion="reduce"] *),
+  .flood-root .flood-drawer[open] > .flood-drawer__body:not([data-flood-motion="reduce"] *) {
+    animation: flood-motion-layer-content-in var(--flood-motion-layer-duration) var(--flood-sys-motion-easing-enter);
+  }
+
+  .flood-root .flood-bulk-action-bar:not([data-flood-motion="reduce"] *) {
+    animation: flood-motion-hint-in var(--flood-sys-motion-duration-enter) var(--flood-sys-motion-easing-enter);
+  }
+
+  .flood-root .flood-toast-region:not([data-inline]):not([data-flood-motion="reduce"] *) {
+    --flood-toast-travel: calc(2 * var(--flood-sys-motion-distance-small));
+    box-sizing: border-box;
+  }
+
+  /* Reserve room within the scrolling region for the card's entry. */
+  .flood-root .flood-toast-region[data-placement^="bottom"]:has(.flood-toast):not([data-inline]):not([data-flood-motion="reduce"] *) {
+    --flood-toast-entry-offset: var(--flood-toast-travel);
+    padding-block-end: var(--flood-toast-travel);
+    margin-block-end: calc(-1 * var(--flood-toast-travel));
+  }
+
+  .flood-root .flood-toast-region[data-placement^="top"]:has(.flood-toast):not([data-inline]):not([data-flood-motion="reduce"] *) {
+    --flood-toast-entry-offset: calc(-1 * var(--flood-toast-travel));
+    padding-block-start: var(--flood-toast-travel);
+    margin-block-start: calc(-1 * var(--flood-toast-travel));
+  }
+
+  .flood-root .flood-toast:not([data-flood-motion="reduce"] *) {
+    animation: flood-toast-enter var(--flood-sys-motion-duration-enter) var(--flood-sys-motion-easing-enter);
+  }
+}
+
+.flood-root :is(.flood-menu,.flood-popover[data-chrome="title-only"])[aria-hidden="true"] { pointer-events:none; }
+
+@media (prefers-reduced-motion: no-preference) and (forced-colors: none) {
+  .flood-root :is(.flood-menu,.flood-popover[data-chrome="title-only"]):not([data-flood-motion="reduce"] *) {
+    opacity:0;
+    transition:
+      opacity var(--flood-sys-motion-duration-exit) var(--flood-sys-motion-easing),
+      display var(--flood-sys-motion-duration-exit) allow-discrete,
+      overlay var(--flood-sys-motion-duration-exit) allow-discrete;
+  }
+  .flood-root :is(.flood-menu,.flood-popover[data-chrome="title-only"]):popover-open:not([data-flood-motion="reduce"] *) {
+    opacity:1;
+    transition-duration:var(--flood-sys-motion-duration-enter);
+  }
+  @starting-style {
+    .flood-root .flood-menu:popover-open:not([data-flood-motion="reduce"] *) { opacity:0; }
+    .flood-root .flood-popover[data-chrome="title-only"]:popover-open:not([data-flood-motion="reduce"] *) { opacity:.8; }
+  }
+  .flood-root .flood-navigation-tree[data-compact] > ul:has(> li > .flood-navigation-tree__flyout:popover-open)
+    > li > .flood-navigation-tree__flyout:not(:popover-open) { transition-duration:0s; }
+}
+
+/* Application-level reduction composes with the system preference. */
+.flood-root:is([data-flood-motion="reduce"], [data-flood-motion="reduce"] *) {
+  --flood-sys-motion-duration-press: var(--flood-sys-motion-duration-reduced);
+  --flood-sys-motion-duration-fast: var(--flood-sys-motion-duration-reduced);
+  --flood-sys-motion-duration-normal: var(--flood-sys-motion-duration-reduced);
+  --flood-sys-motion-duration-enter: var(--flood-sys-motion-duration-reduced);
+  --flood-sys-motion-duration-layer: var(--flood-sys-motion-duration-reduced);
+  --flood-sys-motion-duration-exit: var(--flood-sys-motion-duration-reduced);
+}
+
+.flood-root[data-flood-motion="reduce"] :is(.flood-spinner, .flood-skeleton[data-animate="true"]),
+.flood-root[data-flood-motion="reduce"] .flood-indicator[data-indeterminate="true"] .flood-indicator__fill {
+  animation: none;
+}
+.flood-root[data-flood-motion="reduce"] .flood-indicator[data-indeterminate="true"] .flood-indicator__fill {
+  background: var(--flood-indicator-color);
+  inline-size: 35%;
+}
+@media (forced-colors: active) {
+  .flood-root[data-flood-motion="reduce"] .flood-indicator[data-indeterminate="true"] .flood-indicator__fill {
+    background: Highlight;
+  }
+}