@stridge/kit 0.1.0-alpha.6 → 0.1.0-alpha.60

package/dist/styles/index.css

@@ -66,6 +66,10 @@
   --stridge-kit-z-tooltip: 1070;
   --stridge-kit-overlay: oklch(0% 0 0 / .4);
   --stridge-kit-dialog-width: 480px;
+  --stridge-kit-drawer-max-inline-size: var(--stridge-kit-dialog-width);
+  --stridge-kit-drawer-max-block-size: calc(100% - 2rem);
+  --stridge-kit-drawer-handle-size: 36px;
+  --stridge-kit-drawer-handle-thickness: 4px;
 }
 
 :root, [data-stridge-scope] {
@@ -79,6 +83,9 @@
   --stridge-kit-card-radius: 12px;
   --stridge-kit-card-radius-frame: 16px;
   --stridge-kit-button-radius: 10px;
+  --stridge-kit-tabs-list-radius: 10px;
+  --stridge-kit-tabs-indicator-radius: 7px;
+  --stridge-kit-tabs-tab-padding-block: 10px;
 }
 
 [data-stridge-radius="sharp"] {
@@ -88,6 +95,8 @@
   --stridge-kit-card-radius: 0px;
   --stridge-kit-card-radius-frame: 0px;
   --stridge-kit-button-radius: 0px;
+  --stridge-kit-tabs-list-radius: 0px;
+  --stridge-kit-tabs-indicator-radius: 0px;
   --stridge-kit-radius: 0px;
   --stridge-kit-radius-xs: 0px;
   --stridge-kit-radius-sm: 0px;
@@ -104,6 +113,8 @@
   --stridge-kit-card-radius: 6px;
   --stridge-kit-card-radius-frame: 8px;
   --stridge-kit-button-radius: 6px;
+  --stridge-kit-tabs-list-radius: 6px;
+  --stridge-kit-tabs-indicator-radius: 4px;
   --stridge-kit-radius: .375rem;
   --stridge-kit-radius-xs: 2px;
   --stridge-kit-radius-sm: 4px;
@@ -120,6 +131,8 @@
   --stridge-kit-card-radius: 12px;
   --stridge-kit-card-radius-frame: 16px;
   --stridge-kit-button-radius: 10px;
+  --stridge-kit-tabs-list-radius: 10px;
+  --stridge-kit-tabs-indicator-radius: 7px;
   --stridge-kit-radius: .75rem;
   --stridge-kit-radius-xs: 6px;
   --stridge-kit-radius-sm: 8px;
@@ -136,6 +149,8 @@
   --stridge-kit-card-radius: 18px;
   --stridge-kit-card-radius-frame: 22px;
   --stridge-kit-button-radius: 9999px;
+  --stridge-kit-tabs-list-radius: 9999px;
+  --stridge-kit-tabs-indicator-radius: 9999px;
   --stridge-kit-radius: .875rem;
   --stridge-kit-radius-xs: 8px;
   --stridge-kit-radius-sm: 10px;
@@ -196,8 +211,19 @@
   --stridge-kit-card-border: oklch(29.55% .01 285.72);
   --stridge-kit-card-border-frame: oklch(27.07% .01 285.77);
   --stridge-kit-card-shadow: 0 30px 80px oklch(0% 0 0 / .6), 0 2px 6px oklch(0% 0 0 / .4);
+  --stridge-kit-drawer-handle-color: oklch(52.95% .01 286.13 / .55);
   --stridge-kit-skeleton-base: oklch(29.55% .01 285.72);
   --stridge-kit-skeleton-highlight: oklch(35.16% .01 285.67);
+  --stridge-kit-tabs-list-surface: var(--stridge-kit-card-surface-subdued);
+  --stridge-kit-tabs-list-border: var(--stridge-kit-border);
+  --stridge-kit-tabs-tab-foreground: var(--stridge-kit-muted-foreground);
+  --stridge-kit-tabs-tab-foreground-active: var(--stridge-kit-foreground);
+  --stridge-kit-tabs-tab-surface-active: var(--stridge-kit-tile-surface);
+  --stridge-kit-tabs-tab-border-active: var(--stridge-kit-tile-border);
+  --stridge-kit-tabs-indicator-accent: var(--stridge-kit-foreground);
+  --stridge-kit-attribution-prefix-color: oklch(62% .005 286);
+  --stridge-kit-attribution-mark-color: oklch(72% .005 286);
+  --stridge-kit-attribution-wordmark-color: oklch(76% .005 286);
   --stridge-kit-shadow-xs: 0 1px 1px 0 oklch(0% 0 0 / .125);
   --stridge-kit-shadow-sm: 0 4px 4px -1px oklch(0% 0 0 / .04), 0 1px 1px 0 oklch(0% 0 0 / .08);
   --stridge-kit-shadow-md: 0 3px 8px oklch(0% 0 0 / .125), 0 2px 5px oklch(0% 0 0 / .125), 0 1px 1px oklch(0% 0 0 / .125);
@@ -254,8 +280,19 @@
   --stridge-kit-card-border: oklch(91% 0 286);
   --stridge-kit-card-border-frame: oklch(91% 0 286);
   --stridge-kit-card-shadow: 0 30px 80px oklch(0% 0 0 / .16), 0 2px 6px oklch(0% 0 0 / .08);
+  --stridge-kit-drawer-handle-color: oklch(60% .01 286 / .4);
   --stridge-kit-skeleton-base: oklch(91% 0 286);
   --stridge-kit-skeleton-highlight: oklch(95% 0 286);
+  --stridge-kit-tabs-list-surface: var(--stridge-kit-card-surface-subdued);
+  --stridge-kit-tabs-list-border: var(--stridge-kit-border);
+  --stridge-kit-tabs-tab-foreground: var(--stridge-kit-muted-foreground);
+  --stridge-kit-tabs-tab-foreground-active: var(--stridge-kit-foreground);
+  --stridge-kit-tabs-tab-surface-active: var(--stridge-kit-tile-surface);
+  --stridge-kit-tabs-tab-border-active: var(--stridge-kit-tile-border);
+  --stridge-kit-tabs-indicator-accent: var(--stridge-kit-foreground);
+  --stridge-kit-attribution-prefix-color: oklch(50% .01 286);
+  --stridge-kit-attribution-mark-color: oklch(42% .01 286);
+  --stridge-kit-attribution-wordmark-color: oklch(36% .01 286);
   --stridge-kit-shadow-xs: 0 1px 2px 0 oklch(0% 0 0 / .04);
   --stridge-kit-shadow-sm: 0 1px 1px 0 oklch(0% 0 0 / .04), 0 1px 3px 0 oklch(0% 0 0 / .05);
   --stridge-kit-shadow-md: 0 6px 12px -3px oklch(0% 0 0 / .06), 0 2px 4px -1px oklch(0% 0 0 / .04);
@@ -263,6 +300,16 @@
   --stridge-kit-shadow-xl: 0 24px 56px -12px oklch(0% 0 0 / .1), 0 8px 16px -4px oklch(0% 0 0 / .06);
 }
 
