@layerfi/components 0.1.111 → 0.1.112-alpha

package/dist/index.css

@@ -31,11 +31,11 @@
   --color-dark-h: 0;
   --color-dark-s: 0%;
   --color-dark-l: 7%;
-  --color-dark: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) );
+  --color-dark: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l));
   --color-light-h: 0;
   --color-light-s: 0%;
   --color-light-l: 90%;
-  --color-light: hsl( var(--color-light-h) var(--color-light-s) var(--color-light-l) );
+  --color-light: hsl(var(--color-light-h) var(--color-light-s) var(--color-light-l));
   --color-base-0: #fff;
   --color-base-50: hsl(var(--color-dark-h) 1% 98%);
   --color-base-100: hsl(var(--color-dark-h) 1% 94%);
@@ -51,21 +51,21 @@
   --max-component-width: 1408px;
   --base-transparent-1: hsl(220deg 43% 11% / 1%);
   --base-transparent-2: hsl(220deg 43% 11% / 2%);
-  --base-transparent-4: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 4% );
-  --base-transparent-5: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 5% );
-  --base-transparent-6: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 6% );
-  --base-transparent-8: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 8% );
-  --base-transparent-10: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 10% );
-  --base-transparent-12: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 12% );
-  --base-transparent-16: hsl( var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 16% );
-  --base-transparent-16-light: hsl( var(--color-light-h) var(--color-light-s) var(--color-light-l) / 16% );
+  --base-transparent-4: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 4%);
+  --base-transparent-5: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 5%);
+  --base-transparent-6: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 6%);
+  --base-transparent-8: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 8%);
+  --base-transparent-10: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 10%);
+  --base-transparent-12: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 12%);
+  --base-transparent-16: hsl(var(--color-dark-h) var(--color-dark-s) var(--color-dark-l) / 16%);
+  --base-transparent-16-light: hsl(var(--color-light-h) var(--color-light-s) var(--color-light-l) / 16%);
   --color-primary: var(--color-dark);
   --color-accent: var(--color-light);
   --color-secondary: var(--color-base);
   --color-success: var(--color-info-success);
   --color-danger: var(--color-info-error);
   --color-danger-dark: hsl(349deg 30% 30%);
-  --color-danger-light: hsl( var(--color-info-error-h) var(--color-info-error-s) var(--color-info-error-l) / 40% );
+  --color-danger-light: hsl(var(--color-info-error-h) var(--color-info-error-s) var(--color-info-error-l) / 40%);
   --text-color-primary: var(--color-dark);
   --text-color-secondary: var(--color-base-600);
   --bg-element-focus: var(--color-base-50);
@@ -87,9 +87,14 @@
   --text-heading-secondary: 20px;
   --text-heading-page: var(--text-heading);
   --text-heading-view: var(--text-heading-secondary);
-  --text-heading-sm: 16px;
-  --text-heading-xs: 14px;
   --text-heading-2xs: 12px;
+  --text-heading-xs: 14px;
+  --text-heading-sm: 16px;
+  --text-heading-md: var(--text-heading);
+  --text-heading-lg: 36px;
+  --text-heading-xl: 48px;
+  --text-heading-2xl: 56px;
+  --text-heading-3xl: 64px;
   --font-weight-normal: 460;
   --font-weight-bold: 540;
   --spacing-4xs: 2px;
