@shohojdhara/atomix 0.2.3 → 0.2.4

package/dist/themes/esrar.css

@@ -3571,6 +3571,61 @@ a, a:hover {
   margin-left: calc(var(--atomix-avatar-size) * -1 * var(--atomix-avatar-group-stacked-overlap) / 100);
   z-index: 1;
 }
+.atomix-glass__layer, .atomix-glass__overlay, .atomix-glass__base, .atomix-glass__border-1, .atomix-glass__border-2 {
+  pointer-events: none;
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  transform: inherit;
+  transition: inherit;
+}
+.atomix-glass__border-1, .atomix-glass__border-2 {
+  box-sizing: border-box;
+  padding: 1.5px;
+  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
+  -webkit-mask-composite: xor;
+  mask-composite: exclude;
+  box-shadow: 0 0 0 0.5px rgba(255, 255, 255, 0.5) inset, 0 1px 3px rgba(255, 255, 255, 0.25) inset, 0 1px 4px rgba(0, 0, 0, 0.35);
+  transition-property: transform;
+}
+.atomix-glass__border-1 {
+  z-index: 5;
+  opacity: 0.3;
+  mix-blend-mode: screen;
+}
+.atomix-glass__border-2 {
+  z-index: 6;
+}
+.atomix-glass__hover-1, .atomix-glass__hover-2, .atomix-glass__hover-3 {
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  border-radius: inherit;
+  transform: inherit;
+  transition: inherit;
+  transition-property: transform, opacity;
+}
+.atomix-glass__hover-1 {
+  opacity: 0;
+}
+.atomix-glass__hover-2 {
+  overflow: hidden;
+  opacity: 0;
+}
+.atomix-glass__hover-3 {
+  opacity: 0;
+}
+.atomix-glass__base {
+  will-change: transform;
+  transition-property: transform, opacity;
+  opacity: 0;
+}
+.atomix-glass__overlay {
+  mix-blend-mode: overlay;
+  will-change: transform;
+  transition-property: transform, opacity;
+  opacity: 0;
+}
 .c-badge {
   --atomix-tag-font-size: 0.75rem;
   --atomix-tag-font-weight: 400;
@@ -3607,8 +3662,8 @@ a, a:hover {
   --atomix-tag-padding-y: 0.5rem;
 }
 .c-badge--glass {
-  background-color: color-mix(in srgb, var(--atomix-tag-bg-color) 80%, transparent);
-  border: 1px solid color-mix(in srgb, var(--atomix-tag-color) 20%, transparent);
+  background-color: color-mix(in srgb, var(--atomix-tag-bg-color) 20%, transparent);
+  border: 1px solid color-mix(in srgb, var(--atomix-tag-color) 90%, transparent);
 }
 .c-badge--primary {
   --atomix-tag-bg-color: var(--atomix-brand-bg-subtle);
@@ -3644,10 +3699,6 @@ a, a:hover {
   --atomix-tag-color: var(--atomix-light);
   border: 1px solid var(--atomix-dark);
 }
-.c-badge-glass {
-  box-shadow: inset 1px 2px 3px rgba(255, 255, 255, 0.1), inset 0 -2px 2px rgba(0, 0, 0, 0.3);
-  border-radius: 999px;
-}
 .c-breadcrumb {
   --atomix-breadcrumb-font-size: 0.875rem;
   --atomix-breadcrumb-link-padding-y: 0.25rem;
@@ -6975,7 +7026,7 @@ a, a:hover {
   --atomix-edge-panel-bg: var(--atomix-body-bg);
   --atomix-edge-panel-color: var(--atomix-body-color);
   --atomix-edge-panel-shadow: var(--atomix-box-shadow);
-  --atomix-edge-panel-backdrop-bg: var(--atomix-invert-bg-subtle);
+  --atomix-edge-panel-backdrop-bg: var(--atomix-dark-bg-subtle);
   --atomix-edge-panel-backdrop-opacity: 0.5;
   --atomix-edge-panel-backdrop-blur: 10px;
   --atomix-edge-panel-animation-duration: 300ms;
@@ -7229,6 +7280,89 @@ a, a:hover {
     transform: translateY(100%);
   }
 }
+.c-edge-panel--glass {
+  position: absolute;
+  z-index: auto;
+  z-index: initial;
+}
+.c-edge-panel--glass .c-edge-panel__container {
+  background: transparent;
+  box-shadow: none;
+  overflow: hidden;
+  border: none;
+  padding: 0;
+  z-index: auto;
+  z-index: initial;
+  will-change: initial;
+  transform: none !important;
+  border-radius: inherit;
+  opacity: 0;
+  transition: opacity 0.3s ease;
+}
+.c-edge-panel--glass .c-edge-panel__glass-content {
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  width: 100%;
+  height: 100vh;
+  padding: 0;
+  border-radius: inherit;
+  transition: opacity 0.3s ease;
+}
+.c-edge-panel--glass .c-edge-panel__header {
+  background: transparent;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
+  flex-shrink: 0;
+  padding: var(--atomix-edge-panel-padding-y) var(--atomix-edge-panel-padding-x);
+}
+.c-edge-panel--glass .c-edge-panel__body {
+  background: transparent;
+  flex: 1 1;
+  overflow-y: auto;
+  padding: var(--atomix-edge-panel-padding-y) var(--atomix-edge-panel-padding-x);
+}
+.c-edge-panel--glass .c-edge-panel__close {
+  background: rgba(255, 255, 255, 0.05);
+}
+.c-edge-panel--glass .c-edge-panel__close:hover {
+  background: rgba(255, 255, 255, 0.15);
+}
+.c-edge-panel--glass .c-edge-panel__close:focus-visible {
+  outline-color: rgba(255, 255, 255, 0.5);
+}
+.c-edge-panel--glass .c-edge-panel__backdrop {
+  animation: fadeIn 0.3s ease forwards;
+  z-index: 0;
+}
+.c-edge-panel--glass .c-edge-panel__backdrop.is-animating-out {
+  animation: fadeOut 0.3s ease forwards;
+}
+.c-edge-panel--glass.c-edge-panel--start .c-edge-panel__glass-wrapper {
+  animation: slideInStart 0.3s ease forwards;
+}
+.c-edge-panel--glass.c-edge-panel--start .c-edge-panel__glass-wrapper.is-animating-out {
+  animation: slideOutStart 0.3s ease forwards;
+}
+.c-edge-panel--glass.c-edge-panel--end .c-edge-panel__glass-wrapper {
+  animation: slideInEnd 0.3s ease forwards;
+}
+.c-edge-panel--glass.c-edge-panel--end .c-edge-panel__glass-wrapper.is-animating-out {
+  animation: slideOutEnd 0.3s ease forwards;
+}
+.c-edge-panel--glass.c-edge-panel--top .c-edge-panel__glass-wrapper {
+  animation: slideInTop 0.3s ease forwards;
+}
+.c-edge-panel--glass.c-edge-panel--bottom .c-edge-panel__glass-wrapper {
+  animation: slideInBottom 0.3s ease forwards;
+}
+.c-edge-panel--glass.c-edge-panel--bottom .c-edge-panel__container, .c-edge-panel--glass.c-edge-panel--top .c-edge-panel__container {
+  width: 100vw;
+  height: auto;
+}
+.c-edge-panel--glass.c-edge-panel--bottom .c-edge-panel__glass-content, .c-edge-panel--glass.c-edge-panel--top .c-edge-panel__glass-content {
+  width: 100vw;
+  height: auto;
+}
 .c-footer {
   --atomix-footer-padding-x: 1rem;
   --atomix-footer-padding-y: 3rem;
@@ -9063,6 +9197,134 @@ a, a:hover {
   opacity: 0.5;
   cursor: not-allowed;
 }
+.c-messages--glass {
+  background: transparent;
+  border: none;
+  padding: 0;
+}
+.c-messages--glass .c-messages__glass-content {
+  padding: var(--atomix-messages-padding-y) var(--atomix-messages-padding-x);
+  border-radius: var(--atomix-messages-border-radius);
+}
+.c-messages--glass .c-messages__body {
+  border-radius: 0.25rem;
+  padding: 0.5rem;
+  background-color: color-mix(in srgb, var(--atomix-body-bg) 15%, transparent);
+}
+.c-messages--glass .c-messages__text {
+  background-color: color-mix(in srgb, var(--atomix-body-bg) 50%, transparent);
+  -webkit-backdrop-filter: blur(8px);
+          backdrop-filter: blur(8px);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+}
+.c-messages--glass .c-messages__content--self .c-messages__text {
+  background-color: color-mix(in srgb, var(--atomix-brand-bg-subtle) 50%, transparent);
+  border: 1px solid rgba(var(--atomix-primary-rgb), 0.3);
+  -webkit-backdrop-filter: blur(8px);
+          backdrop-filter: blur(8px);
+}
+.c-messages--glass .c-messages__content--self .c-messages__file {
+  background-color: color-mix(in srgb, var(--atomix-brand-bg-subtle) 50%, transparent);
+  border: 1px solid rgba(var(--atomix-primary-rgb), 0.3);
+  -webkit-backdrop-filter: blur(8px);
+          backdrop-filter: blur(8px);
+}
+.c-messages--glass .c-messages__file {
+  background-color: color-mix(in srgb, var(--atomix-brand-bg-subtle) 50%, transparent);
+  border: 1px solid rgba(var(--atomix-primary-rgb), 0.3);
+  -webkit-backdrop-filter: blur(8px);
+          backdrop-filter: blur(8px);
+  border: 1px solid rgba(255, 255, 255, 0.2);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+}
+.c-messages--glass .c-messages__file-icon {
+  background-color: color-mix(in srgb, var(--atomix-brand-bg-subtle) 50%, transparent);
+  -webkit-backdrop-filter: blur(8px);
+          backdrop-filter: blur(8px);
+  border: 1px solid rgba(255, 255, 255, 0.15);
+}
+.c-messages--glass .c-messages__image {
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+.c-messages--glass .c-messages__avatar {
+  border: 2px solid rgba(255, 255, 255, 0.4);
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+}
+.c-messages--glass .c-messages__name {
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+  font-weight: 600;
+}
+.c-messages--glass .c-messages__time {
+  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+}
+.c-messages--glass .c-messages__form {
+  padding-top: 0.75rem;
+  border-top: 1px solid rgba(255, 255, 255, 0.2);
+  margin-top: 1rem;
+}
+.c-messages--glass .c-messages__input {
+  background: rgba(255, 255, 255, 0.3);
+  -webkit-backdrop-filter: blur(8px);
+          backdrop-filter: blur(8px);
+  border: 1px solid rgba(255, 255, 255, 0.3);
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
+  color: var(--atomix-primary-text-emphasis);
+}
+.c-messages--glass .c-messages__input:focus {
+  background: rgba(255, 255, 255, 0.45);
+  border-color: var(--atomix-primary);
+  box-shadow: 0 0 0 3px rgba(var(--atomix-primary-rgb), 0.15);
+}
+.c-messages--glass .c-messages__input::-moz-placeholder {
+  opacity: 0.8;
+  color: var(--atomix-primary-text-emphasis);
+}
+.c-messages--glass .c-messages__input::placeholder {
+  opacity: 0.8;
+  color: var(--atomix-primary-text-emphasis);
+}
+.c-messages--glass .c-messages__option {
+  padding: 0.375rem;
+  border-radius: 0.25rem;
+  transition: background-color 0.2s ease;
+}
+.c-messages--glass .c-messages__option:hover:not(:disabled) {
+  background: rgba(var(--atomix-secondary-bg-rgb), 0.4);
+}
+.c-messages--glass .c-messages__option:focus-visible {
+  outline: 2px solid var(--atomix-primary);
+  outline-offset: 2px;
+}
+.c-messages--glass .c-messages__option-icon {
+  opacity: 0.8;
+  transition: opacity 0.2s ease;
+}
+.c-messages__option:hover .c-messages--glass .c-messages__option-icon {
+  opacity: 1;
+}
+.c-messages--glass .c-messages__submit {
+  background: rgba(var(--atomix-primary-rgb), 0.9);
+  -webkit-backdrop-filter: blur(8px);
+          backdrop-filter: blur(8px);
+  border: 1px solid rgba(var(--atomix-primary-rgb), 0.4);
+  box-shadow: 0 2px 8px rgba(var(--atomix-primary-rgb), 0.3);
+  transition: all 0.2s ease;
+}
+.c-messages--glass .c-messages__submit:hover:not(:disabled) {
+  background: rgba(var(--atomix-primary-rgb), 1);
+  box-shadow: 0 4px 12px rgba(var(--atomix-primary-rgb), 0.4);
+  transform: translateY(-1px);
+}
+.c-messages--glass .c-messages__submit:active:not(:disabled) {
+  transform: translateY(0);
+  box-shadow: 0 1px 4px rgba(var(--atomix-primary-rgb), 0.3);
+}
+.c-messages--glass .c-messages__submit:disabled {
+  opacity: 0.5;
+  background: rgba(var(--atomix-primary-rgb), 0.5);
+}
 .c-modal {
   --atomix-modal-inner-padding: 1rem;
   --atomix-modal-content-color: ;
@@ -9085,7 +9347,7 @@ a, a:hover {
   --atomix-modal-lg: 62.5rem;
   --atomix-modal-xl: 71.25rem;
   --atomix-modal-width: var(--atomix-modal-md);
-  position: fixed;
+  position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;
@@ -9109,10 +9371,8 @@ a, a:hover {
   margin-left: auto;
   margin-right: auto;
   opacity: 0;
-  z-index: 2;
   pointer-events: none;
   transition: 0.3s ease;
-  will-change: transform;
 }
 .c-modal__content {
   display: flex;
@@ -9176,6 +9436,9 @@ a, a:hover {
 .c-modal--xl {
   --atomix-modal-width: var(--atomix-modal-xl);
 }
+.c-modal--glass .c-modal .c-modal--glass .c-modal__content {
+  background-color: color-mix(in srgb, var(--atomix-modal-content-bg) 50%, transparent);
+}
 .c-modal.is-open .c-modal__backdrop {
   opacity: var(--atomix-modal-backdrop-opacity);
 }
@@ -9498,8 +9761,10 @@ a, a:hover {
     display: flex !important;
   }
 }
-.c-navbar--fixed, .c-navbar--fixed-bottom {
+.c-navbar--fixed:not(.c-navbar--glass), .c-navbar--fixed-bottom:not(.c-navbar--glass) {
   position: fixed;
+}
+.c-navbar--fixed, .c-navbar--fixed-bottom {
   left: 0;
   right: 0;
   width: 100%;
@@ -9508,12 +9773,18 @@ a, a:hover {
 .c-navbar--fixed {
   top: 0;
 }
+.c-navbar--glass {
+  position: relative;
+  background-color: transparent;
+  border-bottom: none;
+}
 .c-navbar--fixed-bottom {
   bottom: 0;
 }
 .c-navbar--fixed-bottom .c-nav__dropdown-menu {
   top: auto;
   bottom: 100%;
+  z-index: 999;
 }
 .c-navbar--fixed-bottom .c-nav--end .c-nav__dropdown-menu {
   left: 50%;
@@ -9854,7 +10125,7 @@ a, a:hover {
   --atomix-callout-icon-color: var(--atomix-light);
 }
 .c-callout--glass {
-  background-color: color-mix(in srgb, var(--atomix-callout-bg) 50%, transparent);
+  background: none;
   padding: 0;
   border: none;
   display: block;
@@ -9864,10 +10135,11 @@ a, a:hover {
   justify-content: center;
   align-items: center;
   padding: var(--atomix-callout-padding-y) var(--atomix-callout-padding-x);
-  border: var(--atomix-callout-border-witdh) solid var(--atomix-callout-border-color);
+  border: var(--atomix-callout-border-witdh) solid color-mix(in srgb, var(--atomix-callout-border-color) 20%, transparent);
   max-width: var(--atomix-callout-width);
   border-radius: var(--atomix-callout-border-radius);
   width: 100%;
+  background-color: color-mix(in srgb, var(--atomix-callout-bg) 50%, transparent);
 }
 .c-callout--glass .c-callout__title {
   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
@@ -11042,6 +11314,10 @@ a, a:hover {
 .c-side-menu__link-text {
   flex: 1 1;
 }
+.c-side-menu--glass {
+  background-color: transparent;
+  border-bottom: none;
+}
 .c-side-menu.is-open .c-side-menu__toggler-icon {
   transform: rotate(90deg);
 }
@@ -13458,6 +13734,35 @@ body.is-open-photoviewer {
   display: block !important;
   clear: both !important;
 }
+.u-glass-clean-root {
+  isolation: initial !important;
+  contain: none !important;
+  transform-style: flat !important;
+  will-change: auto !important;
+  transform: none !important;
+  z-index: auto;
+  z-index: initial;
+}
+.u-glass-debug {
+  outline: 2px dashed red !important;
+}
+.u-glass-debug::after {
+  content: "Glass Debug";
+  position: absolute;
+  top: -20px;
+  left: 0;
+  background: red;
+  color: white;
+  font-size: 10px;
+  padding: 2px 4px;
+  z-index: 9999;
+}
+@media (prefers-reduced-motion: reduce) {
+  .u-glass-no-motion {
+    transition: none !important;
+    animation: none !important;
+  }
+}
 .u-link-primary {
   color: RGBA(var(--atomix-primary-rgb), var(--atomix-u-link-opacity, 1)) !important;
   text-decoration-color: RGBA(var(--atomix-primary-rgb), var(--atomix-u-link-underline-opacity, 1)) !important;
@@ -13708,19 +14013,19 @@ body.is-open-photoviewer {
   border-width: 5px;
 }
 .u-border-opacity-10 {
-  : 0.1;
+  --atomix-u-u-border-opacity-10: 0.1;
 }
 .u-border-opacity-25 {
-  : 0.25;
+  --atomix-u-u-border-opacity-25: 0.25;
 }
 .u-border-opacity-50 {
-  : 0.5;
+  --atomix-u-u-border-opacity-50: 0.5;
 }
 .u-border-opacity-75 {
-  : 0.75;
+  --atomix-u-u-border-opacity-75: 0.75;
 }
 .u-border-opacity-100 {
-  : 1;
+  --atomix-u-u-border-opacity-100: 1;
 }
 .u-rounded {
   border-radius: var(--atomix-border-radius);
@@ -14056,27 +14361,27 @@ body.is-open-photoviewer {
   order: 6;
 }
 .u-link-opacityhover-10 {
-  : 0.1;
+  --atomix-u-u-link-opacity-10: 0.1;
 }
-.u-link-opacityhoverhover-25 {
-  : 0.25;
+.u-link-opacityhover-25 {
+  --atomix-u-u-link-opacity-25: 0.25;
 }
-.u-link-opacityhoverhoverhover-50 {
-  : 0.5;
+.u-link-opacityhover-50 {
+  --atomix-u-u-link-opacity-50: 0.5;
 }
-.u-link-opacityhoverhoverhoverhover-75 {
-  : 0.75;
+.u-link-opacityhover-75 {
+  --atomix-u-u-link-opacity-75: 0.75;
 }
-.u-link-opacityhoverhoverhoverhoverhover-100 {
-  : 1;
+.u-link-opacityhover-100 {
+  --atomix-u-u-link-opacity-100: 1;
 }
 .u-link-offsethover-1 {
   text-underline-offset: 0.125em;
 }
-.u-link-offsethoverhover-2 {
+.u-link-offsethover-2 {
   text-underline-offset: 0.25em;
 }
-.u-link-offsethoverhoverhover-3 {
+.u-link-offsethover-3 {
   text-underline-offset: 0.375em;
 }
 .u-link-underline-primary {
@@ -14113,22 +14418,22 @@ body.is-open-photoviewer {
   text-decoration-color: rgba(var(--atomix-link-color-rgb), var(--atomix-u-link-underline-opacity, 1));
 }
 .u-link-underline-opacityhover-0 {
-  : 0;
+  --atomix-u-u-link-underline-opacity-0: 0;
 }
-.u-link-underline-opacityhoverhover-10 {
-  : 0.1;
+.u-link-underline-opacityhover-10 {
+  --atomix-u-u-link-underline-opacity-10: 0.1;
 }
-.u-link-underline-opacityhoverhoverhover-25 {
-  : 0.25;
+.u-link-underline-opacityhover-25 {
+  --atomix-u-u-link-underline-opacity-25: 0.25;
 }
-.u-link-underline-opacityhoverhoverhoverhover-50 {
-  : 0.5;
+.u-link-underline-opacityhover-50 {
+  --atomix-u-u-link-underline-opacity-50: 0.5;
 }
-.u-link-underline-opacityhoverhoverhoverhoverhover-75 {
-  : 0.75;
+.u-link-underline-opacityhover-75 {
+  --atomix-u-u-link-underline-opacity-75: 0.75;
 }
-.u-link-underline-opacityhoverhoverhoverhoverhoverhover-100 {
-  : 1;
+.u-link-underline-opacityhover-100 {
+  --atomix-u-u-link-underline-opacity-100: 1;
 }
 .u-object-fit-contain {
   -o-object-fit: contain;
@@ -14372,19 +14677,19 @@ body.is-open-photoviewer {
 .u-m-1 {
   margin: 0.25rem;
 }
-.u-m-2 {
+.u-m-1\.5 {
   margin: 0.375rem;
 }
 .u-m-2 {
   margin: 0.5rem;
 }
-.u-m-3 {
+.u-m-2\.5 {
   margin: 0.625rem;
 }
 .u-m-3 {
   margin: 0.75rem;
 }
-.u-m-4 {
+.u-m-3\.5 {
   margin: 0.875rem;
 }
 .u-m-4 {
@@ -14393,7 +14698,7 @@ body.is-open-photoviewer {
 .u-m-5 {
   margin: 1.25rem;
 }
-.u-m-6 {
+.u-m-5\.5 {
   margin: 1.375rem;
 }
 .u-m-6 {
@@ -14402,7 +14707,7 @@ body.is-open-photoviewer {
 .u-m-7 {
   margin: 1.75rem;
 }
-.u-m-8 {
+.u-m-7\.5 {
   margin: 1.875rem;
 }
 .u-m-8 {
@@ -14485,7 +14790,7 @@ body.is-open-photoviewer {
   margin-right: 0.25rem;
   margin-left: 0.25rem;
 }
-.u-mx-2 {
+.u-mx-1\.5 {
   margin-right: 0.375rem;
   margin-left: 0.375rem;
 }
@@ -14493,7 +14798,7 @@ body.is-open-photoviewer {
   margin-right: 0.5rem;
   margin-left: 0.5rem;
 }
-.u-mx-3 {
+.u-mx-2\.5 {
   margin-right: 0.625rem;
   margin-left: 0.625rem;
 }
@@ -14501,7 +14806,7 @@ body.is-open-photoviewer {
   margin-right: 0.75rem;
   margin-left: 0.75rem;
 }
-.u-mx-4 {
+.u-mx-3\.5 {
   margin-right: 0.875rem;
   margin-left: 0.875rem;
 }
@@ -14513,7 +14818,7 @@ body.is-open-photoviewer {
   margin-right: 1.25rem;
   margin-left: 1.25rem;
 }
-.u-mx-6 {
+.u-mx-5\.5 {
   margin-right: 1.375rem;
   margin-left: 1.375rem;
 }
@@ -14525,7 +14830,7 @@ body.is-open-photoviewer {
   margin-right: 1.75rem;
   margin-left: 1.75rem;
 }
-.u-mx-8 {
+.u-mx-7\.5 {
   margin-right: 1.875rem;
   margin-left: 1.875rem;
 }
@@ -14633,7 +14938,7 @@ body.is-open-photoviewer {
   margin-top: 0.25rem;
   margin-bottom: 0.25rem;
 }
-.u-my-2 {
+.u-my-1\.5 {
   margin-top: 0.375rem;
   margin-bottom: 0.375rem;
 }
@@ -14641,7 +14946,7 @@ body.is-open-photoviewer {
   margin-top: 0.5rem;
   margin-bottom: 0.5rem;
 }
-.u-my-3 {
+.u-my-2\.5 {
   margin-top: 0.625rem;
   margin-bottom: 0.625rem;
 }
@@ -14649,7 +14954,7 @@ body.is-open-photoviewer {
   margin-top: 0.75rem;
   margin-bottom: 0.75rem;
 }
-.u-my-4 {
+.u-my-3\.5 {
   margin-top: 0.875rem;
   margin-bottom: 0.875rem;
 }
@@ -14661,7 +14966,7 @@ body.is-open-photoviewer {
   margin-top: 1.25rem;
   margin-bottom: 1.25rem;
 }
-.u-my-6 {
+.u-my-5\.5 {
   margin-top: 1.375rem;
   margin-bottom: 1.375rem;
 }
@@ -14673,7 +14978,7 @@ body.is-open-photoviewer {
   margin-top: 1.75rem;
   margin-bottom: 1.75rem;
 }
-.u-my-8 {
+.u-my-7\.5 {
   margin-top: 1.875rem;
   margin-bottom: 1.875rem;
 }
@@ -14779,19 +15084,19 @@ body.is-open-photoviewer {
 .u-mt-1 {
   margin-top: 0.25rem;
 }
-.u-mt-2 {
+.u-mt-1\.5 {
   margin-top: 0.375rem;
 }
 .u-mt-2 {
   margin-top: 0.5rem;
 }
-.u-mt-3 {
+.u-mt-2\.5 {
   margin-top: 0.625rem;
 }
 .u-mt-3 {
   margin-top: 0.75rem;
 }
-.u-mt-4 {
+.u-mt-3\.5 {
   margin-top: 0.875rem;
 }
 .u-mt-4 {
@@ -14800,7 +15105,7 @@ body.is-open-photoviewer {
 .u-mt-5 {
   margin-top: 1.25rem;
 }
-.u-mt-6 {
+.u-mt-5\.5 {
   margin-top: 1.375rem;
 }
 .u-mt-6 {
@@ -14809,7 +15114,7 @@ body.is-open-photoviewer {
 .u-mt-7 {
   margin-top: 1.75rem;
 }
-.u-mt-8 {
+.u-mt-7\.5 {
   margin-top: 1.875rem;
 }
 .u-mt-8 {
@@ -14890,19 +15195,19 @@ body.is-open-photoviewer {
 .u-me-1 {
   margin-right: 0.25rem;
 }
-.u-me-2 {
+.u-me-1\.5 {
   margin-right: 0.375rem;
 }
 .u-me-2 {
   margin-right: 0.5rem;
 }
-.u-me-3 {
+.u-me-2\.5 {
   margin-right: 0.625rem;
 }
 .u-me-3 {
   margin-right: 0.75rem;
 }
-.u-me-4 {
+.u-me-3\.5 {
   margin-right: 0.875rem;
 }
 .u-me-4 {
@@ -14911,7 +15216,7 @@ body.is-open-photoviewer {
 .u-me-5 {
   margin-right: 1.25rem;
 }
-.u-me-6 {
+.u-me-5\.5 {
   margin-right: 1.375rem;
 }
 .u-me-6 {
@@ -14920,7 +15225,7 @@ body.is-open-photoviewer {
 .u-me-7 {
   margin-right: 1.75rem;
 }
-.u-me-8 {
+.u-me-7\.5 {
   margin-right: 1.875rem;
 }
 .u-me-8 {
@@ -15001,19 +15306,19 @@ body.is-open-photoviewer {
 .u-mb-1 {
   margin-bottom: 0.25rem;
 }
-.u-mb-2 {
+.u-mb-1\.5 {
   margin-bottom: 0.375rem;
 }
 .u-mb-2 {
   margin-bottom: 0.5rem;
 }
-.u-mb-3 {
+.u-mb-2\.5 {
   margin-bottom: 0.625rem;
 }
 .u-mb-3 {
   margin-bottom: 0.75rem;
 }
-.u-mb-4 {
+.u-mb-3\.5 {
   margin-bottom: 0.875rem;
 }
 .u-mb-4 {
@@ -15022,7 +15327,7 @@ body.is-open-photoviewer {
 .u-mb-5 {
   margin-bottom: 1.25rem;
 }
-.u-mb-6 {
+.u-mb-5\.5 {
   margin-bottom: 1.375rem;
 }
 .u-mb-6 {
@@ -15031,7 +15336,7 @@ body.is-open-photoviewer {
 .u-mb-7 {
   margin-bottom: 1.75rem;
 }
-.u-mb-8 {
+.u-mb-7\.5 {
   margin-bottom: 1.875rem;
 }
 .u-mb-8 {
@@ -15112,19 +15417,19 @@ body.is-open-photoviewer {
 .u-ms-1 {
   margin-left: 0.25rem;
 }
-.u-ms-2 {
+.u-ms-1\.5 {
   margin-left: 0.375rem;
 }
 .u-ms-2 {
   margin-left: 0.5rem;
 }
-.u-ms-3 {
+.u-ms-2\.5 {
   margin-left: 0.625rem;
 }
 .u-ms-3 {
   margin-left: 0.75rem;
 }
-.u-ms-4 {
+.u-ms-3\.5 {
   margin-left: 0.875rem;
 }
 .u-ms-4 {
@@ -15133,7 +15438,7 @@ body.is-open-photoviewer {
 .u-ms-5 {
   margin-left: 1.25rem;
 }
-.u-ms-6 {
+.u-ms-5\.5 {
   margin-left: 1.375rem;
 }
 .u-ms-6 {
@@ -15142,7 +15447,7 @@ body.is-open-photoviewer {
 .u-ms-7 {
   margin-left: 1.75rem;
 }
-.u-ms-8 {
+.u-ms-7\.5 {
   margin-left: 1.875rem;
 }
 .u-ms-8 {
@@ -15223,19 +15528,19 @@ body.is-open-photoviewer {
 .u-p-1 {
   padding: 0.25rem;
 }
-.u-p-2 {
+.u-p-1\.5 {
   padding: 0.375rem;
 }
 .u-p-2 {
   padding: 0.5rem;
 }
-.u-p-3 {
+.u-p-2\.5 {
   padding: 0.625rem;
 }
 .u-p-3 {
   padding: 0.75rem;
 }
-.u-p-4 {
+.u-p-3\.5 {
   padding: 0.875rem;
 }
 .u-p-4 {
@@ -15244,7 +15549,7 @@ body.is-open-photoviewer {
 .u-p-5 {
   padding: 1.25rem;
 }
-.u-p-6 {
+.u-p-5\.5 {
   padding: 1.375rem;
 }
 .u-p-6 {
@@ -15253,7 +15558,7 @@ body.is-open-photoviewer {
 .u-p-7 {
   padding: 1.75rem;
 }
-.u-p-8 {
+.u-p-7\.5 {
   padding: 1.875rem;
 }
 .u-p-8 {
@@ -15333,7 +15638,7 @@ body.is-open-photoviewer {
   padding-right: 0.25rem;
   padding-left: 0.25rem;
 }
-.u-px-2 {
+.u-px-1\.5 {
   padding-right: 0.375rem;
   padding-left: 0.375rem;
 }
@@ -15341,7 +15646,7 @@ body.is-open-photoviewer {
   padding-right: 0.5rem;
   padding-left: 0.5rem;
 }
-.u-px-3 {
+.u-px-2\.5 {
   padding-right: 0.625rem;
   padding-left: 0.625rem;
 }
@@ -15349,7 +15654,7 @@ body.is-open-photoviewer {
   padding-right: 0.75rem;
   padding-left: 0.75rem;
 }
-.u-px-4 {
+.u-px-3\.5 {
   padding-right: 0.875rem;
   padding-left: 0.875rem;
 }
@@ -15361,7 +15666,7 @@ body.is-open-photoviewer {
   padding-right: 1.25rem;
   padding-left: 1.25rem;
 }
-.u-px-6 {
+.u-px-5\.5 {
   padding-right: 1.375rem;
   padding-left: 1.375rem;
 }
@@ -15373,7 +15678,7 @@ body.is-open-photoviewer {
   padding-right: 1.75rem;
   padding-left: 1.75rem;
 }
-.u-px-8 {
+.u-px-7\.5 {
   padding-right: 1.875rem;
   padding-left: 1.875rem;
 }
@@ -15477,7 +15782,7 @@ body.is-open-photoviewer {
   padding-top: 0.25rem;
   padding-bottom: 0.25rem;
 }
-.u-py-2 {
+.u-py-1\.5 {
   padding-top: 0.375rem;
   padding-bottom: 0.375rem;
 }
@@ -15485,7 +15790,7 @@ body.is-open-photoviewer {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
 }
-.u-py-3 {
+.u-py-2\.5 {
   padding-top: 0.625rem;
   padding-bottom: 0.625rem;
 }
@@ -15493,7 +15798,7 @@ body.is-open-photoviewer {
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
 }
-.u-py-4 {
+.u-py-3\.5 {
   padding-top: 0.875rem;
   padding-bottom: 0.875rem;
 }
@@ -15505,7 +15810,7 @@ body.is-open-photoviewer {
   padding-top: 1.25rem;
   padding-bottom: 1.25rem;
 }
-.u-py-6 {
+.u-py-5\.5 {
   padding-top: 1.375rem;
   padding-bottom: 1.375rem;
 }
@@ -15517,7 +15822,7 @@ body.is-open-photoviewer {
   padding-top: 1.75rem;
   padding-bottom: 1.75rem;
 }
-.u-py-8 {
+.u-py-7\.5 {
   padding-top: 1.875rem;
   padding-bottom: 1.875rem;
 }
@@ -15619,19 +15924,19 @@ body.is-open-photoviewer {
 .u-pt-1 {
   padding-top: 0.25rem;
 }
-.u-pt-2 {
+.u-pt-1\.5 {
   padding-top: 0.375rem;
 }
 .u-pt-2 {
   padding-top: 0.5rem;
 }
-.u-pt-3 {
+.u-pt-2\.5 {
   padding-top: 0.625rem;
 }
 .u-pt-3 {
   padding-top: 0.75rem;
 }
-.u-pt-4 {
+.u-pt-3\.5 {
   padding-top: 0.875rem;
 }
 .u-pt-4 {
@@ -15640,7 +15945,7 @@ body.is-open-photoviewer {
 .u-pt-5 {
   padding-top: 1.25rem;
 }
-.u-pt-6 {
+.u-pt-5\.5 {
   padding-top: 1.375rem;
 }
 .u-pt-6 {
@@ -15649,7 +15954,7 @@ body.is-open-photoviewer {
 .u-pt-7 {
   padding-top: 1.75rem;
 }
-.u-pt-8 {
+.u-pt-7\.5 {
   padding-top: 1.875rem;
 }
 .u-pt-8 {
@@ -15727,19 +16032,19 @@ body.is-open-photoviewer {
 .u-pe-1 {
   padding-right: 0.25rem;
 }
-.u-pe-2 {
+.u-pe-1\.5 {
   padding-right: 0.375rem;
 }
 .u-pe-2 {
   padding-right: 0.5rem;
 }
-.u-pe-3 {
+.u-pe-2\.5 {
   padding-right: 0.625rem;
 }
 .u-pe-3 {
   padding-right: 0.75rem;
 }
-.u-pe-4 {
+.u-pe-3\.5 {
   padding-right: 0.875rem;
 }
 .u-pe-4 {
@@ -15748,7 +16053,7 @@ body.is-open-photoviewer {
 .u-pe-5 {
   padding-right: 1.25rem;
 }
-.u-pe-6 {
+.u-pe-5\.5 {
   padding-right: 1.375rem;
 }
 .u-pe-6 {
@@ -15757,7 +16062,7 @@ body.is-open-photoviewer {
 .u-pe-7 {
   padding-right: 1.75rem;
 }
-.u-pe-8 {
+.u-pe-7\.5 {
   padding-right: 1.875rem;
 }
 .u-pe-8 {
@@ -15835,19 +16140,19 @@ body.is-open-photoviewer {
 .u-pb-1 {
   padding-bottom: 0.25rem;
 }
-.u-pb-2 {
+.u-pb-1\.5 {
   padding-bottom: 0.375rem;
 }
 .u-pb-2 {
   padding-bottom: 0.5rem;
 }
-.u-pb-3 {
+.u-pb-2\.5 {
   padding-bottom: 0.625rem;
 }
 .u-pb-3 {
   padding-bottom: 0.75rem;
 }
-.u-pb-4 {
+.u-pb-3\.5 {
   padding-bottom: 0.875rem;
 }
 .u-pb-4 {
@@ -15856,7 +16161,7 @@ body.is-open-photoviewer {
 .u-pb-5 {
   padding-bottom: 1.25rem;
 }
-.u-pb-6 {
+.u-pb-5\.5 {
   padding-bottom: 1.375rem;
 }
 .u-pb-6 {
@@ -15865,7 +16170,7 @@ body.is-open-photoviewer {
 .u-pb-7 {
   padding-bottom: 1.75rem;
 }
-.u-pb-8 {
+.u-pb-7\.5 {
   padding-bottom: 1.875rem;
 }
 .u-pb-8 {
@@ -15943,19 +16248,19 @@ body.is-open-photoviewer {
 .u-ps-1 {
   padding-left: 0.25rem;
 }
-.u-ps-2 {
+.u-ps-1\.5 {
   padding-left: 0.375rem;
 }
 .u-ps-2 {
   padding-left: 0.5rem;
 }
-.u-ps-3 {
+.u-ps-2\.5 {
   padding-left: 0.625rem;
 }
 .u-ps-3 {
   padding-left: 0.75rem;
 }
-.u-ps-4 {
+.u-ps-3\.5 {
   padding-left: 0.875rem;
 }
 .u-ps-4 {
@@ -15964,7 +16269,7 @@ body.is-open-photoviewer {
 .u-ps-5 {
   padding-left: 1.25rem;
 }
-.u-ps-6 {
+.u-ps-5\.5 {
   padding-left: 1.375rem;
 }
 .u-ps-6 {
@@ -15973,7 +16278,7 @@ body.is-open-photoviewer {
 .u-ps-7 {
   padding-left: 1.75rem;
 }
-.u-ps-8 {
+.u-ps-7\.5 {
   padding-left: 1.875rem;
 }
 .u-ps-8 {
@@ -16051,19 +16356,19 @@ body.is-open-photoviewer {
 .u-gap-1 {
   gap: 0.25rem;
 }
-.u-gap-2 {
+.u-gap-1\.5 {
   gap: 0.375rem;
 }
 .u-gap-2 {
   gap: 0.5rem;
 }
-.u-gap-3 {
+.u-gap-2\.5 {
   gap: 0.625rem;
 }
 .u-gap-3 {
   gap: 0.75rem;
 }
-.u-gap-4 {
+.u-gap-3\.5 {
   gap: 0.875rem;
 }
 .u-gap-4 {
@@ -16072,7 +16377,7 @@ body.is-open-photoviewer {
 .u-gap-5 {
   gap: 1.25rem;
 }
-.u-gap-6 {
+.u-gap-5\.5 {
   gap: 1.375rem;
 }
 .u-gap-6 {
@@ -16081,7 +16386,7 @@ body.is-open-photoviewer {
 .u-gap-7 {
   gap: 1.75rem;
 }
-.u-gap-8 {
+.u-gap-7\.5 {
   gap: 1.875rem;
 }
 .u-gap-8 {
@@ -16159,19 +16464,19 @@ body.is-open-photoviewer {
 .u-row-gap-1 {
   row-gap: 0.25rem;
 }
-.u-row-gap-2 {
+.u-row-gap-1\.5 {
   row-gap: 0.375rem;
 }
 .u-row-gap-2 {
   row-gap: 0.5rem;
 }
-.u-row-gap-3 {
+.u-row-gap-2\.5 {
   row-gap: 0.625rem;
 }
 .u-row-gap-3 {
   row-gap: 0.75rem;
 }
-.u-row-gap-4 {
+.u-row-gap-3\.5 {
   row-gap: 0.875rem;
 }
 .u-row-gap-4 {
@@ -16180,7 +16485,7 @@ body.is-open-photoviewer {
 .u-row-gap-5 {
   row-gap: 1.25rem;
 }
-.u-row-gap-6 {
+.u-row-gap-5\.5 {
   row-gap: 1.375rem;
 }
 .u-row-gap-6 {
@@ -16189,7 +16494,7 @@ body.is-open-photoviewer {
 .u-row-gap-7 {
   row-gap: 1.75rem;
 }
-.u-row-gap-8 {
+.u-row-gap-7\.5 {
   row-gap: 1.875rem;
 }
 .u-row-gap-8 {
@@ -16269,7 +16574,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 0.25rem;
        column-gap: 0.25rem;
 }
-.u-column-gap-2 {
+.u-column-gap-1\.5 {
   -moz-column-gap: 0.375rem;
        column-gap: 0.375rem;
 }
@@ -16277,7 +16582,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 0.5rem;
        column-gap: 0.5rem;
 }
-.u-column-gap-3 {
+.u-column-gap-2\.5 {
   -moz-column-gap: 0.625rem;
        column-gap: 0.625rem;
 }
@@ -16285,7 +16590,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 0.75rem;
        column-gap: 0.75rem;
 }
-.u-column-gap-4 {
+.u-column-gap-3\.5 {
   -moz-column-gap: 0.875rem;
        column-gap: 0.875rem;
 }
@@ -16297,7 +16602,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 1.25rem;
        column-gap: 1.25rem;
 }
-.u-column-gap-6 {
+.u-column-gap-5\.5 {
   -moz-column-gap: 1.375rem;
        column-gap: 1.375rem;
 }
@@ -16309,7 +16614,7 @@ body.is-open-photoviewer {
   -moz-column-gap: 1.75rem;
        column-gap: 1.75rem;
 }
-.u-column-gap-8 {
+.u-column-gap-7\.5 {
   -moz-column-gap: 1.875rem;
        column-gap: 1.875rem;
 }