+[data-stridge-scope] [data-stridge-slot] {
+  -webkit-user-select: none;
+  user-select: none;
+}
+
+[data-stridge-scope] [data-stridge-slot]:is(input, textarea, [contenteditable="true"], [data-stridge-selectable]), [data-stridge-scope] :is(input, textarea, [contenteditable="true"], [data-stridge-selectable]) {
+  -webkit-user-select: text;
+  user-select: text;
+}
+
 @stylex;
 
 @layer priority1;
@@ -378,6 +425,14 @@
     border-color: var(--stridge-kit-card-border-frame);
   }
 
+  .xv87bwv {
+    border-color: var(--stridge-kit-card-surface);
+  }
+
+  .x1s46ruh {
+    border-color: var(--stridge-kit-tabs-list-border);
+  }
+
   .xa3awxp {
     border-color: var(--stridge-kit-tile-border);
   }
@@ -386,6 +441,18 @@
     border-color: var(--stridge-kit-border);
   }
 
+  .x16691aj {
+    border-color: var(--stridge-kit-destructive);
+  }
+
+  .xab7lrg {
+    border-color: var(--stridge-kit-tabs-tab-border-active);
+  }
+
+  .x1l0rsgs {
+    border-inline-width: 1px;
+  }
+
   .x6i6fhv {
     border-radius: .375rem;
   }
@@ -398,10 +465,18 @@
     border-radius: 0;
   }
 
+  .x16rqkct {
+    border-radius: 50%;
+  }
+
   .x10hpsqq {
     border-radius: 9999px;
   }
 
+  .x1e6avla {
+    border-radius: 999px;
+  }
+
   .x1pjcqnp {
     border-radius: inherit;
   }
@@ -414,6 +489,10 @@
     border-radius: var(--stridge-kit-radius-full);
   }
 
+  .x1gt2vge {
+    border-radius: var(--stridge-kit-tabs-list-radius);
+  }
+
   .x2zroun {
     border-radius: var(--stridge-kit-radius-xs);
   }
@@ -434,6 +513,10 @@
     border-radius: var(--stridge-kit-radius-sm);
   }
 
+  .xfauvix {
+    border-radius: var(--stridge-kit-tabs-indicator-radius);
+  }
+
   .x1c2egtx {
     border-radius: var(--stridge-kit-card-radius-frame);
   }
@@ -478,6 +561,10 @@
     border-width: 2px;
   }
 
+  .xkz0k9k {
+    flex: 0 auto;
+  }
+
   .x845mor {
     flex: 1;
   }
@@ -582,10 +669,26 @@
     gap: var(--stridge-kit-space-2);
   }
 
