@ebay/skin 19.4.0 → 19.5.1

package/dist/alert-dialog/alert-dialog.css

@@ -1,6 +1,6 @@
 :root {
-    --dialog-scrim-color-hide: rgb(17, 24, 32, 0);
-    --dialog-scrim-color-show: rgb(17, 24, 32, 0.7);
+    --dialog-scrim-color-hide: rgb(17 24 32 / 0);
+    --dialog-scrim-color-show: rgb(17 24 32 / 0.7);
     --dialog-lightbox-max-width: 616px;
 }
 .alert-dialog[role="alertdialog"] {
@@ -26,11 +26,11 @@
         --dialog-window-background-color,
         var(--color-background-primary)
     );
-    border-radius: var(--lightbox-border-radius, var(--border-radius-150));
+    border-radius: var(--lightbox-border-radius, var(--border-radius-100));
     display: flex;
     flex: 1 0 auto;
     flex-direction: column;
-    margin: auto auto 16px;
+    margin: auto;
     margin-left: var(--spacing-200);
     margin-right: var(--spacing-200);
     max-height: 90%;
@@ -75,6 +75,42 @@
 .alert-dialog--show .alert-dialog__window--fade {
     transition: opacity 0.16s ease-out;
 }
+.alert-dialog--hide.alert-dialog--mask-fade,
+.alert-dialog--hide.alert-dialog--mask-fade-slow {
+    transition: background-color var(--motion-duration-short-3)
+        var(--motion-easing-continuous);
+}
+.alert-dialog--hide .alert-dialog__window--fade {
+    transition: opacity var(--motion-duration-short-3)
+        var(--motion-easing-continuous);
+}
+.alert-dialog--hide .alert-dialog__window--animate {
+    transition:
+        transform var(--motion-duration-medium-3) var(--motion-easing-soft-exit),
+        opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--hide .alert-dialog__window--animate > * {
+    transition: opacity var(--motion-duration-short-2)
+        var(--motion-easing-continuous);
+}
+.alert-dialog--show.alert-dialog--mask-fade,
+.alert-dialog--show.alert-dialog--mask-fade-slow {
+    transition: background-color var(--motion-duration-short-3)
+        var(--motion-easing-continuous);
+}
+.alert-dialog--show .alert-dialog__window--fade {
+    transition: opacity var(--motion-duration-short-3)
+        var(--motion-easing-continuous);
+}
+.alert-dialog--show .alert-dialog__window--animate {
+    transition:
+        transform var(--motion-duration-medium-3) var(--motion-easing-standard),
+        opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--show .alert-dialog__window--animate > * {
+    transition: opacity var(--motion-duration-medium-2)
+        var(--motion-easing-continuous) var(--motion-duration-short-3);
+}
 
 .alert-dialog--hide.alert-dialog--hide,
 .alert-dialog--hide.alert-dialog--show-init,
@@ -88,7 +124,11 @@
 .alert-dialog--show-init.alert-dialog--mask-fade-slow {
     background-color: var(--dialog-scrim-color-hide);
 }
+.alert-dialog--hide .alert-dialog__window--animate,
+.alert-dialog--hide .alert-dialog__window--animate > *,
 .alert-dialog--hide .alert-dialog__window--fade,
+.alert-dialog--show-init .alert-dialog__window--animate,
+.alert-dialog--show-init .alert-dialog__window--animate > *,
 .alert-dialog--show-init .alert-dialog__window--fade {
     opacity: 0;
 }
@@ -105,15 +145,65 @@
 .alert-dialog--show.alert-dialog--mask-fade-slow {
     background-color: var(--dialog-scrim-color-show);
 }
+.alert-dialog--hide-init .alert-dialog__window--animate,
+.alert-dialog--hide-init .alert-dialog__window--animate > *,
 .alert-dialog--hide-init .alert-dialog__window--fade,
+.alert-dialog--show .alert-dialog__window--animate,
+.alert-dialog--show .alert-dialog__window--animate > *,
 .alert-dialog--show .alert-dialog__window--fade {
     opacity: 1;
 }
 
+@media (prefers-reduced-motion) {
+    .alert-dialog--hide.alert-dialog--mask-fade,
+    .alert-dialog--hide.alert-dialog--mask-fade-slow {
+        transition: background-color var(--motion-duration-short-3)
+            var(--motion-easing-soft-exit);
+    }
+    .alert-dialog--hide .alert-dialog__window--animate,
+    .alert-dialog--hide .alert-dialog__window--fade {
+        transition: opacity var(--motion-duration-short-3)
+            var(--motion-easing-soft-exit);
+    }
+    .alert-dialog--hide .alert-dialog__window--animate > * {
+        transition: opacity var(--motion-duration-short-2)
+            var(--motion-soft-exit);
+    }
+    .alert-dialog--show.alert-dialog--mask-fade,
+    .alert-dialog--show.alert-dialog--mask-fade-slow {
+        transition: background-color var(--motion-duration-medium-2)
+            var(--motion-easing-soft-enter);
+    }
+    .alert-dialog--show .alert-dialog__window--animate,
+    .alert-dialog--show .alert-dialog__window--fade {
+        transition: opacity var(--motion-duration-medium-2)
+            var(--motion-easing-soft-enter);
+    }
+    .alert-dialog--show .alert-dialog__window--animate > * {
+        transition: opacity var(--motion-duration-medium-2)
+            var(--motion-easing-soft-enter) var(--motion-duration-short-3);
+    }
+}
+.alert-dialog--hide-init .alert-dialog__window--animate,
+.alert-dialog--show .alert-dialog__window--animate {
+    transform: scale(1);
+}
+
+.alert-dialog--hide .alert-dialog__window--animate,
+.alert-dialog--show-init .alert-dialog__window--animate {
+    transform: scale(0.75);
+}
+
+@media (prefers-reduced-motion) {
+    .alert-dialog--hide .alert-dialog__window--animate,
+    .alert-dialog--hide-init .alert-dialog__window--animate,
+    .alert-dialog--show .alert-dialog__window--animate,
+    .alert-dialog--show-init .alert-dialog__window--animate {
+        transform: scale(1);
+    }
+}
 @media (min-width: 768px) {
     .alert-dialog__window {
-        border-radius: var(--lightbox-border-radius, var(--border-radius-100));
-        margin: auto;
         max-width: calc(88% - var(--spacing-400));
     }
 }

package/dist/bundles/skin-default.css

@@ -677,11 +677,11 @@ ul.accordion--large summary.details__summary{
 
 .alert-dialog__window{
   background-color:var(--dialog-window-background-color, var(--color-background-primary));
-  border-radius:var(--lightbox-border-radius, var(--border-radius-150));
+  border-radius:var(--lightbox-border-radius, var(--border-radius-100));
   display:flex;
   flex:1 0 auto;
   flex-direction:column;
-  margin:auto auto 16px;
+  margin:auto;
   margin-left:var(--spacing-200);
   margin-right:var(--spacing-200);
   max-height:90%;
@@ -723,6 +723,30 @@ ul.accordion--large summary.details__summary{
 .alert-dialog--hide .alert-dialog__window--fade,.alert-dialog--show .alert-dialog__window--fade{
   transition:opacity .16s ease-out;
 }
+.alert-dialog--hide.alert-dialog--mask-fade,.alert-dialog--hide.alert-dialog--mask-fade-slow{
+  transition:background-color var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--hide .alert-dialog__window--fade{
+  transition:opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--hide .alert-dialog__window--animate{
+  transition:transform var(--motion-duration-medium-3) var(--motion-easing-soft-exit), opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--hide .alert-dialog__window--animate>*{
+  transition:opacity var(--motion-duration-short-2) var(--motion-easing-continuous);
+}
+.alert-dialog--show.alert-dialog--mask-fade,.alert-dialog--show.alert-dialog--mask-fade-slow{
+  transition:background-color var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--show .alert-dialog__window--fade{
+  transition:opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--show .alert-dialog__window--animate{
+  transition:transform var(--motion-duration-medium-3) var(--motion-easing-standard), opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.alert-dialog--show .alert-dialog__window--animate>*{
+  transition:opacity var(--motion-duration-medium-2) var(--motion-easing-continuous) var(--motion-duration-short-3);
+}
 
 .alert-dialog--hide.alert-dialog--hide,.alert-dialog--hide.alert-dialog--show-init,.alert-dialog--show-init.alert-dialog--hide,.alert-dialog--show-init.alert-dialog--show-init{
   display:flex;
@@ -730,7 +754,7 @@ ul.accordion--large summary.details__summary{
 .alert-dialog--hide.alert-dialog--mask-fade,.alert-dialog--hide.alert-dialog--mask-fade-slow,.alert-dialog--show-init.alert-dialog--mask-fade,.alert-dialog--show-init.alert-dialog--mask-fade-slow{
   background-color:var(--dialog-scrim-color-hide);
 }
-.alert-dialog--hide .alert-dialog__window--fade,.alert-dialog--show-init .alert-dialog__window--fade{
+.alert-dialog--hide .alert-dialog__window--animate,.alert-dialog--hide .alert-dialog__window--animate>*,.alert-dialog--hide .alert-dialog__window--fade,.alert-dialog--show-init .alert-dialog__window--animate,.alert-dialog--show-init .alert-dialog__window--animate>*,.alert-dialog--show-init .alert-dialog__window--fade{
   opacity:0;
 }
 
@@ -740,14 +764,45 @@ ul.accordion--large summary.details__summary{
 .alert-dialog--hide-init.alert-dialog--mask-fade,.alert-dialog--hide-init.alert-dialog--mask-fade-slow,.alert-dialog--show.alert-dialog--mask-fade,.alert-dialog--show.alert-dialog--mask-fade-slow{
   background-color:var(--dialog-scrim-color-show);
 }
-.alert-dialog--hide-init .alert-dialog__window--fade,.alert-dialog--show .alert-dialog__window--fade{
+.alert-dialog--hide-init .alert-dialog__window--animate,.alert-dialog--hide-init .alert-dialog__window--animate>*,.alert-dialog--hide-init .alert-dialog__window--fade,.alert-dialog--show .alert-dialog__window--animate,.alert-dialog--show .alert-dialog__window--animate>*,.alert-dialog--show .alert-dialog__window--fade{
   opacity:1;
 }
 
+@media (prefers-reduced-motion){
+  .alert-dialog--hide.alert-dialog--mask-fade,.alert-dialog--hide.alert-dialog--mask-fade-slow{
+    transition:background-color var(--motion-duration-short-3) var(--motion-easing-soft-exit);
+  }
+  .alert-dialog--hide .alert-dialog__window--animate,.alert-dialog--hide .alert-dialog__window--fade{
+    transition:opacity var(--motion-duration-short-3) var(--motion-easing-soft-exit);
+  }
+  .alert-dialog--hide .alert-dialog__window--animate>*{
+    transition:opacity var(--motion-duration-short-2) var(--motion-soft-exit);
+  }
+  .alert-dialog--show.alert-dialog--mask-fade,.alert-dialog--show.alert-dialog--mask-fade-slow{
+    transition:background-color var(--motion-duration-medium-2) var(--motion-easing-soft-enter);
+  }
+  .alert-dialog--show .alert-dialog__window--animate,.alert-dialog--show .alert-dialog__window--fade{
+    transition:opacity var(--motion-duration-medium-2) var(--motion-easing-soft-enter);
+  }
+  .alert-dialog--show .alert-dialog__window--animate>*{
+    transition:opacity var(--motion-duration-medium-2) var(--motion-easing-soft-enter) var(--motion-duration-short-3);
+  }
+}
+.alert-dialog--hide-init .alert-dialog__window--animate,.alert-dialog--show .alert-dialog__window--animate{
+  transform:scale(1);
+}
+
+.alert-dialog--hide .alert-dialog__window--animate,.alert-dialog--show-init .alert-dialog__window--animate{
+  transform:scale(.75);
+}
+
+@media (prefers-reduced-motion){
+  .alert-dialog--hide .alert-dialog__window--animate,.alert-dialog--hide-init .alert-dialog__window--animate,.alert-dialog--show .alert-dialog__window--animate,.alert-dialog--show-init .alert-dialog__window--animate{
+    transform:scale(1);
+  }
+}
 @media (min-width:768px){
   .alert-dialog__window{
-    border-radius:var(--lightbox-border-radius, var(--border-radius-100));
-    margin:auto;
     max-width:calc(88% - var(--spacing-400));
   }
 }
@@ -2498,11 +2553,11 @@ span.combobox{
 
 .confirm-dialog__window{
   background-color:var(--dialog-window-background-color, var(--color-background-primary));
-  border-radius:var(--lightbox-border-radius, var(--border-radius-150));
+  border-radius:var(--lightbox-border-radius, var(--border-radius-100));
   display:flex;
   flex:1 0 auto;
   flex-direction:column;
-  margin:auto auto 16px;
+  margin:auto;
   margin-left:var(--spacing-200);
   margin-right:var(--spacing-200);
   max-height:90%;
@@ -2538,15 +2593,29 @@ span.combobox{
 a.confirm-dialog__confirm,button.confirm-dialog__confirm{
   margin-left:var(--spacing-100);
 }
-
-.confirm-dialog--hide.confirm-dialog--mask-fade,.confirm-dialog--show.confirm-dialog--mask-fade{
-  transition:background-color .16s ease-out;
+.confirm-dialog--hide.confirm-dialog--mask-fade,.confirm-dialog--hide.confirm-dialog--mask-fade-slow{
+  transition:background-color var(--motion-duration-short-3) var(--motion-easing-continuous);
 }
-.confirm-dialog--hide.confirm-dialog--mask-fade-slow,.confirm-dialog--show.confirm-dialog--mask-fade-slow{
-  transition:background-color .32s ease-out;
+.confirm-dialog--hide .confirm-dialog__window--fade{
+  transition:opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
 }
-.confirm-dialog--hide .confirm-dialog__window--fade,.confirm-dialog--show .confirm-dialog__window--fade{
-  transition:opacity .16s ease-out;
+.confirm-dialog--hide .confirm-dialog__window--animate{
+  transition:transform var(--motion-duration-medium-3) var(--motion-easing-soft-exit), opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.confirm-dialog--hide .confirm-dialog__window--animate>*{
+  transition:opacity var(--motion-duration-short-2) var(--motion-easing-continuous);
+}
+.confirm-dialog--show.confirm-dialog--mask-fade,.confirm-dialog--show.confirm-dialog--mask-fade-slow{
+  transition:background-color var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.confirm-dialog--show .confirm-dialog__window--fade{
+  transition:opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.confirm-dialog--show .confirm-dialog__window--animate{
+  transition:transform var(--motion-duration-medium-3) var(--motion-easing-standard), opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.confirm-dialog--show .confirm-dialog__window--animate>*{
+  transition:opacity var(--motion-duration-medium-2) var(--motion-easing-continuous) var(--motion-duration-short-3);
 }
 
 .confirm-dialog--hide.confirm-dialog--hide,.confirm-dialog--hide.confirm-dialog--show-init,.confirm-dialog--show-init.confirm-dialog--hide,.confirm-dialog--show-init.confirm-dialog--show-init{
@@ -2555,7 +2624,7 @@ a.confirm-dialog__confirm,button.confirm-dialog__confirm{
 .confirm-dialog--hide.confirm-dialog--mask-fade,.confirm-dialog--hide.confirm-dialog--mask-fade-slow,.confirm-dialog--show-init.confirm-dialog--mask-fade,.confirm-dialog--show-init.confirm-dialog--mask-fade-slow{
   background-color:var(--dialog-scrim-color-hide);
 }
-.confirm-dialog--hide .confirm-dialog__window--fade,.confirm-dialog--show-init .confirm-dialog__window--fade{
+.confirm-dialog--hide .confirm-dialog__window--animate,.confirm-dialog--hide .confirm-dialog__window--animate>*,.confirm-dialog--hide .confirm-dialog__window--fade,.confirm-dialog--show-init .confirm-dialog__window--animate,.confirm-dialog--show-init .confirm-dialog__window--animate>*,.confirm-dialog--show-init .confirm-dialog__window--fade{
   opacity:0;
 }
 
@@ -2565,14 +2634,45 @@ a.confirm-dialog__confirm,button.confirm-dialog__confirm{
 .confirm-dialog--hide-init.confirm-dialog--mask-fade,.confirm-dialog--hide-init.confirm-dialog--mask-fade-slow,.confirm-dialog--show.confirm-dialog--mask-fade,.confirm-dialog--show.confirm-dialog--mask-fade-slow{
   background-color:var(--dialog-scrim-color-show);
 }
-.confirm-dialog--hide-init .confirm-dialog__window--fade,.confirm-dialog--show .confirm-dialog__window--fade{
+.confirm-dialog--hide-init .confirm-dialog__window--animate,.confirm-dialog--hide-init .confirm-dialog__window--animate>*,.confirm-dialog--hide-init .confirm-dialog__window--fade,.confirm-dialog--show .confirm-dialog__window--animate,.confirm-dialog--show .confirm-dialog__window--animate>*,.confirm-dialog--show .confirm-dialog__window--fade{
   opacity:1;
 }
 
+@media (prefers-reduced-motion){
+  .confirm-dialog--hide.confirm-dialog--mask-fade,.confirm-dialog--hide.confirm-dialog--mask-fade-slow{
+    transition:background-color var(--motion-duration-short-3) var(--motion-easing-soft-exit);
+  }
+  .confirm-dialog--hide .confirm-dialog__window--animate,.confirm-dialog--hide .confirm-dialog__window--fade{
+    transition:opacity var(--motion-duration-short-3) var(--motion-easing-soft-exit);
+  }
+  .confirm-dialog--hide .confirm-dialog__window--animate>*{
+    transition:opacity var(--motion-duration-short-2) var(--motion-soft-exit);
+  }
+  .confirm-dialog--show.confirm-dialog--mask-fade,.confirm-dialog--show.confirm-dialog--mask-fade-slow{
+    transition:background-color var(--motion-duration-medium-2) var(--motion-easing-soft-enter);
+  }
+  .confirm-dialog--show .confirm-dialog__window--animate,.confirm-dialog--show .confirm-dialog__window--fade{
+    transition:opacity var(--motion-duration-medium-2) var(--motion-easing-soft-enter);
+  }
+  .confirm-dialog--show .confirm-dialog__window--animate>*{
+    transition:opacity var(--motion-duration-medium-2) var(--motion-easing-soft-enter) var(--motion-duration-short-3);
+  }
+}
+.confirm-dialog--hide-init .confirm-dialog__window--animate,.confirm-dialog--show .confirm-dialog__window--animate{
+  transform:scale(1);
+}
+
+.confirm-dialog--hide .confirm-dialog__window--animate,.confirm-dialog--show-init .confirm-dialog__window--animate{
+  transform:scale(.75);
+}
+
+@media (prefers-reduced-motion){
+  .confirm-dialog--hide .confirm-dialog__window--animate,.confirm-dialog--hide-init .confirm-dialog__window--animate,.confirm-dialog--show .confirm-dialog__window--animate,.confirm-dialog--show-init .confirm-dialog__window--animate{
+    transform:scale(1);
+  }
+}
 @media (min-width:768px){
   .confirm-dialog__window{
-    border-radius:var(--lightbox-border-radius, var(--border-radius-100));
-    margin:auto;
     max-width:calc(88% - var(--spacing-400));
   }
 }
@@ -3776,6 +3876,60 @@ a.filter-link--selected:not([href]):hover,a.filter-link--selected[aria-disabled=
 a.filter-link:focus:not(:focus-visible),button.filter-button:focus:not(:focus-visible){
   outline:none;
 }
+
+.filter-input{
+  display:inline-block;
+  width:100%;
+}
+
+.filter-input__clear-btn{
+  display:none;
+}
+
+.filter-input .textbox{
+  border-radius:var(--border-radius-150);
+  max-width:480px;
+  min-width:200px;
+}
+
+.filter-input .textbox__control{
+  height:40px;
+}
+
+.filter-input .textbox__control:not(:placeholder-shown)~.filter-input__clear-btn{
+  display:block;
+}
+
+.filter-input .textbox__control::-webkit-search-cancel-button{
+  -webkit-appearance:none;
+  display:none;
+}
+
+.filter-input .textbox button.icon-btn.icon-btn--transparent.icon-btn--small{
+  min-width:32px;
+}
+
+.filter-input .textbox .icon-btn:last-child{
+  flex-shrink:0;
+  margin-inline-end:var(--spacing-50);
+  margin-inline-start:0;
+}
+
+.filter-input--small .textbox .icon-btn:last-child{
+  margin-inline-end:0;
+}
+
+.filter-input--large .textbox .icon-btn:last-child{
+  margin-inline-end:var(--spacing-100);
+}
+
+.filter-input--small .textbox__control{
+  height:32px;
+}
+
+.filter-input--large .textbox__control{
+  height:48px;
+}
 .filter-menu,.filter-menu-form{
   background-color:var(--filter-menu-item-background-color, var(--color-background-primary));
   min-width:144px;
@@ -7136,18 +7290,29 @@ button.icon-btn.lightbox-dialog__prev{
 .lightbox-dialog__title--center{
   text-align:center;
 }
-
-.lightbox-dialog--hide.lightbox-dialog--mask-fade,.lightbox-dialog--show.lightbox-dialog--mask-fade{
-  transition:background-color .16s ease-out;
+.lightbox-dialog--hide.lightbox-dialog--mask-fade,.lightbox-dialog--hide.lightbox-dialog--mask-fade-slow{
+  transition:background-color var(--motion-duration-short-3) var(--motion-easing-continuous);
 }
-.lightbox-dialog--hide.lightbox-dialog--mask-fade-slow,.lightbox-dialog--show.lightbox-dialog--mask-fade-slow{
-  transition:background-color .32s ease-out;
+.lightbox-dialog--hide .lightbox-dialog__window--fade{
+  transition:opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
 }
-.lightbox-dialog--hide .lightbox-dialog__window--fade,.lightbox-dialog--show .lightbox-dialog__window--fade{
-  transition:opacity .16s ease-out;
+.lightbox-dialog--hide .lightbox-dialog__window--animate{
+  transition:transform var(--motion-duration-medium-3) var(--motion-easing-soft-exit), opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.lightbox-dialog--hide .lightbox-dialog__window--animate>*{
+  transition:opacity var(--motion-duration-short-2) var(--motion-easing-continuous);
+}
+.lightbox-dialog--show.lightbox-dialog--mask-fade,.lightbox-dialog--show.lightbox-dialog--mask-fade-slow{
+  transition:background-color var(--motion-duration-short-3) var(--motion-easing-continuous);
 }
-.lightbox-dialog--hide .lightbox-dialog__window--animate,.lightbox-dialog--show .lightbox-dialog__window--animate{
-  transition:opacity .16s ease-out,transform .32s ease-out;
+.lightbox-dialog--show .lightbox-dialog__window--fade{
+  transition:opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.lightbox-dialog--show .lightbox-dialog__window--animate{
+  transition:transform var(--motion-duration-medium-3) var(--motion-easing-standard), opacity var(--motion-duration-short-3) var(--motion-easing-continuous);
+}
+.lightbox-dialog--show .lightbox-dialog__window--animate>*{
+  transition:opacity var(--motion-duration-medium-2) var(--motion-easing-continuous) var(--motion-duration-short-3);
 }
 
 .lightbox-dialog--hide.lightbox-dialog--hide,.lightbox-dialog--hide.lightbox-dialog--show-init,.lightbox-dialog--show-init.lightbox-dialog--hide,.lightbox-dialog--show-init.lightbox-dialog--show-init{
@@ -7156,12 +7321,8 @@ button.icon-btn.lightbox-dialog__prev{
 .lightbox-dialog--hide.lightbox-dialog--mask-fade,.lightbox-dialog--hide.lightbox-dialog--mask-fade-slow,.lightbox-dialog--show-init.lightbox-dialog--mask-fade,.lightbox-dialog--show-init.lightbox-dialog--mask-fade-slow{
   background-color:var(--dialog-scrim-color-hide);
 }
-.lightbox-dialog--hide .lightbox-dialog__window--fade,.lightbox-dialog--show-init .lightbox-dialog__window--fade{
-  opacity:0;
-}
-.lightbox-dialog--hide .lightbox-dialog__window--animate,.lightbox-dialog--show-init .lightbox-dialog__window--animate{
+.lightbox-dialog--hide .lightbox-dialog__window--animate,.lightbox-dialog--hide .lightbox-dialog__window--animate>*,.lightbox-dialog--hide .lightbox-dialog__window--fade,.lightbox-dialog--show-init .lightbox-dialog__window--animate,.lightbox-dialog--show-init .lightbox-dialog__window--animate>*,.lightbox-dialog--show-init .lightbox-dialog__window--fade{
   opacity:0;
-  transform:translateY(100%);
 }
 
 .lightbox-dialog--hide-init.lightbox-dialog--hide-init,.lightbox-dialog--hide-init.lightbox-dialog--show,.lightbox-dialog--show.lightbox-dialog--hide-init,.lightbox-dialog--show.lightbox-dialog--show{
@@ -7170,13 +7331,37 @@ button.icon-btn.lightbox-dialog__prev{
 .lightbox-dialog--hide-init.lightbox-dialog--mask-fade,.lightbox-dialog--hide-init.lightbox-dialog--mask-fade-slow,.lightbox-dialog--show.lightbox-dialog--mask-fade,.lightbox-dialog--show.lightbox-dialog--mask-fade-slow{
   background-color:var(--dialog-scrim-color-show);
 }
-.lightbox-dialog--hide-init .lightbox-dialog__window--fade,.lightbox-dialog--show .lightbox-dialog__window--fade{
+.lightbox-dialog--hide-init .lightbox-dialog__window--animate,.lightbox-dialog--hide-init .lightbox-dialog__window--animate>*,.lightbox-dialog--hide-init .lightbox-dialog__window--fade,.lightbox-dialog--show .lightbox-dialog__window--animate,.lightbox-dialog--show .lightbox-dialog__window--animate>*,.lightbox-dialog--show .lightbox-dialog__window--fade{
   opacity:1;
 }
+
+@media (prefers-reduced-motion){
+  .lightbox-dialog--hide.lightbox-dialog--mask-fade,.lightbox-dialog--hide.lightbox-dialog--mask-fade-slow{
+    transition:background-color var(--motion-duration-short-3) var(--motion-easing-soft-exit);
+  }
+  .lightbox-dialog--hide .lightbox-dialog__window--animate,.lightbox-dialog--hide .lightbox-dialog__window--fade{
+    transition:opacity var(--motion-duration-short-3) var(--motion-easing-soft-exit);
+  }
+  .lightbox-dialog--hide .lightbox-dialog__window--animate>*{
+    transition:opacity var(--motion-duration-short-2) var(--motion-soft-exit);
+  }
+  .lightbox-dialog--show.lightbox-dialog--mask-fade,.lightbox-dialog--show.lightbox-dialog--mask-fade-slow{
+    transition:background-color var(--motion-duration-medium-2) var(--motion-easing-soft-enter);
+  }
+  .lightbox-dialog--show .lightbox-dialog__window--animate,.lightbox-dialog--show .lightbox-dialog__window--fade{
+    transition:opacity var(--motion-duration-medium-2) var(--motion-easing-soft-enter);
+  }
+  .lightbox-dialog--show .lightbox-dialog__window--animate>*{
+    transition:opacity var(--motion-duration-medium-2) var(--motion-easing-soft-enter) var(--motion-duration-short-3);
+  }
+}
 .lightbox-dialog--hide-init .lightbox-dialog__window--animate,.lightbox-dialog--show .lightbox-dialog__window--animate{
-  opacity:1;
   transform:translateY(0);
 }
+
+.lightbox-dialog--hide .lightbox-dialog__window--animate,.lightbox-dialog--show-init .lightbox-dialog__window--animate{
+  transform:translateY(100%);
+}
 .lightbox-dialog__handle:after{
   background-color:var(--dialog-handle-color, var(--color-stroke-default));
   border-radius:3px;
@@ -7229,8 +7414,16 @@ button.icon-btn.lightbox-dialog__prev{
     margin-left:var(--spacing-100);
     margin-top:0;
   }
+  .lightbox-dialog--hide-init .lightbox-dialog__window--animate,.lightbox-dialog--show .lightbox-dialog__window--animate{
+    transform:scale(1);
+  }
+  .lightbox-dialog--hide .lightbox-dialog__window--animate,.lightbox-dialog--show-init .lightbox-dialog__window--animate{
+    transform:scale(.75);
+  }
+}
+@media (min-width:512px) and (prefers-reduced-motion){
   .lightbox-dialog--hide .lightbox-dialog__window--animate,.lightbox-dialog--hide-init .lightbox-dialog__window--animate,.lightbox-dialog--show .lightbox-dialog__window--animate,.lightbox-dialog--show-init .lightbox-dialog__window--animate{
-    transform:translateY(0);
+    transform:scale(1);
   }
 }
 @media (min-width:768px){
@@ -7668,6 +7861,53 @@ span.listbox-button__value{
   margin-left:3px;
   margin-right:0;
 }
+.number-input .textbox{
+  background:transparent;
+}
+
+.number-input label:first-child{
+  flex-grow:1;
+  padding-left:var(--spacing-200);
+}
+
+.number-input label:first-child~input.textbox__control{
+  flex-grow:0;
+}
+
+.icon-btn.number-input__delete{
+  display:none;
+  margin-inline-end:calc(var(--spacing-100)*-1);
+  order:-1;
+  padding-inline-start:var(--spacing-200);
+}
+
+.number-input--show-delete .number-input__delete{
+  display:block;
+}
+
+.number-input--show-delete .number-input__decrement{
+  display:none;
+}
+
+.number-input .textbox .textbox__control{
+  font-weight:700;
+  text-align:center;
+  width:48px;
+}
+.number-input .textbox .textbox__control::-webkit-inner-spin-button,.number-input .textbox .textbox__control::-webkit-outer-spin-button{
+  -webkit-appearance:none;
+  margin:0;
+}
+.number-input .textbox .textbox__control[type=number]{
+  -moz-appearance:textfield;
+  -webkit-appearance:textfield;
+          appearance:textfield;
+}
+
+.number-input .textbox .icon-btn:not(:disabled) svg{
+  color:var(--color-foreground-primary);
+  fill:currentColor;
+}
 .fake-menu__items,.menu__items{
   background-color:var(--menu-background-color, var(--color-background-primary));
   cursor:default;
@@ -10168,6 +10408,10 @@ span.switch__control:focus:not(:focus-visible){
   padding:16px;
 }
 
+.table--frozen-header{
+  max-height:90vh;
+}
+
 .table--frozen-header thead{
   position:sticky;
   top:0;
@@ -10580,11 +10824,11 @@ input.textbox__control{
   display:inline-flex;
   height:1lh;
   pointer-events:none;
-  width:14px;
   fill:var(--textbox-icon-color, var(--color-foreground-secondary));
 }
 
 .textbox>span:first-child,.textbox>svg:first-child{
+  flex-shrink:0;
   margin-inline-start:var(--spacing-200);
 }
 
@@ -10608,8 +10852,8 @@ input.textbox__control[readonly]:focus,textarea.textbox__control[readonly]:focus
   width:100%;
 }
 :root{
-  --dialog-scrim-color-hide:rgb(17, 24, 32, 0);
-  --dialog-scrim-color-show:rgb(17, 24, 32, 0.7);
+  --dialog-scrim-color-hide:rgb(17 24 32 / 0);
+  --dialog-scrim-color-show:rgb(17 24 32 / 0.7);
   --dialog-lightbox-max-width:616px;
 }
 .toast-dialog{
@@ -11710,7 +11954,7 @@ button.tooltip__close{
   }
 }
 :root{
-  --bubble-shadow:0 2px 7px rgb(0, 0, 0, 0.15), 0 5px 17px rgb(0, 0, 0, 0.2);
+  --bubble-shadow:0 2px 7px rgb(0 0 0 / 0.15), 0 5px 17px rgb(0 0 0 / 0.2);
 }
 .tourtip{
   position:relative;