@satellatickets/ui 0.1.0 → 0.2.1

package/dist/web/styles.css

@@ -1,82 +1,8 @@
-.sui-root-iCOp0a {
-  box-sizing: border-box;
-  padding: var(--space-1) var(--space-2);
-  border: var(--border-width-thin) solid var(--badge-border);
-  border-radius: var(--radius-full);
-  background-color: var(--badge-bg);
-  color: var(--badge-fg);
-  font-family: var(--font-family-sans);
-  font-size: var(--font-size-xs);
-  line-height: var(--font-line-height-xs);
-  font-weight: var(--font-weight-medium);
-  align-items: center;
-  display: inline-flex;
-}
-
-.sui-success-iCOp0a {
-  --badge-bg: var(--color-feedback-success-bg);
-  --badge-border: var(--color-feedback-success-border);
-  --badge-fg: var(--color-feedback-success-text);
-}
-
-.sui-warning-iCOp0a {
-  --badge-bg: var(--color-feedback-warning-bg);
-  --badge-border: var(--color-feedback-warning-border);
-  --badge-fg: var(--color-feedback-warning-text);
-}
-
-.sui-danger-iCOp0a {
-  --badge-bg: var(--color-feedback-danger-bg);
-  --badge-border: var(--color-feedback-danger-border);
-  --badge-fg: var(--color-feedback-danger-text);
-}
-
-.sui-info-iCOp0a {
-  --badge-bg: var(--color-feedback-info-bg);
-  --badge-border: var(--color-feedback-info-border);
-  --badge-fg: var(--color-feedback-info-text);
-}
-.sui-root-fYQz2a {
-  --box-padding: initial;
-  --box-padding-x: initial;
-  --box-padding-y: initial;
-  --box-background: initial;
-  --box-radius: initial;
-  --box-border-color: initial;
-  --box-border-width: initial;
-  --box-shadow: initial;
-  --box-flex: initial;
-  box-sizing: border-box;
-  min-width: 0;
-  padding: var(--box-padding, 0);
-  padding-inline: var(--box-padding-x, var(--box-padding, 0));
-  padding-block: var(--box-padding-y, var(--box-padding, 0));
-  background-color: var(--box-background, transparent);
-  border-radius: var(--box-radius, 0);
-  border: var(--box-border-width, 0) solid var(--box-border-color, transparent);
-  box-shadow: var(--box-shadow, none);
-  flex: var(--box-flex, initial);
-}
 .sui-root-JxbEOq {
   vertical-align: middle;
   flex-shrink: 0;
   display: inline-block;
 }