+  .x10no89f {
+    inset-block: 0;
+  }
+
+  .x17y0mx6 {
+    inset-inline: 0;
+  }
+
+  .x10im51j {
+    margin-block: 0;
+  }
+
   .x10bka1u {
     margin-inline: 22px;
   }
 
+  .xvueqy4 {
+    margin-inline: auto;
+  }
+
   .x1mqxmvn {
     margin-inline: calc(var(--stridge-kit-space-1) * -1);
   }
@@ -634,6 +737,10 @@
     padding-block: 15px;
   }
 
+  .x1xn8qrt {
+    padding-block: 16px;
+  }
+
   .x12ulsxz {
     padding-block: 4px;
   }
@@ -650,6 +757,18 @@
     padding-block: 8px;
   }
 
+  .x1yowcxs {
+    padding-block: var(--stridge-kit-space-3);
+  }
+
+  .x1wjkr2j {
+    padding-block: var(--stridge-kit-tabs-tab-padding-block);
+  }
+
+  .xpuy6co {
+    padding-block: var(--stridge-kit-space-2);
+  }
+
   .xvpgqt4 {
     padding-inline: .625rem;
   }
@@ -690,6 +809,10 @@
     padding-inline: 6px;
   }
 
+  .xqsvw4s {
+    padding-inline: var(--stridge-kit-space-4);
+  }
+
   .x7mqn57 {
     padding-inline: var(--stridge-kit-space-1);
   }
@@ -698,6 +821,10 @@
     padding-inline: var(--stridge-kit-space-3);
   }
 
+  .x1ujb8i1 {
+    padding-inline: var(--stridge-kit-space-5);
+  }
+
   .xxztuhb {
     padding-inline: var(--stridge-kit-space-2);
   }
@@ -714,14 +841,26 @@
     border-color: var(--stridge-kit-ring);
   }
 
+  .x1o5aa3h:focus-visible {
+    border-radius: var(--stridge-kit-radius-full);
+  }
+
   .x63abuj:focus-visible {
     border-radius: var(--stridge-kit-radius-sm);
   }
 
+  .x1gvykhg:focus-visible {
+    outline: 2px solid var(--stridge-kit-ring);
+  }
+
   .x67ar3w:focus-visible {
     outline: 2px solid var(--stridge-kit-foreground);
   }
 
+  .x1l0eogd:is(a:hover, a:focus-visible) [data-stridge-slot~="attribution-wordmark"] {
+    text-decoration: underline;
+  }
+
   .xnyhjf:has( > input:focus-visible,  > textarea:focus-visible) {
     border-color: var(--stridge-kit-ring);
   }
@@ -842,6 +981,10 @@
     animation-delay: 0s;
   }
 
+  .x1a78uxe {
+    animation-duration: .24s;
+  }
+
   .x4afe7t {
     animation-duration: .3s;
   }
@@ -874,6 +1017,14 @@
     animation-duration: 1.8s;
   }
 
+  .x1q3qbx4 {
+    animation-duration: 1s;
+  }
+
+  .x19y0sg2 {
+    animation-duration: var(--stridge-kit-duration-fast);
+  }
+
   .x1u6ievf {
     animation-fill-mode: both;
   }
@@ -894,6 +1045,14 @@
     animation-name: x17l86xk-B;
   }
 
+  .xqcmdr3 {
+    animation-name: x18re5ia-B;
+  }
+
+  .x1tj11xs {
+    animation-name: x1deacm-B;
+  }
+
   .xv305lp {
     animation-name: x1l9pw95-B;
   }
@@ -918,6 +1077,10 @@
     animation-name: xdk6pkw-B;
   }
 
+  .x11qdjwd {
+    animation-name: xmr5gd0-B;
+  }
+
   .x1ka1v4i {
     animation-name: xqng64z-B;
   }
@@ -1046,6 +1209,10 @@
     background-color: var(--stridge-kit-card-surface);
   }
 
+  .x1fkz0ev {
+    background-color: var(--stridge-kit-tabs-indicator-accent);
+  }
+
   .x136i1dt {
     background-color: var(--stridge-kit-border);
   }
@@ -1058,6 +1225,10 @@
     background-color: var(--stridge-kit-secondary);
   }
 
+  .x1ge2e6s {
+    background-color: var(--stridge-kit-tabs-tab-surface-active);
+  }
+
   .xdmxa9o {
     background-color: var(--stridge-kit-primary);
   }
@@ -1074,6 +1245,14 @@
     background-color: var(--stridge-kit-skeleton-base);
   }
 
+  .x13y6qn8 {
+    background-color: var(--stridge-kit-tabs-list-surface);
+  }
+
+  .x1p0xf7o {
+    background-color: var(--stridge-kit-drawer-handle-color);
+  }
+
   .xfhhmty {
     background-color: var(--stridge-kit-destructive-soft);
   }
