@a4ui/core 0.38.0 → 0.39.0

package/dist/elements.css

@@ -135,11 +135,22 @@ body {
   animation: modal-content-out 0.15s ease-in;
 }
 
+/* Reading direction as a number, so horizontal slide offsets can mirror:
+   `translateX(calc(16px * var(--dir-x)))`. Inherited, so any element (including
+   portaled overlays, which get their own `dir`) sees the nearest `dir`. */
+:root,
+[dir='ltr'] {
+  --dir-x: 1;
+}
+[dir='rtl'] {
+  --dir-x: -1;
+}
+
 /* Toast — same animationend-only presence mechanism as Dialog. */
 @keyframes toast-in {
   from {
     opacity: 0;
-    transform: translateX(16px);
+    transform: translateX(calc(16px * var(--dir-x, 1)));
   }
   to {
     opacity: 1;
@@ -153,7 +164,7 @@ body {
   }
   to {
     opacity: 0;
-    transform: translateX(16px);
+    transform: translateX(calc(16px * var(--dir-x, 1)));
   }
 }
 .toast-item[data-opened] {
@@ -168,7 +179,7 @@ body {
    on every theme; the sweep is a pure CSS animation (no engine). */
 @keyframes skeleton-shimmer {
   100% {
-    transform: translateX(100%);
+    transform: translateX(calc(100% * var(--dir-x, 1)));
   }
 }
 .skeleton-shimmer {
@@ -179,8 +190,13 @@ body {
   content: '';
   position: absolute;
   inset: 0;
-  transform: translateX(-100%);
-  background: linear-gradient(90deg, transparent, hsl(var(--foreground) / 0.08), transparent);
+  transform: translateX(calc(-100% * var(--dir-x, 1)));
+  background: linear-gradient(
+    calc(90deg * var(--dir-x, 1)),
+    transparent,
+    hsl(var(--foreground) / 0.08),
+    transparent
+  );
   animation: skeleton-shimmer 1.5s ease-in-out infinite;
 }
 
@@ -299,7 +315,7 @@ body {
 @keyframes questionnaire-step-in {
   from {
     opacity: 0;
-    transform: translateX(16px);
+    transform: translateX(calc(16px * var(--dir-x, 1)));
   }
   to {
     opacity: 1;
@@ -309,7 +325,7 @@ body {
 @keyframes questionnaire-step-in-back {
   from {
     opacity: 0;
-    transform: translateX(-16px);
+    transform: translateX(calc(-16px * var(--dir-x, 1)));
   }
   to {
     opacity: 1;
@@ -343,7 +359,7 @@ body {
 @keyframes navmenu-from-start {
   from {
     opacity: 0;
-    transform: translateX(-2.5rem);
+    transform: translateX(calc(-2.5rem * var(--dir-x, 1)));
   }
   to {
     opacity: 1;
@@ -353,7 +369,7 @@ body {
 @keyframes navmenu-from-end {
   from {
     opacity: 0;
-    transform: translateX(2.5rem);
+    transform: translateX(calc(2.5rem * var(--dir-x, 1)));
   }
   to {
     opacity: 1;
@@ -368,7 +384,7 @@ body {
   to {
     opacity: 0;
     visibility: hidden;
-    transform: translateX(-2.5rem);
+    transform: translateX(calc(-2.5rem * var(--dir-x, 1)));
   }
 }
 @keyframes navmenu-to-end {
@@ -379,7 +395,7 @@ body {
   to {
     opacity: 0;
     visibility: hidden;
-    transform: translateX(2.5rem);
+    transform: translateX(calc(2.5rem * var(--dir-x, 1)));
   }
 }
 .navmenu-viewport[data-expanded] {
@@ -1471,8 +1487,8 @@ video {
 .\!card {
   position: relative !important;
   background: hsl(var(--card) / 0.55) !important;
-  backdrop-filter: blur(8px) saturate(150%) !important;
   -webkit-backdrop-filter: blur(8px) saturate(150%) !important;
+  backdrop-filter: blur(8px) saturate(150%) !important;
   border: 1px solid hsl(var(--foreground) / 0.16) !important;
   border-radius: var(--radius-xl, 1rem) !important;
   box-shadow: 0 1px 2px hsl(var(--shadow) / 0.05), 0 4px 12px hsl(var(--shadow) / 0.1) !important;
@@ -1481,8 +1497,8 @@ video {
 .card {
   position: relative;
   background: hsl(var(--card) / 0.55);
-  backdrop-filter: blur(8px) saturate(150%);
   -webkit-backdrop-filter: blur(8px) saturate(150%);
+  backdrop-filter: blur(8px) saturate(150%);
   border: 1px solid hsl(var(--foreground) / 0.16);
   border-radius: var(--radius-xl, 1rem);
   box-shadow: 0 1px 2px hsl(var(--shadow) / 0.05), 0 4px 12px hsl(var(--shadow) / 0.1);
@@ -1569,8 +1585,8 @@ video {
 }
 .bg-glass {
   background: hsl(var(--card) / 0.72);
-  backdrop-filter: blur(14px) saturate(160%);
   -webkit-backdrop-filter: blur(14px) saturate(160%);
+  backdrop-filter: blur(14px) saturate(160%);
   border: 1px solid hsl(var(--foreground) / 0.14);
 }
 [data-theme='light'] .bg-glass {
@@ -1587,13 +1603,13 @@ html.calm .badge {
 }
 html.calm .card, html.calm .bg-glass {
   background: hsl(var(--card));
-  backdrop-filter: none;
   -webkit-backdrop-filter: none;
+  backdrop-filter: none;
 }
 html.calm .\!card {
   background: hsl(var(--card)) !important;
-  backdrop-filter: none !important;
   -webkit-backdrop-filter: none !important;
+  backdrop-filter: none !important;
 }
 html.calm .tile-glass {
   background: hsl(var(--muted));
@@ -1746,35 +1762,35 @@ html.calm .tile-glass {
 .-bottom-6 {
   bottom: -1.5rem;
 }
-.-left-1 {
-  left: -0.25rem;
+.-end-1 {
+  inset-inline-end: -0.25rem;
 }
-.-left-1\.5 {
-  left: -0.375rem;
+.-end-1\.5 {
+  inset-inline-end: -0.375rem;
 }
-.-left-40 {
-  left: -10rem;
+.-end-2 {
+  inset-inline-end: -0.5rem;
 }
-.-left-\[10\%\] {
-  left: -10%;
+.-end-9 {
+  inset-inline-end: -2.25rem;
 }
-.-right-1 {
-  right: -0.25rem;
+.-end-\[10\%\] {
+  inset-inline-end: -10%;
 }
-.-right-1\.5 {
-  right: -0.375rem;
+.-left-1 {
+  left: -0.25rem;
 }
-.-right-2 {
-  right: -0.5rem;
+.-left-40 {
+  left: -10rem;
 }
 .-right-32 {
   right: -8rem;
 }
-.-right-9 {
-  right: -2.25rem;
+.-start-1\.5 {
+  inset-inline-start: -0.375rem;
 }
-.-right-\[10\%\] {
-  right: -10%;
+.-start-\[10\%\] {
+  inset-inline-start: -10%;
 }
 .-top-1 {
   top: -0.25rem;
@@ -1815,6 +1831,27 @@ html.calm .tile-glass {
 .bottom-\[-10\%\] {
   bottom: -10%;
 }
+.end-0 {
+  inset-inline-end: 0px;
+}
+.end-1 {
+  inset-inline-end: 0.25rem;
+}
+.end-2 {
+  inset-inline-end: 0.5rem;
+}
+.end-3 {
+  inset-inline-end: 0.75rem;
+}
+.end-4 {
+  inset-inline-end: 1rem;
+}
+.end-6 {
+  inset-inline-end: 1.5rem;
+}
+.end-9 {
+  inset-inline-end: 2.25rem;
+}
 .left-0 {
   left: 0px;
 }
@@ -1833,38 +1870,32 @@ html.calm .tile-glass {
 .left-3 {
   left: 0.75rem;
 }
-.left-6 {
-  left: 1.5rem;
-}
-.left-\[1\.375rem\] {
-  left: 1.375rem;
-}
-.left-\[calc\(0\.5rem\+0\.375rem\)\] {
-  left: calc(0.5rem + 0.375rem);
-}
-.left-\[calc\(0\.5rem\+2px\)\] {
-  left: calc(0.5rem + 2px);
-}
 .right-0 {
   right: 0px;
 }
-.right-1 {
-  right: 0.25rem;
-}
 .right-2 {
   right: 0.5rem;
 }
 .right-3 {
   right: 0.75rem;
 }
-.right-4 {
-  right: 1rem;
+.start-0 {
+  inset-inline-start: 0px;
 }
-.right-6 {
-  right: 1.5rem;
+.start-2 {
+  inset-inline-start: 0.5rem;
 }
-.right-9 {
-  right: 2.25rem;
+.start-6 {
+  inset-inline-start: 1.5rem;
+}
+.start-\[1\.375rem\] {
+  inset-inline-start: 1.375rem;
+}
+.start-\[calc\(0\.5rem\+0\.375rem\)\] {
+  inset-inline-start: calc(0.5rem + 0.375rem);
+}
+.start-\[calc\(0\.5rem\+2px\)\] {
+  inset-inline-start: calc(0.5rem + 2px);
 }
 .top-0 {
   top: 0px;
@@ -2000,8 +2031,8 @@ html.calm .tile-glass {
   margin-top: 0.75rem;
   margin-bottom: 0.75rem;
 }
-.-ml-2 {
-  margin-left: -0.5rem;
+.-ms-2 {
+  margin-inline-start: -0.5rem;
 }
 .-mt-1 {
   margin-top: -0.25rem;
@@ -2021,29 +2052,29 @@ html.calm .tile-glass {
 .mb-3 {
   margin-bottom: 0.75rem;
 }
-.ml-0 {
-  margin-left: 0px;
+.me-0 {
+  margin-inline-end: 0px;
 }
-.ml-1 {
-  margin-left: 0.25rem;
+.me-1 {
+  margin-inline-end: 0.25rem;
 }
-.ml-1\.5 {
-  margin-left: 0.375rem;
+.ms-0 {
+  margin-inline-start: 0px;
 }
-.ml-2 {
-  margin-left: 0.5rem;
+.ms-1 {
+  margin-inline-start: 0.25rem;
 }
-.ml-4 {
-  margin-left: 1rem;
+.ms-1\.5 {
+  margin-inline-start: 0.375rem;
 }
-.ml-auto {
-  margin-left: auto;
+.ms-2 {
+  margin-inline-start: 0.5rem;
 }
-.mr-0 {
-  margin-right: 0px;
+.ms-4 {
+  margin-inline-start: 1rem;
 }
-.mr-1 {
-  margin-right: 0.25rem;
+.ms-auto {
+  margin-inline-start: auto;
 }
 .mt-0\.5 {
   margin-top: 0.125rem;
@@ -3098,17 +3129,17 @@ html.calm .tile-glass {
   border-bottom-right-radius: 1rem;
   border-bottom-left-radius: 1rem;
 }
-.rounded-l-full {
-  border-top-left-radius: 9999px;
-  border-bottom-left-radius: 9999px;
+.rounded-e-md {
+  border-start-end-radius: 0.375rem;
+  border-end-end-radius: 0.375rem;
 }
-.rounded-l-md {
-  border-top-left-radius: 0.375rem;
-  border-bottom-left-radius: 0.375rem;
+.rounded-s-full {
+  border-start-start-radius: 9999px;
+  border-end-start-radius: 9999px;
 }
-.rounded-r-md {
-  border-top-right-radius: 0.375rem;
-  border-bottom-right-radius: 0.375rem;
+.rounded-s-md {
+  border-start-start-radius: 0.375rem;
+  border-end-start-radius: 0.375rem;
 }
 .rounded-t {
   border-top-left-radius: 0.25rem;
@@ -3145,15 +3176,12 @@ html.calm .tile-glass {
 .border-b-2 {
   border-bottom-width: 2px;
 }
+.border-e {
+  border-inline-end-width: 1px;
+}
 .border-l {
   border-left-width: 1px;
 }
-.border-l-2 {
-  border-left-width: 2px;
-}
-.border-l-4 {
-  border-left-width: 4px;
-}
 .border-l-8 {
   border-left-width: 8px;
 }
@@ -3163,6 +3191,15 @@ html.calm .tile-glass {
 .border-r-8 {
   border-right-width: 8px;
 }
+.border-s {
+  border-inline-start-width: 1px;
+}
+.border-s-2 {
+  border-inline-start-width: 2px;
+}
+.border-s-4 {
+  border-inline-start-width: 4px;
+}
 .border-t {
   border-top-width: 1px;
 }
@@ -3705,50 +3742,56 @@ html.calm .tile-glass {
 .pb-4 {
   padding-bottom: 1rem;
 }
-.pl-1 {
-  padding-left: 0.25rem;
+.pe-1 {
+  padding-inline-end: 0.25rem;
 }
-.pl-2 {
-  padding-left: 0.5rem;
+.pe-1\.5 {
+  padding-inline-end: 0.375rem;
 }
-.pl-2\.5 {
-  padding-left: 0.625rem;
+.pe-10 {
+  padding-inline-end: 2.5rem;
 }
-.pl-3 {
-  padding-left: 0.75rem;
+.pe-2 {
+  padding-inline-end: 0.5rem;
 }
-.pl-4 {
-  padding-left: 1rem;
+.pe-3 {
+  padding-inline-end: 0.75rem;
 }
-.pl-6 {
-  padding-left: 1.5rem;
+.pe-4 {
+  padding-inline-end: 1rem;
 }
-.pl-8 {
-  padding-left: 2rem;
+.pe-9 {
+  padding-inline-end: 2.25rem;
+}
+.pl-1 {
+  padding-left: 0.25rem;
 }
 .pr-1 {
   padding-right: 0.25rem;
 }
-.pr-1\.5 {
-  padding-right: 0.375rem;
+.pr-8 {
+  padding-right: 2rem;
 }
-.pr-10 {
-  padding-right: 2.5rem;
+.ps-1 {
+  padding-inline-start: 0.25rem;
 }
-.pr-2 {
-  padding-right: 0.5rem;
+.ps-2 {
+  padding-inline-start: 0.5rem;
 }
-.pr-3 {
-  padding-right: 0.75rem;
+.ps-2\.5 {
+  padding-inline-start: 0.625rem;
 }
-.pr-4 {
-  padding-right: 1rem;
+.ps-3 {
+  padding-inline-start: 0.75rem;
 }
-.pr-8 {
-  padding-right: 2rem;
+.ps-4 {
+  padding-inline-start: 1rem;
+}
+.ps-6 {
+  padding-inline-start: 1.5rem;
 }
-.pr-9 {
-  padding-right: 2.25rem;
+.ps-8 {
+  padding-inline-start: 2rem;
 }
 .pt-0 {
   padding-top: 0px;
@@ -3780,6 +3823,12 @@ html.calm .tile-glass {
 .text-right {
   text-align: right;
 }
+.text-start {
+  text-align: start;
+}
+.text-end {
+  text-align: end;
+}
 .align-top {
   vertical-align: top;
 }
@@ -4471,9 +4520,9 @@ html.calm .tile-glass {
   top: 0px;
   bottom: 0px;
 }
-.after\:left-1\/2::after {
+.after\:start-1\/2::after {
   content: var(--tw-content);
-  left: 50%;
+  inset-inline-start: 50%;
 }
 .after\:w-px::after {
   content: var(--tw-content);
@@ -4495,8 +4544,8 @@ html.calm .tile-glass {
 .last\:border-0:last-child {
   border-width: 0px;
 }
-.last\:border-r-0:last-child {
-  border-right-width: 0px;
+.last\:border-e-0:last-child {
+  border-inline-end-width: 0px;
 }
 .focus-within\:border-ring:focus-within {
   --tw-border-opacity: 1;
@@ -4790,8 +4839,8 @@ html.calm .tile-glass {
   --tw-ring-opacity: 1;
   --tw-ring-color: hsl(var(--ring) / var(--tw-ring-opacity, 1));
 }
-.group\/item:has([data-sidebar=menu-action]) .group-has-\[\[data-sidebar\=menu-action\]\]\/item\:pr-9 {
-  padding-right: 2.25rem;
+.group\/item:has([data-sidebar=menu-action]) .group-has-\[\[data-sidebar\=menu-action\]\]\/item\:pe-9 {
+  padding-inline-end: 2.25rem;
 }
 .aria-pressed\:text-primary[aria-pressed="true"] {
   --tw-text-opacity: 1;
@@ -4878,9 +4927,9 @@ html.calm .tile-glass {
 .group[data-disabled] .group-data-\[disabled\]\:opacity-50 {
   opacity: 0.5;
 }
-[data-theme='light'] .light\:text-amber-700 {
+[data-theme='light'] .light\:text-amber-800 {
   --tw-text-opacity: 1;
-  color: rgb(180 83 9 / var(--tw-text-opacity, 1));
+  color: rgb(146 64 14 / var(--tw-text-opacity, 1));
 }
 [data-theme='light'] .light\:text-emerald-700 {
   --tw-text-opacity: 1;
@@ -4917,12 +4966,12 @@ html.calm .tile-glass {
     white-space: normal;
   }
 
-  .sm\:left-4 {
-    left: 1rem;
+  .sm\:end-4 {
+    inset-inline-end: 1rem;
   }
 
-  .sm\:right-4 {
-    right: 1rem;
+  .sm\:start-4 {
+    inset-inline-start: 1rem;
   }
 
   .sm\:col-span-2 {
@@ -5115,21 +5164,65 @@ html.calm .tile-glass {
     line-height: 1;
   }
 }
+.rtl\:origin-right:where([dir="rtl"], [dir="rtl"] *) {
+  transform-origin: right;
+}
+.rtl\:-translate-x-full:where([dir="rtl"], [dir="rtl"] *) {
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.rtl\:translate-x-full:where([dir="rtl"], [dir="rtl"] *) {
+  --tw-translate-x: 100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.rtl\:-scale-x-100:where([dir="rtl"], [dir="rtl"] *) {
+  --tw-scale-x: -1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.rtl\:cursor-e-resize:where([dir="rtl"], [dir="rtl"] *) {
+  cursor: e-resize;
+}
+.rtl\:cursor-w-resize:where([dir="rtl"], [dir="rtl"] *) {
+  cursor: w-resize;
+}
+.rtl\:justify-start:where([dir="rtl"], [dir="rtl"] *) {
+  justify-content: flex-start;
+}
+.rtl\:justify-end:where([dir="rtl"], [dir="rtl"] *) {
+  justify-content: flex-end;
+}
+.rtl\:divide-x-reverse:where([dir="rtl"], [dir="rtl"] *) > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-x-reverse: 1;
+}
+.rtl\:pl-8:where([dir="rtl"], [dir="rtl"] *) {
+  padding-left: 2rem;
+}
+.rtl\:pr-0:where([dir="rtl"], [dir="rtl"] *) {
+  padding-right: 0px;
+}
+.group[open] .rtl\:group-\[\[open\]\]\:scale-x-100:where([dir="rtl"], [dir="rtl"] *) {
+  --tw-scale-x: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.rtl\:data-\[checked\]\:-translate-x-4[data-checked]:where([dir="rtl"], [dir="rtl"] *) {
+  --tw-translate-x: -1rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .\[\&\.a4ui-tile-loaded\]\:opacity-100.a4ui-tile-loaded {
   opacity: 1;
 }
 .\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker {
   display: none;
 }
+.\[\&\:\:-webkit-scrollbar-thumb\:hover\]\:bg-muted-foreground\/55::-webkit-scrollbar-thumb:hover {
+  background-color: hsl(var(--muted-foreground) / 0.55);
+}
 .\[\&\:\:-webkit-scrollbar-thumb\]\:rounded-full::-webkit-scrollbar-thumb {
   border-radius: 9999px;
 }
 .\[\&\:\:-webkit-scrollbar-thumb\]\:bg-muted-foreground\/35::-webkit-scrollbar-thumb {
   background-color: hsl(var(--muted-foreground) / 0.35);
 }
-.hover\:\[\&\:\:-webkit-scrollbar-thumb\]\:bg-muted-foreground\/55::-webkit-scrollbar-thumb:hover {
-  background-color: hsl(var(--muted-foreground) / 0.55);
-}
 .\[\&\:\:-webkit-scrollbar-track\]\:bg-transparent::-webkit-scrollbar-track {
   background-color: transparent;
 }
@@ -5151,15 +5244,15 @@ html.calm .tile-glass {
 .\[\&\>\*\:last-child\]\:border-b-0>*:last-child {
   border-bottom-width: 0px;
 }
-.\[\&\>\*\:not\(\:first-child\)\]\:-ml-px>*:not(:first-child) {
-  margin-left: -1px;
+.\[\&\>\*\:not\(\:first-child\)\]\:-ms-px>*:not(:first-child) {
+  margin-inline-start: -1px;
 }
 .\[\&\>\*\:not\(\:first-child\)\]\:-mt-px>*:not(:first-child) {
   margin-top: -1px;
 }
-.\[\&\>\*\:not\(\:first-child\)\]\:rounded-l-none>*:not(:first-child) {
-  border-top-left-radius: 0px;
-  border-bottom-left-radius: 0px;
+.\[\&\>\*\:not\(\:first-child\)\]\:rounded-s-none>*:not(:first-child) {
+  border-start-start-radius: 0px;
+  border-end-start-radius: 0px;
 }
 .\[\&\>\*\:not\(\:first-child\)\]\:rounded-t-none>*:not(:first-child) {
   border-top-left-radius: 0px;
@@ -5169,9 +5262,9 @@ html.calm .tile-glass {
   border-bottom-right-radius: 0px;
   border-bottom-left-radius: 0px;
 }
-.\[\&\>\*\:not\(\:last-child\)\]\:rounded-r-none>*:not(:last-child) {
-  border-top-right-radius: 0px;
-  border-bottom-right-radius: 0px;
+.\[\&\>\*\:not\(\:last-child\)\]\:rounded-e-none>*:not(:last-child) {
+  border-start-end-radius: 0px;
+  border-end-end-radius: 0px;
 }
 .\[\&\>\*\]\:relative>* {
   position: relative;
@@ -5247,6 +5340,10 @@ html.calm .tile-glass {
   --tw-rotate: 90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+.\[\&\[data-expanded\]\>svg\]\:rtl\:scale-x-100:where([dir="rtl"], [dir="rtl"] *)[data-expanded]>svg {
+  --tw-scale-x: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
 .\[\&_\.lead\]\:text-2xl .lead {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -5286,15 +5383,15 @@ html.calm .tile-glass {
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
 }
-.\[\&_blockquote\]\:border-l-2 blockquote {
-  border-left-width: 2px;
+.\[\&_blockquote\]\:border-s-2 blockquote {
+  border-inline-start-width: 2px;
 }
 .\[\&_blockquote\]\:border-border blockquote {
   --tw-border-opacity: 1;
   border-color: hsl(var(--border) / var(--tw-border-opacity, 1));
 }
-.\[\&_blockquote\]\:pl-4 blockquote {
-  padding-left: 1rem;
+.\[\&_blockquote\]\:ps-4 blockquote {
+  padding-inline-start: 1rem;
 }
 .\[\&_blockquote\]\:italic blockquote {
   font-style: italic;
@@ -5307,8 +5404,8 @@ html.calm .tile-glass {
   padding-top: 1rem;
   padding-bottom: 1rem;
 }
-.\[\&_button\]\:text-left button {
-  text-align: left;
+.\[\&_button\]\:text-start button {
+  text-align: start;
 }
 .\[\&_button\]\:text-base button {
   font-size: 1rem;
@@ -5455,8 +5552,8 @@ html.calm .tile-glass {
 .\[\&_ol\]\:list-decimal ol {
   list-style-type: decimal;
 }
-.\[\&_ol\]\:pl-6 ol {
-  padding-left: 1.5rem;
+.\[\&_ol\]\:ps-6 ol {
+  padding-inline-start: 1.5rem;
 }
 .\[\&_p\]\:my-4 p {
   margin-top: 1rem;
@@ -5545,8 +5642,8 @@ html.calm .tile-glass {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
 }
-.\[\&_th\]\:text-left th {
-  text-align: left;
+.\[\&_th\]\:text-start th {
+  text-align: start;
 }
 .\[\&_th\]\:font-semibold th {
   font-weight: 600;
@@ -5558,6 +5655,6 @@ html.calm .tile-glass {
 .\[\&_ul\]\:list-disc ul {
   list-style-type: disc;
 }
-.\[\&_ul\]\:pl-6 ul {
-  padding-left: 1.5rem;
+.\[\&_ul\]\:ps-6 ul {
+  padding-inline-start: 1.5rem;
 }