@nattstack/ui 0.0.107 → 0.1.1

package/dist/components/stylex.css

@@ -0,0 +1,1420 @@
+
+
+@layer components.priority1;
+
+@layer components.priority2 {
+  .x10a8y8t {
+    inset: 0;
+  }
+
+  .x1717udv {
+    padding: 0;
+  }
+
+  .xc7ga6q {
+    padding: 12px;
+  }
+
+  .x1tamke2 {
+    padding: 16px;
+  }
+
+  .xggk2y7 {
+    padding: 24px;
+  }
+
+  .x1i3ajwb {
+    padding: 2px;
+  }
+
+  .xfawy5m {
+    padding: 4px;
+  }
+
+  .x1r1ic4w {
+    scroll-padding: 4px;
+  }
+
+  .x3cdv55:not(:empty) {
+    padding: 8px 12px;
+  }
+
+  @media (width <= 640px) {
+    .x16g1wpl.x16g1wpl {
+      padding: 48px 0 0;
+    }
+  }
+}
+
+@layer components.priority3 {
+  .x14i3s5s {
+    border-color: var(--color-border);
+  }
+
+  .x1q4ynmn {
+    border-radius: 10px;
+  }
+
+  .x1ctf4ec {
+    border-radius: 11px;
+  }
+
+  .x4pepcl {
+    border-radius: 12px;
+  }
+
+  .xixl9f9 {
+    border-radius: 14px;
+  }
+
+  .xgqmno8 {
+    border-radius: 16px;
+  }
+
+  .xugzpu4 {
+    border-radius: 18px;
+  }
+
+  .x1m3ak92 {
+    border-radius: 20px;
+  }
+
+  .x13pz1uv {
+    border-radius: 22px;
+  }
+
+  .x1khhgft {
+    border-radius: 24px;
+  }
+
+  .x12oqio5 {
+    border-radius: 4px;
+  }
+
+  .xur7f20 {
+    border-radius: 8px;
+  }
+
+  .x10hpsqq {
+    border-radius: 9999px;
+  }
+
+  .xhpnuu7 {
+    border-radius: 9px;
+  }
+
+  .xujip75 {
+    border-radius: var(--border-radius);
+  }
+
+  .xng3xce {
+    border-style: none;
+  }
+
+  .x1y0btm7 {
+    border-style: solid;
+  }
+
+  .xmkeg23 {
+    border-width: 1px;
+  }
+
+  .x167g77z {
+    gap: 8px;
+  }
+
+  .x1twdi5u {
+    margin-block: 12px;
+  }
+
+  .x8q42hb {
+    margin-block: 2px;
+  }
+
+  .xxbjj12 {
+    margin-inline: 8px;
+  }
+
+  .xvueqy4 {
+    margin-inline: auto;
+  }
+
+  .x1a2a7pz {
+    outline: none;
+  }
+
+  .xb3r6kr {
+    overflow: hidden;
+  }
+
+  .xish69e {
+    overscroll-behavior: contain;
+  }
+
+  .xt970qd {
+    padding-block: 0;
+  }
+
+  .x12ulsxz {
+    padding-block: 4px;
+  }
+
+  .xxzk6he {
+    padding-block: 6px 4px;
+  }
+
+  .x1t0vds8 {
+    padding-block: 6px;
+  }
+
+  .x1vvogim {
+    padding-block: 8px;
+  }
+
+  .xnjsko4 {
+    padding-inline: 0;
+  }
+
+  .x1awh872 {
+    padding-inline: 10px;
+  }
+
+  .xaope02 {
+    padding-inline: 12px;
+  }
+
+  .xqin4a2 {
+    padding-inline: 14px;
+  }
+
+  .x1hr3lfm {
+    padding-inline: 16px;
+  }
+
+  .xelufkg {
+    padding-inline: 17px;
+  }
+
+  .x12j899k {
+    padding-inline: 18px;
+  }
+
+  .x17qtykl {
+    padding-inline: 20px;
+  }
+
+  .x16l46lf {
+    padding-inline: 23px;
+  }
+
+  .x1pbfunf {
+    padding-inline: 28px;
+  }
+
+  .xdqyycr {
+    padding-inline: 8px;
+  }
+
+  .x1hl2dhg {
+    text-decoration: none;
+  }
+
+  .x81i4et[data-checked] {
+    border-color: #0000;
+  }
+
+  .x7n6cpb:hover {
+    border-color: var(--color-gray-6);
+  }
+}
+
+@layer components.priority4 {
+  .x6s0dn4 {
+    align-items: center;
+  }
+
+  .x1yy6ivq {
+    align-items: safe center;
+  }
+
+  .x1q3qbx4 {
+    animation-duration: 1s;
+  }
+
+  .xa4qsjk {
+    animation-iteration-count: infinite;
+  }
+
+  .x1m7ugx0 {
+    animation-name: x1wfl5al-B;
+  }
+
+  .xbv57ra {
+    animation-timing-function: steps(12, end);
+  }
+
+  .xjyslct {
+    appearance: none;
+  }
+
+  .x1y5e3q9 {
+    aspect-ratio: 1;
+  }
+
+  .x42x0ya {
+    background-color: #000;
+  }
+
+  .xjbqb8w {
+    background-color: #0000;
+  }
+
+  .x1h73wb5 {
+    background-color: var(--color-bg-shell-inner);
+  }
+
+  .x1m4xfpy {
+    background-color: var(--color-border);
+  }
+
+  .xm8sm7k {
+    background-color: var(--color-gray-1);
+  }
+
+  .x1escjlh {
+    background-color: var(--color-gray-12);
+  }
+
+  .x2j0cto {
+    background-color: var(--color-gray-3);
+  }
+
+  .x1tcrco7 {
+    background-color: var(--color-gray-4);
+  }
+
+  .xfl8pkj {
+    background-color: var(--color-gray-6);
+  }
+
+  .xa4c8pb {
+    background-color: var(--color-primary-9);
+  }
+
+  .x191mfzf {
+    background-color: var(--color-tooltip-bg);
+  }
+
+  .x12peec7 {
+    background-color: #fff;
+  }
+
+  .x1ikjq0b {
+    box-shadow: 0 .5px #00000008, 0 36px 15px -4px #00000003, 0 20px 12px -3px #00000008, 0 9px 9px -2px #0000000a, 0 2px 5px -1px #0000000d;
+    box-shadow: 0 .5px lab(0% 0 0 / .03), 0 36px 15px -4px lab(0% 0 0 / .01), 0 20px 12px -3px lab(0% 0 0 / .03), 0 9px 9px -2px lab(0% 0 0 / .04), 0 2px 5px -1px lab(0% 0 0 / .05);
+  }
+
+  .x1bbn379 {
+    box-shadow: 0 1px 3px #0000001a, 0 1px 2px -1px #0000001a;
+  }
+
+  .x1buzmp1 {
+    box-shadow: inset 0 -1px 0 var(--color-border);
+  }
+
+  .x1er153n {
+    box-shadow: inset 0 0 0 1px var(--color-border);
+  }
+
+  .x1gnnqk1 {
+    box-shadow: none;
+  }
+
+  .x1heor9g {
+    color: inherit;
+  }
+
+  .x19co3pv {
+    color: #0000;
+  }
+
+  .xf4b43d {
+    color: var(--color-gray-1);
+  }
+
+  .x1dtbpl2 {
+    color: var(--color-gray-11);
+  }
+
+  .x197k1c5 {
+    color: var(--color-gray-12);
+  }
+
+  .x1vpwubs {
+    color: var(--color-gray-9);
+  }
+
+  .x9i09x5 {
+    color: var(--color-primary-9);
+  }
+
+  .x1tgivj0 {
+    color: var(--color-text-primary);
+  }
+
+  .xv1l7n4 {
+    color: var(--color-text-secondary);
+  }
+
+  .x1x01sck {
+    color: var(--color-tooltip);
+  }
+
+  .xfex06f {
+    column-gap: 8px;
+  }
+
+  .x1sqbtui {
+    cursor: auto;
+  }
+
+  .x1h6gzvc {
+    cursor: not-allowed;
+  }
+
+  .x1ypdohk {
+    cursor: pointer;
+  }
+
+  .x1ed109x {
+    cursor: text;
+  }
+
+  .x78zum5 {
+    display: flex;
+  }
+
+  .x3nfvp2 {
+    display: inline-flex;
+  }
+
+  .x1s85apg {
+    display: none;
+  }
+
+  .x1r8uery {
+    flex-basis: 0;
+  }
+
+  .xdt5ytf {
+    flex-direction: column;
+  }
+
+  .x1q0g3np {
+    flex-direction: row;
+  }
+
+  .x1iyjqo2 {
+    flex-grow: 1;
+  }
+
+  .x2lah0s {
+    flex-shrink: 0;
+  }
+
+  .xs83m0k {
+    flex-shrink: 1;
+  }
+
+  .x1a02dak {
+    flex-wrap: wrap;
+  }
+
+  .xjb2p0i {
+    font-family: inherit;
+  }
+
+  .xgxxoiu {
+    font-size: 0;
+  }
+
+  .xfifm61 {
+    font-size: 12px;
+  }
+
+  .x4z9k3i {
+    font-size: 13px;
+  }
+
+  .xif65rj {
+    font-size: 14px;
+  }
+
+  .xo1l8bm {
+    font-weight: 400;
+  }
+
+  .x10p5zqr {
+    font-weight: 450;
+  }
+
+  .xc8icb0 {
+    isolation: isolate;
+  }
+
+  .xl56j7k {
+    justify-content: center;
+  }
+
+  .xej7fhh {
+    justify-content: safe center;
+  }
+
+  .x1evy7pa {
+    line-height: 1.5;
+  }
+
+  .x1xyvc85 {
+    opacity: .15;
+  }
+
+  .xvpkmg4 {
+    opacity: .25;
+  }
+
+  .x1b0snh4 {
+    opacity: .325;
+  }
+
+  .xti2d7y {
+    opacity: .4;
+  }
+
+  .x1sfcrbg {
+    opacity: .475;
+  }
+
+  .xbyyjgo {
+    opacity: .5;
+  }
+
+  .xwq05k6 {
+    opacity: .55;
+  }
+
+  .x8qkkdt {
+    opacity: .625;
+  }
+
+  .x1ks1olk {
+    opacity: .7;
+  }
+
+  .x11t8jnp {
+    opacity: .775;
+  }
+
+  .xiiclqw {
+    opacity: .85;
+  }
+
+  .x1skojfp {
+    opacity: .925;
+  }
+
+  .xg01cxk {
+    opacity: 0;
+  }
+
+  .x1hc1fzr {
+    opacity: 1;
+  }
+
+  .x1b866l {
+    opacity: calc(var(--backdrop-opacity) * (1 - var(--drawer-swipe-progress)));
+  }
+
+  .x1uczgqu {
+    outline-color: #0000;
+  }
+
+  .x43yjvr {
+    outline-color: var(--color-outline);
+  }
+
+  .x1luwoo2 {
+    outline-color: var(--color-primary-9);
+  }
+
+  .x1du7r5n {
+    outline-color: var(--color-primary);
+  }
+
+  .x2ssjo2 {
+    outline-offset: -2px;
+  }
+
+  .xr2mjdv {
+    outline-offset: -4px;
+  }
+
+  .x1hl8ikr {
+    outline-offset: 2px;
+  }
+
+  .xaatb59 {
+    outline-style: solid;
+  }
+
+  .x1k57tk5 {
+    outline-width: 0;
+  }
+
+  .x1de99jn {
+    outline-width: 2px;
+  }
+
+  .x47corl {
+    pointer-events: none;
+  }
+
+  .x10l6tqk {
+    position: absolute;
+  }
+
+  .xixxii4 {
+    position: fixed;
+  }
+
+  .x1n2onr6 {
+    position: relative;
+  }
+
+  .x288g5 {
+    resize: vertical;
+  }
+
+  .x1gcftaf {
+    rotate: 0deg;
+  }
+
+  .x1yqfaqn {
+    rotate: 120deg;
+  }
+
+  .x1rtxy7 {
+    rotate: 150deg;
+  }
+
+  .x1qul50q {
+    rotate: 180deg;
+  }
+
+  .x5f4xin {
+    rotate: 210deg;
+  }
+
+  .x13zb3im {
+    rotate: 240deg;
+  }
+
+  .x7lonkb {
+    rotate: 270deg;
+  }
+
+  .xyp7w1s {
+    rotate: 300deg;
+  }
+
+  .xqd20pc {
+    rotate: 30deg;
+  }
+
+  .xggx6ht {
+    rotate: 330deg;
+  }
+
+  .xhmk0vv {
+    rotate: 60deg;
+  }
+
+  .xq77vm1 {
+    rotate: 90deg;
+  }
+
+  .x1dbijih {
+    row-gap: 2px;
+  }
+
+  .xngwomw {
+    scale: -1 1;
+  }
+
+  .x1hsy5kr {
+    scale: 1;
+  }
+
+  .xqjr0vm {
+    stroke-width: 3px;
+  }
+
+  .xqvyd8v {
+    stroke: #fff;
+  }
+
+  .x2b8uid {
+    text-align: center;
+  }
+
+  .xlyipyv {
+    text-overflow: ellipsis;
+  }
+
+  .x1kol6zn {
+    transform-origin: 0;
+  }
+
+  .xctpfpq {
+    transform-origin: var(--transform-origin);
+  }
+
+  .x1c071of {
+    transform: none;
+  }
+
+  .xx6bhzk {
+    transition-duration: .15s;
+  }
+
+  .xfagghw {
+    transition-property: all;
+  }
+
+  .xts7igz {
+    transition-property: background-color, border-color;
+  }
+
+  .x1koyr57 {
+    transition-property: background-color, box-shadow, color;
+  }
+
+  .x101bfz1 {
+    transition-property: background-color, box-shadow, translate;
+  }
+
+  .x106061f {
+    transition-property: background-color, box-shadow;
+  }
+
+  .xs2xxs2 {
+    transition-property: background-color, color;
+  }
+
+  .x15406qy {
+    transition-property: background-color;
+  }
+
+  .xe97l14 {
+    transition-property: box-shadow, opacity;
+  }
+
+  .xkdsq27 {
+    transition-property: box-shadow;
+  }
+
+  .xt3l3uh {
+    transition-property: color;
+  }
+
+  .x1ym43eq {
+    transition-property: left, width;
+  }
+
+  .x1h615f9 {
+    transition-property: opacity, scale;
+  }
+
+  .x6o7n8i {
+    transition-property: opacity, transform;
+  }
+
+  .x19991ni {
+    transition-property: opacity;
+  }
+
+  .x1s3hfkw {
+    transition-property: rotate;
+  }
+
+  .x11xpdln {
+    transition-property: transform;
+  }
+
+  .xwji4o3 {
+    transition-timing-function: ease;
+  }
+
+  .x3sa99s {
+    translate: 0 -50%;
+  }
+
+  .x1qeszuu {
+    translate: 0;
+  }
+
+  .x1kxipp6 {
+    -webkit-user-select: auto;
+    user-select: auto;
+  }
+
+  .x87ps6o {
+    -webkit-user-select: none;
+    user-select: none;
+  }
+
+  .xuxw1ft {
+    white-space: nowrap;
+  }
+
+  .x6my1t9 {
+    will-change: opacity,transform;
+  }
+
+  .x8knxv4 {
+    z-index: -1;
+  }
+
+  .x1fdshc9 {
+    z-index: -2;
+  }
+
+  .x68pp3s {
+    z-index: 30;
+  }
+
+  .xa9119d {
+    z-index: 50;
+  }
+
+  .xpy517o.xpy517o:where(:has(.x-default-marker:disabled)) {
+    background-color: var(--color-gray-3);
+  }
+
+  .x1beebc2.x1beebc2:where(:has(.x-default-marker:disabled)) {
+    cursor: not-allowed;
+  }
+
+  .x116ge45.x116ge45:where(:has(.x-default-marker:disabled)) {
+    opacity: .5;
+  }
+
+  .xalcron:hover:not(:disabled) {
+    background-color: color-mix(in oklab,var(--color-gray-12) 100%,var(--color-gray-1) 25%);
+  }
+
+  .x18ejm1c[data-active] {
+    background-color: #0000;
+  }
+
+  .x160dr52[data-highlighted][data-disabled]:not(:hover), .x1cgdd2a[data-highlighted]:not([data-disabled]), .xhsv7s5[data-pressed], .xm4hijy[data-popup-open], .xoepl9e[data-disabled] {
+    background-color: var(--color-gray-3);
+  }
+
+  .x1pflddp:hover:not(:disabled) {
+    background-color: var(--color-gray-4);
+  }
+
+  .x1hhl9jx[data-checked] {
+    background-color: var(--color-primary-9);
+  }
+
+  .x1qny0gl[data-checked] {
+    background-color: var(--color-primary);
+  }
+
+  .xofwk0p[data-popup-open] {
+    box-shadow: inset 0 0 0 1px #0000;
+  }
+
+  .x1ytwql3:hover:not([data-disabled], :has(:disabled)), .xhxsgan:enabled[data-is-active="true"], .xwsgaks:hover:not(:disabled, [data-popup-open]) {
+    box-shadow: inset 0 0 0 1px var(--color-gray-6);
+  }
+
+  .x11uh7ir[data-pressed] {
+    box-shadow: inset 0 0 0 1px var(--color-primary);
+  }
+
+  .x7auhu6:hover:not(:disabled) {
+    box-shadow: none;
+  }
+
+  .x1dua4oe[data-active] {
+    color: var(--color-gray-1);
+  }
+
+  .x58zf59[data-active] {
+    color: var(--color-gray-12);
+  }
+
+  .x1juq307[data-placeholder], .xn64az2.xn64az2:where(.x-default-marker[data-placeholder] *) {
+    color: var(--color-gray-9);
+  }
+
+  .xp9l56k[data-pressed] {
+    color: var(--color-text-primary);
+  }
+
+  .x5y519c:not(:empty) {
+    color: var(--color-text-secondary);
+  }
+
+  .x5ezrf1[data-disabled] {
+    cursor: not-allowed;
+  }
+
+  .x1vilw8v[data-empty] {
+    display: none;
+  }
+
+  .x1iczwhp.x1iczwhp:where(.x-default-marker[data-is-masked="true"] *) {
+    font-family: var(--font-code);
+  }
+
+  .xigw2gj:not(:empty) {
+    font-size: 14px;
+  }
+
+  .xhqi7ye:not(:empty) {
+    font-weight: 450;
+  }
+
+  .xxh3kiz[data-disabled] {
+    opacity: .5;
+  }
+
+  .x1pimrze:is([data-ending-style], [data-starting-style]) {
+    opacity: 0;
+  }
+
+  .xyn2shw[data-checked] {
+    opacity: 1;
+  }
+
+  .x1mr6snm[data-is-valid="true"] {
+    outline-color: #30a46c;
+  }
+
+  .x43j12e[data-is-invalid="true"] {
+    outline-color: #e5484d;
+  }
+
+  .xfcj4rt:focus-visible {
+    outline-color: var(--color-outline);
+  }
+
+  .x1mp0jls:focus-visible {
+    outline-color: var(--color-primary-9);
+  }
+
+  .x1oifg:focus-within, .xr5th1z:focus-visible {
+    outline-color: var(--color-primary);
+  }
+
+  .x784prv:focus-visible {
+    outline-width: 2px;
+  }
+
+  .xxh3ss5.xxh3ss5:where(.x-default-marker[data-popup-open] *) {
+    rotate: 180deg;
+  }
+
+  .xx6l7ed:is([data-ending-style], [data-starting-style]) {
+    scale: .975;
+  }
+
+  .x1fpexdu:is([data-side="inline-end"][data-ending-style], [data-side="inline-end"][data-starting-style], [data-side="right"][data-ending-style], [data-side="right"][data-starting-style]) {
+    transform: scale(.975) translateX(-4px);
+  }
+
+  .xaf6vq3:is([data-side="inline-start"][data-ending-style], [data-side="inline-start"][data-starting-style], [data-side="left"][data-ending-style], [data-side="left"][data-starting-style]) {
+    transform: scale(.975) translateX(4px);
+  }
+
+  .xmrwbtw:is([data-side="bottom"][data-ending-style], [data-side="bottom"][data-starting-style]) {
+    transform: scale(.975) translateY(-4px);
+  }
+
+  .x1usa04o:is([data-side="top"][data-ending-style], [data-side="top"][data-starting-style]) {
+    transform: scale(.975) translateY(4px);
+  }
+
+  .x1t4ihx1:is([data-ending-style], [data-starting-style]) {
+    transform: scale(.975);
+  }
+
+  .x1bad46t[data-checked] {
+    transform: translateX(var(--translateX));
+  }
+
+  .xm69ghq[data-swiping], .xuik8z1[data-instant] {
+    transition-duration: 0s;
+  }
+
+  .x10t6uq9[data-ending-style] {
+    transition-duration: calc(var(--drawer-swipe-strength) * .4s);
+  }
+
+  .xfm2kp[data-instant] {
+    transition-property: none;
+  }
+
+  .x1avgydi:active:not(:disabled) {
+    translate: 0 1px;
+  }
+
+  .xk78c8h[data-swiping] {
+    -webkit-user-select: none;
+    user-select: none;
+  }
+
+  .xfi2sx2:disabled {
+    background-color: var(--color-gray-3);
+  }
+
+  .x1s07b3s:disabled {
+    cursor: not-allowed;
+  }
+
+  .xijokvz:disabled {
+    opacity: .5;
+  }
+
+  .xpdez7c:disabled {
+    opacity: var(--opacity-picker-disabled);
+  }
+
+  .x12icss0:hover {
+    background-color: var(--color-gray-3);
+  }
+
+  .x135mljp:hover {
+    background-color: var(--color-gray-4);
+  }
+
+  .x1srrrpr:hover {
+    color: var(--color-gray-12);
+  }
+
+  @media (width <= 640px) {
+    .x13k7z1v.x13k7z1v {
+      align-items: safe flex-end;
+    }
+
+    .xfsj286.xfsj286 {
+      display: block;
+    }
+
+    .xpvzxny.xpvzxny {
+      opacity: 1;
+    }
+
+    .x1u4bqw3.x1u4bqw3 {
+      transform: translateY(var(--drawer-swipe-movement-y));
+    }
+
+    .xan356u.xan356u {
+      transition-duration: .45s;
+    }
+
+    .x1lnlnex.x1lnlnex {
+      transition-property: transform;
+    }
+
+    .xxexonw.xxexonw {
+      transition-timing-function: cubic-bezier(.32, .72, 0, 1);
+    }
+  }
+
+  .x1rlgnxn:enabled:hover {
+    box-shadow: inset 0 0 0 1px var(--color-gray-6);
+  }
+
+  @media (width <= 640px) {
+    .xf275dk.xf275dk:is([data-ending-style], [data-starting-style]) {
+      opacity: 1;
+    }
+
+    .x1snmyix.x1snmyix:is([data-ending-style], [data-starting-style]) {
+      transform: scale(1) translateY(100%);
+    }
+
+    .x1ty2x96.x1ty2x96[data-ending-style] {
+      transition-duration: calc(var(--drawer-swipe-strength) * .3s);
+    }
+  }
+
+  .xho1339:enabled:focus, .xnn6d81:enabled:active {
+    box-shadow: inset 0 0 0 1px var(--color-gray-6);
+  }
+}
+
+@layer components.priority5 {
+  .x1s77fqg {
+    border-bottom-color: var(--color-gray-4);
+  }
+
+  .x17sffzf {
+    border-bottom-left-radius: 16px;
+  }
+
+  .xve69zf {
+    border-bottom-right-radius: 16px;
+  }
+
+  .x1q0q8m5 {
+    border-bottom-style: solid;
+  }
+
+  .xso031l {
+    border-bottom-width: 1px;
+  }
+
+  .xtzlleu {
+    border-top-left-radius: 16px;
+  }
+
+  .x34fko1 {
+    border-top-right-radius: 16px;
+  }
+
+  .x1ey2m1c {
+    bottom: 0;
+  }
+
+  .x5yr21d {
+    height: 100%;
+  }
+
+  .xlup9mm {
+    height: 16px;
+  }
+
+  .xmix8c7 {
+    height: 18px;
+  }
+
+  .xjm9jq1 {
+    height: 1px;
+  }
+
+  .xxk0z11 {
+    height: 24px;
+  }
+
+  .x36qwtl {
+    height: 2px;
+  }
+
+  .x10w6t97 {
+    height: 32px;
+  }
+
+  .xc9qbxq {
+    height: 36px;
+  }
+
+  .x1vqgdyp {
+    height: 40px;
+  }
+
+  .xn3w4p2 {
+    height: 44px;
+  }
+
+  .xsdox4t {
+    height: 48px;
+  }
+
+  .xqu0tyb {
+    height: 4px;
+  }
+
+  .xt7dq6l {
+    height: auto;
+  }
+
+  .x13gmgbj {
+    height: calc(var(--size) / 12);
+  }
+
+  .x1gezbiy {
+    height: var(--active-tab-height);
+  }
+
+  .x188dgw3 {
+    height: var(--size);
+  }
+
+  .xvbikie {
+    left: var(--active-tab-left);
+  }
+
+  .xzueoph {
+    margin-bottom: 6px;
+  }
+
+  .x8x9d4c {
+    margin-left: auto;
+  }
+
+  .xqldp2m {
+    max-height: min(var(--available-height),480px);
+  }
+
+  .x7ab17h {
+    max-height: none;
+  }
+
+  .x11gisft {
+    max-width: 640px;
+  }
+
+  .xnx49gs {
+    max-width: min(var(--available-width),320px);
+  }
+
+  .x7k7lee {
+    max-width: var(--available-width);
+  }
+
+  .x21xpn4 {
+    min-height: 32px;
+  }
+
+  .xu0aao5 {
+    min-height: 36px;
+  }
+
+  .x1ba4aug {
+    min-height: 40px;
+  }
+
+  .x1gg8mnh {
+    min-height: 44px;
+  }
+
+  .x1wxaq2x {
+    min-height: 48px;
+  }
+
+  .xcr9lap {
+    min-height: 66px;
+  }
+
+  .xeuugli {
+    min-width: 0;
+  }
+
+  .xfb3i0g {
+    min-width: 180px;
+  }
+
+  .xz962wo {
+    min-width: max(var(--anchor-width),240px);
+  }
+
+  .xw2csxc {
+    overflow-x: auto;
+  }
+
+  .x6ikm8r {
+    overflow-x: hidden;
+  }
+
+  .x1odjw0f {
+    overflow-y: auto;
+  }
+
+  .xyamay9 {
+    padding-top: 16px;
+  }
+
+  .x3m8u43 {
+    right: 0;
+  }
+
+  .xwa60dl {
+    top: 50%;
+  }
+
+  .x10uur0e {
+    top: var(--active-tab-top);
+  }
+
+  .xh8yej3 {
+    width: 100%;
+  }
+
+  .x1kky2od {
+    width: 16px;
+  }
+
+  .x1849jeq {
+    width: 30px;
+  }
+
+  .x1td3qas {
+    width: 32px;
+  }
+
+  .x14qfxbe {
+    width: 36px;
+  }
+
+  .x100vrsf {
+    width: 40px;
+  }
+
+  .x187nhsf {
+    width: 44px;
+  }
+
+  .x1useyqa {
+    width: 48px;
+  }
+
+  .xtnyu7h {
+    width: calc(var(--size) / 2);
+  }
+
+  .xeq5yr9 {
+    width: fit-content;
+  }
+
+  .xezivpi {
+    width: max-content;
+  }
+
+  .x1brm51p {
+    width: -webkit-fill-available;
+    width: -moz-available;
+    width: stretch;
+  }
+
+  .xoffw1 {
+    width: var(--active-tab-width);
+  }
+
+  .x1hhjr3y {
+    width: var(--anchor-width);
+  }
+
+  .x1fjlwjz {
+    width: var(--size);
+  }
+
+  @media (width <= 640px) {
+    .x1lclwwd.x1lclwwd {
+      border-bottom-left-radius: 0;
+    }
+
+    .xgrp7ii.xgrp7ii {
+      border-bottom-right-radius: 0;
+    }
+
+    .x1pwg7sp.x1pwg7sp {
+      border-top-left-radius: var(--radius-mobile);
+    }
+
+    .x18pojzy.x18pojzy {
+      border-top-right-radius: var(--radius-mobile);
+    }
+
+    .x1vy0343.x1vy0343 {
+      padding-top: 0;
+    }
+  }
+}
+
+@layer components.priority6 {
+  .x1f3l70z:after {
+    border-radius: 9999px;
+  }
+}
+
+@layer components.priority7 {
+  .x1hfhjwi:after {
+    background-color: currentColor;
+  }
+
+  .x1ta7s2x::placeholder {
+    color: var(--color-gray-9);
+  }
+
+  .x1s928wv:after {
+    content: "";
+  }
+
+  .x1j6awrg:after {
+    position: absolute;
+  }
+
+  .xjp5s5a::placeholder {
+    -webkit-user-select: none;
+    user-select: none;
+  }
+}
+
+@layer components.priority8 {
+  .x1wsn0xg:after {
+    height: 100%;
+  }
+
+  .xnbfe2x:after {
+    right: 0;
+  }
+
+  .xdnmdmm:after {
+    width: 50%;
+  }
+}
+
+@keyframes x1wfl5al-B {
+  to {
+    rotate: 1turn;
+  }
+}
+
+.x10t59f0 {
+  --backdrop-opacity: var(--opacity-dialog-backdrop);
+}
+
+.xq5qtd1 {
+  --border-radius: 12px;
+}
+
+.x1kpxz5j {
+  --radius-mobile: 16px;
+}
+
+.x14kqwz2 {
+  --size: 12px;
+}
+
+.x1fwrj7o {
+  --size: 16px;
+}
+
+.x16tb73e {
+  --translateX: 12px;
+}
+
+.xksez7u {
+  --translateX: 16px;
+}
+
+@media (width <= 640px) {
+  .xlj1bto.xlj1bto {
+    --radius-mobile: 24px;
+  }
+}