@@ -1082,6 +1261,10 @@
     background-color: var(--stridge-kit-overlay);
   }
 
+  .xvaq5cg {
+    background-color: var(--stridge-kit-card);
+  }
+
   .x19u6ldj {
     background-color: var(--stridge-kit-background);
   }
@@ -1126,10 +1309,18 @@
     border-start-end-radius: var(--stridge-kit-radius-md);
   }
 
+  .x1af6ir8 {
+    border-start-end-radius: var(--stridge-kit-card-radius-frame);
+  }
+
   .x1d6sz28 {
     border-start-start-radius: var(--stridge-kit-radius-md);
   }
 
+  .x8htq0b {
+    border-start-start-radius: var(--stridge-kit-card-radius-frame);
+  }
+
   .x1gsh91t {
     box-shadow: 0 0 0 1.5px var(--stridge-kit-tile-surface);
   }
@@ -1250,6 +1441,10 @@
     color: var(--stridge-kit-info);
   }
 
+  .x9irweu {
+    color: var(--stridge-kit-attribution-mark-color);
+  }
+
   .x1vits3x {
     color: var(--stridge-kit-card-foreground);
   }
@@ -1258,6 +1453,10 @@
     color: var(--stridge-kit-secondary-foreground);
   }
 
+  .x1nxg1fm {
+    color: var(--stridge-kit-attribution-wordmark-color);
+  }
+
   .x1me39qh {
     color: var(--stridge-kit-primary);
   }
@@ -1270,6 +1469,10 @@
     color: var(--stridge-kit-destructive);
   }
 
+  .xddgj62 {
+    color: var(--stridge-kit-tabs-tab-foreground);
+  }
+
   .x137ha3m {
     color: var(--stridge-kit-muted-foreground-faint);
   }
@@ -1282,6 +1485,10 @@
     color: var(--stridge-kit-details-label);
   }
 
+  .xd2gg92 {
+    color: var(--stridge-kit-attribution-prefix-color);
+  }
+
   .x1kqivnd {
     color: var(--stridge-kit-tile-foreground);
   }
@@ -1334,6 +1541,10 @@
     display: block;
   }
 
+  .xjp7ctv {
+    display: contents;
+  }
+
   .x78zum5 {
     display: flex;
   }
@@ -1354,10 +1565,18 @@
     display: inline;
   }
 
+  .x1s85apg {
+    display: none;
+  }
+
   .x5f5z56 {
     field-sizing: content;
   }
 
+  .x117rol3 {
+    fill: currentColor;
+  }
+
   .xbh8q5q {
     fill: none;
   }
@@ -1570,6 +1789,10 @@
     inset-inline-start: 0;
   }
 
+  .xbudbmw {
+    inset-inline-start: 50%;
+  }
+
   .xc8icb0 {
     isolation: isolate;
   }
@@ -1578,6 +1801,10 @@
     justify-content: center;
   }
 
+  .x13a6bvl {
+    justify-content: flex-end;
+  }
+
   .x1nhvcw1 {
     justify-content: flex-start;
   }
@@ -1610,6 +1837,10 @@
     letter-spacing: .02em;
   }
 
+  .x1labic3 {
+    letter-spacing: .14em;
+  }
+
   .x4gjf66 {
     letter-spacing: inherit;
   }
@@ -1634,6 +1865,14 @@
     letter-spacing: var(--stridge-kit-tracking-widest);
   }
 
+  .x14ju556 {
+    line-height: 0;
+  }
+
+  .x1u7k74 {
+    line-height: 1.2;
+  }
+
   .x132q4wb {
     line-height: 1.25;
   }
@@ -1746,6 +1985,10 @@
     opacity: 0;
   }
 
+  .x1hc1fzr {
+    opacity: 1;
+  }
+
   .x1clqncf {
     order: -1;
   }
@@ -1762,6 +2005,10 @@
     overflow-wrap: anywhere;
   }
 
+  .x2vl965 {
+    padding-inline-end: 10px;
+  }
+
   .xpdmqnj {
     padding-inline-end: 12px;
   }
@@ -1786,6 +2033,10 @@
     padding-inline-end: 9px;
   }
 
+  .xvkiva6 {
+    padding-inline-end: var(--stridge-kit-space-4);
+  }
+
   .xi8f3d1 {
     padding-inline-end: var(--stridge-kit-space-3);
   }
@@ -1794,6 +2045,10 @@
     padding-inline-end: var(--stridge-kit-space-8);
   }
 
+  .x1hvdk87 {
+    padding-inline-end: var(--stridge-kit-space-5);
+  }
+
   .xzfcf9p {
     padding-inline-end: var(--stridge-kit-space-2);
   }
@@ -1818,18 +2073,34 @@
     padding-inline-start: 22px;
   }
 
+  .x25sj25 {
+    padding-inline-start: 6px;
+  }
+
   .x7coems {
     padding-inline-start: 9px;
   }
 