@@ -198,16 +203,16 @@
   --button-border-color-ghost-active: var(--color-base-800);
 }
 .Layer__component *::-webkit-scrollbar {
-  width: 6px;
   height: 6px;
+  width: 6px;
 }
 .Layer__component *::-webkit-scrollbar-track {
-  background: #f1f1f1;
   border-radius: 4px;
+  background: #f1f1f1;
 }
 .Layer__component *::-webkit-scrollbar-thumb {
-  background: #e2e2e2;
   border-radius: 4px;
+  background: #e2e2e2;
 }
 .Layer__component *::-webkit-scrollbar-thumb:hover {
   background: #999;
@@ -223,27 +228,27 @@
   stroke: var(--color-base-1000);
 }
 .Layer__actionable-list {
-  list-style: none;
-  margin: 0;
   padding: 0;
+  margin: 0;
+  list-style: none;
 }
 .Layer__actionable-list li {
-  padding: var(--spacing-sm) var(--spacing-sm) var(--spacing-sm) var(--spacing-md);
-  gap: var(--spacing-2xs);
-  border-radius: var(--spacing-xs);
   box-sizing: border-box;
-  font-size: 12px;
-  cursor: pointer;
   display: flex;
+  gap: var(--spacing-2xs);
   align-items: center;
   justify-content: space-between;
+  padding: var(--spacing-sm) var(--spacing-sm) var(--spacing-sm) var(--spacing-md);
+  border-radius: var(--spacing-xs);
+  cursor: pointer;
+  font-size: 12px;
 }
 .Layer__actionable-list li .Layer__actionable-list__content {
   display: flex;
   flex-direction: column;
+  gap: var(--spacing-2xs);
   align-items: flex-start;
   max-width: 36ch;
-  gap: var(--spacing-2xs);
 }
 .Layer__actionable-list li .Layer__actionable-list__content .Layer__actionable-list__content-description {
   color: var(--color-base-500);
@@ -258,28 +263,28 @@
   background-color: var(--color-base-50);
 }
 .Layer__actionable-list .Layer__actionable-list__select {
-  width: 18px;
-  height: 18px;
   display: flex;
+  height: 18px;
+  width: 18px;
   border-radius: 50%;
   border: 1px solid var(--color-base-300);
 }
 .Layer__actionable-list .Layer__actionable-list__select.Layer__actionable-list__select--selected {
-  border: 1px solid var(--color-info-success);
-  color: var(--color-info-success);
-  background-color: var(--color-info-success-bg);
   align-items: center;
   justify-content: center;
+  border: 1px solid var(--color-info-success);
+  background-color: var(--color-info-success-bg);
+  color: var(--color-info-success);
 }
 .Layer__actionable_row {
   display: flex;
-  padding: var(--spacing-md);
+  gap: var(--spacing-md);
   align-items: center;
   justify-content: space-between;
-  gap: var(--spacing-md);
-  border-radius: var(--XS, 8px);
+  padding: var(--spacing-md);
+  border-radius: 8px;
+  box-shadow: 0 0 0 1px var(--color-base-300);
   background: var(--color-base-0);
-  box-shadow: 0px 0px 0px 1px var(--color-base-300);
   container-type: inline-size;
 }
 @container (max-width: 30rem) {
@@ -293,25 +298,25 @@
 }
 .Layer__actionable_row__main {
   display: flex;
-  align-items: center;
   gap: var(--spacing-md);
+  align-items: center;
 }
 .Layer__actionable_row__icon {
   display: flex;
-  width: 32px;
-  height: 32px;
-  background-color: var(--color-base-100);
-  border-radius: var(--border-radius-3xs);
   align-items: center;
   justify-content: center;
-  box-shadow: 0px 0px 3px 0px var(--base-transparent-4) inset;
+  height: 32px;
+  width: 32px;
+  border-radius: var(--border-radius-3xs);
+  box-shadow: 0 0 3px 0 var(--base-transparent-4) inset;
+  background-color: var(--color-base-100);
 }
 .Layer__actionable_row__action {
   display: flex;
 }
 .Layer__actionable_row__description {
-  color: var(--color-base-500);
   font-size: var(--text-sm);
+  color: var(--color-base-500);
 }
 @keyframes Layer__rotate {
   from {
@@ -400,17 +405,17 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
+  min-height: 52px;
+  padding: var(--spacing-3xs) var(--spacing-sm);
+  border-radius: var(--border-radius-xs);
+  box-shadow: 0 0 0 3px var(--color-base-300);
   background-color: var(--color-base-800);
   color: var(--color-base-50);
-  border-radius: var(--border-radius-xs);
-  padding: var(--spacing-3xs) var(--spacing-sm);
-  min-height: 52px;
-  box-shadow: 0px 0px 0px 3px var(--color-base-300);
 }
 .Layer__bar-banner__left-col {
   display: flex;
-  align-items: center;
   gap: var(--spacing-md);
+  align-items: center;
 }
 .Layer__bar-banner__text-container__desc {
   color: var(--color-base-300);
@@ -418,8 +423,8 @@
 @container (max-width: 560px) {
   .Layer__bar-banner--bookkeeping {
     flex-direction: column;
-    align-items: flex-start;
     gap: var(--spacing-sm);
+    align-items: flex-start;
     padding: var(--spacing-sm);
   }
   .Layer__bar-banner--bookkeeping .Layer__icon-box {
@@ -771,15 +776,15 @@
   display: flex;
   flex-direction: column;
   border-radius: var(--spacing-sm);
-  background: var(--color-base-0);
   box-shadow:
-    0px 4px 12px 0px var(--base-transparent-8),
-    0px 2px 4px 0px var(--base-transparent-6),
-    0px 0px 0px 1px var(--base-transparent-4);
+    0 4px 12px 0 var(--base-transparent-8),
+    0 2px 4px 0 var(--base-transparent-6),
+    0 0 0 1px var(--base-transparent-4);
+  background: var(--color-base-0);
 }
 .Layer__component .recharts-responsive-container {
-  padding: 4px;
   box-sizing: border-box;
+  padding: 4px;
   border-radius: var(--border-radius-xs);
 }
 .Layer__component .recharts-responsive-container .recharts-cartesian-axis-line {
@@ -798,31 +803,31 @@
   min-height: 300px;
 }
 .Layer__chart-legend-list {
-  margin: 0;
-  padding: 0;
   display: flex;
+  gap: var(--spacing-sm);
   align-items: center;
+  justify-content: flex-end;
+  padding: 0;
+  margin: 0;
   font-size: 12px;
-  gap: var(--spacing-sm);
   list-style: none;
-  justify-content: flex-end;
 }
 .Layer__chart__tooltip {
-  background-color: var(--color-base-1000);
   padding: var(--spacing-2xs) var(--spacing-sm);
-  color: var(--color-base-500);
   border-radius: var(--border-radius-3xs);
+  background-color: var(--color-base-1000);
   font-size: var(--text-sm);
+  color: var(--color-base-500);
 }
 .Layer__chart__tooltip-list {
-  margin: 0;
   padding: 0;
+  margin: 0;
 }
 .Layer__chart__tooltip-list li {
-  list-style: none;
   display: flex;
-  justify-content: space-between;
   column-gap: var(--spacing-sm);
+  justify-content: space-between;
+  list-style: none;
 }
 .Layer__chart__tooltip-list .Layer__chart__tooltip-label {
   color: var(--color-base-500);
@@ -846,7 +851,7 @@
 }
 .Layer__hover-menu.Layer__hover-menu--open .Layer__hover-menu__list-wrapper {
   top: 100%;
-  right: 0px;
+  right: 0;
   opacity: 1;
   touch-action: auto;
   pointer-events: auto;
@@ -855,67 +860,67 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  cursor: pointer;
   width: 100%;
+  cursor: pointer;
 }
 .Layer__hover-menu .Layer__hover-menu__list-wrapper {
   position: absolute;
   z-index: 99;
   top: 80%;
   right: -8px;
-  padding-top: var(--spacing-xs);
+  display: flex;
+  justify-content: stretch;
   min-width: 160px;
+  padding-top: var(--spacing-xs);
   touch-action: none;
   pointer-events: none;
   opacity: 0;
-  display: flex;
-  justify-content: stretch;
   transition: all 0.15s ease-out;
 }
 .Layer__hover-menu .Layer__hover-menu__list-wrapper .Layer__hover-menu__list {
-  flex: 1;
+  box-sizing: border-box;
   display: flex;
+  flex: 1;
   flex-direction: column;
   gap: var(--spacing-3xs);
+  padding: var(--spacing-3xs);
   border-radius: var(--spacing-xs);
-  background: var(--color-base-0);
   box-shadow:
-    0px 0px 0px 1px rgba(25, 25, 25, 0.06),
-    0px 4px 12px 0px var(--base-transparent-1, rgba(16, 24, 40, 0.01)),
-    0px 2px 4px 0px rgba(25, 25, 25, 0.06);
-  box-sizing: border-box;
+    0 0 0 1px rgba(25, 25, 25, 0.06),
+    0 4px 12px 0 var(--base-transparent-1, rgba(16, 24, 40, 0.01)),
+    0 2px 4px 0 rgba(25, 25, 25, 0.06);
   margin: 0;
-  padding: var(--spacing-3xs);
+  background: var(--color-base-0);
   list-style: none;
 }
 .Layer__hover-menu .Layer__hover-menu__list-wrapper .Layer__hover-menu__list .Layer__hover-menu__list-item {
+  display: flex;
+  align-items: center;
   padding: var(--spacing-3xs);
   padding-left: var(--spacing-xs);
   border-radius: var(--spacing-2xs);
   color: var(--color-base-500);
   transition: all 0.2s ease-in-out;
-  display: flex;
-  align-items: center;
 }
 .Layer__hover-menu .Layer__hover-menu__list-wrapper .Layer__hover-menu__list .Layer__hover-menu__list-item .Layer__hover-menu__list-item-button {
-  text-align: start;
-  background: none;
+  width: 100%;
   border: none;
   outline: none;
-  color: inherit;
+  background: none;
+  cursor: pointer;
   font-size: var(--text-sm);
+  line-height: normal;
   font-family: inherit;
-  font-feature-settings: inherit;
   font-weight: 500;
-  width: 100%;
-  line-height: normal;
+  text-align: start;
+  color: inherit;
+  font-feature-settings: inherit;
   letter-spacing: -0.06px;
-  cursor: pointer;
 }
 .Layer__hover-menu .Layer__hover-menu__list-wrapper .Layer__hover-menu__list .Layer__hover-menu__list-item:hover {
   background: var(--color-base-50);
-  color: var(--color-base-800);
   font-weight: 540;
+  color: var(--color-base-800);
 }
 .Layer__component {
   max-width: 1406px;
@@ -993,14 +998,14 @@
 }
 .Layer__datetime {
   display: inline-flex;
-  align-items: center;
   gap: var(--spacing-md);
+  align-items: center;
 }
 .Layer__DatePickerModeSelector__container {
   display: flex;
   justify-content: flex-end;
-  padding-inline: var(--spacing-xs);
   padding-block: var(--spacing-xs);
+  padding-inline: var(--spacing-xs);
 }
 .Layer__datepicker__wrapper,
 #Layer__datepicker__portal {
@@ -2975,13 +2980,13 @@
   padding: var(--spacing-xs) var(--spacing-md);
 }
 .Layer__file-thumb {
+  box-sizing: border-box;
+  position: relative;
   display: flex;
+  gap: var(--spacing-2xs);
   align-items: flex-start;
   justify-content: space-between;
   min-height: 38px;
-  gap: var(--spacing-2xs);
-  position: relative;
-  box-sizing: border-box;
   container-type: normal;
 }
 .Layer__file-thumb:not(.Layer__file-thumb--floating) {
@@ -2994,17 +2999,17 @@
     border-bottom: 1px solid var(--color-base-300);
   }
   .Layer__file-thumb:not(.Layer__file-thumb--floating) .Layer__file-thumb__actions:not(.Layer__file-thumb__actions--floating) {
-    padding-left: 0;
     padding-right: 0;
+    padding-left: 0;
     margin-left: -6px;
   }
   .Layer__file-thumb:not(.Layer__file-thumb--floating) .Layer__file-thumb__actions:not(.Layer__file-thumb__actions--floating) .Layer__icon-btn {
-    width: 26px;
     height: 26px;
+    width: 26px;
   }
   .Layer__file-thumb:not(.Layer__file-thumb--floating) .Layer__file-thumb__actions:not(.Layer__file-thumb__actions--floating) .Layer__icon-btn svg {
-    width: 14px;
     height: 14px;
+    width: 14px;
   }
 }
 .Layer__file-thumb__main {
@@ -3027,55 +3032,55 @@
   color: var(--color-danger);
 }
 .Layer__file-thumb__actions.Layer__file-thumb__actions--floating {
-  display: none;
   position: absolute;
   top: -20px;
   right: -10px;
-  background-color: var(--color-base-0);
+  display: none;
   border-radius: var(--border-radius-3xs);
-  box-shadow: 0px 1px 2px 0px var(--base-transparent-6), 0px 0px 0px 1px var(--color-base-300);
+  box-shadow: 0 1px 2px 0 var(--base-transparent-6), 0 0 0 1px var(--color-base-300);
+  background-color: var(--color-base-0);
   transform: scale(0.8);
 }
 .Layer__file-thumb:hover .Layer__file-thumb__actions--floating {
   display: flex;
 }
 .Layer__file-thumb__img {
-  width: 100%;
   height: 100%;
   height: 38px;
+  width: 100%;
   width: 38px;
   border-radius: var(--border-radius-3xs, 4px);
+  box-shadow: 0 1px 2px 0 var(--base-transparent-6), 0 0 0 1px var(--color-base-300);
   background: var(--color-base-300);
-  box-shadow: 0px 1px 2px 0px var(--base-transparent-6), 0px 0px 0px 1px var(--color-base-300);
 }
 .Layer__file-thumb__img img {
-  width: 100%;
   height: 100%;
+  width: 100%;
   object-fit: cover;
 }
 .Layer__file-thumb__details {
   display: flex;
   flex-direction: column;
-  align-items: flex-start;
   gap: var(--spacing-4xs);
-  font-size: var(--text-sm);
+  align-items: flex-start;
   justify-content: flex-start;
   padding: var(--spacing-4xs) var(--spacing-2xs);
+  font-size: var(--text-sm);
 }
 .Layer__file-thumb__details__date {
   color: var(--color-base-600);
 }
 .Layer__file-thumb__details__uploading {
   display: flex;
-  align-items: center;
   gap: var(--spacing-3xs);
+  align-items: center;
   color: var(--color-info-fg);
 }
 .Layer__file-thumb__details__error {
   color: var(--color-danger);
 }
 .Layer__file-thumb__details__name {
-  word-break: break-word;
+  overflow-wrap: break-word;
 }
 .Layer__header {
   display: flex;
@@ -3084,37 +3089,37 @@
 }
 .Layer__header--sticky {
   position: sticky;
+  z-index: 10;
   top: 0;
   background: rgba(255, 255, 255, 0.5);
   backdrop-filter: blur(6px);
-  z-index: 10;
 }
 .Layer__header--top-rounded {
   border-top-left-radius: var(--border-radius-sm);
   border-top-right-radius: var(--border-radius-sm);
 }
 .Layer__header__row {
+  box-sizing: border-box;
   display: flex;
-  width: 100%;
+  gap: var(--spacing-sm);
   align-items: center;
   justify-content: space-between;
-  gap: var(--spacing-sm);
-  border-bottom: 1px solid var(--border-color);
+  width: 100%;
   padding: 0 var(--spacing-md);
-  box-sizing: border-box;
+  border-bottom: 1px solid var(--border-color);
 }
 .Layer__header__row[data-direction=col] {
   flex-direction: column;
+  gap: var(--spacing-md);
   align-items: flex-start;
   padding-top: var(--spacing-md);
   padding-bottom: var(--spacing-md);
-  gap: var(--spacing-md);
 }
 .Layer__header__row[data-direction=col] .Layer__header__col {
-  padding-top: 0;
-  padding-bottom: 0;
   min-height: 36px;
   width: 100%;
+  padding-top: 0;
+  padding-bottom: 0;
 }
 @container (min-width: 1400px) {
   .Layer__header__row {
@@ -3122,15 +3127,15 @@
   }
 }
 .Layer__header__col {
+  box-sizing: border-box;
   display: flex;
-  align-items: center;
   gap: var(--spacing-sm);
+  align-items: center;
   min-height: 68px;
-  box-sizing: border-box;
 }
 .Layer__header__col[data-no-padding=true] {
-  padding-left: 0;
   padding-right: 0;
+  padding-left: 0;
 }
 ::placeholder {
   color: var(--input-placeholder-color);
@@ -3712,15 +3717,15 @@
     transform 500ms ease-out;
 }
 .Layer__onboarding__content {
+  box-sizing: border-box;
   display: flex;
   flex-direction: column;
   align-items: center;
   padding: var(--spacing-lg) var(--spacing-md) var(--spacing-3xl);
-  box-sizing: border-box;
 }
 .Layer__onboarding .Layer__actionable_row {
-  max-width: 90%;
   width: 640px;
+  max-width: 90%;
 }
 .Layer__table {
   width: 100%;
@@ -4082,34 +4087,34 @@ tbody .Layer__table__empty-row:first-child {
   border-bottom: 1px solid var(--border-color);
 }
 .Layer__heading {
-  color: var(--text-color-primary);
+  align-self: center;
+  margin: 0;
   font-size: var(--text-heading);
+  line-height: 140%;
   font-weight: var(--font-weight-bold);
+  color: var(--text-color-primary);
   font-variation-settings: "wght" var(--font-weight-bold);
-  line-height: 140%;
   letter-spacing: -0.12px;
-  margin: 0;
-  align-self: center;
 }
 .Layer__heading--secondary,
 .Layer__heading.Layer__heading--secondary {
-  color: var(--text-color-primary);
   font-size: var(--text-heading-sm);
   font-weight: var(--font-weight-bold);
+  color: var(--text-color-primary);
   font-variation-settings: "wght" var(--font-weight-bold);
 }
 .Layer__heading--view,
 .Layer__heading.Layer__heading--view {
-  color: var(--text-color-primary);
   font-size: var(--text-heading-view);
   font-weight: var(--font-weight-bold);
+  color: var(--text-color-primary);
   font-variation-settings: "wght" var(--font-weight-bold);
 }
 .Layer__heading--page,
 .Layer__heading.Layer__heading--page {
-  color: var(--text-color-primary);
   font-size: var(--text-heading-page);
   font-weight: var(--font-weight-bold);
+  color: var(--text-color-primary);
   font-variation-settings: "wght" var(--font-weight-bold);
 }
 .Layer__heading--left {
@@ -4122,6 +4127,8 @@ tbody .Layer__table__empty-row:first-child {
   align-self: flex-end;
 }
 .Layer__text {
+  margin: 0;
+  line-height: 140%;
   font-family: var(--font-family);
   font-weight: var(--font-weight-normal);
   font-variant-numeric: lining-nums proportional-nums;
@@ -4130,8 +4137,6 @@ tbody .Layer__table__empty-row:first-child {
     "cv05" on,
     "cv08" on,
     "ss03" on;
-  line-height: 140%;
-  margin: 0;
 }
 .Layer__text--sm {
   font-size: var(--text-sm);
@@ -4183,10 +4188,10 @@ tbody .Layer__table__empty-row:first-child {
   text-overflow: ellipsis;
 }
 .Layer__label {
-  color: var(--color-base-500);
+  overflow: hidden;
   font-weight: var(--font-weight-normal);
+  color: var(--color-base-500);
   white-space: nowrap;
-  overflow: hidden;
 }
 .Layer__justify--center {
   justify-content: center;
@@ -4335,8 +4340,8 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__view .Layer__view-header__title {
   display: flex;
   align-items: center;
-  width: 100%;
   min-height: 44px;
+  width: 100%;
   padding: var(--spacing-md) var(--spacing-sm);
 }
 .Layer__view .Layer__view-header__content {
@@ -4911,23 +4916,23 @@ tbody .Layer__table__empty-row:first-child {
   animation-iteration-count: infinite;
 }
 .Layer__Menu {
-  max-block-size: inherit;
-  min-inline-size: 9rem;
-  overflow: auto;
   display: flex;
   flex-direction: column;
   gap: var(--spacing-3xs);
+  overflow: auto;
+  max-block-size: inherit;
+  min-inline-size: 9rem;
   padding: var(--spacing-3xs);
-  border: 1px solid var(--border-color);
   border-radius: var(--spacing-xs);
-  background: white;
+  border: 1px solid var(--border-color);
   outline: none;
+  background: white;
 }
 .Layer__MenuItem {
   display: flex;
   align-items: center;
-  padding-inline: var(--spacing-xs);
   padding-block: var(--spacing-3xs);
+  padding-inline: var(--spacing-xs);
   border-radius: var(--spacing-2xs);
   outline: none;
   cursor: pointer;
@@ -5090,16 +5095,16 @@ tbody .Layer__table__empty-row:first-child {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
+  padding: var(--spacing-2xs) var(--spacing-sm);
+  border-radius: var(--badge-border-radius);
   border: none;
   outline: none;
+  background-color: var(--badge-bg-color);
   cursor: pointer;
+  user-select: none;
   font-size: var(--text-sm);
-  background-color: var(--badge-bg-color);
   color: var(--badge-color);
-  border-radius: var(--badge-border-radius);
-  padding: var(--spacing-2xs) var(--spacing-sm);
   white-space: nowrap;
-  user-select: none;
 }
 .Layer__Pill svg {
   margin-right: 0.25rem;
@@ -5609,12 +5614,21 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__UI__Heading[data-size=sm] {
   font-size: var(--text-heading-sm);
 }
-.Layer__UI__Heading[data-size=lg] {
+.Layer__UI__Heading[data-size=md] {
   font-size: var(--text-heading-secondary);
 }
-.Layer__UI__Heading[data-size=xl] {
+.Layer__UI__Heading[data-size=lg] {
   font-size: var(--text-heading);
 }
+.Layer__UI__Heading[data-size=xl] {
+  font-size: var(--text-heading-xl);
+}
+.Layer__UI__Heading[data-size="2xl"] {
+  font-size: var(--text-heading-2xl);
+}
+.Layer__UI__Heading[data-size="3xl"] {
+  font-size: var(--text-heading-3xl);
+}
 .Layer__UI__Heading[data-align=left] {
   text-align: left;
 }
@@ -5635,8 +5649,8 @@ tbody .Layer__table__empty-row:first-child {
   font-weight: var(--font-weight-bold);
 }
 .Layer__MoneyText {
-  color: var(--color-base-800);
   overflow-x: hidden;
+  color: var(--color-base-800);
   text-overflow: ellipsis;
 }
 .Layer__MoneyText[data-bold] {
@@ -5682,7 +5696,7 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__Label[data-variant=subtle],
 .Layer__P[data-variant=subtle],
 .Layer__Span[data-variant=subtle] {
-  color: var(--color-base-600);
+  color: var(--fg-subtle);
 }
 .Layer__Header[data-status=error],
 .Layer__Label[data-status=error],
@@ -5704,6 +5718,12 @@ tbody .Layer__table__empty-row:first-child {
   overflow: hidden;
   text-overflow: ellipsis;
 }
+.Layer__Header[data-size="2xs"],
+.Layer__Label[data-size="2xs"],
+.Layer__P[data-size="2xs"],
+.Layer__Span[data-size="2xs"] {
+  font-size: var(--text-2xs);
+}
 .Layer__Header[data-size=xs],
 .Layer__Label[data-size=xs],
 .Layer__P[data-size=xs],
@@ -5956,6 +5976,24 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__InvisibleDownload {
   display: none;
 }
+.Layer__call-booking {
+  padding: var(--spacing-lg);
+}
+.Layer__call-booking .Layer__call-booking-details {
+  width: 100%;
+}
+.Layer__call-booking .Layer__call-booking-actions {
+  width: 100%;
+  margin-top: var(--spacing-md);
+}
+.Layer__call-booking .Layer__call-booking-state {
+  text-align: center;
+}
+@media (width <= 480px) {
+  .Layer__call-booking {
+    padding: var(--spacing-md);
+  }
+}
 .Layer__custom-account-form .Layer__custom-account-form__field > .Layer__input-tooltip {
   display: flex;
   flex: 1 1;
@@ -6114,8 +6152,8 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__due-status--sm {
   flex-direction: row;
-  align-items: center;
   gap: var(--spacing-3xs);
+  align-items: center;
 }
 .Layer__due-status[data-status=overdue] .Layer__due-status__title {
   color: var(--color-info-error);
@@ -6135,8 +6173,8 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__BasicLinkedAccountContainer {
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto;
-  padding-inline: var(--spacing-xs) var(--spacing-md);
   padding-block: var(--spacing-xs);
+  padding-inline: var(--spacing-xs) var(--spacing-md);
   border-radius: var(--border-radius-xs);
   border: 1px solid var(--outline-subtle);
 }
@@ -6147,8 +6185,8 @@ tbody .Layer__table__empty-row:first-child {
   display: flex;
   align-items: center;
   justify-content: center;
-  width: 52px;
   height: 28px;
+  width: 52px;
   padding: var(--spacing-3xs) 0;
   border-radius: var(--border-radius-3xs);
   background: var(--color-base-0);
@@ -6753,8 +6791,8 @@ tbody .Layer__table__empty-row:first-child {
   }
 }
 .Layer__bills-list-item__separator {
-  width: 1px;
   height: 10px;
+  width: 1px;
   background-color: var(--color-base-400);
 }
 @container (max-width: 499px) {
@@ -6983,17 +7021,17 @@ tbody .Layer__table__empty-row:first-child {
   width: 100%;
 }
 .Layer__caobfb {
-  padding-inline: var(--spacing-md);
-  padding-block: var(--spacing-sm);
   position: relative;
   display: flex;
   gap: var(--spacing-sm);
+  max-height: 280px;
+  padding-block: var(--spacing-sm);
+  padding-inline: var(--spacing-md);
   border-radius: var(--border-radius-xs);
   border: 1px solid var(--color-base-100);
   container-type: inline-size;
   transition: all 0.25s ease-in-out;
   transition-delay: 0.8s;
-  max-height: 280px;
 }
 .Layer__caobfb[data-confirmed=true] {
   background-color: var(--color-base-50);
@@ -7005,10 +7043,10 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__caobfb__details-col {
   display: flex;
+  flex: 1;
   flex-direction: column;
   gap: var(--spacing-2xs);
   color: var(--color-base-700);
-  flex: 1;
 }
 .Layer__caobfb__details-col__details {
   padding-bottom: var(--spacing-sm);
@@ -7020,17 +7058,17 @@ tbody .Layer__table__empty-row:first-child {
   max-width: 500px;
 }
 .Layer__caobfb__details-col__name__institution-name {
-  color: var(--color-base-500);
+  overflow: hidden;
   max-width: 50%;
+  color: var(--color-base-500);
   text-overflow: ellipsis;
-  overflow: hidden;
   white-space: nowrap;
 }
 .Layer__caobfb__details-col__name__account-name {
-  color: var(--color-base-1000);
+  overflow: hidden;
   max-width: 50%;
+  color: var(--color-base-1000);
   text-overflow: ellipsis;
-  overflow: hidden;
   white-space: nowrap;
 }
 .Layer__caobfb__details-col__inputs {
@@ -7065,23 +7103,23 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__caobfb__success-banner {
   position: absolute;
-  inset: 0;
-  opacity: 0;
   z-index: -1;
+  inset: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   padding: var(--spacing-sm);
   background-color: var(--color-base-50);
-  transition: opacity 0.12s ease-in-out;
   color: var(--color-info-success-fg);
+  opacity: 0;
+  transition: opacity 0.12s ease-in-out;
 }
 .Layer__caobfb[data-saved] {
+  overflow: hidden;
   max-height: 0;
   padding: 0;
   border-width: 0;
-  overflow: hidden;
 }
 .Layer__caobfb[data-saved] .Layer__caobfb__success-banner {
   opacity: 1;
@@ -7490,9 +7528,9 @@ tbody .Layer__table__empty-row:first-child {
   align-items: center;
 }
 .Layer__progress-steps .Layer__progress-steps--step-wrapper {
+  position: relative;
   display: flex;
   align-items: flex-start;
-  position: relative;
   min-width: 50px;
 }
 .Layer__progress-steps .Layer__progress-steps--step-wrapper .Layer__progress-steps--step {
@@ -7525,61 +7563,61 @@ tbody .Layer__table__empty-row:first-child {
   position: relative;
 }
 .Layer__progress-steps .Layer__progress-steps--step-wrapper .Layer__progress-steps--step .Layer__progress-steps--label p::after {
-  content: "";
-  opacity: 0;
-  width: 100%;
-  height: 100%;
-  padding: 2px 8px;
-  background-color: var(--color-base-300);
   position: absolute;
-  border-radius: 30px;
+  z-index: -1;
   top: -2px;
   left: -8px;
+  height: 100%;
+  width: 100%;
+  padding: 2px 8px;
+  border-radius: 30px;
+  background-color: var(--color-base-300);
+  content: "";
+  opacity: 0;
   transition: all 200ms ease;
-  z-index: -1;
 }
 .Layer__progress-steps .Layer__progress-steps--step-wrapper .Layer__progress-steps--step .Layer__progress-steps--circle {
-  width: 12px;
-  height: 12px;
-  background-color: var(--color-base-50);
-  border: 1px var(--color-base-500);
-  border-style: dashed;
-  border-radius: 100%;
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
+  height: 12px;
+  width: 12px;
+  border-radius: 100%;
+  border: 1px var(--color-base-500);
+  background-color: var(--color-base-50);
+  border-style: dashed;
   transition: all 200ms ease;
 }
 .Layer__progress-steps .Layer__progress-steps--step-wrapper .Layer__progress-steps--step .Layer__progress-steps--circle::after {
+  position: absolute;
+  top: -1px;
+  left: -1px;
   display: block;
-  content: "";
-  width: 12px;
   height: 12px;
+  width: 12px;
+  border-radius: 100%;
   border: 1px var(--color-base-500);
+  content: "";
   border-style: dashed;
-  border-radius: 100%;
-  position: absolute;
-  top: -1px;
-  left: -1px;
   transition: all 200ms ease;
 }
 .Layer__progress-steps--step-line {
-  width: 100%;
-  height: 2px;
-  background-color: var(--color-base-300);
   position: absolute;
   top: 6px;
   display: flex;
   align-items: center;
   justify-content: flex-start;
+  height: 2px;
+  width: 100%;
+  background-color: var(--color-base-300);
 }
 .Layer__progress-steps--step-line::after {
-  content: "";
-  width: 0%;
+  position: absolute;
   height: 2px;
+  width: 0%;
   background-color: var(--color-base-800);
-  position: absolute;
+  content: "";
   transition: all 200ms ease;
 }
 .Layer__progress-steps--step[data-complete=true] .Layer__progress-steps--step-line::after {
@@ -7622,17 +7660,17 @@ tbody .Layer__table__empty-row:first-child {
   container-type: inline-size;
 }
 .Layer__platform-onboarding-layout {
-  position: relative;
   box-sizing: border-box;
+  position: relative;
   padding: var(--spacing-lg);
 }
 .Layer__platform-onboarding__back-button-container {
-  max-width: calc(672px + 2 * var(--spacing-xl));
-  margin: auto;
-  margin-bottom: var(--spacing-lg);
   position: absolute;
   top: var(--spacing-lg);
   left: var(--spacing-lg);
+  max-width: calc(672px + 2 * var(--spacing-xl));
+  margin: auto;
+  margin-bottom: var(--spacing-lg);
 }
 @container (width < 969px) {
   .Layer__platform-onboarding__back-button-container {
@@ -7640,16 +7678,16 @@ tbody .Layer__table__empty-row:first-child {
   }
 }
 .Layer__platfom-onboarding-layout__box {
-  padding: var(--spacing-xl);
-  max-width: 672px;
-  margin: auto;
   display: flex;
   flex-direction: column;
   gap: var(--spacing-lg);
+  max-width: 672px;
+  padding: var(--spacing-xl);
   border-radius: var(--border-radius-xs);
-  background: var(--color-base-0);
   box-shadow: 0 0 0 1px var(--base-transparent-4);
+  margin: auto;
   margin-bottom: var(--spacing-md);
+  background: var(--color-base-0);
 }
 @container (width < 500px) {
   .Layer__platfom-onboarding-layout__box {
@@ -7657,8 +7695,8 @@ tbody .Layer__table__empty-row:first-child {
   }
 }
 .Layer__platform-onboarding-layout__footer {
-  padding: var(--spacing-lg) 0;
   max-width: 1200px;
+  padding: var(--spacing-lg) 0;
   margin: auto;
 }
 @container (width < 500px) {
@@ -7676,13 +7714,13 @@ tbody .Layer__table__empty-row:first-child {
   margin-bottom: var(--spacing-lg);
 }
 .Layer__platform-onboarding__welcome-footer__content {
-  max-width: 672px;
-  margin: auto;
   display: flex;
   flex-direction: column;
-  align-items: flex-start;
   gap: var(--spacing-lg);
+  align-items: flex-start;
+  max-width: 672px;
   padding: 0 var(--spacing-xl);
+  margin: auto;
 }
 @container (width < 500px) {
   .Layer__platform-onboarding__welcome-footer__content {
@@ -7700,8 +7738,8 @@ tbody .Layer__table__empty-row:first-child {
   gap: var(--spacing-lg);
   align-items: flex-start;
   max-width: 1200px;
-  margin: auto;
   padding-top: var(--spacing-5xl);
+  margin: auto;
 }
 @container (width < 640px) {
   .Layer__platform-onboarding__welcome-footer__images {
@@ -7715,16 +7753,16 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__platform-onboarding__welcome-footer__images .Layer__platform-onboarding__welcome-footer__image .Layer__platform__onboarding__welcome-footer__image-wrapper {
   display: flex;
+  flex: 1 0 0;
   flex-direction: column;
-  align-items: center;
   gap: var(--spacing-2xl);
-  flex: 1 0 0;
+  align-items: center;
   border-radius: 12px;
   box-shadow: 0 0 0 1px var(--base-transparent-4, rgba(16, 24, 40, 0.04));
 }
 .Layer__platform-onboarding__welcome-footer__images .Layer__platform-onboarding__welcome-footer__image .Layer__platform__onboarding__welcome-footer__image-wrapper img {
-  width: 100%;
   height: 100%;
+  width: 100%;
   object-fit: contain;
 }
 .Layer__platform-onboarding__welcome-footer__images .Layer__platform-onboarding__welcome-footer__image .Layer__platform__onboarding__welcome-footer__image-text {
@@ -7733,14 +7771,14 @@ tbody .Layer__table__empty-row:first-child {
   gap: var(--spacing-xs);
   align-items: center;
   justify-content: center;
-  padding: 36px 0;
   max-width: 27ch;
+  padding: 36px 0;
   margin: auto;
   text-align: center;
 }
 .Layer__separator {
-  width: 100%;
   height: 1px;
+  width: 100%;
   background-color: var(--color-base-300);
 }
 .Layer__separator[data-mbe="3xs"] {
@@ -7887,41 +7925,41 @@ tbody .Layer__table__empty-row:first-child {
 @container (width < 460px) {
   .Layer__profit-and-loss-header__bookkeeping-status {
     position: static;
-    width: 260px;
     height: 18px;
+    width: 260px;
   }
   .Layer__profit-and-loss-header__bookkeeping-status .Layer__bookkeeping-status {
     white-space: normal;
   }
 }
 .Layer__bookkeeping-status {
-  white-space: nowrap;
   display: flex;
-  align-items: center;
   gap: var(--spacing-3xs);
+  align-items: center;
+  white-space: nowrap;
 }
 .Layer__bookkeeping-status .Layer__bookkeeping-status__icon-wrapper {
-  border-radius: 50%;
-  width: 16px;
-  height: 16px;
   display: flex;
   align-items: center;
   justify-content: center;
-  color: var(--color-info-fg);
-  background: var(--color-info-bg);
+  height: 16px;
+  width: 16px;
+  border-radius: 50%;
   margin-top: -1px;
+  background: var(--color-info-bg);
+  color: var(--color-info-fg);
 }
 .Layer__bookkeeping-status[data-status=warning] .Layer__bookkeeping-status__icon-wrapper {
-  color: var(--color-info-warning-fg);
   background: var(--color-info-warning-bg);
+  color: var(--color-info-warning-fg);
 }
 .Layer__bookkeeping-status[data-status=success] .Layer__bookkeeping-status__icon-wrapper {
-  color: var(--color-info-success-fg);
   background: var(--color-info-success-bg);
+  color: var(--color-info-success-fg);
 }
 .Layer__bookkeeping-status[data-status=error] .Layer__bookkeeping-status__icon-wrapper {
-  color: var(--color-info-error-fg);
   background: var(--color-info-error-bg);
+  color: var(--color-info-error-fg);
 }
 .Layer__tabs__container {
   overflow: auto hidden;
@@ -8020,17 +8058,17 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__mobile-panel {
   position: fixed;
+  z-index: -1;
   top: 0;
   left: 0;
-  width: 100dvw;
+  display: flex;
+  flex-direction: column;
   height: 100dvh;
+  width: 100dvw;
+  background-color: var(--color-base-50);
   opacity: 0;
   transition: opacity 180ms ease-out;
   filter: blur(6px);
-  display: flex;
-  flex-direction: column;
-  background-color: var(--color-base-50);
-  z-index: -1;
 }
 .Layer__mobile-panel[data-open] {
   z-index: var(--z-index-mobile-panel);
@@ -8041,11 +8079,11 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__mobile-panel__header {
   top: 0;
   display: flex;
+  gap: var(--spacing-lg);
   align-items: center;
   padding: var(--spacing-sm) var(--spacing-lg);
-  background-color: var(--color-base-0);
-  gap: var(--spacing-lg);
   border-bottom: 1px solid var(--color-base-100);
+  background-color: var(--color-base-0);
 }
 .Layer__mobile-panel__content {
   flex: 1;
@@ -8151,9 +8189,9 @@ tbody .Layer__table__empty-row:first-child {
   padding-top: var(--spacing-xl);
 }
 .Layer__JournalEntryForm .Layer__JournalEntryForm__Row {
-  padding: 0 var(--spacing-xl);
   display: flex;
   gap: var(--spacing-md);
+  padding: 0 var(--spacing-xl);
 }
 .Layer__JournalEntryForm .Layer__JournalEntryForm__Row > * {
   flex: 0 0 clamp(16rem, 100%, 24rem);
@@ -8178,8 +8216,8 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__JournalEntryForm__LineItem {
   display: flex;
-  align-items: flex-end;
   gap: var(--spacing-xs);
+  align-items: flex-end;
 }
 .Layer__JournalEntryForm__LineItem .Layer__JournalEntryForm__Field--accountName {
   flex: 1 1 12rem;
@@ -8199,11 +8237,11 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__JournalEntryForm__LineItem--readonly .Layer__JournalEntryForm__Field--removeButton {
   display: none;
 }
-@media (max-width: 768px) {
+@media (width <= 768px) {
   .Layer__JournalEntryForm__LineItem {
     flex-direction: column;
-    align-items: stretch;
     gap: var(--spacing-sm);
+    align-items: stretch;
   }
   .Layer__JournalEntryForm__LineItem .Layer__JournalEntryForm__Field {
     flex: 1 1 auto;
@@ -8264,8 +8302,8 @@ tbody .Layer__table__empty-row:first-child {
   box-sizing: border-box;
 }
 .Layer__ledger-account__index {
-  background-color: var(--color-base-0);
   width: 100%;
+  background-color: var(--color-base-0);
 }
 .Layer__ledger-account__panel {
   min-height: 800px;
@@ -8283,54 +8321,41 @@ tbody .Layer__table__empty-row:first-child {
   background: var(--color-base-0);
 }
 .Layer__ledger-account__entry-details__header {
-  background: var(--color-base-0);
   border-top-left-radius: var(--border-radius-sm);
   border-top-right-radius: var(--border-radius-sm);
+  background: var(--color-base-0);
 }
 .Layer__ledger-account__title-container {
   display: flex;
   flex-direction: column;
-  justify-content: flex-start;
   align-items: flex-start;
+  justify-content: flex-start;
   width: 100%;
 }
 .Layer__ledger-account__balance-container {
   display: flex;
-  align-items: center;
   gap: var(--spacing-xs);
+  align-items: center;
 }
 .Layer__ledger-account__balance-label {
   color: var(--color-base-600);
 }
-.Layer__ledger-account__entry-details__back-btn {
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-md);
-  padding-bottom: var(--spacing-md);
-}
 .Layer__ledger-account__entry-details__title-container > .Layer__text {
   font-size: 24px;
 }
 .Layer__ledger-account__entry-details__line-items {
   padding: var(--spacing-md);
 }
-.Layer__ledger-account__entry-details__back-btn {
-  display: none;
-  background: var(--color-base-0);
-  padding-top: var(--spacing-xl);
-  padding-left: var(--spacing-xl);
-  padding-right: var(--spacing-xl);
-}
 .Layer__ledger-account-table__tablet-main-col .Layer__table-cell-content {
   display: flex;
   flex-direction: column;
-  align-items: flex-start;
   gap: var(--spacing-xs);
+  align-items: flex-start;
 }
 .Layer__ledger-account-table__tablet-main-col .Layer__ledger-account-table__tablet-main-col__date {
   display: flex;
-  align-items: center;
   gap: var(--spacing-xs);
+  align-items: center;
 }
 .Layer__ledger_account-table__journal-id {
   color: var(--color-base-800);
@@ -8338,14 +8363,14 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__ledger_account-table__balances-mobile {
   display: flex;
   flex-direction: column;
-  width: 100%;
   gap: var(--spacing-xs);
+  width: 100%;
 }
 .Layer__ledger_account-table__balance-item {
   display: flex;
-  width: 100%;
   align-items: center;
   justify-content: space-between;
+  width: 100%;
 }
 .Layer__ledger_account-table__balance-item .Layer__ledger_account-table__balances-mobile__value {
   font-weight: var(--font-weight-bold);
@@ -8355,14 +8380,11 @@ tbody .Layer__table__empty-row:first-child {
   .Layer__ledger-account__panel .Layer__panel__sidebar .Layer__panel__sidebar-content {
     width: 100%;
   }
-  .Layer__ledger-account__entry-details__back-btn {
-    display: flex;
-  }
 }
 @container (min-width: 500px) and (max-width: 1024px) {
   .Layer__ledger-account__panel .Layer__details-list .Layer__component-header {
-    padding-left: var(--spacing-xl);
     padding-right: var(--spacing-xl);
+    padding-left: var(--spacing-xl);
   }
 }
 @container (max-width: 499px) {
@@ -8374,21 +8396,17 @@ tbody .Layer__table__empty-row:first-child {
     padding: 0 var(--spacing-xs);
   }
   .Layer__ledger-account__entry-details__line-items {
-    padding-left: 0;
-    padding-right: 0;
     padding-top: 0;
+    padding-right: 0;
+    padding-left: 0;
   }
   .Layer__ledger-account__entry-details__line-items .Layer__card {
-    box-shadow: none;
     border-radius: 0;
+    box-shadow: none;
   }
   .Layer__ledger-account__panel .Layer__panel__sidebar {
     background: var(--color-base-0);
   }
-  .Layer__ledger-account__entry-details__back-btn {
-    padding-left: var(--spacing-md);
-    padding-right: var(--spacing-md);
-  }
 }
 .Layer__ledger-account__entry-details__table .Layer__table-row.Layer__table-row--variant-default,
 .Layer__ledger-account__entry-details__table .Layer__table-row.Layer__table-row--variant-summation {
@@ -8402,8 +8420,8 @@ tbody .Layer__table__empty-row:first-child {
   .Layer__ledger-account__entry-details__table tr td:last-child .Layer__table-cell-content,
   .Layer__ledger-account__entry-details__table tr th:first-child.Layer__table-header,
   .Layer__ledger-account__entry-details__table tr th:last-child.Layer__table-header {
-    padding-left: var(--spacing-lg);
     padding-right: var(--spacing-lg);
+    padding-left: var(--spacing-lg);
   }
 }
 @container (max-width: 1023px) and (min-width: 700px) {
@@ -8657,6 +8675,7 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__bank-transaction-row .Layer__table-cell {
   background-color: var(--table-bg);
+  color: var(--text-color-primary);
   transition: background-color var(--transition-speed) ease-out;
 }
 .Layer__bank-transaction-row .Layer__table-cell-content {
@@ -8866,15 +8885,11 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__bank-transaction-row__table-cell--amount-debit,
 .Layer__bank-transaction-list-item__amount-debit {
   justify-content: flex-end;
-  color: var(--text-color-primary);
 }
 .Layer__bank-transaction-row__table-cell--amount-debit .Layer__table-cell-content,
 .Layer__bank-transaction-list-item__amount-debit .Layer__table-cell-content {
   justify-content: flex-end;
 }
-.Layer__bank-transaction-list-item__amount-debit {
-  color: var(--text-color-primary);
-}
 .Layer__expanded-bank-transaction-row__description {
   padding: 0 var(--spacing-md);
 }
@@ -9127,9 +9142,6 @@ tbody .Layer__table__empty-row:first-child {
   box-sizing: border-box;
   color: var(--color-base-1000);
 }
-.Layer__bank-transactions__tx-text {
-  max-width: 32ch;
-}
 .Layer__bank-transactions__account-col {
   box-sizing: border-box;
   width: 30ch;
@@ -9167,16 +9179,6 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__bank-transaction-row:not(.Layer__bank-transaction-row--expanded) .Layer__bank-transactions__tx-col {
   text-overflow: ellipsis;
 }
-.Layer__bank-transaction-row:not(.Layer__bank-transaction-row--expanded) .Layer__bank-transactions__account-col .Layer__table-cell-content .Layer__bank-transactions__account-text,
-.Layer__bank-transaction-row:not(.Layer__bank-transaction-row--expanded) .Layer__bank-transactions__account-col .Layer__table-cell-content .Layer__bank-transactions__tx-text,
-.Layer__bank-transaction-row:not(.Layer__bank-transaction-row--expanded) .Layer__bank-transactions__tx-col .Layer__table-cell-content .Layer__bank-transactions__account-text,
-.Layer__bank-transaction-row:not(.Layer__bank-transaction-row--expanded) .Layer__bank-transactions__tx-col .Layer__table-cell-content .Layer__bank-transactions__tx-text {
-  box-sizing: border-box;
-  display: block;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
 .Layer__bank-transaction-row.Layer__bank-transaction-row--expanded td {
   vertical-align: top;
 }
@@ -9225,9 +9227,6 @@ tbody .Layer__table__empty-row:first-child {
     box-shadow: none;
   }
 }
-.Layer__tooltip.Layer__bank-transactions__tx-tooltip {
-  max-width: 250px;
-}
 .Layer__bank-transaction-list-item__match-tooltip,
 .Layer__expanded-bank-transaction-row__match-tooltip,
 .Layer__bank-transaction-row__match-tooltip {
@@ -10227,9 +10226,9 @@ tbody .Layer__table__empty-row:first-child {
   }
 }
 .Layer__component-container.Layer__journal {
+  position: relative;
   display: flex;
   align-items: stretch;
-  position: relative;
   overflow: auto;
 }
 .Layer__component-container.Layer__journal .Layer__table-state-container {
@@ -10251,8 +10250,8 @@ tbody .Layer__table__empty-row:first-child {
   max-width: 100%;
 }
 .Layer__journal__table-container {
-  max-width: 100%;
   overflow: auto;
+  max-width: 100%;
 }
 .Layer__journal__arrow .Layer__table-cell-content {
   padding-right: 0 !important;
@@ -10273,8 +10272,8 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__journal__actions {
   display: flex;
-  align-items: center;
   gap: var(--spacing-sm);
+  align-items: center;
 }
 .Layer__table-cell.Layer__journal__arrow,
 .Layer__table-cell.Layer__journal__balance {
@@ -10297,19 +10296,19 @@ tbody .Layer__table__empty-row:first-child {
   font-weight: var(--font-weight-bold);
 }
 .Layer__journal__balance {
-  text-align: right;
   justify-content: flex-end;
+  text-align: right;
 }
 .Layer__table-cell.Layer__journal__actions {
   width: 160px;
 }
 .Layer__table-cell.Layer__journal__actions .Layer__table-cell-content {
   display: flex;
-  justify-content: flex-end;
+  gap: var(--spacing-xs);
   align-items: center;
+  justify-content: flex-end;
   padding-top: var(--spacing-3xs);
   padding-bottom: var(--spacing-3xs);
-  gap: var(--spacing-xs);
 }
 .Layer__table-cell.Layer__journal__actions .Layer__table-cell-content > .Layer__btn {
   opacity: 0;
@@ -10318,12 +10317,12 @@ tbody .Layer__table__empty-row:first-child {
   transform: scale(0.92);
 }
 .Layer__table-cell.Layer__journal__actions .Layer__btn--icon-only {
-  width: 32px;
+  box-sizing: border-box;
   height: 32px;
   min-height: 32px;
   max-height: 32px;
+  width: 32px;
   padding: 0;
-  box-sizing: border-box;
 }
 .Layer__journal-line__table-row {
   background-color: var(--color-base-50);
@@ -10352,11 +10351,11 @@ tbody .Layer__table__empty-row:first-child {
   margin: auto;
 }
 .Layer__journal__form-edit-entry {
-  padding: var(--spacing-md) var(--spacing-xl);
   display: flex;
+  gap: var(--spacing-md);
   align-items: center;
   justify-content: space-between;
-  gap: var(--spacing-md);
+  padding: var(--spacing-md) var(--spacing-xl);
 }
 .Layer__journal__form-edit-entry .Layer__text {
   margin: 0;
@@ -10397,12 +10396,12 @@ tbody .Layer__table__empty-row:first-child {
     width: 64px;
   }
   .Layer__journal__row---mobile {
-    visibility: visible;
     display: table-row;
+    visibility: visible;
   }
   .Layer__journal__row---desktop {
-    visibility: hidden;
     display: none;
+    visibility: hidden;
   }
   .Layer__journal__form-row {
     flex-direction: column;
@@ -10415,29 +10414,25 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__journal__entry-details__title .Layer__component-header {
   padding-bottom: var(--spacing-3xs);
 }
-.Layer__journal__entry-details__title .Layer__journal__entry-details__back-btn {
-  display: flex;
-  background: var(--color-base-0);
-}
 .Layer__journal__form__input-group__line-item {
   display: flex;
   flex-direction: column;
-  padding: var(--spacing-md) 0;
   gap: var(--spacing-2xs);
+  padding: var(--spacing-md) 0;
 }
 .Layer__journal__form__input-group__line-item:not(:first-of-type) {
   border-top: 1px solid var(--color-base-300);
 }
 .Layer__remove__button {
-  box-shadow: 0 0 0 1px var(--input-border-color), 0 0 0 2px rgba(0, 0, 0, 0);
   padding: 8px;
+  box-shadow: 0 0 0 1px var(--input-border-color), 0 0 0 2px rgba(0, 0, 0, 0);
   margin-left: 8px;
 }
 .Layer__journal__form__input-group {
   display: flex;
   flex-direction: column;
-  padding: var(--spacing-xl);
   gap: var(--spacing-3xs);
+  padding: var(--spacing-xl);
 }
 .Layer__journal__form__input-group__textarea {
   background: var(--color-base-50);
@@ -10450,9 +10445,9 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__journal__form__input-group .Layer__input-group .Layer__journal__datepicker__wrapper {
   display: flex;
+  gap: var(--spacing-xs);
   align-items: center;
   justify-content: flex-end;
-  gap: var(--spacing-xs);
 }
 .Layer__journal__form__input-group .Layer__input-label {
   padding: 0;
@@ -10464,10 +10459,10 @@ tbody .Layer__table__empty-row:first-child {
   display: flex;
 }
 .Layer__journal__form__error-message {
-  padding: var(--spacing-4xs) var(--spacing-xl);
+  box-sizing: border-box;
   width: 100%;
+  padding: var(--spacing-4xs) var(--spacing-xl);
   text-align: right;
-  box-sizing: border-box;
   color: var(--color-danger);
 }
 .Layer__journal__add-entry-line {
@@ -10500,15 +10495,15 @@ tbody .Layer__table__empty-row:first-child {
   .Layer__journal__panel .Layer__panel__sidebar .Layer__panel__sidebar-content .Layer__form .Layer__input-group,
   .Layer__journal__panel .Layer__panel__sidebar .Layer__panel__sidebar-content .Layer__form .Layer__journal__form__input-group__title,
   .Layer__journal__panel .Layer__panel__sidebar .Layer__panel__sidebar-content .Layer__form .Layer__journal__add-entry-line {
-    max-width: 600px;
     width: 100%;
+    max-width: 600px;
     margin: auto;
   }
   .Layer__journal__panel .Layer__panel__sidebar .Layer__panel__sidebar-content .Layer__form .Layer__header__col {
     width: 100%;
-    margin: auto;
-    padding: var(--spacing-md) var(--spacing-xl);
     max-width: calc(600px + var(--spacing-xl) * 2);
+    padding: var(--spacing-md) var(--spacing-xl);
+    margin: auto;
   }
   .Layer__journal__panel .Layer__panel__sidebar .Layer__panel__sidebar-content .Layer__journal__bottom-actions {
     max-width: 600px;
@@ -10517,9 +10512,6 @@ tbody .Layer__table__empty-row:first-child {
   .Layer__journal .Layer__journal__sidebar__header .actions {
     display: none;
   }
-  .Layer__journal .Layer__journal__sidebar__header .actions {
-    display: none;
-  }
   .Layer__journal .Layer__journal__bottom-actions {
     display: flex;
   }
@@ -10535,8 +10527,8 @@ tbody .Layer__table__empty-row:first-child {
 }
 @container (min-width: 500px) and (max-width: 1024px) {
   .Layer__journal__panel .Layer__details-list .Layer__component-header {
-    padding-left: var(--spacing-xl);
     padding-right: var(--spacing-xl);
+    padding-left: var(--spacing-xl);
   }
 }
 @container (max-width: 499px) {
@@ -10548,21 +10540,17 @@ tbody .Layer__table__empty-row:first-child {
     padding: 0 var(--spacing-xs);
   }
   .Layer__journal__entry-details__line-items {
-    padding-left: 0;
-    padding-right: 0;
     padding-top: 0;
+    padding-right: 0;
+    padding-left: 0;
   }
   .Layer__journal__entry-details__line-items .Layer__card {
-    box-shadow: none;
     border-radius: 0;
+    box-shadow: none;
   }
   .Layer__journal__panel .Layer__panel__sidebar {
     background: var(--color-base-0);
   }
-  .Layer__journal__entry-details__back-btn {
-    padding-left: var(--spacing-md);
-    padding-right: var(--spacing-md);
-  }
   .Layer__input-group.Layer__input-group--inline {
     flex-direction: column;
     gap: var(--spacing-2xs);
@@ -10689,14 +10677,14 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__linked-accounts__header {
   position: sticky;
   left: 0;
-  padding: var(--spacing-md);
+  padding: var(--spacing-lg);
 }
 .Layer__linked-accounts__list {
   display: flex;
   flex-wrap: wrap;
   gap: var(--spacing-md);
   align-items: stretch;
-  padding: var(--spacing-md);
+  padding: var(--spacing-lg);
 }
 @media screen and (width <= 650px) {
   .Layer__linked-accounts__list {
@@ -10711,12 +10699,6 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__linked-accounts__loader-container {
   min-height: 120px;
 }
-.Layer__linked-accounts__header {
-  padding: var(--spacing-lg);
-}
-.Layer__linked-accounts__list {
-  padding: var(--spacing-lg);
-}
 .Layer__linked-accounts__new-account {
   box-sizing: border-box;
   display: flex;
@@ -10815,8 +10797,8 @@ tbody .Layer__table__empty-row:first-child {
   padding: var(--spacing-xs);
   border-top-left-radius: var(--border-radius-xs);
   border-top-right-radius: var(--border-radius-xs);
-  border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
   background: var(--color-base-50);
   color: var(--text-color-primary);
 }
@@ -10867,8 +10849,8 @@ tbody .Layer__table__empty-row:first-child {
   padding: 0 var(--spacing-xs);
   border-top-left-radius: 0;
   border-top-right-radius: 0;
-  border-bottom-right-radius: var(--border-radius-xs);
   border-bottom-left-radius: var(--border-radius-xs);
+  border-bottom-right-radius: var(--border-radius-xs);
   background: var(--color-base-50);
 }
 .Layer__linked-account-thumb .middlebar .account-balance-text {
@@ -10881,8 +10863,8 @@ tbody .Layer__table__empty-row:first-child {
   gap: var(--spacing-xs);
   align-items: center;
   padding: var(--spacing-xs);
-  border-bottom-right-radius: var(--border-radius-xs);
   border-bottom-left-radius: var(--border-radius-xs);
+  border-bottom-right-radius: var(--border-radius-xs);
 }
 .Layer__linked-account-thumb .loadingbar .loading-text {
   flex: 1;
@@ -10917,8 +10899,8 @@ tbody .Layer__table__empty-row:first-child {
   gap: var(--spacing-2xs);
 }
 .Layer__linked-account-thumb.--as-widget .topbar {
-  border-bottom-right-radius: var(--border-radius-xs);
   border-bottom-left-radius: var(--border-radius-xs);
+  border-bottom-right-radius: var(--border-radius-xs);
 }
 .Layer__linked-account-thumb.--as-widget .account-number {
   display: flex;
@@ -11232,13 +11214,13 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__ProfitAndLossSummariesListItem {
   all: unset;
   display: grid;
-  background: var(--color-base-0);
-  border-radius: var(--border-radius-xs);
-  box-shadow: 0px 0px 0px 1px var(--color-base-300);
   padding: var(--spacing-4xs);
+  border-radius: var(--border-radius-xs);
+  box-shadow: 0 0 0 1px var(--color-base-300);
+  background: var(--color-base-0);
 }
 .Layer__ProfitAndLossSummariesListItem[data-active] {
-  box-shadow: 0px 0px 0px 1px var(--color-base-200);
+  box-shadow: 0 0 0 1px var(--color-base-200);
   background: var(--color-base-50);
 }
 .Layer__ProfitAndLossSummariesListItem[data-clickable] {
@@ -11250,14 +11232,14 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__ProfitAndLossSummariesList {
   all: unset;
   display: grid;
-  gap: var(--spacing-sm);
   grid-auto-rows: minmax(0, 1fr);
+  gap: var(--spacing-sm);
 }
 @container (min-width: 48rem) {
   .Layer__ProfitAndLossSummariesList {
     --column-count: 3;
-    gap: var(--spacing-md);
     grid-template-columns: repeat(var(--column-count), minmax(0, 1fr));
+    gap: var(--spacing-md);
   }
   .Layer__ProfitAndLossSummariesList[data-column-count="4"] {
     --column-count: 4;
@@ -11265,14 +11247,14 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__ProfitAndLossSummariesSummary {
   display: grid;
-  min-block-size: 3rem;
+  grid-template-areas: "chart heading" "chart amount";
   grid-template-columns: auto minmax(0, 1fr);
   gap: var(--spacing-3xs) var(--spacing-xs);
-  grid-template-areas: "chart heading" "chart amount";
+  min-block-size: 3rem;
 }
 .Layer__ProfitAndLossSummariesSummary[data-size=lg] {
-  min-block-size: 6rem;
   column-gap: var(--spacing-md);
+  min-block-size: 6rem;
 }
 .Layer__ProfitAndLossSummariesSummary [slot=heading] {
   grid-area: heading;
@@ -12020,28 +12002,201 @@ header.Layer__profit-and-loss-detailed-charts__header--tablet {
 .Layer__project-view .Layer__select__menu {
   z-index: 2;
 }
+.Layer__service-offering {
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md);
+  justify-content: flex-start;
+  height: 100%;
+  width: 100%;
+  border-radius: var(--border-radius-sm);
+  border: none;
+  background: var(--color-white);
+}
+.Layer__service-offering__calendly-container {
+  overflow: hidden;
+  max-height: 0;
+  margin: 0;
+  transition: max-height 0.6s cubic-bezier(0.4, 0, 0.2, 1);
+}
+.Layer__service-offering__calendly-container.visible {
+  max-height: 800px;
+  margin: var(--spacing-lg) 0;
+}
+.Layer__service-offering__calendly-container .calendly-inline-widget {
+  min-height: 630px;
+  width: 100%;
+  margin-bottom: var(--spacing-lg);
+  transition: opacity 0.3s ease-in-out 0.8s;
+}
+.Layer__feature-card {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md);
+  width: 33%;
+  margin: auto 0;
+  text-align: center;
+}
+.Layer__feature-card .img-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 320px;
+  width: auto;
+}
+@media (width <= 768px) {
+  .Layer__feature-card .img-container {
+    height: 100%;
+    max-width: max(80%, 240px);
+    margin: var(--spacing-xl) auto;
+  }
+}
+@media (width <= 1024px) {
+  .Layer__feature-card .img-container {
+    margin: var(--spacing-md) auto;
+  }
+}
+.Layer__feature-card .img-container img {
+  height: 100%;
+  width: auto;
+  max-width: 100%;
+  margin: 0 auto;
+  filter: drop-shadow(0 12px 16px rgba(0, 0, 0, 0.2));
+}
+.Layer__service-offering-options {
+  max-width: 1200px;
+  padding: var(--spacing-xl) var(--spacing-lg);
+  margin: 0 auto;
+}
+.Layer__service-offering-options__grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--spacing-md);
+  justify-items: center;
+  width: fit-content;
+  margin: 0 auto;
+}
+@media (width <= 720px) {
+  .Layer__service-offering-options__grid {
+    grid-template-columns: 1fr;
+  }
+}
+.Layer__service-offering-options__card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+  max-width: 420px;
+  padding: var(--spacing-md);
+  border-radius: 16px;
+  border: none;
+  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+  margin: 0;
+  background: white;
+}
+.Layer__service-offering__content {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xl);
+}
+.Layer__service-offering__offers {
+  flex-shrink: 0;
+  min-width: 0;
+  background-color: transparent;
+}
+@media (width <= 1440px) {
+  .Layer__service-offering__offers {
+    padding: 0 var(--spacing-lg);
+  }
+}
+.Layer__service-offering__responsive-layout {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+}
+@media (width <= 1440px) {
+  .Layer__service-offering__responsive-layout {
+    flex-direction: column;
+    gap: var(--spacing-xl);
+  }
+}
+.Layer__service-offering__responsive-content {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-2xl);
+  padding: var(--spacing-3xl);
+  padding-bottom: var(--spacing-3xl);
+}
+@media (width <= 1440px) {
+  .Layer__service-offering__responsive-content {
+    padding: var(--spacing-xl);
+  }
+}
+.Layer__service-offering__responsive-image {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+@media (width <= 1440px) {
+  .Layer__service-offering__responsive-image {
+    margin-top: var(--spacing-lg);
+  }
+}
+.Layer__service-offering__responsive-image img {
+  height: auto;
+  max-width: 100%;
+}
+.Layer__service-offering__value-props-responsive {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: var(--spacing-5xl);
+  justify-items: center;
+}
+@media (width <= 1440px) {
+  .Layer__service-offering__value-props-responsive {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+@media (width <= 768px) {
+  .Layer__service-offering__value-props-responsive {
+    grid-template-columns: 1fr;
+    gap: var(--spacing-xl);
+  }
+}
+.Layer__mobile-feature-section {
+  box-sizing: border-box;
+  gap: var(--spacing-xl);
+  width: 100%;
+  padding: 0 var(--spacing-md);
+}
+.Layer__mobile-feature-section .Layer__feature-card {
+  width: 100%;
+  max-width: 100%;
+  margin: 0 auto;
+}
 .Layer__tooltip {
   box-sizing: border-box;
+  z-index: 100;
   width: max-content;
   max-width: calc(100vw - 10px);
-  z-index: 100;
 }
 .Layer__tooltip[data-width=md] {
   max-width: 256px;
 }
 .Layer__tooltip .Layer__tooltip-content {
-  background: var(--color-base-1000);
-  color: var(--color-base-300);
+  box-sizing: border-box;
   padding: var(--spacing-2xs) var(--spacing-sm);
   border-radius: var(--border-radius-2xs);
-  box-sizing: border-box;
+  background: var(--color-base-1000);
   font-size: var(--text-sm);
+  color: var(--color-base-300);
 }
 .Layer__tooltip-trigger {
   display: flex;
   flex: 1;
-  padding-top: 2px;
   max-width: 100%;
+  padding-top: 2px;
 }
 .Layer__actionable-list__tooltip-content {
   z-index: 99999;
@@ -12051,36 +12206,36 @@ header.Layer__profit-and-loss-detailed-charts__header--tablet {
   align-items: flex-start;
 }
 .Layer__actionable-list__tooltip-content .Layer__tooltip-content {
-  margin-right: auto;
   max-width: 220px;
-  border-radius: var(--border-radius-3xs);
   padding: var(--spacing-2xs) var(--spacing-sm);
+  border-radius: var(--border-radius-3xs);
+  margin-right: auto;
   background-color: var(--color-base-800);
   color: var(--color-base-0);
 }
 .Layer__toasts-container {
   position: fixed;
-  bottom: 20px;
+  z-index: 1000;
   right: 20px;
+  bottom: 20px;
   display: flex;
   flex-direction: column-reverse;
   gap: 10px;
-  z-index: 1000;
 }
 .Layer__toasts-container .Layer__toast {
-  color: var(--color-base-0);
-  background: var(--color-base-1000);
-  border-radius: var(--spacing-3xs);
   padding: var(--spacing-xs) var(--spacing-md);
-  opacity: 0;
-  transform: translateY(20px);
-  transition: opacity 0.6s linear, transform 0.6s linear;
+  border-radius: var(--spacing-3xs);
   box-shadow:
     0 4px 4px 0 var(--base-transparent-5, rgba(16, 24, 40, 0.05)),
     0 3px 3px 0 var(--base-transparent-6, rgba(16, 24, 40, 0.06)),
     0 2px 2px 0 var(--base-transparent-8, rgba(16, 24, 40, 0.08)),
     0 1px 0 0 var(--base-transparent-12, rgba(16, 24, 40, 0.12)),
     0 0 0 1px var(--base-900, #05132f);
+  background: var(--color-base-1000);
+  color: var(--color-base-0);
+  opacity: 0;
+  transform: translateY(20px);
+  transition: opacity 0.6s linear, transform 0.6s linear;
 }
 .Layer__toasts-container .Layer__toast p {
   margin: 0;
@@ -12088,12 +12243,12 @@ header.Layer__profit-and-loss-detailed-charts__header--tablet {
   color: var(--color-base-0);
 }
 .Layer__toasts-container .Layer__toast.Layer__toast--success {
-  background: var(--color-info-success);
   box-shadow: 0 0 0 1px var(--color-info-success);
+  background: var(--color-info-success);
 }
 .Layer__toasts-container .Layer__toast.Layer__toast--error {
-  background: var(--color-info-error);
   box-shadow: 0 0 0 1px var(--color-info-error);
+  background: var(--color-info-error);
 }
 .Layer__toast.enter {
   opacity: 1;
@@ -12112,9 +12267,9 @@ header.Layer__profit-and-loss-detailed-charts__header--tablet {
 }
 .Layer__TransactionsToReview {
   display: flex;
+  gap: var(--spacing-xs);
   align-items: center;
   justify-content: space-between;
-  gap: var(--spacing-xs);
   padding: var(--spacing-2xs) var(--spacing-xs);
 }
 .Layer__accounting-overview-profit-and-loss-charts {
@@ -12145,8 +12300,8 @@ header.Layer__profit-and-loss-detailed-charts__header--tablet {
   }
 }
 .Layer__accounting-overview-profit-and-loss-chart {
-  width: 100%;
   box-sizing: border-box;
+  width: 100%;
 }
 @container (max-width: 460px) {
   .Layer__component.Layer__accounting-overview-profit-and-loss .recharts-responsive-container {
@@ -12216,7 +12371,7 @@ header.Layer__profit-and-loss-detailed-charts__header--tablet {
 }
 @container (min-width: 1024px) {
   .Layer__reports .Layer__panel__content {
-    border-bottom-right-radius: 0;
     border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
   }
 }