-.sui-root-iFfE_q {
-  vertical-align: middle;
-  flex-shrink: 0;
-  display: inline-flex;
-}
-
-.sui-icon-iFfE_q {
-  animation: sui-spin-iFfE_q calc(var(--duration-slow) * 2) linear infinite;
-}
-
-@keyframes sui-spin-iFfE_q {
-  to {
-    transform: rotate(360deg);
-  }
-}
 .sui-root-FZ-IiW {
   box-sizing: border-box;
   min-width: 0;
@@ -222,92 +148,1078 @@
 .sui-root-FZ-IiW svg {
   stroke: currentColor;
 }
-.sui-stack-oAyu1G {
-  --stack-gap: initial;
-  gap: var(--stack-gap, 0);
-  display: flex;
+.sui-root-iFfE_q {
+  vertical-align: middle;
+  flex-shrink: 0;
+  display: inline-flex;
 }
 
-.sui-column-oAyu1G {
-  flex-direction: column;
+.sui-icon-iFfE_q {
+  animation: sui-spin-iFfE_q calc(var(--duration-slow) * 2) linear infinite;
 }
 
-.sui-row-oAyu1G {
-  flex-direction: row;
+@media (prefers-reduced-motion: reduce) {
+  .sui-icon-iFfE_q {
+    animation-duration: calc(var(--duration-slow) * 8);
+  }
 }
 
-.sui-alignStretch-oAyu1G {
-  align-items: stretch;
+@keyframes sui-spin-iFfE_q {
+  to {
+    transform: rotate(360deg);
+  }
+}
+.sui-sm-f0wlja, .sui-md-f0wlja, .sui-lg-f0wlja {
+  --button-padding-x: var(--space-0);
+  --button-padding-y: var(--space-0);
+  --button-font-size: var(--font-size-sm);
+  --button-line-height: var(--font-line-height-sm);
+  width: var(--button-height);
+  flex-shrink: 0;
 }
 
-.sui-alignStart-oAyu1G {
-  align-items: flex-start;
+.sui-sm-f0wlja {
+  --button-height: var(--size-control-sm);
 }
 
-.sui-alignCenter-oAyu1G {
-  align-items: center;
+.sui-md-f0wlja {
+  --button-height: var(--size-control-md);
 }
 
-.sui-alignEnd-oAyu1G {
-  align-items: flex-end;
+.sui-lg-f0wlja {
+  --button-height: var(--size-control-lg);
+}
+.sui-root-hPKSzG {
+  align-items: flex-start;
+  gap: var(--space-3);
+  box-sizing: border-box;
+  padding: var(--space-3) var(--space-4);
+  border: var(--border-width-thin) solid var(--alert-border);
+  border-radius: var(--radius-md);
+  background-color: var(--alert-bg);
+  color: var(--alert-fg);
+  font-family: var(--font-family-sans);
+  display: flex;
 }
 
-.sui-justifyStart-oAyu1G {
-  justify-content: flex-start;
+.sui-success-hPKSzG {
+  --alert-bg: var(--color-feedback-success-bg);
+  --alert-border: var(--color-feedback-success-border);
+  --alert-fg: var(--color-feedback-success-text);
 }
 
-.sui-justifyCenter-oAyu1G {
-  justify-content: center;
+.sui-warning-hPKSzG {
+  --alert-bg: var(--color-feedback-warning-bg);
+  --alert-border: var(--color-feedback-warning-border);
+  --alert-fg: var(--color-feedback-warning-text);
 }
 
-.sui-justifyEnd-oAyu1G {
-  justify-content: flex-end;
+.sui-danger-hPKSzG {
+  --alert-bg: var(--color-feedback-danger-bg);
+  --alert-border: var(--color-feedback-danger-border);
+  --alert-fg: var(--color-feedback-danger-text);
 }
 
-.sui-justifyBetween-oAyu1G {
-  justify-content: space-between;
+.sui-info-hPKSzG {
+  --alert-bg: var(--color-feedback-info-bg);
+  --alert-border: var(--color-feedback-info-border);
+  --alert-fg: var(--color-feedback-info-text);
 }
 
-.sui-justifyAround-oAyu1G {
-  justify-content: space-around;
+.sui-icon-hPKSzG {
+  height: var(--font-line-height-md);
+  flex-shrink: 0;
+  align-items: center;
+  display: inline-flex;
 }
 
-.sui-wrap-oAyu1G {
-  flex-wrap: wrap;
+.sui-content-hPKSzG {
+  flex: auto;
+  min-width: 0;
 }
-.sui-root-ca3VdW {
-  --text-letter-spacing: initial;
-  font-family: var(--text-family);
-  font-size: var(--text-size);
-  line-height: var(--text-line-height);
-  font-weight: var(--text-weight);
-  color: var(--text-color);
-  letter-spacing: var(--text-letter-spacing, normal);
-  overflow-wrap: break-word;
+
+.sui-title-hPKSzG {
+  font-size: var(--font-size-md);
+  line-height: var(--font-line-height-md);
+  font-weight: var(--font-weight-semibold);
   margin: 0;
 }
 
-.sui-uppercase-ca3VdW {
-  text-transform: uppercase;
+.sui-description-hPKSzG {
+  font-size: var(--font-size-sm);
+  line-height: var(--font-line-height-sm);
+  font-weight: var(--font-weight-regular);
 }
 
-.sui-left-ca3VdW {
-  text-align: left;
+.sui-description-hPKSzG:first-child {
+  padding: calc((var(--font-line-height-md) - var(--font-line-height-sm)) / 2) var(--space-0);
 }
 
-.sui-center-ca3VdW {
-  text-align: center;
+.sui-close-hPKSzG {
+  margin: calc((var(--font-line-height-md) - var(--size-control-sm)) / 2) calc(var(--space-2) * -1)
+    calc((var(--font-line-height-md) - var(--size-control-sm)) / 2) var(--space-0);
+  flex-shrink: 0;
+}
+.sui-root-iCOp0a {
+  box-sizing: border-box;
+  padding: var(--space-1) var(--space-2);
+  border: var(--border-width-thin) solid var(--badge-border);
+  border-radius: var(--radius-full);
+  background-color: var(--badge-bg);
+  color: var(--badge-fg);
+  font-family: var(--font-family-sans);
+  font-size: var(--font-size-xs);
+  line-height: var(--font-line-height-xs);
+  font-weight: var(--font-weight-medium);
+  align-items: center;
+  display: inline-flex;
 }
 
-.sui-right-ca3VdW {
-  text-align: right;
+.sui-success-iCOp0a {
+  --badge-bg: var(--color-feedback-success-bg);
+  --badge-border: var(--color-feedback-success-border);
+  --badge-fg: var(--color-feedback-success-text);
 }
 
-.sui-truncate-ca3VdW {
-  white-space: nowrap;
-  text-overflow: ellipsis;
+.sui-warning-iCOp0a {
+  --badge-bg: var(--color-feedback-warning-bg);
+  --badge-border: var(--color-feedback-warning-border);
+  --badge-fg: var(--color-feedback-warning-text);
+}
+
+.sui-danger-iCOp0a {
+  --badge-bg: var(--color-feedback-danger-bg);
+  --badge-border: var(--color-feedback-danger-border);
+  --badge-fg: var(--color-feedback-danger-text);
+}
+
+.sui-info-iCOp0a {
+  --badge-bg: var(--color-feedback-info-bg);
+  --badge-border: var(--color-feedback-info-border);
+  --badge-fg: var(--color-feedback-info-text);
+}
+.sui-root-fYQz2a {
+  --box-padding: initial;
+  --box-padding-x: initial;
+  --box-padding-y: initial;
+  --box-background: initial;
+  --box-radius: initial;
+  --box-border-color: initial;
+  --box-border-width: initial;
+  --box-shadow: initial;
+  --box-flex: initial;
+  box-sizing: border-box;
+  min-width: 0;
+  padding: var(--box-padding, 0);
+  padding-inline: var(--box-padding-x, var(--box-padding, 0));
+  padding-block: var(--box-padding-y, var(--box-padding, 0));
+  background-color: var(--box-background, transparent);
+  border-radius: var(--box-radius, 0);
+  border: var(--box-border-width, 0) solid var(--box-border-color, transparent);
+  box-shadow: var(--box-shadow, none);
+  flex: var(--box-flex, initial);
+}
+.sui-root-So50QW {
+  box-sizing: border-box;
+  min-width: 0;
+  padding: var(--card-padding);
+  border: var(--border-width-thin) solid var(--color-border-default);
+  border-radius: var(--radius-lg);
+  background-color: var(--card-bg);
+  box-shadow: var(--card-shadow);
+  color: var(--color-text-primary);
+  transition: background-color var(--duration-fast),
+    border-color var(--duration-fast);
+  display: block;
   overflow: hidden;
 }
+
+.sui-outlined-So50QW {
+  --card-bg: var(--color-bg-surface);
+  --card-shadow: none;
+}
+
+.sui-elevated-So50QW {
+  --card-bg: var(--color-bg-elevated);
+  --card-shadow: var(--shadow-md);
+}
+
+.sui-interactive-So50QW {
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+}
+
+@media (hover: hover) {
+  .sui-interactive-So50QW:hover {
+    border-color: var(--color-border-strong);
+  }
+}
+
+.sui-interactive-So50QW:active {
+  background-color: var(--color-bg-subtle);
+}
+
+.sui-interactive-So50QW:focus-visible {
+  outline: var(--border-width-thick) solid var(--color-border-focus);
+  outline-offset: var(--border-width-thick);
+}
+.sui-root-iE7-OG {
+  --checkbox-size: var(--space-5);
+  --checkbox-offset: calc((var(--font-line-height-md) - var(--checkbox-size)) / 2);
+  align-items: flex-start;
+  gap: var(--space-2);
+  min-height: var(--space-6);
+  color: var(--color-text-primary);
+  font-family: var(--font-family-sans);
+  font-size: var(--font-size-md);
+  line-height: var(--font-line-height-md);
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+  display: inline-flex;
+  position: relative;
+}
+
+.sui-disabled-iE7-OG {
+  color: var(--color-text-disabled);
+  cursor: not-allowed;
+}
+
+.sui-input-iE7-OG {
+  top: var(--checkbox-offset);
+  left: var(--space-0);
+  width: var(--checkbox-size);
+  height: var(--checkbox-size);
+  opacity: 0;
+  cursor: inherit;
+  margin: 0;
+  position: absolute;
+}
+
+.sui-box-iE7-OG {
+  box-sizing: border-box;
+  width: var(--checkbox-size);
+  height: var(--checkbox-size);
+  margin-top: var(--checkbox-offset);
+  border: var(--border-width-thin) solid var(--color-border-strong);
+  border-radius: var(--radius-xs);
+  background-color: var(--color-bg-surface);
+  transition: background-color var(--duration-fast),
+    border-color var(--duration-fast);
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  display: inline-flex;
+}
+
+.sui-invalid-iE7-OG {
+  border-color: var(--color-feedback-danger-icon);
+}
+
+.sui-mark-iE7-OG {
+  display: none;
+}
+
+.sui-label-iE7-OG {
+  min-width: 0;
+}
+
+.sui-input-iE7-OG:checked + .sui-box-iE7-OG, .sui-input-iE7-OG:indeterminate + .sui-box-iE7-OG {
+  border-color: var(--color-action-primary);
+  background-color: var(--color-action-primary);
+}
+
+.sui-input-iE7-OG:checked:not(:indeterminate) + .sui-box-iE7-OG .sui-check-iE7-OG, .sui-input-iE7-OG:indeterminate + .sui-box-iE7-OG .sui-dash-iE7-OG {
+  display: block;
+}
+
+@media (hover: hover) {
+  .sui-root-iE7-OG:hover .sui-input-iE7-OG:not(:disabled, :checked, :indeterminate) + .sui-box-iE7-OG {
+    border-color: var(--color-action-primary);
+  }
+}
+
+.sui-input-iE7-OG:focus-visible + .sui-box-iE7-OG {
+  outline: var(--border-width-thick) solid var(--color-border-focus);
+  outline-offset: var(--border-width-thick);
+}
+
+.sui-input-iE7-OG:disabled + .sui-box-iE7-OG {
+  background-color: var(--color-action-disabled);
+  border-color: #0000;
+}
+
+.sui-input-iE7-OG:disabled + .sui-box-iE7-OG svg {
+  stroke: var(--color-text-disabled);
+}
+.sui-root-Ea_Ija {
+  box-sizing: border-box;
+  background-color: var(--color-border-default);
+  border: 0;
+  flex-shrink: 0;
+  margin: 0;
+}
+
+.sui-horizontal-Ea_Ija {
+  width: 100%;
+  height: var(--border-width-thin);
+}
+
+.sui-vertical-Ea_Ija {
+  width: var(--border-width-thin);
+  align-self: stretch;
+}
+.sui-root-E2FhZq {
+  gap: var(--space-1);
+  min-width: 0;
+  font-family: var(--font-family-sans);
+  flex-direction: column;
+  display: flex;
+}
+
+.sui-label-E2FhZq {
+  color: var(--color-text-primary);
+  font-size: var(--font-size-sm);
+  line-height: var(--font-line-height-sm);
+  font-weight: var(--font-weight-medium);
+  align-self: flex-start;
+}
+
+.sui-disabled-E2FhZq .sui-label-E2FhZq {
+  color: var(--color-text-disabled);
+}
+
+.sui-required-E2FhZq {
+  color: var(--color-feedback-danger-text);
+}
+
+.sui-help-E2FhZq, .sui-error-E2FhZq {
+  font-size: var(--font-size-sm);
+  line-height: var(--font-line-height-sm);
+  margin: 0;
+}
+
+.sui-help-E2FhZq {
+  color: var(--color-text-muted);
+}
+
+.sui-error-E2FhZq {
+  align-items: flex-start;
+  gap: var(--space-1);
+  color: var(--color-feedback-danger-text);
+  display: flex;
+}
+
+.sui-errorIcon-E2FhZq {
+  height: var(--font-line-height-sm);
+  flex-shrink: 0;
+  align-items: center;
+  display: inline-flex;
+}
+.sui-field-jPIPoq {
+  box-sizing: border-box;
+  border: var(--border-width-thin) solid var(--color-border-strong);
+  border-radius: var(--radius-md);
+  background-color: var(--color-bg-surface);
+  width: 100%;
+  min-width: 0;
+  color: var(--color-text-primary);
+  font-family: var(--font-family-sans);
+  font-size: var(--font-size-md);
+  line-height: var(--font-line-height-md);
+  font-weight: var(--font-weight-regular);
+  cursor: text;
+  transition: border-color var(--duration-fast),
+    background-color var(--duration-fast);
+  align-items: center;
+  display: flex;
+}
+
+.sui-field-jPIPoq:focus-within {
+  border-color: var(--color-border-focus);
+  outline: var(--border-width-thin) solid var(--color-border-focus);
+}
+
+.sui-invalid-jPIPoq, .sui-invalid-jPIPoq:focus-within {
+  border-color: var(--color-feedback-danger-icon);
+  outline-color: var(--color-feedback-danger-icon);
+}
+
+.sui-readOnly-jPIPoq {
+  background-color: var(--color-bg-subtle);
+}
+
+.sui-disabled-jPIPoq {
+  background-color: var(--color-action-disabled);
+  color: var(--color-text-disabled);
+  cursor: not-allowed;
+  border-color: #0000;
+}
+
+.sui-control-jPIPoq {
+  box-sizing: border-box;
+  min-width: 0;
+  color: inherit;
+  font: inherit;
+  appearance: none;
+  background: none;
+  border: 0;
+  outline: 0;
+  flex: auto;
+  margin: 0;
+  padding: 0;
+}
+
+.sui-control-jPIPoq::placeholder {
+  color: var(--color-text-muted);
+  opacity: 1;
+}
+
+.sui-control-jPIPoq:disabled {
+  -webkit-text-fill-color: currentcolor;
+  opacity: 1;
+  cursor: not-allowed;
+}
+
+.sui-control-jPIPoq:autofill {
+  box-shadow: 0 0 0 100vmax var(--color-bg-surface) inset;
+  -webkit-text-fill-color: var(--color-text-primary);
+}
+.sui-root-DAA5va {
+  gap: var(--space-2);
+  min-height: var(--input-height);
+  padding: var(--space-0) var(--input-padding-x);
+}
+
+.sui-sm-DAA5va {
+  --input-height: var(--size-control-sm);
+  --input-padding-x: var(--space-3);
+}
+
+.sui-md-DAA5va {
+  --input-height: var(--size-control-md);
+  --input-padding-x: var(--space-3);
+}
+
+.sui-lg-DAA5va {
+  --input-height: var(--size-control-lg);
+  --input-padding-x: var(--space-4);
+}
+
+.sui-input-DAA5va {
+  min-height: calc(var(--input-height) - var(--border-width-thin) * 2);
+  align-self: stretch;
+}
+
+.sui-input-DAA5va::-webkit-search-decoration, .sui-input-DAA5va::-webkit-search-cancel-button {
+  appearance: none;
+}
+.sui-root-5twIfq {
+  --link-letter-spacing: initial;
+  border-radius: var(--radius-xs);
+  color: var(--link-color);
+  text-decoration-line: underline;
+  text-decoration-thickness: var(--border-width-thin);
+  text-underline-offset: var(--border-width-thick);
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+  transition: color var(--duration-fast);
+}
+
+.sui-typed-5twIfq {
+  font-family: var(--link-family);
+  font-size: var(--link-size);
+  line-height: var(--link-line-height);
+  font-weight: var(--link-weight);
+  letter-spacing: var(--link-letter-spacing, normal);
+}
+
+.sui-uppercase-5twIfq {
+  text-transform: uppercase;
+}
+
+.sui-hover-5twIfq {
+  text-decoration-line: none;
+}
+
+@media (hover: hover) {
+  .sui-always-5twIfq:hover {
+    text-decoration-thickness: var(--border-width-thick);
+  }
+
+  .sui-hover-5twIfq:hover {
+    text-decoration-line: underline;
+  }
+}
+
+.sui-root-5twIfq:active {
+  color: var(--color-text-primary);
+}
+
+.sui-root-5twIfq:focus-visible {
+  outline: var(--border-width-thick) solid var(--color-border-focus);
+  outline-offset: var(--border-width-thick);
+  text-decoration-line: underline;
+}
+.sui-root-M_CPgW {
+  box-sizing: border-box;
+  border: var(--border-width-thin) solid var(--color-border-default);
+  background-color: var(--color-bg-elevated);
+  box-shadow: var(--shadow-lg);
+  color: var(--color-text-primary);
+  font-family: var(--font-family-sans);
+  padding: 0;
+}
+
+.sui-root-M_CPgW[open] {
+  flex-direction: column;
+  display: flex;
+}
+
+.sui-root-M_CPgW:focus-visible {
+  outline: var(--border-width-thick) solid var(--color-border-focus);
+  outline-offset: var(--border-width-thick);
+}
+
+.sui-root-M_CPgW::backdrop {
+  background-color: var(--color-bg-overlay);
+}
+
+.sui-dialog-M_CPgW {
+  width: calc(100% - var(--space-8));
+  max-width: calc(var(--space-24) * 5);
+  max-height: calc(100% - var(--space-8));
+  border-radius: var(--radius-xl);
+  margin: auto;
+}
+
+.sui-sheet-M_CPgW {
+  width: 100%;
+  max-width: 100%;
+  max-height: calc(100% - var(--space-12));
+  margin: auto auto var(--space-0);
+  border-width: var(--border-width-thin) var(--space-0) var(--space-0);
+  border-radius: var(--radius-xl) var(--radius-xl) var(--radius-none) var(--radius-none);
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
+.sui-header-M_CPgW {
+  align-items: flex-start;
+  gap: var(--space-3);
+  padding: var(--space-5) var(--space-5) var(--space-0);
+  flex-shrink: 0;
+  display: flex;
+}
+
+.sui-titles-M_CPgW {
+  flex: auto;
+  min-width: 0;
+}
+
+.sui-title-M_CPgW, .sui-description-M_CPgW {
+  margin: 0;
+}
+
+.sui-title-M_CPgW {
+  font-size: var(--font-size-lg);
+  line-height: var(--font-line-height-lg);
+  font-weight: var(--font-weight-semibold);
+}
+
+.sui-description-M_CPgW {
+  margin-top: var(--space-1);
+  color: var(--color-text-secondary);
+  font-size: var(--font-size-sm);
+  line-height: var(--font-line-height-sm);
+}
+
+.sui-close-M_CPgW {
+  margin: calc((var(--font-line-height-lg) - var(--size-control-sm)) / 2) calc(var(--space-2) * -1)
+    calc((var(--font-line-height-lg) - var(--size-control-sm)) / 2) var(--space-0);
+  flex-shrink: 0;
+}
+
+.sui-body-M_CPgW {
+  overscroll-behavior: contain;
+  min-height: 0;
+  padding: var(--space-4) var(--space-5) var(--space-0);
+  font-size: var(--font-size-md);
+  line-height: var(--font-line-height-md);
+  flex: auto;
+  overflow-y: auto;
+}
+
+.sui-footer-M_CPgW {
+  justify-content: flex-end;
+  gap: var(--space-3);
+  padding: var(--space-5) var(--space-5) var(--space-0);
+  flex-wrap: wrap;
+  flex-shrink: 0;
+  display: flex;
+}
+
+.sui-header-M_CPgW:last-child, .sui-body-M_CPgW:last-child, .sui-footer-M_CPgW:last-child {
+  padding-bottom: var(--space-5);
+}
+.sui-root-Rxx4wG {
+  min-height: var(--select-height);
+  cursor: pointer;
+  position: relative;
+}
+
+.sui-sm-Rxx4wG {
+  --select-height: var(--size-control-sm);
+  --select-padding-x: var(--space-3);
+  --select-icon: var(--space-4);
+}
+
+.sui-md-Rxx4wG {
+  --select-height: var(--size-control-md);
+  --select-padding-x: var(--space-3);
+  --select-icon: var(--space-5);
+}
+
+.sui-lg-Rxx4wG {
+  --select-height: var(--size-control-lg);
+  --select-padding-x: var(--space-4);
+  --select-icon: var(--space-5);
+}
+
+.sui-select-Rxx4wG {
+  min-height: calc(var(--select-height) - var(--border-width-thin) * 2);
+  padding: var(--space-0) calc(var(--select-padding-x) + var(--select-icon) + var(--space-2))
+    var(--space-0) var(--select-padding-x);
+  border-radius: inherit;
+  text-overflow: ellipsis;
+  cursor: inherit;
+  align-self: stretch;
+}
+
+.sui-placeholder-Rxx4wG {
+  color: var(--color-text-muted);
+}
+
+.sui-select-Rxx4wG option {
+  background-color: var(--color-bg-surface);
+  color: var(--color-text-primary);
+}
+
+.sui-select-Rxx4wG option:disabled {
+  color: var(--color-text-disabled);
+}
+
+.sui-chevron-Rxx4wG {
+  top: var(--space-0);
+  right: var(--select-padding-x);
+  bottom: var(--space-0);
+  pointer-events: none;
+  align-items: center;
+  display: flex;
+  position: absolute;
+}
+.sui-root-KsqoQq {
+  --skeleton-width: initial;
+  --skeleton-height: initial;
+  display: block;
+}
+
+.sui-bar-KsqoQq {
+  background-color: var(--color-bg-muted);
+  animation: sui-pulse-KsqoQq calc(var(--duration-slow) * 4) ease-in-out infinite alternate;
+  display: block;
+}
+
+.sui-line-KsqoQq {
+  width: var(--skeleton-width, 100%);
+  height: var(--skeleton-font-size);
+  margin: calc((var(--skeleton-line-height) - var(--skeleton-font-size)) / 2) var(--space-0);
+  border-radius: var(--radius-xs);
+}
+
+.sui-line-KsqoQq:last-child:not(:first-child) {
+  width: 60%;
+}
+
+.sui-rectangle-KsqoQq {
+  width: var(--skeleton-width, 100%);
+  height: var(--skeleton-height, var(--size-control-md));
+  border-radius: var(--radius-md);
+}
+
+.sui-circle-KsqoQq {
+  width: var(--skeleton-width, var(--skeleton-height, var(--size-control-md)));
+  height: var(--skeleton-height, var(--skeleton-width, var(--size-control-md)));
+  border-radius: var(--radius-full);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sui-bar-KsqoQq {
+    animation: none;
+  }
+}
+
+@keyframes sui-pulse-KsqoQq {
+  from {
+    background-color: var(--color-bg-muted);
+  }
+
+  to {
+    background-color: var(--color-bg-subtle);
+  }
+}
+.sui-stack-oAyu1G {
+  --stack-gap: initial;
+  gap: var(--stack-gap, 0);
+  display: flex;
+}
+
+.sui-column-oAyu1G {
+  flex-direction: column;
+}
+
+.sui-row-oAyu1G {
+  flex-direction: row;
+}
+
+.sui-alignStretch-oAyu1G {
+  align-items: stretch;
+}
+
+.sui-alignStart-oAyu1G {
+  align-items: flex-start;
+}
+
+.sui-alignCenter-oAyu1G {
+  align-items: center;
+}
+
+.sui-alignEnd-oAyu1G {
+  align-items: flex-end;
+}
+
+.sui-justifyStart-oAyu1G {
+  justify-content: flex-start;
+}
+
+.sui-justifyCenter-oAyu1G {
+  justify-content: center;
+}
+
+.sui-justifyEnd-oAyu1G {
+  justify-content: flex-end;
+}
+
+.sui-justifyBetween-oAyu1G {
+  justify-content: space-between;
+}
+
+.sui-justifyAround-oAyu1G {
+  justify-content: space-around;
+}
+
+.sui-wrap-oAyu1G {
+  flex-wrap: wrap;
+}
+.sui-root-WH6kOa {
+  --switch-width: var(--space-10);
+  --switch-height: var(--space-6);
+  --switch-gap: var(--border-width-thick);
+  --switch-thumb: calc(var(--switch-height) - var(--switch-gap) * 2);
+  align-items: flex-start;
+  gap: var(--space-3);
+  min-height: var(--switch-height);
+  color: var(--color-text-primary);
+  font-family: var(--font-family-sans);
+  font-size: var(--font-size-md);
+  line-height: var(--font-line-height-md);
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+  display: inline-flex;
+  position: relative;
+}
+
+.sui-disabled-WH6kOa {
+  color: var(--color-text-disabled);
+  cursor: not-allowed;
+}
+
+.sui-input-WH6kOa {
+  top: var(--space-0);
+  left: var(--space-0);
+  width: var(--switch-width);
+  height: var(--switch-height);
+  opacity: 0;
+  cursor: inherit;
+  margin: 0;
+  position: absolute;
+}
+
+.sui-track-WH6kOa {
+  box-sizing: border-box;
+  width: var(--switch-width);
+  height: var(--switch-height);
+  padding: var(--switch-gap);
+  border-radius: var(--radius-full);
+  background-color: var(--color-border-strong);
+  transition: background-color var(--duration-fast);
+  flex-shrink: 0;
+  align-items: center;
+  display: inline-flex;
+}
+
+.sui-thumb-WH6kOa {
+  width: var(--switch-thumb);
+  height: var(--switch-thumb);
+  border-radius: var(--radius-full);
+  background-color: var(--color-text-on-primary);
+  transition: transform var(--duration-fast);
+}
+
+.sui-label-WH6kOa {
+  min-width: 0;
+}
+
+.sui-input-WH6kOa:checked + .sui-track-WH6kOa {
+  background-color: var(--color-action-primary);
+}
+
+.sui-input-WH6kOa:checked + .sui-track-WH6kOa .sui-thumb-WH6kOa {
+  transform: translateX(calc(var(--switch-width) - var(--switch-height)));
+}
+
+.sui-input-WH6kOa:focus-visible + .sui-track-WH6kOa {
+  outline: var(--border-width-thick) solid var(--color-border-focus);
+  outline-offset: var(--border-width-thick);
+}
+
+.sui-input-WH6kOa:disabled + .sui-track-WH6kOa {
+  background-color: var(--color-action-disabled);
+}
+
+.sui-input-WH6kOa:disabled + .sui-track-WH6kOa .sui-thumb-WH6kOa {
+  background-color: var(--color-text-disabled);
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sui-track-WH6kOa, .sui-thumb-WH6kOa {
+    transition: none;
+  }
+}
+.sui-root-5aOC0W {
+  min-width: 0;
+  font-family: var(--font-family-sans);
+  flex-direction: column;
+  display: flex;
+}
+
+.sui-list-5aOC0W {
+  gap: var(--space-1);
+  border-bottom: var(--border-width-thin) solid var(--color-border-default);
+  scrollbar-width: none;
+  display: flex;
+  overflow-x: auto;
+}
+
+.sui-tab-5aOC0W {
+  align-items: center;
+  gap: var(--space-2);
+  box-sizing: border-box;
+  min-height: var(--size-control-md);
+  padding: var(--space-0) var(--space-3);
+  border: 0;
+  border-bottom: var(--border-width-thick) solid transparent;
+  border-radius: var(--radius-sm) var(--radius-sm) var(--radius-none) var(--radius-none);
+  color: var(--color-text-secondary);
+  font-family: inherit;
+  font-size: var(--font-size-sm);
+  line-height: var(--font-line-height-sm);
+  font-weight: var(--font-weight-medium);
+  white-space: nowrap;
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+  transition: background-color var(--duration-fast),
+    border-color var(--duration-fast),
+    color var(--duration-fast);
+  background-color: #0000;
+  flex-shrink: 0;
+  margin: 0;
+  display: inline-flex;
+}
+
+.sui-selected-5aOC0W {
+  border-bottom-color: var(--color-action-primary);
+  color: var(--color-text-primary);
+}
+
+@media (hover: hover) {
+  .sui-tab-5aOC0W:hover:not(:disabled) {
+    background-color: var(--color-bg-subtle);
+    color: var(--color-text-primary);
+  }
+}
+
+.sui-tab-5aOC0W:active:not(:disabled) {
+  background-color: var(--color-bg-muted);
+}
+
+.sui-tab-5aOC0W:focus-visible, .sui-panel-5aOC0W:focus-visible {
+  outline: var(--border-width-thick) solid var(--color-border-focus);
+  outline-offset: calc(var(--border-width-thick) * -1);
+}
+
+.sui-tab-5aOC0W:disabled {
+  color: var(--color-text-disabled);
+  cursor: not-allowed;
+}
+
+.sui-tab-5aOC0W svg {
+  stroke: currentColor;
+}
+
+.sui-panel-5aOC0W {
+  padding-top: var(--space-4);
+  color: var(--color-text-primary);
+  font-size: var(--font-size-md);
+  line-height: var(--font-line-height-md);
+}
+.sui-root-ca3VdW {
+  --text-letter-spacing: initial;
+  font-family: var(--text-family);
+  font-size: var(--text-size);
+  line-height: var(--text-line-height);
+  font-weight: var(--text-weight);
+  color: var(--text-color);
+  letter-spacing: var(--text-letter-spacing, normal);
+  overflow-wrap: break-word;
+  margin: 0;
+}
+
+.sui-uppercase-ca3VdW {
+  text-transform: uppercase;
+}
+
+.sui-left-ca3VdW {
+  text-align: left;
+}
+
+.sui-center-ca3VdW {
+  text-align: center;
+}
+
+.sui-right-ca3VdW {
+  text-align: right;
+}
+
+.sui-truncate-ca3VdW {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.sui-root-c4Gv8W {
+  padding: var(--space-2) var(--space-3);
+  appearance: none;
+  resize: vertical;
+  margin: 0;
+  display: block;
+}
+
+.sui-root-c4Gv8W::placeholder {
+  color: var(--color-text-muted);
+  opacity: 1;
+}
+
+.sui-root-c4Gv8W:disabled {
+  -webkit-text-fill-color: currentcolor;
+  opacity: 1;
+  resize: none;
+}
+.sui-viewport-8N5mCG {
+  z-index: var(--z-index-toast);
+  right: var(--space-0);
+  bottom: var(--space-0);
+  left: var(--space-0);
+  align-items: center;
+  gap: var(--space-2);
+  box-sizing: border-box;
+  padding: var(--space-4);
+  padding-bottom: max(var(--space-4), env(safe-area-inset-bottom));
+  pointer-events: none;
+  flex-direction: column;
+  display: flex;
+  position: fixed;
+}
+
+.sui-root-8N5mCG {
+  align-items: flex-start;
+  gap: var(--space-3);
+  box-sizing: border-box;
+  width: 100%;
+  max-width: calc(var(--space-24) * 4);
+  padding: var(--space-3) var(--space-4);
+  border: var(--border-width-thin) solid var(--color-border-strong);
+  border-radius: var(--radius-lg);
+  background-color: var(--color-bg-elevated);
+  box-shadow: var(--shadow-lg);
+  color: var(--color-text-primary);
+  font-family: var(--font-family-sans);
+  pointer-events: auto;
+  animation: sui-enter-8N5mCG var(--duration-normal) ease-out;
+  display: flex;
+}
+
+.sui-icon-8N5mCG {
+  height: var(--font-line-height-md);
+  flex-shrink: 0;
+  align-items: center;
+  display: inline-flex;
+}
+
+.sui-content-8N5mCG {
+  flex: auto;
+  min-width: 0;
+}
+
+.sui-title-8N5mCG, .sui-description-8N5mCG {
+  margin: 0;
+}
+
+.sui-title-8N5mCG {
+  font-size: var(--font-size-md);
+  line-height: var(--font-line-height-md);
+  font-weight: var(--font-weight-medium);
+}
+
+.sui-description-8N5mCG {
+  color: var(--color-text-secondary);
+  font-size: var(--font-size-sm);
+  line-height: var(--font-line-height-sm);
+}
+
+.sui-actions-8N5mCG {
+  align-items: center;
+  gap: var(--space-1);
+  margin: calc((var(--font-line-height-md) - var(--size-control-sm)) / 2) calc(var(--space-2) * -1)
+    calc((var(--font-line-height-md) - var(--size-control-sm)) / 2) var(--space-0);
+  flex-shrink: 0;
+  display: flex;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sui-root-8N5mCG {
+    animation: none;
+  }
+}
+
+@keyframes sui-enter-8N5mCG {
+  from {
+    opacity: 0;
+    transform: translateY(var(--space-2));
+  }
+
+  to {
+    opacity: 1;
+    transform: translateY(var(--space-0));
+  }
+}
 :root, [data-theme="light"] {
   color-scheme: light;
   --color-bg-canvas: #f5f5fa;