+  .xiplbrm {
+    padding-inline-start: var(--stridge-kit-space-4);
+  }
+
   .x1qntkwk {
     padding-inline-start: var(--stridge-kit-space-3);
   }
 
+  .xmg6hw8 {
+    padding-inline-start: var(--stridge-kit-space-5);
+  }
+
   .xpsy26f {
     padding-inline-start: var(--stridge-kit-space-2);
   }
 
+  .x67bb7w {
+    pointer-events: auto;
+  }
+
   .x47corl {
     pointer-events: none;
   }
@@ -1882,6 +2153,10 @@
     stroke-width: 2.2px;
   }
 
+  .x1ip4yf {
+    stroke-width: 2.5px;
+  }
+
   .xvlca1e {
     stroke-width: 2px;
   }
@@ -1962,6 +2237,14 @@
     touch-action: none;
   }
 
+  .x1764fhq {
+    transform-box: fill-box;
+  }
+
+  .x1ybzjv4 {
+    transform-origin: 16px 16px;
+  }
+
   .x1g0ag68 {
     transform-origin: center;
   }
@@ -1978,8 +2261,12 @@
     transform: rotate(90deg);
   }
 
-  .x3oybdh {
-    transform: scale(1);
+  .x11lhmoz {
+    transform: translate(-50%, -50%);
+  }
+
+  .xacbhai {
+    transform: translateY(var(--drawer-swipe-movement-y, 0px));
   }
 
   .xx6bhzk {
@@ -1998,10 +2285,18 @@
     transition-duration: .2s;
   }
 
+  .x1szhkt1 {
+    transition-duration: var(--stridge-kit-duration-normal);
+  }
+
   .x1vhb3u9 {
     transition-duration: var(--stridge-kit-duration-fast);
   }
 
+  .x1s4mzch {
+    transition-duration: var(--stridge-kit-duration-slow);
+  }
+
   .x11vqxbs {
     transition-property: background-color, border-color, box-shadow;
   }
@@ -2014,6 +2309,10 @@
     transition-property: background-color, border-color, color, box-shadow, transform;
   }
 
+  .xgzoi8n {
+    transition-property: background-color, border-color, color, box-shadow;
+  }
+
   .x1eaenvl {
     transition-property: background-color, border-color, color;
   }
@@ -2034,10 +2333,18 @@
     transition-property: border-color, box-shadow;
   }
 
+  .xshfolx {
+    transition-property: border-color;
+  }
+
   .xkdsq27 {
     transition-property: box-shadow;
   }
 
+  .xt3l3uh {
+    transition-property: color;
+  }
+
   .x1vma9ed {
     transition-property: font-size, width;
   }
@@ -2046,6 +2353,10 @@
     transition-property: height;
   }
 
+  .x36inuq {
+    transition-property: left, right, top, bottom, width, height;
+  }
+
   .x19991ni {
     transition-property: opacity;
   }
@@ -2066,6 +2377,10 @@
     transition-timing-function: ease-out;
   }
 
+  .xr4whw6 {
+    transition-timing-function: var(--stridge-kit-ease-enter);
+  }
+
   .x1xv5090 {
     transition-timing-function: var(--stridge-kit-ease-out);
   }
@@ -2111,10 +2426,6 @@
     will-change: height;
   }
 
-  .x6my1t9 {
-    will-change: opacity,transform;
-  }
-
   .x1q1rmc8 {
     will-change: transform,opacity;
   }
@@ -2135,6 +2446,10 @@
     z-index: 1;
   }
 
+  .x1n327nk {
+    z-index: 10;
+  }
+
   .x11uqc5h {
     z-index: 100;
   }
@@ -2171,6 +2486,14 @@
     z-index: var(--stridge-kit-z-popover);
   }
 
+  .x3ppix8:active:not(:disabled) {
+    background-color: color-mix(in oklab,var(--stridge-kit-card-surface) 78%,var(--stridge-kit-foreground));
+  }
+
+  .x16sea6d:hover:not(:disabled) {
+    background-color: color-mix(in oklab,var(--stridge-kit-card-surface) 89%,var(--stridge-kit-foreground));
+  }
+
   .x3celgi:active:not(:disabled) {
     background-color: color-mix(in oklab,var(--stridge-kit-surface-hover) 70%,var(--stridge-kit-foreground));
   }
@@ -2219,6 +2542,18 @@
     box-shadow: var(--stridge-kit-shadow-ring-focus);
   }
 
+  .x1perupi:is(a:hover, a:focus-visible) [data-stridge-slot~="attribution-mark"] {
+    color: color-mix(in oklab,var(--stridge-kit-attribution-mark-color) 78%,var(--stridge-kit-foreground));
+  }
+
+  .x19k0ldo:is(a:hover, a:focus-visible) [data-stridge-slot~="attribution-wordmark"] {
+    color: color-mix(in oklab,var(--stridge-kit-attribution-wordmark-color) 78%,var(--stridge-kit-foreground));
+  }
+
+  .x1wa2jhk:is(a:hover, a:focus-visible) [data-stridge-slot~="attribution-prefix"] {
+    color: color-mix(in oklab,var(--stridge-kit-attribution-prefix-color) 78%,var(--stridge-kit-foreground));
+  }
+
   .x111phvh:active:not(:disabled), .x70x1a4:hover:not(:disabled) {
     color: var(--stridge-kit-foreground);
   }
@@ -2227,6 +2562,10 @@
     color: var(--stridge-kit-muted-foreground);
   }
 
+  .x1i2unn7:is([data-starting-style], [data-ending-style]) {
+    opacity: 0;
+  }
+
   .x11ayl2i:focus-visible {
     outline-color: var(--stridge-kit-ring);
   }
@@ -2247,6 +2586,14 @@
     outline-width: 2px;
   }
 
+  .x1diuls0:is(a:hover, a:focus-visible) [data-stridge-slot~="attribution-wordmark"] {
+    text-underline-offset: 2px;
+  }
+
+  .xjvuu2i:is([data-starting-style], [data-ending-style]) {
+    transform: translateY(100%);
+  }
+
   .x1yi73pz:has( > input:focus-visible,  > textarea:focus-visible) {
     box-shadow: var(--stridge-kit-shadow-ring-focus);
   }
@@ -2307,6 +2654,10 @@
     background-color: color-mix(in oklab,var(--stridge-kit-destructive) 80%,var(--stridge-kit-foreground));
   }
 
+  .xyv6lf4:hover {
+    background-color: color-mix(in oklab,var(--stridge-kit-tabs-list-surface) 50%,transparent);
+  }
+
   .x1ehxjrm:hover {
     background-color: color-mix(in oklab,var(--stridge-kit-destructive-soft) 86%,var(--stridge-kit-foreground));
   }
@@ -2327,6 +2678,10 @@
     color: var(--stridge-kit-muted-foreground);
   }
 
+  .xbs6d1p:hover {
+    color: var(--stridge-kit-tabs-tab-foreground-active);
+  }
+
   .x1mzqehw:hover {
     opacity: .6;
   }
@@ -2380,6 +2735,10 @@
       animation-duration: 0s;
     }
 
+    .x80wavc.x80wavc {
+      animation-duration: 3.5s;
+    }
+
     .x1aquc0h.x1aquc0h {
       animation-name: none;
     }
@@ -2387,6 +2746,10 @@
     .x12w9bfk.x12w9bfk {
       transition-duration: 0s;
     }
+
+    .x4wkmsb.x4wkmsb {
+      transition-property: none;
+    }
   }
 
   @container field-group (width >= 32rem) {
@@ -2451,6 +2814,10 @@
     border-top-color: var(--stridge-kit-card-border);
   }
 
+  .x19bq4ie {
+    border-top-color: var(--stridge-kit-details-border);
+  }
+
   .x1wc9ssx {
     border-top-color: var(--stridge-kit-card-border-frame);
   }
@@ -2511,6 +2878,10 @@
     height: 14px;
   }
 
+  .x1ymw6g {
+    height: 160px;
+  }
+
   .xlup9mm {
     height: 16px;
   }
@@ -2535,6 +2906,14 @@
     height: 200px;
   }
 
+  .x1qx5ct2 {
+    height: 20px;
+  }
+
+  .x17rw0jw {
+    height: 22px;
+  }
+
   .xxk0z11 {
     height: 24px;
   }
@@ -2551,6 +2930,10 @@
     height: 36px;
   }
 
+  .xn3w4p2 {
+    height: 44px;
+  }
+
   .xwvwv9b {
     height: 46px;
   }
@@ -2559,6 +2942,10 @@
     height: 64px;
   }
 
+  .xdk7pt {
+    height: 8px;
+  }
+
   .xegnrdp {
     height: 9px;
   }
@@ -2571,10 +2958,18 @@
     height: fit-content;
   }
 
+  .x1gezbiy {
+    height: var(--active-tab-height);
+  }
+
   .xuan8c8 {
     height: var(--collapsible-panel-height);
   }
 
+  .xl3s093 {
+    height: var(--stridge-kit-drawer-handle-thickness);
+  }
+
   .x1nrll8i {
     left: 50%;
   }
@@ -2583,6 +2978,10 @@
     left: auto;
   }
 
+  .xvbikie {
+    left: var(--active-tab-left);
+  }
+
   .xat24cr {
     margin-bottom: 0;
   }
@@ -2679,10 +3078,18 @@
     max-height: calc(100% - 2rem);
   }
 
+  .x17geuhg {
+    max-height: min(60vh, 500px);
+  }
+
   .x1ko6lg0 {
     max-height: min(var(--available-height),200px);
   }
 
+  .x96tae4 {
+    max-height: var(--stridge-kit-drawer-max-block-size);
+  }
+
   .x193iq5w {
     max-width: 100%;
   }
@@ -2707,6 +3114,10 @@
     max-width: min(var(--stridge-kit-dialog-width),calc(100% - 2rem));
   }
 
+  .x1qvtwti {
+    max-width: var(--stridge-kit-drawer-max-inline-size);
+  }
+
   .x2lwn1j {
     min-height: 0;
   }
@@ -2735,6 +3146,10 @@
     min-height: 32px;
   }
 
+  .x1dby22o {
+    min-height: 360px;
+  }
+
   .x1ba4aug {
     min-height: 40px;
   }
@@ -2767,10 +3182,6 @@
     overflow-y: auto;
   }
 
-  .x1rife3k {
-    overflow-y: scroll;
-  }
-
   .xnw97ix {
     padding-bottom: .125rem;
   }
@@ -2819,10 +3230,18 @@
     padding-bottom: var(--stridge-kit-space-3);
   }
 
+  .xpnfv0q {
+    padding-bottom: var(--stridge-kit-space-5);
+  }
+
   .x1ww8orz {
     padding-bottom: var(--stridge-kit-space-2);
   }
 
+  .x1ej8hiu {
+    padding-bottom: var(--stridge-kit-space-10);
+  }
+
   .xrhwvvd {
     padding-top: .125rem;
   }
@@ -2887,6 +3306,10 @@
     padding-top: 9px;
   }
 
+  .xtgch2x {
+    padding-top: var(--stridge-kit-space-6);
+  }
+
   .x1h03h88 {
     padding-top: var(--stridge-kit-space-4);
   }
@@ -2899,10 +3322,18 @@
     padding-top: var(--stridge-kit-space-3);
   }
 
+  .x4xct4k {
+    padding-top: var(--stridge-kit-space-5);
+  }
+
   .x2tg1xt {
     padding-top: var(--stridge-kit-space-2);
   }
 
+  .x1saie51 {
+    padding-top: var(--stridge-kit-space-10);
+  }
+
   .x13vifvy {
     top: 0;
   }
@@ -2911,6 +3342,14 @@
     top: 14px;
   }
 
+  .xwa60dl {
+    top: 50%;
+  }
+
+  .x10uur0e {
+    top: var(--active-tab-top);
+  }
+
   .xh8yej3 {
     width: 100%;
   }
@@ -2935,10 +3374,18 @@
     width: 14px;
   }
 
+  .xq1dxzn {
+    width: 160px;
+  }
+
   .x1kky2od {
     width: 16px;
   }
 
+  .x1xp8n7a {
+    width: 18px;
+  }
+
   .x1so1ns2 {
     width: 192px;
   }
@@ -2947,10 +3394,18 @@
     width: 1em;
   }
 
+  .xw4jnvo {
+    width: 20px;
+  }
+
   .x16grhtn {
     width: 220px;
   }
 
+  .x17z2i9w {
+    width: 22px;
+  }
+
   .xgd8bvy {
     width: 28px;
   }
@@ -2967,10 +3422,26 @@
     width: 36px;
   }
 
+  .x187nhsf {
+    width: 44px;
+  }
+
+  .x1bu4hv2 {
+    width: 5ch;
+  }
+
   .x1fu8urw {
     width: 64px;
   }
 
+  .xig3uv9 {
+    width: 6ch;
+  }
+
+  .x1xc55vz {
+    width: 8px;
+  }
+
   .xfxxnmn {
     width: calc(100% - 28px);
   }
@@ -2983,6 +3454,22 @@
     width: max-content;
   }
 
+  .xoffw1 {
+    width: var(--active-tab-width);
+  }
+
+  .x19k59d4 {
+    width: var(--stridge-kit-drawer-handle-size);
+  }
+
+  .x1et6zyk.x1et6zyk:where([dir="rtl"]) :scope {
+    left: auto;
+  }
+
+  .xdvm21q.xdvm21q:where([dir="rtl"]) :scope {
+    right: var(--active-tab-right);
+  }
+
   .x1g31smg:first-child {
     border-top-width: 0;
   }
@@ -3043,6 +3530,10 @@
 }
 
 @layer priority6 {
+  .x7kzco9[data-active] {
+    border-color: var(--stridge-kit-foreground);
+  }
+
   .x13rkwjk[aria-invalid="true"][data-popup-open], .x1e0f7l1[aria-invalid="true"], .xu6psuv[aria-invalid="true"]:focus-visible {
     border-color: var(--stridge-kit-destructive-border);
   }
@@ -3105,10 +3596,18 @@
     animation-timing-function: var(--stridge-kit-ease-exit);
   }
 
+  .xthri8c[data-active], .xynnxzo[data-disabled] {
+    background-color: #0000;
+  }
+
   .xevhoj0[data-highlighted] {
     background-color: var(--stridge-kit-tile-surface);
   }
 
+  .x1anawn6[data-active] {
+    background-color: var(--stridge-kit-foreground);
+  }
+
   .x9oo2q2[aria-expanded="true"] {
     background-color: var(--stridge-kit-muted);
   }
@@ -3133,18 +3632,42 @@
     color: var(--stridge-kit-destructive);
   }
 
+  .xctydo3[data-disabled] {
+    color: var(--stridge-kit-tabs-tab-foreground);
+  }
+
   .x163giyb[data-highlighted] {
     color: var(--stridge-kit-popover-foreground);
   }
 
+  .xqclgz3[data-active] {
+    color: var(--stridge-kit-tabs-tab-foreground-active);
+  }
+
+  .xuz9cdh[data-active] {
+    color: var(--stridge-kit-background);
+  }
+
+  .x1j1ks5o[data-disabled] {
+    cursor: not-allowed;
+  }
+
   .xzuuoaq[hidden]:not([hidden="until-found"]) {
     display: none;
   }
 
-  .xrvs7vr[data-orientation="horizontal"] {
+  .x1nquej0[data-orientation="vertical"], .xrvs7vr[data-orientation="horizontal"] {
     flex-direction: column;
   }
 
+  .xlpxku1[data-orientation="vertical"] {
+    flex-direction: row;
+  }
+
+  .x1xpet1t[data-active] {
+    font-weight: var(--stridge-kit-font-weight-semibold);
+  }
+
   .x118mprz[data-side="inline-start"] {
     inset-inline-end: -13px;
   }
@@ -3161,6 +3684,10 @@
     inset-inline-start: 0;
   }
 
+  .x1sydc4h[data-orientation="vertical"] {
+    justify-content: flex-start;
+  }
+
   .x11xjgb3[data-disabled] {
     opacity: .45;
   }
@@ -3197,6 +3724,10 @@
     transform: rotate(90deg);
   }
 
+  .xsqp3co[data-swiping] {
+    transition-duration: 0s;
+  }
+
   @media (prefers-reduced-motion: reduce) {
     .xgx5xwo.xgx5xwo[data-closed], .xslpr3k.xslpr3k[data-open] {
       animation-duration: 0s;
@@ -3225,6 +3756,10 @@
     flex: 1;
   }
 
+  .x1nzntce[data-orientation="horizontal"] {
+    height: .125rem;
+  }
+
   .x12wejat[data-ending-style], .x1fe7yth[data-starting-style] {
     height: 0;
   }
@@ -3233,6 +3768,14 @@
     height: 100%;
   }
 
+  .x6demw2[data-orientation="vertical"] {
+    height: calc(var(--active-tab-height) * .8);
+  }
+
+  .x1smgklz[data-orientation="vertical"] {
+    height: fit-content;
+  }
+
   .x1thhcpk[data-orientation="horizontal"] {
     height: var(--stridge-kit-space-3);
   }
@@ -3241,6 +3784,10 @@
     left: -13px;
   }
 
+  .x1fhtaip[data-orientation="vertical"] {
+    left: 0;
+  }
+
   .x1f3sk1h[data-side="left"] {
     right: -13px;
   }
@@ -3257,13 +3804,29 @@
     top: 100%;
   }
 
-  .x90yeee[data-orientation="horizontal"] {
+  .xfdi2ae[data-orientation="vertical"] {
+    top: calc(var(--active-tab-top) + var(--active-tab-height) * .1);
+  }
+
+  .x13i9a9u[data-orientation="vertical"] {
+    width: .125rem;
+  }
+
+  .x1nvwyg1[data-orientation="vertical"], .x90yeee[data-orientation="horizontal"] {
     width: 100%;
   }
 
   .xr4lo6p[data-orientation="vertical"] {
     width: var(--stridge-kit-space-3);
   }
+
+  .xqse6zn.xqse6zn:where([dir="rtl"]) :scope[data-orientation="vertical"] {
+    left: auto;
+  }
+
+  .x1ef44r0.x1ef44r0:where([dir="rtl"]) :scope[data-orientation="vertical"] {
+    right: 0;
+  }
 }
 
 @layer priority9 {
@@ -3396,6 +3959,26 @@
   }
 }
 
+@keyframes x18re5ia-B {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes xmr5gd0-B {
+  0%, 80%, 100% {
+    opacity: 0;
+  }
+
+  40% {
+    opacity: 1;
+  }
+}
+
 @keyframes x1k48ry3-B {
   from {
     opacity: 0;
@@ -3408,6 +3991,18 @@
   }
 }
 
+@keyframes x1deacm-B {
+  0% {
+    opacity: 0;
+    transform: translateY(2px);
+  }
+
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
 @keyframes x1l9pw95-B {
   0% {
     opacity: 0;