@tangible/ui 0.0.1

package/styles/all.expanded.unlayered.css

@@ -0,0 +1,4137 @@
+@keyframes tui-fadeFromOpaque {
+  from {
+    opacity: 1;
+  }
+}
+@keyframes tui-fadeToOpaque {
+  to {
+    opacity: 1;
+  }
+}
+@keyframes tui-fadeFromTransparent {
+  from {
+    opacity: 0;
+  }
+}
+@keyframes tui-fadeToTransparent {
+  to {
+    opacity: 0;
+  }
+}
+/* @tui-tokens
+--tui-accordion-bg
+--tui-accordion-bg-open
+--tui-accordion-border
+--tui-accordion-radius
+--tui-accordion-padding
+--tui-accordion-gap
+--tui-accordion-indicator
+--tui-accordion-trigger-hover
+*/
+/* @tui-tokens
+--tui-button-bg
+--tui-button-fg
+--tui-button-border
+--tui-button-radius
+--tui-button-bg-interact
+--tui-button-fg-interact
+--tui-button-border-interact
+*/
+/* @tui-tokens
+--tui-card-bg
+--tui-card-border
+--tui-card-border-interact
+--tui-card-radius
+--tui-card-shadow
+--tui-card-shadow-interact
+--tui-card-padding
+--tui-card-foot-basis
+*/
+/* @tui-tokens
+--tui-modal-z
+--tui-modal-max
+--tui-modal-backdrop
+--tui-modal-bg
+--tui-modal-border
+--tui-modal-radius
+--tui-modal-padding
+--tui-modal-shadow
+*/
+/* @tui-tokens
+--tui-notice-bg
+--tui-notice-border
+--tui-notice-stripe
+--tui-notice-fg
+--tui-notice-radius
+--tui-notice-padding
+--tui-notice-foot-basis
+*/
+/* @tui-tokens
+--tui-tabs-gap
+--tui-tabs-list-bg
+--tui-tabs-list-padding
+--tui-tabs-list-radius
+--tui-tabs-tab-padding
+--tui-tabs-tab-radius
+--tui-tabs-tab-bg
+--tui-tabs-tab-fg
+--tui-tabs-tab-bg-active
+--tui-tabs-tab-fg-active
+--tui-tabs-tab-bg-hover
+--tui-tabs-tab-border
+--tui-tabs-indicator
+--tui-tabs-indicator-size
+*/
+
+:where(.tui-interface) {
+  /* ========================
+     PRIMITIVES
+     ======================== */
+  /* Motion */
+  --tui-motion-duration: 200ms;
+  --tui-motion-timing: ease-in-out;
+  /* Opacity */
+  --tui-opacity-disabled: 0.75;
+  --tui-opacity-backdrop: 0.5;
+  /* Focus Ring (a11y) */
+  --tui-focus-ring-width: 2px;
+  --tui-focus-ring-offset: 2px;
+  --tui-focus-ring-color: #2563eb;
+  /* Border */
+  --tui-border-width: 1px;
+  /* Z-Index Layers */
+  --tui-layer-surface: 0;
+  --tui-layer-elevated: 2;
+  --tui-layer-overlay: 100;
+  --tui-layer-modal: 1000;
+  --tui-layer-top: 9999;
+  /* ========================
+     COLORS
+     ======================== */
+  /* Neutral: surfaces */
+  --tui-color-bg: #fff;
+  --tui-color-bg-surface: #fafafa;
+  --tui-color-bg-elevated: #fff;
+  --tui-color-bg-inverted: #111928;
+  --tui-color-bg-overlay: rgba(0, 0, 0, var(--tui-opacity-backdrop));
+  /* Neutral: text */
+  --tui-color-fg: #111928;
+  --tui-color-fg-muted: #6B7280;
+  --tui-color-fg-on-accent: #fff;
+  --tui-color-fg-inverted: #fafafa;
+  /* Neutral: borders/dividers */
+  --tui-color-border: #E5E7EB;
+  --tui-color-divider: #F3F4F6;
+  /* Primary */
+  --tui-theme-primary-strongest: #090949;
+  --tui-theme-primary-stronger: #1b2398;
+  --tui-theme-primary-strong: #1d35b4;
+  --tui-theme-primary-base: #2942d1;
+  --tui-theme-primary-soft: #7b93ff;
+  --tui-theme-primary-subtle: #c7d6ff;
+  --tui-theme-primary-subtlest: #e2e9ff;
+  /* Secondary */
+  --tui-theme-secondary-strongest: #111928;
+  --tui-theme-secondary-stronger: #202836;
+  --tui-theme-secondary-strong: #374151;
+  --tui-theme-secondary-base: #6B7280;
+  --tui-theme-secondary-soft: #9CA3AF;
+  --tui-theme-secondary-subtle: #E5E7EB;
+  --tui-theme-secondary-subtlest: #F3F4F6;
+  /* Success */
+  --tui-theme-success-strongest: #003008;
+  --tui-theme-success-stronger: #005c12;
+  --tui-theme-success-strong: #007017;
+  --tui-theme-success-base: #008a20;
+  --tui-theme-success-soft: #00ba37;
+  --tui-theme-success-subtle: #b7e7be;
+  --tui-theme-success-subtlest: #d8f3dc;
+  /* Info */
+  --tui-theme-info-strongest: #090949;
+  --tui-theme-info-stronger: #1b2398;
+  --tui-theme-info-strong: #1d35b4;
+  --tui-theme-info-base: #2942d1;
+  --tui-theme-info-soft: #7b93ff;
+  --tui-theme-info-subtle: #c7d6ff;
+  --tui-theme-info-subtlest: #e2e9ff;
+  /* Warning */
+  --tui-theme-warning-strongest: #362400;
+  --tui-theme-warning-stronger: #614200;
+  --tui-theme-warning-strong: #755100;
+  --tui-theme-warning-base: #996800;
+  --tui-theme-warning-soft: #dba617;
+  --tui-theme-warning-subtle: #f5e6ab;
+  --tui-theme-warning-subtlest: #f9f1d2;
+  /* Danger */
+  --tui-theme-danger-strongest: #451313;
+  --tui-theme-danger-stronger: #8a2424;
+  --tui-theme-danger-strong: #b32d2e;
+  --tui-theme-danger-base: #d63638;
+  --tui-theme-danger-soft: #f86368;
+  --tui-theme-danger-subtle: #facfd2;
+  --tui-theme-danger-subtlest: #fce3e5;
+  /* A11y (legacy alias - prefer --focus-ring-color) */
+  --tui-color-focus-ring: var(--tui-focus-ring-color);
+}
+
+:where(.tui-interface)[data-theme=dark] {
+  /* Backgrounds */
+  --tui-color-bg: #111928;
+  --tui-color-bg-surface: #202836;
+  --tui-color-bg-elevated: #374151;
+  --tui-color-bg-inverted: #F9FAFB;
+  --tui-color-bg-overlay: rgba(0, 0, 0, 0.7);
+  /* Text */
+  --tui-color-fg: #F9FAFB;
+  --tui-color-fg-muted: #9CA3AF;
+  --tui-color-fg-on-accent: #fff;
+  --tui-color-fg-inverted: #111928;
+  /* Borders */
+  --tui-color-border: #374151;
+  --tui-color-divider: #202836;
+  /* Theme colors - adjust for dark mode contrast */
+  --tui-theme-primary-base: #3858e9;
+  --tui-theme-primary-soft: #2942d1;
+  --tui-theme-primary-strong: #5373f2;
+  --tui-theme-primary-stronger: #7b93ff;
+  --tui-theme-primary-strongest: #a0b5fe;
+  --tui-theme-primary-subtlest: #090949;
+  --tui-theme-primary-subtle: #101375;
+  /* Secondary */
+  --tui-theme-secondary-subtlest: #202836;
+  --tui-theme-secondary-subtle: #374151;
+  --tui-theme-secondary-soft: #4B5563;
+  --tui-theme-secondary-strong: #D1D5DB;
+  --tui-theme-secondary-stronger: #E5E7EB;
+  --tui-theme-secondary-strongest: #F3F4F6;
+  --tui-theme-success-base: #00a32a;
+  --tui-theme-success-strong: #00ba37;
+  --tui-theme-success-stronger: #1ed14b;
+  --tui-theme-success-strongest: #68de7c;
+  --tui-theme-success-subtlest: #003008;
+  --tui-theme-warning-base: #bd8600;
+  --tui-theme-warning-strong: #dba617;
+  --tui-theme-warning-stronger: #f0c33c;
+  --tui-theme-warning-subtlest: #362400;
+  --tui-theme-danger-base: #e65054;
+  --tui-theme-danger-strong: #f86368;
+  --tui-theme-danger-stronger: #ff8085;
+  --tui-theme-danger-strongest: #ffabaf;
+  --tui-theme-danger-subtlest: #451313;
+  /* Focus ring - brighter for dark backgrounds */
+  --tui-focus-ring-color: #3858e9;
+  /* Shadows - more pronounced in dark mode */
+  --tui-shadow-color: 0, 0, 0;
+}
+
+@media (prefers-color-scheme: dark) {
+  :where(.tui-interface)[data-theme=auto] {
+    /* Backgrounds */
+    --tui-color-bg: #111928;
+    --tui-color-bg-surface: #202836;
+    --tui-color-bg-elevated: #374151;
+    --tui-color-bg-inverted: #F9FAFB;
+    --tui-color-bg-overlay: rgba(0, 0, 0, 0.7);
+    /* Text */
+    --tui-color-fg: #F9FAFB;
+    --tui-color-fg-muted: #9CA3AF;
+    --tui-color-fg-on-accent: #fff;
+    --tui-color-fg-inverted: #111928;
+    /* Borders */
+    --tui-color-border: #374151;
+    --tui-color-divider: #202836;
+    /* Theme colors - adjust for dark mode contrast */
+    --tui-theme-primary-base: #3858e9;
+    --tui-theme-primary-soft: #2942d1;
+    --tui-theme-primary-strong: #5373f2;
+    --tui-theme-primary-stronger: #7b93ff;
+    --tui-theme-primary-strongest: #a0b5fe;
+    --tui-theme-primary-subtlest: #090949;
+    --tui-theme-primary-subtle: #101375;
+    /* Secondary */
+    --tui-theme-secondary-subtlest: #202836;
+    --tui-theme-secondary-subtle: #374151;
+    --tui-theme-secondary-soft: #4B5563;
+    --tui-theme-secondary-strong: #D1D5DB;
+    --tui-theme-secondary-stronger: #E5E7EB;
+    --tui-theme-secondary-strongest: #F3F4F6;
+    --tui-theme-success-base: #00a32a;
+    --tui-theme-success-strong: #00ba37;
+    --tui-theme-success-stronger: #1ed14b;
+    --tui-theme-success-strongest: #68de7c;
+    --tui-theme-success-subtlest: #003008;
+    --tui-theme-warning-base: #bd8600;
+    --tui-theme-warning-strong: #dba617;
+    --tui-theme-warning-stronger: #f0c33c;
+    --tui-theme-warning-subtlest: #362400;
+    --tui-theme-danger-base: #e65054;
+    --tui-theme-danger-strong: #f86368;
+    --tui-theme-danger-stronger: #ff8085;
+    --tui-theme-danger-strongest: #ffabaf;
+    --tui-theme-danger-subtlest: #451313;
+    /* Focus ring - brighter for dark backgrounds */
+    --tui-focus-ring-color: #3858e9;
+    /* Shadows - more pronounced in dark mode */
+    --tui-shadow-color: 0, 0, 0;
+  }
+}
+.tui-interface {
+  --tui-spacing-base: 4px;
+  --tui-palette-spacing-1: calc(var(--tui-spacing-base) * 1);
+  --tui-palette-spacing-2: calc(var(--tui-spacing-base) * 2);
+  --tui-palette-spacing-3: calc(var(--tui-spacing-base) * 3);
+  --tui-palette-spacing-4: calc(var(--tui-spacing-base) * 4);
+  --tui-palette-spacing-5: calc(var(--tui-spacing-base) * 5);
+  --tui-palette-spacing-6: calc(var(--tui-spacing-base) * 6);
+  --tui-palette-spacing-8: calc(var(--tui-spacing-base) * 8);
+  --tui-palette-spacing-10: calc(var(--tui-spacing-base) * 10);
+  --tui-palette-spacing-12: calc(var(--tui-spacing-base) * 12);
+  --tui-palette-spacing-16: calc(var(--tui-spacing-base) * 16);
+  --tui-palette-spacing-20: calc(var(--tui-spacing-base) * 20);
+  --tui-palette-spacing-24: calc(var(--tui-spacing-base) * 24);
+  --tui-palette-spacing-30: calc(var(--tui-spacing-base) * 30);
+  --tui-palette-spacing-40: calc(var(--tui-spacing-base) * 40);
+  --tui-palette-spacing-50: calc(var(--tui-spacing-base) * 50);
+  --tui-spacing-xxs: var(--tui-palette-spacing-1);
+  --tui-spacing-xs: var(--tui-palette-spacing-2);
+  --tui-spacing-sm: var(--tui-palette-spacing-3);
+  --tui-spacing-md: var(--tui-palette-spacing-4);
+  --tui-spacing-lg: var(--tui-palette-spacing-6);
+  --tui-spacing-xl: var(--tui-palette-spacing-8);
+  --tui-spacing-xxl: var(--tui-palette-spacing-16);
+  --tui-fontSize-multiplier: calc(1rem / 16);
+  --tui-typography-size-xs: calc(12 * var(--tui-fontSize-multiplier, calc(1rem / 16)));
+  --tui-typography-size-sm: calc(14 * var(--tui-fontSize-multiplier, calc(1rem / 16)));
+  --tui-typography-size-md: calc(16 * var(--tui-fontSize-multiplier, calc(1rem / 16)));
+  --tui-typography-size-lg: calc(20 * var(--tui-fontSize-multiplier, calc(1rem / 16)));
+  --tui-typography-size-xl: calc(24 * var(--tui-fontSize-multiplier, calc(1rem / 16)));
+  --tui-typography-size-xxl: calc(32 * var(--tui-fontSize-multiplier, calc(1rem / 16)));
+  --tui-palette-color-white: #fff;
+  --tui-palette-color-black: #000;
+  --tui-radius-xs: 2px;
+  --tui-radius-sm: 4px;
+  --tui-radius-md: 8px;
+  --tui-radius-lg: 12px;
+  --tui-font-size-base: 16px;
+  --tui-line: 1.5;
+  --tui-typography-size: var(--tui-font-size-base);
+  --tui-typography-line-height: 1.4;
+  --tui-typography-font-family: inherit;
+  --tui-typography-color-base: currentColor;
+  --tui-typography-color-contrast-high: var(--tui-color-fg);
+  --tui-typography-color-contrast-low: var(--tui-color-fg-muted);
+  --tui-typography-color-headings: var(--tui-color-fg);
+  --tui-shadow-color: 0, 0, 0;
+  --tui-shadow-xs: 0 1px 2px rgba(var(--tui-shadow-color), 0.05);
+  --tui-shadow-sm: 0 1px 3px rgba(var(--tui-shadow-color), 0.1),
+                    0 1px 2px rgba(var(--tui-shadow-color), 0.06);
+  --tui-shadow-md: 0 4px 6px rgba(var(--tui-shadow-color), 0.1),
+                    0 2px 4px rgba(var(--tui-shadow-color), 0.06);
+  --tui-shadow-lg: 0 10px 15px rgba(var(--tui-shadow-color), 0.1),
+                    0 4px 6px rgba(var(--tui-shadow-color), 0.05);
+}
+
+
+  .tui-interface {
+    font-size: var(--tui-typography-size);
+    line-height: var(--tui-typography-line-height);
+    color: inherit;
+  }
+  .tui-interface[data-theme] {
+    color: var(--tui-color-fg);
+  }
+  .tui-interface button,
+  .tui-interface [type=button],
+  .tui-interface [type=submit],
+  .tui-interface [type=reset] {
+    box-shadow: none;
+    text-transform: none;
+    letter-spacing: normal;
+  }
+
+
+  :where(.tui-interface) .tui-accordion {
+    display: flex;
+    flex-direction: column;
+    gap: var(--tui-accordion-gap, var(--tui-spacing-sm));
+  }
+  :where(.tui-interface) .tui-accordion__item {
+    --_bg: var(--tui-accordion-bg, var(--tui-color-bg-surface));
+    --_bg-open: var(--tui-accordion-bg-open, var(--_bg));
+    --_border: var(--tui-accordion-border, var(--tui-color-border));
+    --_radius: var(--tui-accordion-radius, var(--tui-radius-md));
+    --_padding: var(--tui-accordion-padding, var(--tui-spacing-md));
+    --_indicator: var(--tui-accordion-indicator, currentColor);
+    --_trigger-hover: var(--tui-accordion-trigger-hover, var(--tui-color-bg-muted));
+    background-color: var(--_bg);
+    border: var(--tui-border-width) solid var(--_border);
+    border-radius: var(--_radius);
+    overflow: hidden;
+  }
+  :where(.tui-interface) .tui-accordion__item[data-state=open] {
+    --_bg: var(--_bg-open);
+  }
+  :where(.tui-interface) .tui-accordion__item[data-disabled=true] {
+    opacity: var(--tui-opacity-disabled);
+  }
+  :where(.tui-interface) .tui-accordion__heading {
+    margin: 0;
+    font: inherit;
+  }
+  :where(.tui-interface) .tui-accordion__trigger {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--tui-spacing-sm);
+    width: 100%;
+    padding: var(--_padding);
+    border: none;
+    border-radius: var(--_radius);
+    background: transparent;
+    color: inherit;
+    font: inherit;
+    font-weight: var(--tui-font-weight-medium, 500);
+    text-align: start;
+    cursor: pointer;
+    transition-property: background-color;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-accordion__trigger:hover:not(:disabled) {
+    background-color: var(--_trigger-hover);
+  }
+  :where(.tui-interface) .tui-accordion__trigger:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: calc(var(--tui-focus-ring-offset) * -1 - 1px);
+    z-index: 1;
+  }
+  :where(.tui-interface) .tui-accordion__trigger:disabled {
+    cursor: not-allowed;
+  }
+  :where(.tui-interface) .tui-accordion__trigger-content {
+    display: flex;
+    align-items: center;
+    gap: var(--tui-spacing-sm);
+    flex: 1;
+    min-width: 0;
+  }
+  :where(.tui-interface) .tui-accordion__indicator {
+    flex-shrink: 0;
+    color: var(--_indicator);
+    transition-property: transform;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+  }
+  [data-state=open] > :where(.tui-interface) .tui-accordion__indicator {
+    transform: rotate(180deg);
+  }
+  :where(.tui-interface) .tui-accordion__panel {
+    display: grid;
+    grid-template-rows: 0fr;
+    transition-property: grid-template-rows;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-accordion__panel[data-state=open] {
+    grid-template-rows: 1fr;
+  }
+  :where(.tui-interface) .tui-accordion__panel-content {
+    min-height: 0;
+    overflow: hidden;
+    padding-inline: var(--_padding);
+  }
+  :where(.tui-interface) .tui-accordion__panel-content > *:first-child {
+    margin-block-start: 0;
+  }
+  :where(.tui-interface) .tui-accordion__panel-content > *:last-child {
+    margin-block-end: 0;
+  }
+  :where(.tui-interface) .tui-accordion__panel-content::after {
+    content: "";
+    display: block;
+    height: var(--_padding);
+  }
+  :where(.tui-interface) .tui-accordion__panel[data-state=closed] > .tui-accordion__panel-content {
+    animation: tui-fadeToTransparent var(--tui-motion-duration) var(--tui-motion-timing) forwards;
+  }
+  :where(.tui-interface) .tui-accordion__panel[data-state=open] > .tui-accordion__panel-content {
+    animation: tui-fadeFromTransparent var(--tui-motion-duration) var(--tui-motion-timing) forwards;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-accordion__panel {
+      transition: none;
+    }
+    :where(.tui-interface) .tui-accordion__panel-content {
+      transition: none;
+    }
+    :where(.tui-interface) .tui-accordion__indicator {
+      transition: none;
+    }
+    :where(.tui-interface) .tui-accordion__trigger {
+      transition: none;
+    }
+  }
+  :where(.tui-interface) {
+    --tui-avatar-palette-coral: #c62828;
+    --tui-avatar-palette-amber: #f59e0b;
+    --tui-avatar-palette-lime: #65a30d;
+    --tui-avatar-palette-teal: #0f766e;
+    --tui-avatar-palette-cyan: #0891b2;
+    --tui-avatar-palette-blue: #1d4ed8;
+    --tui-avatar-palette-violet: #6d28d9;
+    --tui-avatar-palette-pink: #be185d;
+    --tui-avatar-palette-slate: #475569;
+    --tui-avatar-palette-emerald: #047857;
+  }
+  :where(.tui-interface) .tui-avatar {
+    --_size: var(--tui-avatar-size, 2.5rem);
+    --_radius: var(--tui-avatar-radius, 50%);
+    --_bg: var(--tui-avatar-bg, var(--tui-color-bg-muted));
+    --_fg: var(--tui-avatar-fg, var(--tui-color-fg-inverted));
+    --_border: var(--tui-avatar-border, 2px solid var(--tui-color-bg));
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--_size);
+    height: var(--_size);
+    border-radius: var(--_radius);
+    background-color: var(--_bg);
+    color: var(--_fg);
+    font-weight: 500;
+    font-size: calc(var(--_size) * 0.4);
+    line-height: 1;
+    flex-shrink: 0;
+    user-select: none;
+  }
+  :where(.tui-interface) .tui-avatar.is-size-xs {
+    --_size: var(--tui-avatar-size, 1.5rem);
+  }
+  :where(.tui-interface) .tui-avatar.is-size-sm {
+    --_size: var(--tui-avatar-size, 2rem);
+  }
+  :where(.tui-interface) .tui-avatar.is-size-md {
+    --_size: var(--tui-avatar-size, 2.5rem);
+  }
+  :where(.tui-interface) .tui-avatar.is-size-lg {
+    --_size: var(--tui-avatar-size, 3rem);
+  }
+  :where(.tui-interface) .tui-avatar.is-size-xl {
+    --_size: var(--tui-avatar-size, 4rem);
+  }
+  :where(.tui-interface) .tui-avatar.is-size-xxl {
+    --_size: var(--tui-avatar-size, 5rem);
+  }
+  :where(.tui-interface) .tui-avatar.is-shape-circle {
+    --_radius: var(--tui-avatar-radius, 50%);
+  }
+  :where(.tui-interface) .tui-avatar.is-shape-square {
+    --_radius: var(--tui-avatar-radius, var(--tui-radius-md));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-coral {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-coral));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-amber {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-amber));
+    --_fg: var(--tui-avatar-fg, var(--tui-color-fg));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-lime {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-lime));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-teal {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-teal));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-cyan {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-cyan));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-blue {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-blue));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-violet {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-violet));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-pink {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-pink));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-slate {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-slate));
+  }
+  :where(.tui-interface) .tui-avatar.is-color-emerald {
+    --_bg: var(--tui-avatar-bg, var(--tui-avatar-palette-emerald));
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__content {
+    position: absolute;
+    inset: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: inherit;
+    overflow: hidden;
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__initials {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-transform: uppercase;
+    letter-spacing: -0.025em;
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__placeholder {
+    font-size: calc(var(--_size) * 0.6);
+    opacity: 0.7;
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__indicator {
+    --_indicator-size: calc(var(--_size) * 0.35);
+    --_indicator-bg: var(--tui-avatar-indicator-bg, var(--tui-theme-danger-base));
+    --_indicator-fg: var(--tui-avatar-indicator-fg, var(--tui-color-fg-on-accent));
+    position: absolute;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: var(--_indicator-size);
+    min-height: var(--_indicator-size);
+    padding: 0.15em;
+    font-size: calc(var(--_size) * 0.3);
+    line-height: 1;
+    background-color: var(--_indicator-bg);
+    color: var(--_indicator-fg);
+    border-radius: 50%;
+    border: 2px solid var(--tui-color-bg);
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__indicator.is-position-top-left {
+    top: 0;
+    left: 0;
+    transform: translate(-25%, -25%);
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__indicator.is-position-top-right {
+    top: 0;
+    right: 0;
+    transform: translate(25%, -25%);
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__indicator.is-position-bottom-left {
+    bottom: 0;
+    left: 0;
+    transform: translate(-25%, 25%);
+  }
+  :where(.tui-interface) .tui-avatar .tui-avatar__indicator.is-position-bottom-right {
+    bottom: 0;
+    right: 0;
+    transform: translate(25%, 25%);
+  }
+  :where(.tui-interface) .tui-avatar.tui-avatar--overflow {
+    --_bg: var(--tui-avatar-overflow-bg, var(--tui-color-bg-surface));
+    --_fg: var(--tui-avatar-overflow-fg, var(--tui-color-fg-muted));
+  }
+  :where(.tui-interface) .tui-avatar-group {
+    --_gap: var(--tui-avatar-group-gap, var(--tui-spacing-xs));
+    display: inline-flex;
+    align-items: center;
+    gap: var(--_gap);
+  }
+  :where(.tui-interface) .tui-avatar-group.is-overlap {
+    --tui-overlap-stack-overlap: var(--tui-avatar-group-overlap, -0.35em);
+    gap: 0;
+  }
+  :where(.tui-interface) .tui-avatar-group.is-overlap .tui-avatar {
+    box-shadow: 0 0 0 var(--tui-avatar-group-border-width, 2px) var(--tui-avatar-group-border-color, var(--tui-color-bg-surface));
+  }
+  @media (forced-colors: active) {
+    :where(.tui-interface) .tui-avatar {
+      background-color: Canvas;
+      color: CanvasText;
+      border: 1px solid CanvasText;
+    }
+  }
+  :where(.tui-interface) :is(button, [type=button], [type=submit]) {
+    cursor: pointer;
+    font-family: inherit;
+    font-size: var(--tui-typography-size-md);
+    line-height: 1.4;
+    border: unset;
+    box-shadow: unset;
+    height: auto;
+  }
+  :where(.tui-interface) :where(a).tui-button {
+    text-decoration: none;
+  }
+  :where(.tui-interface) :where(a).tui-button[aria-disabled=true] {
+    pointer-events: none;
+  }
+  :where(.tui-interface) :where(a).tui-button:visited {
+    color: var(--_fg) !important;
+  }
+  .tui-interface .tui-button {
+    --_bg: var(--tui-button-bg, var(--tui-theme-primary-base));
+    --_fg: var(--tui-button-fg, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-button-border, var(--tui-theme-primary-base));
+    --_radius: var(--tui-button-radius, var(--tui-radius-md));
+    --_bg-interact: var(--tui-button-bg-interact, var(--tui-theme-primary-stronger));
+    --_fg-interact: var(--tui-button-fg-interact, var(--tui-palette-color-white));
+    --_border-interact: var(--tui-button-border-interact, var(--tui-theme-primary-stronger));
+    font-size: var(--tui-typography-size-md);
+    font-weight: normal;
+    line-height: 1.4;
+    box-sizing: border-box;
+    display: inline-flex;
+    align-self: center;
+    text-align: center;
+    justify-content: center;
+    align-items: center;
+    padding-inline: 1.2em;
+    padding-block: 0.575em;
+    gap: 0.5em;
+    background-color: var(--_bg) !important;
+    color: var(--_fg) !important;
+    border-color: var(--_border) !important;
+    border-style: solid;
+    border-width: var(--tui-border-width);
+    border-radius: var(--_radius);
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+    transition-property: border-color, color, background-color;
+  }
+  .tui-interface .tui-button .tui-icon {
+    font-size: inherit;
+  }
+  .tui-interface .tui-button:hover {
+    --_bg: var(--_bg-interact);
+    --_fg: var(--_fg-interact);
+    --_border: var(--_border-interact);
+  }
+  .tui-interface .tui-button:focus-visible {
+    --_bg: var(--_bg-interact);
+    --_fg: var(--_fg-interact);
+    --_border: var(--_border-interact);
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  .tui-interface .tui-button:is(:active, [aria-pressed=true]) {
+    --_bg: var(--_bg-interact);
+    --_fg: var(--tui-button-fg-active, var(--tui-color-fg-on-accent));
+    --_border: var(--_border-interact);
+  }
+  .tui-interface .tui-button:where(:disabled, [aria-disabled=true], .is-disabled) {
+    pointer-events: none;
+    cursor: not-allowed;
+    opacity: var(--tui-opacity-disabled);
+  }
+  .tui-interface .tui-button[data-loading=true] {
+    pointer-events: none;
+  }
+  .tui-interface .tui-button[data-loading=true] > .tui-icon:first-child {
+    visibility: hidden;
+  }
+  .tui-interface .tui-button[data-loading=true]::before {
+    content: "";
+    inline-size: 0.75em;
+    block-size: 0.75em;
+    border: 0.15em solid currentColor;
+    border-right-color: transparent;
+    border-radius: 50%;
+    display: inline-block;
+    animation: tui-spin 0.85s linear infinite;
+  }
+  .tui-interface .tui-button.is-width-full {
+    width: 100%;
+  }
+  .tui-interface .tui-button.is-size-lg {
+    font-size: var(--tui-typography-size-lg);
+  }
+  .tui-interface .tui-button.is-size-sm {
+    font-size: var(--tui-typography-size-sm);
+  }
+  .tui-interface .tui-button.is-size-xs {
+    --_radius: var(--tui-button-radius, var(--tui-radius-sm));
+    font-size: var(--tui-typography-size-xs);
+    padding: var(--tui-spacing-xxs);
+    min-width: 2em;
+  }
+  .tui-interface .tui-button.is-theme-secondary {
+    --_bg: var(--tui-button-bg, var(--tui-theme-secondary-subtle));
+    --_fg: var(--tui-button-fg, var(--tui-theme-secondary-strongest));
+    --_border: var(--tui-button-border, var(--tui-theme-secondary-subtle));
+  }
+  .tui-interface .tui-button.is-theme-secondary:hover, .tui-interface .tui-button.is-theme-secondary:focus-visible, .tui-interface .tui-button.is-theme-secondary:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-secondary-subtlest));
+    --_fg: var(--tui-button-fg-interact, var(--tui-theme-primary-base));
+    --_border: var(--tui-button-border-interact, var(--tui-theme-secondary-subtlest));
+  }
+  .tui-interface .tui-button.is-theme-danger {
+    --_bg: var(--tui-button-bg, var(--tui-theme-danger-base));
+    --_fg: var(--tui-button-fg, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-button-border, var(--tui-theme-danger-base));
+  }
+  .tui-interface .tui-button.is-theme-danger:hover, .tui-interface .tui-button.is-theme-danger:focus-visible, .tui-interface .tui-button.is-theme-danger:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-danger-stronger));
+    --_fg: var(--tui-button-fg-interact, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-button-border-interact, var(--tui-theme-danger-stronger));
+  }
+  .tui-interface .tui-button.is-style-outline {
+    --_bg: var(--tui-button-bg, transparent);
+    --_fg: var(--tui-button-fg, var(--tui-theme-primary-strong));
+    --_border: var(--tui-button-border, var(--tui-theme-primary-base));
+  }
+  .tui-interface .tui-button.is-style-outline:hover, .tui-interface .tui-button.is-style-outline:focus-visible, .tui-interface .tui-button.is-style-outline:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-primary-base));
+    --_fg: var(--tui-button-fg-interact, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-button-border-interact, var(--tui-theme-primary-base));
+  }
+  .tui-interface .tui-button.is-style-outline.is-theme-secondary {
+    --_bg: var(--tui-button-bg, transparent);
+    --_fg: var(--tui-button-fg, var(--tui-color-fg));
+    --_border: var(--tui-button-border, var(--tui-color-border));
+  }
+  .tui-interface .tui-button.is-style-outline.is-theme-secondary:hover, .tui-interface .tui-button.is-style-outline.is-theme-secondary:focus-visible, .tui-interface .tui-button.is-style-outline.is-theme-secondary:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-secondary-subtle));
+    --_fg: var(--tui-button-fg-interact, var(--tui-color-fg));
+    --_border: var(--tui-button-border-interact, var(--tui-color-border));
+  }
+  .tui-interface .tui-button.is-style-outline.is-theme-danger {
+    --_bg: var(--tui-button-bg, transparent);
+    --_fg: var(--tui-button-fg, var(--tui-theme-danger-strong));
+    --_border: var(--tui-button-border, var(--tui-theme-danger-base));
+  }
+  .tui-interface .tui-button.is-style-outline.is-theme-danger:hover, .tui-interface .tui-button.is-style-outline.is-theme-danger:focus-visible, .tui-interface .tui-button.is-style-outline.is-theme-danger:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-danger-base));
+    --_fg: var(--tui-button-fg-interact, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-button-border-interact, var(--tui-theme-danger-base));
+  }
+  .tui-interface .tui-button.is-style-ghost {
+    --_bg: var(--tui-button-bg, transparent);
+    --_fg: var(--tui-button-fg, var(--tui-color-fg));
+    --_border: transparent;
+  }
+  .tui-interface .tui-button.is-style-ghost:hover, .tui-interface .tui-button.is-style-ghost:focus-visible, .tui-interface .tui-button.is-style-ghost:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-secondary-subtle));
+    --_fg: var(--tui-button-fg-interact, var(--tui-color-fg));
+    --_border: transparent;
+  }
+  .tui-interface .tui-button.is-style-ghost.is-theme-primary {
+    --_fg: var(--tui-button-fg, var(--tui-theme-primary-strong));
+  }
+  .tui-interface .tui-button.is-style-ghost.is-theme-primary:hover, .tui-interface .tui-button.is-style-ghost.is-theme-primary:focus-visible, .tui-interface .tui-button.is-style-ghost.is-theme-primary:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-primary-subtlest));
+    --_fg: var(--tui-button-fg-interact, var(--tui-theme-primary-stronger));
+  }
+  .tui-interface .tui-button.is-style-ghost.is-theme-danger {
+    --_fg: var(--tui-button-fg, var(--tui-theme-danger-strong));
+  }
+  .tui-interface .tui-button.is-style-ghost.is-theme-danger:hover, .tui-interface .tui-button.is-style-ghost.is-theme-danger:focus-visible, .tui-interface .tui-button.is-style-ghost.is-theme-danger:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, var(--tui-theme-danger-subtlest));
+    --_fg: var(--tui-button-fg-interact, var(--tui-theme-danger-stronger));
+  }
+  .tui-interface .tui-button.is-style-link {
+    --_bg: var(--tui-button-bg, transparent);
+    --_fg: var(--tui-button-fg, var(--tui-theme-primary-strong));
+    --_border: transparent;
+    border-width: 0;
+    padding: 0;
+  }
+  .tui-interface .tui-button.is-style-link:hover, .tui-interface .tui-button.is-style-link:focus-visible, .tui-interface .tui-button.is-style-link:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-button-bg-interact, transparent);
+    --_fg: var(--tui-button-fg-interact, var(--tui-theme-primary-stronger));
+    --_border: transparent;
+  }
+  .tui-interface .tui-button.is-style-link.is-theme-secondary {
+    --_fg: var(--tui-button-fg, var(--tui-theme-secondary-strong));
+  }
+  .tui-interface .tui-button.is-style-link.is-theme-secondary:hover, .tui-interface .tui-button.is-style-link.is-theme-secondary:focus-visible, .tui-interface .tui-button.is-style-link.is-theme-secondary:is(:active, [aria-pressed=true]) {
+    --_fg: var(--tui-button-fg-interact, var(--tui-theme-secondary-strongest));
+  }
+  .tui-interface .tui-button.is-style-link.is-theme-danger {
+    --_fg: var(--tui-button-fg, var(--tui-theme-danger-strong));
+  }
+  .tui-interface .tui-button.is-style-link.is-theme-danger:hover, .tui-interface .tui-button.is-style-link.is-theme-danger:focus-visible, .tui-interface .tui-button.is-style-link.is-theme-danger:is(:active, [aria-pressed=true]) {
+    --_fg: var(--tui-button-fg-interact, var(--tui-theme-danger-strongest));
+  }
+  @media (forced-colors: active) {
+    .tui-interface .tui-button {
+      forced-color-adjust: none;
+      background-color: CanvasText;
+      color: Canvas;
+      border-color: CanvasText;
+    }
+    .tui-interface .tui-button:is(:hover, :active) {
+      background-color: Highlight;
+      border-color: Highlight;
+    }
+    .tui-interface .tui-button:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+    .tui-interface .tui-button.is-style-link {
+      background-color: transparent;
+      color: LinkText;
+      border-color: transparent;
+    }
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .tui-interface .tui-button {
+      transition: none;
+    }
+  }
+  .tui-interface input[type=file] {
+    --_bg: var(--tui-button-bg, var(--tui-theme-primary-base));
+    --_fg: var(--tui-button-fg, var(--tui-color-bg-surface));
+    --_border: var(--tui-button-border, var(--tui-theme-primary-base));
+    --_radius: var(--tui-button-radius, var(--tui-radius-md));
+    --_bg-interact: var(--tui-button-bg-interact, var(--tui-theme-primary-stronger));
+    --_fg-interact: var(--tui-button-fg-interact, var(--tui-color-fg-on-accent));
+    --_border-interact: var(--tui-button-border-interact, var(--tui-theme-primary-stronger));
+  }
+  .tui-interface input[type=file]::file-selector-button {
+    font-size: var(--tui-typography-size-md);
+    font-weight: normal;
+    line-height: 1.4;
+    display: inline-flex;
+    align-self: center;
+    text-align: center;
+    justify-content: center;
+    align-items: center;
+    padding-inline: 1.2em;
+    padding-block: 0.575em;
+    gap: 0.5em;
+    background-color: var(--_bg);
+    color: var(--_fg);
+    border: var(--tui-border-width) solid var(--_border);
+    border-radius: var(--_radius);
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+    transition-property: border-color, color, background-color;
+  }
+  .tui-interface input[type=file]:hover::file-selector-button {
+    background-color: var(--_bg-interact);
+    color: var(--_fg-interact);
+    border-color: var(--_border-interact);
+  }
+  .tui-interface input[type=file]:focus-visible::file-selector-button {
+    background-color: var(--_bg-interact);
+    color: var(--_fg-interact);
+    border-color: var(--_border-interact);
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  .tui-interface input[type=file]:active::file-selector-button {
+    background-color: var(--_bg-interact);
+    color: var(--_fg-interact);
+    border-color: var(--_border-interact);
+  }
+  :where(.tui-interface) .tui-card {
+    --_bg: var(--tui-card-bg, var(--tui-color-bg-surface));
+    --_border: var(--tui-card-border, var(--tui-color-border));
+    --_border-interact: var(--tui-card-border-interact, var(--tui-theme-primary-base));
+    --_radius: var(--tui-card-radius, var(--tui-radius-md));
+    --_shadow: var(--tui-card-shadow, var(--tui-shadow-md));
+    --_shadow-interact: var(--tui-card-shadow-interact, var(--tui-shadow-sm));
+    --_padding: var(--tui-card-padding, var(--tui-spacing-md));
+    --_foot-basis: var(--tui-card-foot-basis, 500px);
+    box-sizing: border-box;
+    container-type: inline-size;
+    container-name: tuiCard;
+    position: relative;
+    width: 100%;
+    border-style: solid;
+    border-width: var(--tui-border-width);
+    border-color: var(--_border);
+    border-radius: var(--_radius);
+    background-color: var(--_bg);
+  }
+  :where(.tui-interface) .tui-card img.tui-card__media {
+    max-width: 100%;
+  }
+  :where(.tui-interface) .tui-card img.tui-card__media.is-flush {
+    border-radius: 0;
+  }
+  :where(.tui-interface) .tui-card .tui-card__media.is-flush {
+    margin-inline: calc(var(--_padding) * -1);
+    max-width: calc(100% + 2 * var(--_padding));
+    border-radius: 0;
+  }
+  :where(.tui-interface) .tui-card__head {
+    padding-block: var(--_padding);
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+  }
+  :where(.tui-interface) .tui-card__head .tui-card__media.is-flush:first-child {
+    margin-block-start: calc(var(--_padding) * -1);
+    border-start-end-radius: calc(var(--_radius) - 1px);
+    border-start-start-radius: calc(var(--_radius) - 1px);
+  }
+  :where(.tui-interface) .tui-card__body {
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+  }
+  :where(.tui-interface) .tui-card__body > *:first-child {
+    margin-block-start: unset;
+  }
+  :where(.tui-interface) .tui-card__body > *:last-child {
+    margin-block-end: unset;
+  }
+  :where(.tui-interface) .tui-card__body > p {
+    margin: 0;
+  }
+  :where(.tui-interface) .tui-card__body:first-child {
+    padding-block-start: var(--_padding);
+  }
+  :where(.tui-interface) .tui-card__body:last-child {
+    padding-block-end: var(--_padding);
+  }
+  :where(.tui-interface) .tui-card__foot {
+    padding-block: var(--_padding);
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+  }
+  :where(.tui-interface) .tui-card__foot .tui-card__media.is-flush:last-child {
+    margin-block-end: calc(var(--_padding) * -1);
+    border-end-end-radius: calc(var(--_radius) - 1px);
+    border-end-start-radius: calc(var(--_radius) - 1px);
+  }
+  @container tuiCard (width >= 400px) {
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      gap: var(--_padding);
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__media.is-flush {
+      object-fit: cover;
+      object-position: center;
+      margin-block: calc(var(--_padding) * -1);
+      height: calc(100% + 2 * var(--_padding));
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner *:has(.tui-card__media.is-flush) {
+      align-self: stretch;
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__head {
+      padding-inline-start: var(--_padding);
+      padding-block: var(--_padding);
+      flex: 0 1 auto;
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__head:has(.tui-icon:only-child) {
+      flex: 0 0 max-content;
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__head .tui-card__media.is-flush:first-child {
+      margin-inline-end: var(--_padding);
+      max-width: calc(100% + var(--_padding));
+      border-start-end-radius: 0;
+      border-end-start-radius: calc(var(--_radius) - 1px);
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__body {
+      flex: 2 1 auto;
+      padding-block: var(--_padding);
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__foot {
+      width: unset;
+      flex: 0 1 var(--_foot-basis);
+      padding-block: var(--_padding);
+      padding-inline-end: var(--_padding);
+      margin-inline-start: auto;
+      justify-content: flex-end;
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__foot .tui-card__media.is-flush:last-child {
+      margin-inline-start: var(--_padding);
+      max-width: calc(100% + var(--_padding));
+      border-end-start-radius: 0;
+      border-start-end-radius: calc(var(--_radius) - 1px);
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__head:not(:first-child),
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__body:not(:first-child),
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__foot:not(:first-child) {
+      padding-inline-start: 0;
+    }
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__head:not(:last-child),
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__body:not(:last-child),
+    :where(.tui-interface) .tui-card.is-layout-inline .tui-card__inner .tui-card__foot:not(:last-child) {
+      padding-inline-end: 0;
+    }
+  }
+  :where(.tui-interface) .tui-card.has-interaction {
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+    transition-property: border-color, color, background-color;
+  }
+  :where(.tui-interface) .tui-card.has-interaction:hover {
+    --_border: var(--_border-interact);
+  }
+  :where(.tui-interface) .tui-card.has-interaction:focus, :where(.tui-interface) .tui-card.has-interaction:focus-within {
+    --_border: var(--_border-interact);
+  }
+  :where(.tui-interface) .tui-card.has-interaction:active, :where(.tui-interface) .tui-card.has-interaction.active {
+    --_border: var(--tui-card-border-active, var(--tui-palette-color-gray-50));
+  }
+  :where(.tui-interface) .tui-card.has-interaction [disabled],
+  :where(.tui-interface) .tui-card.has-interaction .disabled {
+    opacity: var(--tui-opacity-disabled);
+  }
+  :where(.tui-interface) .tui-card.is-style-elevated {
+    box-shadow: var(--_shadow);
+    transition-property: border-color, color, background-color, box-shadow;
+  }
+  :where(.tui-interface) .tui-card.is-style-elevated:hover {
+    box-shadow: var(--_shadow-interact);
+  }
+  :where(.tui-interface) .tui-chip {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-secondary-subtle));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-secondary-strongest));
+    --_border: var(--tui-chip-border, var(--tui-theme-secondary-subtle));
+    --_icon: var(--tui-chip-icon, inherit);
+    --_radius: var(--tui-chip-radius, var(--tui-radius-sm));
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-weight: normal !important;
+    gap: 0.25em;
+    padding-inline: 0.75em;
+    padding-block: 0.375em;
+    background-color: var(--_bg) !important;
+    color: var(--_fg) !important;
+    border: var(--tui-border-width) solid var(--_border) !important;
+    border-radius: var(--_radius);
+    text-decoration: none;
+    line-height: 1.25;
+    white-space: nowrap;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+    transition-property: border-color, color, background-color, filter;
+  }
+  :where(.tui-interface) .tui-chip .tui-icon {
+    color: var(--_icon);
+  }
+  :where(.tui-interface) .tui-chip:where([aria-disabled=true], [disabled]) {
+    opacity: var(--tui-opacity-disabled);
+    pointer-events: none;
+  }
+  :where(.tui-interface) .tui-chip.is-size-xs {
+    font-size: var(--tui-typography-size-xs);
+    padding-inline: 0.5em;
+  }
+  :where(.tui-interface) .tui-chip.is-size-sm {
+    font-size: var(--tui-typography-size-sm);
+  }
+  :where(.tui-interface) .tui-chip.is-size-md {
+    font-size: var(--tui-typography-size-md);
+  }
+  :where(.tui-interface) .tui-chip.is-interactive, :where(.tui-interface) .tui-chip:is(a, button, [role=button]), :where(.tui-interface) .tui-chip:has(input[type=checkbox], input[type=radio]) {
+    cursor: pointer;
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-interactive:not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):hover {
+      filter: brightness(0.95);
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-interactive:not(:disabled):not([aria-disabled=true]):focus-visible, :where(.tui-interface) .tui-chip:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):focus-visible, :where(.tui-interface) .tui-chip:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) .tui-chip.is-interactive:is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-interactive:has(input:checked), :where(.tui-interface) .tui-chip:is(a, button, [role=button]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip:is(a, button, [role=button]):has(input:checked), :where(.tui-interface) .tui-chip:has(input[type=checkbox], input[type=radio]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip:has(input[type=checkbox], input[type=radio]):has(input:checked) {
+    box-shadow: 0 0 0 1px var(--_fg) inset;
+    filter: brightness(0.95);
+  }
+  :where(.tui-interface) .tui-chip.is-interactive:is(a), :where(.tui-interface) .tui-chip:is(a, button, [role=button]):is(a), :where(.tui-interface) .tui-chip:has(input[type=checkbox], input[type=radio]):is(a) {
+    text-decoration: none;
+  }
+  :where(.tui-interface) .tui-chip.is-interactive:is(a):visited, :where(.tui-interface) .tui-chip:is(a, button, [role=button]):is(a):visited, :where(.tui-interface) .tui-chip:has(input[type=checkbox], input[type=radio]):is(a):visited {
+    color: var(--_fg);
+  }
+  :where(.tui-interface) .tui-chip.is-theme-primary {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-primary-subtlest));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-primary-stronger));
+    --_border: var(--tui-chip-border, var(--tui-theme-primary-subtlest));
+  }
+  :where(.tui-interface) .tui-chip.is-theme-secondary {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-secondary-subtle));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-secondary-stronger));
+    --_border: var(--tui-chip-border, var(--tui-theme-secondary-subtle));
+    --_icon: var(--tui-chip-icon, var(--tui-theme-secondary-base));
+  }
+  :where(.tui-interface) .tui-chip.is-theme-success {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-success-subtlest));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-success-stronger));
+    --_border: var(--tui-chip-border, var(--tui-theme-success-subtlest));
+    --_icon: var(--tui-chip-icon, var(--tui-theme-success-base));
+  }
+  :where(.tui-interface) .tui-chip.is-theme-warning {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-warning-subtlest));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-warning-stronger));
+    --_border: var(--tui-chip-border, var(--tui-theme-warning-subtlest));
+    --_icon: var(--tui-chip-icon, var(--tui-theme-warning-base));
+  }
+  :where(.tui-interface) .tui-chip.is-theme-danger {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-danger-subtlest));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-danger-stronger));
+    --_border: var(--tui-chip-border, var(--tui-theme-danger-subtlest));
+    --_icon: var(--tui-chip-icon, var(--tui-theme-danger-base));
+  }
+  :where(.tui-interface) .tui-chip.is-style-ghost:not(:is(a, button, [role=button])), :where(.tui-interface) .tui-chip.is-style-ghost:not(:is(:hover, :focus)) {
+    --_bg: transparent;
+  }
+  :where(.tui-interface) .tui-chip.is-style-ghost:not(:is(:focus-visible, :active, [aria-pressed=true], .is-selected)) {
+    --_border: transparent;
+  }
+  :where(.tui-interface) .tui-chip.is-style-outline {
+    --_bg: var(--tui-chip-bg, var(--tui-color-bg-surface));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-secondary-base));
+    --_border: var(--tui-chip-border, var(--tui-theme-secondary-base));
+  }
+  :where(.tui-interface) .tui-chip.is-style-outline.is-theme-primary {
+    --_bg: var(--tui-chip-bg, var(--tui-color-bg-surface));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-primary-base));
+    --_border: var(--tui-chip-border, var(--tui-theme-primary-base));
+  }
+  :where(.tui-interface) .tui-chip.is-style-outline.is-theme-secondary {
+    --_bg: var(--tui-chip-bg, var(--tui-color-bg-surface));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-secondary-strong));
+    --_border: var(--tui-chip-border, var(--tui-theme-secondary-strong));
+  }
+  :where(.tui-interface) .tui-chip.is-style-outline.is-theme-success {
+    --_bg: var(--tui-chip-bg, var(--tui-color-bg-surface));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-success-strong));
+    --_border: var(--tui-chip-border, var(--tui-theme-success-strong));
+  }
+  :where(.tui-interface) .tui-chip.is-style-outline.is-theme-warning {
+    --_bg: var(--tui-chip-bg, var(--tui-color-bg-surface));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-warning-base));
+    --_border: var(--tui-chip-border, var(--tui-theme-warning-base));
+  }
+  :where(.tui-interface) .tui-chip.is-style-outline.is-theme-danger {
+    --_bg: var(--tui-chip-bg, var(--tui-color-bg-surface));
+    --_fg: var(--tui-chip-fg, var(--tui-theme-danger-base));
+    --_border: var(--tui-chip-border, var(--tui-theme-danger-base));
+  }
+  :where(.tui-interface) .tui-chip.is-selected.is-style-outline {
+    --_bg: var(--_border);
+    --_fg: var(--tui-color-fg-on-accent);
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-secondary-base));
+    --_fg: var(--tui-chip-fg, var(--tui-color-fg-on-accent));
+    --_icon: var(--tui-chip-icon, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-chip-border, var(--tui-theme-secondary-base));
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-style-solid.is-interactive:not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):hover {
+      --_bg: var(--tui-theme-secondary-strong);
+      --_border: var(--tui-theme-secondary-strong);
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-interactive:is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-interactive:has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid:is(a, button, [role=button]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid:is(a, button, [role=button]):has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid:has(input[type=checkbox], input[type=radio]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid:has(input[type=checkbox], input[type=radio]):has(input:checked) {
+    --_bg: var(--tui-theme-secondary-stronger);
+    --_border: var(--tui-theme-secondary-stronger);
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-primary-base));
+    --_fg: var(--tui-chip-fg, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-chip-border, var(--tui-theme-primary-base));
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary.is-interactive:not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):hover {
+      --_bg: var(--tui-theme-primary-strong);
+      --_border: var(--tui-theme-primary-strong);
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary.is-interactive:is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary.is-interactive:has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary:is(a, button, [role=button]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary:is(a, button, [role=button]):has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary:has(input[type=checkbox], input[type=radio]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-primary:has(input[type=checkbox], input[type=radio]):has(input:checked) {
+    --_bg: var(--tui-theme-primary-stronger);
+    --_border: var(--tui-theme-primary-stronger);
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-secondary-base));
+    --_fg: var(--tui-chip-fg, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-chip-border, var(--tui-theme-secondary-base));
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary.is-interactive:not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):hover {
+      --_bg: var(--tui-theme-secondary-strong);
+      --_border: var(--tui-theme-secondary-strong);
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary.is-interactive:is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary.is-interactive:has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary:is(a, button, [role=button]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary:is(a, button, [role=button]):has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary:has(input[type=checkbox], input[type=radio]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-secondary:has(input[type=checkbox], input[type=radio]):has(input:checked) {
+    --_bg: var(--tui-theme-secondary-stronger);
+    --_border: var(--tui-theme-secondary-stronger);
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-success-base));
+    --_fg: var(--tui-chip-fg, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-chip-border, var(--tui-theme-success-base));
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success.is-interactive:not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):hover {
+      --_bg: var(--tui-theme-success-strong);
+      --_border: var(--tui-theme-success-strong);
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success.is-interactive:is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success.is-interactive:has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success:is(a, button, [role=button]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success:is(a, button, [role=button]):has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success:has(input[type=checkbox], input[type=radio]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-success:has(input[type=checkbox], input[type=radio]):has(input:checked) {
+    --_bg: var(--tui-theme-success-stronger);
+    --_border: var(--tui-theme-success-stronger);
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-warning-base));
+    --_fg: var(--tui-chip-fg, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-chip-border, var(--tui-theme-warning-base));
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning.is-interactive:not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):hover {
+      --_bg: var(--tui-theme-warning-strong);
+      --_border: var(--tui-theme-warning-strong);
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning.is-interactive:is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning.is-interactive:has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning:is(a, button, [role=button]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning:is(a, button, [role=button]):has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning:has(input[type=checkbox], input[type=radio]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-warning:has(input[type=checkbox], input[type=radio]):has(input:checked) {
+    --_bg: var(--tui-theme-warning-stronger);
+    --_border: var(--tui-theme-warning-stronger);
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger {
+    --_bg: var(--tui-chip-bg, var(--tui-theme-danger-base));
+    --_fg: var(--tui-chip-fg, var(--tui-color-fg-on-accent));
+    --_border: var(--tui-chip-border, var(--tui-theme-danger-base));
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger.is-interactive:not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger:is(a, button, [role=button]):not(:disabled):not([aria-disabled=true]):hover, :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger:has(input[type=checkbox], input[type=radio]):not(:disabled):not([aria-disabled=true]):hover {
+      --_bg: var(--tui-theme-danger-strong);
+      --_border: var(--tui-theme-danger-strong);
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger.is-interactive:is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger.is-interactive:has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger:is(a, button, [role=button]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger:is(a, button, [role=button]):has(input:checked), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger:has(input[type=checkbox], input[type=radio]):is(:active, [aria-pressed=true], .is-selected), :where(.tui-interface) .tui-chip.is-style-solid.is-theme-danger:has(input[type=checkbox], input[type=radio]):has(input:checked) {
+    --_bg: var(--tui-theme-danger-stronger);
+    --_border: var(--tui-theme-danger-stronger);
+  }
+  :where(.tui-interface) .tui-chip.is-style-flush {
+    --_bg: transparent;
+    --_fg: var(--tui-chip-fg, var(--tui-color-fg));
+    --_border: transparent;
+    padding-inline: 0 !important;
+    padding-block: 0 !important;
+    border: 0 !important;
+    background: transparent !important;
+    filter: none !important;
+  }
+  :where(.tui-interface) .tui-chip.is-style-flush:hover, :where(.tui-interface) .tui-chip.is-style-flush:active {
+    filter: none !important;
+  }
+  :where(.tui-interface) .tui-chip.is-style-flush.is-interactive, :where(.tui-interface) .tui-chip.is-style-flush:is(a, button, [role=button]) {
+    text-decoration: none;
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-chip.is-style-flush.is-interactive:hover, :where(.tui-interface) .tui-chip.is-style-flush:is(a, button, [role=button]):hover {
+      text-decoration: underline;
+    }
+  }
+  :where(.tui-interface) .tui-chip.is-style-flush.is-interactive:focus-visible, :where(.tui-interface) .tui-chip.is-style-flush:is(a, button, [role=button]):focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) .tui-content-indicator {
+    --_bg: var(--tui-content-indicator-bg, transparent);
+    --_border: var(--tui-content-indicator-border, var(--tui-color-border));
+    --_fg: var(--tui-content-indicator-fg, var(--tui-color-fg));
+    display: inline-flex;
+  }
+  :where(.tui-interface) .tui-content-indicator.is-size-xs {
+    font-size: 8px;
+  }
+  :where(.tui-interface) .tui-content-indicator.is-size-sm {
+    font-size: 12px;
+  }
+  :where(.tui-interface) .tui-content-indicator.is-size-md {
+    font-size: 16px;
+  }
+  :where(.tui-interface) .tui-content-indicator.is-size-lg {
+    font-size: 20px;
+  }
+  :where(.tui-interface) .tui-content-indicator__circle {
+    position: relative;
+    display: grid;
+    place-items: center;
+    inline-size: 2em;
+    block-size: 2em;
+    border-radius: 50%;
+    background: var(--_bg);
+    border: 0.15em solid var(--_border);
+  }
+  :where(.tui-interface) .tui-content-indicator__circle .tui-icon {
+    font-size: 1.2em;
+    color: var(--_fg);
+  }
+  :where(.tui-interface) .tui-content-indicator.is-variant-solid .tui-content-indicator__circle {
+    border: none;
+    background: var(--_border);
+  }
+  :where(.tui-interface) .tui-content-indicator.is-variant-solid .tui-content-indicator__circle .tui-icon {
+    color: var(--tui-color-fg-on-accent);
+  }
+  :where(.tui-interface) .tui-content-indicator.is-theme-default {
+    --_border: var(--tui-color-border);
+    --_fg: var(--tui-color-fg-muted);
+  }
+  :where(.tui-interface) .tui-content-indicator.is-theme-info {
+    --_border: var(--tui-theme-info-base);
+    --_fg: var(--tui-theme-info-base);
+  }
+  :where(.tui-interface) .tui-content-indicator.is-theme-success {
+    --_border: var(--tui-theme-success-base);
+    --_fg: var(--tui-theme-success-base);
+  }
+  :where(.tui-interface) .tui-content-indicator.is-theme-warning {
+    --_border: var(--tui-theme-warning-base);
+    --_fg: var(--tui-theme-warning-base);
+  }
+  :where(.tui-interface) .tui-content-indicator.is-theme-danger {
+    --_border: var(--tui-theme-danger-base);
+    --_fg: var(--tui-theme-danger-base);
+  }
+  :where(.tui-interface) .tui-dropdown {
+    --_bg: var(--tui-dropdown-bg, var(--tui-color-bg-elevated));
+    --_fg: var(--tui-dropdown-fg, var(--tui-color-fg-default));
+    --_radius: var(--tui-dropdown-radius, var(--tui-radius-sm));
+    --_shadow: var(--tui-dropdown-shadow, var(--tui-shadow-md));
+    --_z: var(--tui-dropdown-z, var(--tui-layer-top));
+    --_border: var(--tui-dropdown-border, var(--tui-color-border-default));
+    --_item-bg-hover: var(--tui-dropdown-item-bg-hover, var(--tui-color-bg-subtle));
+    --_item-bg-active: var(--tui-dropdown-item-bg-active, var(--tui-color-bg-muted));
+    box-sizing: border-box;
+    z-index: var(--_z);
+    min-width: var(--tui-dropdown-min-width, 160px);
+    padding: var(--tui-spacing-xxs, 4px);
+    pointer-events: auto;
+    background-color: var(--_bg);
+    color: var(--_fg);
+    border-radius: var(--_radius);
+    box-shadow: var(--_shadow);
+    border: 1px solid var(--_border);
+    font-size: var(--tui-typography-size-sm, 14px);
+    line-height: 1.4;
+    animation: tui-fadeFromTransparent var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-dropdown__item,
+  :where(.tui-interface) .tui-dropdown .tui-button,
+  :where(.tui-interface) .tui-dropdown .tui-icon-button {
+    box-sizing: border-box;
+    justify-content: flex-start;
+    width: 100%;
+    min-width: 0;
+    gap: var(--tui-spacing-xs, 8px);
+    padding: var(--tui-spacing-xs, 8px) var(--tui-spacing-sm, 12px);
+    border-radius: var(--tui-radius-xs, 4px);
+    text-align: left;
+    font-weight: normal;
+    --tui-button-bg: transparent;
+    --tui-button-fg: inherit;
+    --tui-button-border-color: transparent;
+  }
+  :where(.tui-interface) .tui-dropdown__item:hover, :where(.tui-interface) .tui-dropdown__item:focus-visible, :where(.tui-interface) .tui-dropdown__item[data-active],
+  :where(.tui-interface) .tui-dropdown .tui-button:hover,
+  :where(.tui-interface) .tui-dropdown .tui-button:focus-visible,
+  :where(.tui-interface) .tui-dropdown .tui-button[data-active],
+  :where(.tui-interface) .tui-dropdown .tui-icon-button:hover,
+  :where(.tui-interface) .tui-dropdown .tui-icon-button:focus-visible,
+  :where(.tui-interface) .tui-dropdown .tui-icon-button[data-active] {
+    --tui-button-bg: var(--_item-bg-hover);
+    --tui-button-fg: inherit;
+    outline: none;
+  }
+  :where(.tui-interface) .tui-dropdown__item:active,
+  :where(.tui-interface) .tui-dropdown .tui-button:active,
+  :where(.tui-interface) .tui-dropdown .tui-icon-button:active {
+    --tui-button-bg: var(--_item-bg-active);
+  }
+  :where(.tui-interface) .tui-dropdown__item:disabled, :where(.tui-interface) .tui-dropdown__item[aria-disabled=true],
+  :where(.tui-interface) .tui-dropdown .tui-button:disabled,
+  :where(.tui-interface) .tui-dropdown .tui-button[aria-disabled=true],
+  :where(.tui-interface) .tui-dropdown .tui-icon-button:disabled,
+  :where(.tui-interface) .tui-dropdown .tui-icon-button[aria-disabled=true] {
+    opacity: 0.5;
+    cursor: not-allowed;
+    pointer-events: none;
+  }
+  :where(.tui-interface) .tui-dropdown .tui-icon-button {
+    justify-content: center;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-dropdown {
+      animation: none;
+    }
+  }
+  @media (forced-colors: active) {
+    :where(.tui-interface) .tui-dropdown {
+      background-color: Canvas;
+      color: CanvasText;
+      border: 1px solid CanvasText;
+    }
+    :where(.tui-interface) .tui-dropdown__item:hover, :where(.tui-interface) .tui-dropdown__item:focus-visible, :where(.tui-interface) .tui-dropdown__item[data-active],
+    :where(.tui-interface) .tui-dropdown .tui-button:hover,
+    :where(.tui-interface) .tui-dropdown .tui-button:focus-visible,
+    :where(.tui-interface) .tui-dropdown .tui-button[data-active],
+    :where(.tui-interface) .tui-dropdown .tui-icon-button:hover,
+    :where(.tui-interface) .tui-dropdown .tui-icon-button:focus-visible,
+    :where(.tui-interface) .tui-dropdown .tui-icon-button[data-active] {
+      background-color: Highlight;
+      color: HighlightText;
+      forced-color-adjust: none;
+    }
+  }
+  :where(.tui-interface) :is(label, .tui-label) {
+    color: var(--tui-color-fg);
+    font-weight: bold;
+    font-size: var(--tui-typography-size-sm);
+  }
+  :where(.tui-interface) :is(.tui-input,
+  input[type=text],
+  input[type=email],
+  input[type=url],
+  input[type=password],
+  input[type=search],
+  input[type=number],
+  input[type=tel],
+  input[type=range],
+  input[type=date],
+  input[type=month],
+  input[type=week],
+  input[type=time],
+  input[type=datetime],
+  input[type=datetime-local],
+  input[type=color],
+  textarea,
+  select) {
+    --_bg: var(--tui-input-bg, var(--tui-color-bg));
+    --_fg: var(--tui-input-fg, var(--tui-color-fg-muted));
+    --_border: var(--tui-input-border, var(--tui-color-border));
+    --_border-focus: var(--tui-input-border-focus, var(--tui-theme-primary-base));
+    --_border-invalid: var(--tui-input-border-invalid, var(--tui-theme-danger-base));
+    --_radius: var(--tui-input-radius, var(--tui-radius-md));
+    font-size: var(--tui-typography-size-sm);
+    font-family: inherit;
+    box-sizing: content-box;
+    border: var(--tui-border-width) solid var(--_border);
+    border-radius: var(--_radius);
+    appearance: none;
+    background-color: var(--_bg);
+    color: var(--_fg);
+    height: calc(2em - 2 * var(--tui-border-width));
+    padding-inline: 0.5em;
+    padding-block: 0;
+    min-width: 1px;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+    transition-property: border-color, color, background-color;
+  }
+  :where(.tui-interface) :is(.tui-input,
+  input[type=text],
+  input[type=email],
+  input[type=url],
+  input[type=password],
+  input[type=search],
+  input[type=number],
+  input[type=tel],
+  input[type=range],
+  input[type=date],
+  input[type=month],
+  input[type=week],
+  input[type=time],
+  input[type=datetime],
+  input[type=datetime-local],
+  input[type=color],
+  textarea,
+  select):focus-visible {
+    --_border: var(--_border-focus);
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) :is(.tui-input,
+  input[type=text],
+  input[type=email],
+  input[type=url],
+  input[type=password],
+  input[type=search],
+  input[type=number],
+  input[type=tel],
+  input[type=range],
+  input[type=date],
+  input[type=month],
+  input[type=week],
+  input[type=time],
+  input[type=datetime],
+  input[type=datetime-local],
+  input[type=color],
+  textarea,
+  select)[disabled] {
+    opacity: var(--tui-opacity-disabled);
+    cursor: not-allowed;
+  }
+  :where(.tui-interface) :is(.tui-input,
+  input[type=text],
+  input[type=email],
+  input[type=url],
+  input[type=password],
+  input[type=search],
+  input[type=number],
+  input[type=tel],
+  input[type=range],
+  input[type=date],
+  input[type=month],
+  input[type=week],
+  input[type=time],
+  input[type=datetime],
+  input[type=datetime-local],
+  input[type=color],
+  textarea,
+  select):invalid {
+    --_border: var(--_border-invalid);
+  }
+  :where(.tui-interface) :is(input[type=search], input[type=search].tui-input) {
+    padding-inline-start: 2.5em !important;
+    background-image: url('data:image/svg+xml;utf8,<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M8 16a8 8 0 1 1 8-8 8.009 8.009 0 0 1-8 8ZM8 2a6 6 0 1 0 6 6 6.006 6.006 0 0 0-6-6ZM19 20a1 1 0 0 1-.707-.293l-4-4a1 1 0 0 1 1.414-1.414l4 4A1 1 0 0 1 19 20Z" fill="%231F2A37"/></svg>');
+    background-repeat: no-repeat;
+    background-position: 0.75em 50%;
+    background-size: 1em;
+  }
+  :where(.tui-interface) :is(select, select.tui-input) {
+    padding-inline-end: 2.5em !important;
+    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHZpZXdCb3g9IjAgMCAxMSAxMCI+PHBhdGggZmlsbD0iIzExMTkyOCIgZD0iTTUuNTExIDcuNWEuOTM5LjkzOSAwIDAgMS0uNjM2LS4yNDRsLTMuNi0zLjMyNmEuODMzLjgzMyAwIDAgMS0uMjAyLS4yNy43NzguNzc4IDAgMCAxLS4wMDYtLjY0My44My44MyAwIDAgMSAuMTk3LS4yNzMuOTA5LjkwOSAwIDAgMSAuMjk1LS4xODIuOTY1Ljk2NSAwIDAgMSAuNjk2LjAwNmMuMTEuMDQzLjIxLjEwNi4yOTIuMTg2bDIuOTY0IDIuNzM4IDIuOTY0LTIuNzM4YS45NC45NCAwIDAgMSAuNjMzLS4yMzRjLjIzNi4wMDIuNDYyLjA5LjYyOC4yNDRhLjgwMS44MDEgMCAwIDEgLjI2NC41OC44LjggMCAwIDEtLjI1My41ODZsLTMuNiAzLjMyNmEuOTM5LjkzOSAwIDAgMS0uNjM2LjI0NFoiLz48L3N2Zz4=");
+    background-repeat: no-repeat;
+    background-position: calc(100% - 0.75em) 50%;
+    background-size: 1em;
+  }
+  :where(.tui-interface) .tui-inline-choice {
+    --_accent: var(--tui-input-accent, var(--tui-theme-primary-base));
+    display: flex;
+    align-items: center;
+    gap: var(--tui-spacing-xs);
+  }
+  :where(.tui-interface) .tui-inline-choice input[type=radio],
+  :where(.tui-interface) .tui-inline-choice input[type=checkbox] {
+    font-size: 1.15em;
+    width: 1em;
+    height: 1em;
+    flex: 0 0 1em;
+    margin: 0;
+  }
+  :where(.tui-interface) .tui-inline-choice input[type=radio]:checked,
+  :where(.tui-interface) .tui-inline-choice input[type=checkbox]:checked {
+    accent-color: var(--_accent);
+  }
+  :where(.tui-interface) .tui-inline-choice label {
+    font-weight: unset;
+    line-height: 1.25em;
+    font-size: var(--tui-typography-size-sm);
+  }
+  :where(.tui-interface) .tui-toggle {
+    --_accent: var(--tui-input-accent, var(--tui-theme-primary-base));
+    --_track-off: var(--tui-palette-color-gray-300);
+  }
+  :where(.tui-interface) .tui-toggle input[type=checkbox] {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    border: 0;
+  }
+  :where(.tui-interface) .tui-toggle input[type=checkbox] + label {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--tui-spacing-xs);
+    font-weight: unset;
+    line-height: 1.25em;
+    font-size: var(--tui-typography-size-sm);
+  }
+  :where(.tui-interface) .tui-toggle input[type=checkbox] + label[for]::before {
+    content: "";
+    display: inline-flex;
+    cursor: pointer;
+    width: 2.8575em;
+    height: 1.4285em;
+    border-radius: 9999px;
+    border: var(--tui-border-width) solid var(--_track-off);
+    background-color: var(--_track-off);
+    vertical-align: middle;
+    background-image: radial-gradient(circle, currentcolor 0%, currentcolor 52.25%, rgba(255, 255, 255, 0) 52.25%, rgba(255, 255, 255, 0) 100%);
+    color: var(--tui-color-bg);
+    background-size: 1.4285em;
+    background-repeat: no-repeat;
+    background-position: 0 50%;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+    transition-property: background-position, color, background-color;
+  }
+  :where(.tui-interface) .tui-toggle input[type=checkbox]:checked + label[for]::before {
+    background-position: 100% 50%;
+    background-color: var(--_accent);
+    border-color: var(--_accent);
+  }
+  :where(.tui-interface) .tui-toggle input[type=checkbox]:focus-visible + label[for]::before {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) input[type=number] {
+    padding-inline-end: 0.25em;
+  }
+  :where(.tui-interface) input[type=file] {
+    --_bg: var(--tui-input-bg, var(--tui-color-bg));
+    --_fg: var(--tui-input-fg, var(--tui-color-fg-muted));
+    --_border: var(--tui-input-border, var(--tui-color-border));
+    --_radius: var(--tui-input-radius, var(--tui-radius-md));
+    font-size: var(--tui-typography-size-sm);
+    font-family: inherit;
+    box-sizing: content-box;
+    border: var(--tui-border-width) solid var(--_border);
+    border-radius: var(--_radius);
+    background-color: var(--_bg);
+    color: var(--_fg);
+    padding: 0.5em;
+    min-width: 1px;
+    cursor: pointer;
+  }
+  :where(.tui-interface) .tui-icon {
+    display: inline-flex;
+    vertical-align: -0.125em;
+    line-height: 1;
+  }
+  :where(.tui-interface) .tui-icon.is-size-xs {
+    font-size: var(--tui-icon-size-xs, var(--tui-typography-size-xs));
+  }
+  :where(.tui-interface) .tui-icon.is-size-sm {
+    font-size: var(--tui-icon-size-sm, var(--tui-typography-size-sm));
+  }
+  :where(.tui-interface) .tui-icon.is-size-md {
+    font-size: var(--tui-icon-size-md, var(--tui-typography-size-md));
+  }
+  :where(.tui-interface) .tui-icon.is-size-lg {
+    font-size: var(--tui-icon-size-lg, var(--tui-typography-size-lg));
+  }
+  :where(.tui-interface) .tui-icon.is-size-xl {
+    font-size: var(--tui-icon-size-xl, var(--tui-typography-size-xl));
+  }
+  :where(.tui-interface) .tui-icon.is-size-xxl {
+    font-size: var(--tui-icon-size-xxl, var(--tui-typography-size-xxl));
+  }
+  :where(.tui-interface) .tui-icon svg {
+    width: 1em;
+    height: 1em;
+    fill: currentColor;
+  }
+  .tui-interface .tui-icon-button {
+    --_bg: var(--tui-icon-button-bg, transparent);
+    --_fg: var(--tui-icon-button-fg, var(--tui-color-fg));
+    --_border: var(--tui-icon-button-border, transparent);
+    --_radius: var(--tui-icon-button-radius, var(--tui-radius-md));
+    --_bg-interact: var(--tui-icon-button-bg-interact, var(--tui-theme-secondary-subtle));
+    --_fg-interact: var(--tui-icon-button-fg-interact, var(--tui-color-fg));
+    appearance: none;
+    border: none;
+    background: none;
+    padding: 0;
+    margin: 0;
+    font: inherit;
+    cursor: pointer;
+    text-decoration: none;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+    width: 2rem;
+    height: 2rem;
+    background-color: var(--_bg);
+    color: var(--_fg);
+    border: var(--tui-border-width) solid var(--_border);
+    border-radius: var(--_radius);
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+    transition-property: background-color, color, border-color;
+  }
+  .tui-interface .tui-icon-button .tui-icon {
+    font-size: 1rem;
+  }
+  .tui-interface .tui-icon-button:hover {
+    --_bg: var(--_bg-interact);
+    --_fg: var(--_fg-interact);
+  }
+  .tui-interface .tui-icon-button:focus-visible {
+    --_bg: var(--_bg-interact);
+    --_fg: var(--_fg-interact);
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  .tui-interface .tui-icon-button:is(:active, [aria-pressed=true]) {
+    --_bg: var(--_bg-interact);
+    --_fg: var(--_fg-interact);
+  }
+  .tui-interface .tui-icon-button:where(:disabled, [aria-disabled=true], .is-disabled) {
+    pointer-events: none;
+    cursor: not-allowed;
+    opacity: var(--tui-opacity-disabled);
+  }
+  .tui-interface .tui-icon-button.is-size-xs {
+    width: 1.5rem;
+    height: 1.5rem;
+    --_radius: var(--tui-icon-button-radius, var(--tui-radius-sm));
+  }
+  .tui-interface .tui-icon-button.is-size-xs .tui-icon {
+    font-size: 0.75rem;
+  }
+  .tui-interface .tui-icon-button.is-size-md {
+    width: 2.5rem;
+    height: 2.5rem;
+  }
+  .tui-interface .tui-icon-button.is-size-md .tui-icon {
+    font-size: 1.25rem;
+  }
+  .tui-interface .tui-icon-button.is-size-lg {
+    width: 3rem;
+    height: 3rem;
+  }
+  .tui-interface .tui-icon-button.is-size-lg .tui-icon {
+    font-size: 1.5rem;
+  }
+  .tui-interface .tui-icon-button.is-theme-primary {
+    --_fg: var(--tui-icon-button-fg, var(--tui-theme-primary-base));
+    --_fg-interact: var(--tui-icon-button-fg-interact, var(--tui-theme-primary-strong));
+    --_bg-interact: var(--tui-icon-button-bg-interact, var(--tui-theme-primary-subtlest));
+  }
+  .tui-interface .tui-icon-button.is-theme-danger {
+    --_fg: var(--tui-icon-button-fg, var(--tui-theme-danger-base));
+    --_fg-interact: var(--tui-icon-button-fg-interact, var(--tui-theme-danger-strong));
+    --_bg-interact: var(--tui-icon-button-bg-interact, var(--tui-theme-danger-subtlest));
+  }
+  .tui-interface .tui-icon-button.is-style-outline {
+    --_border: var(--tui-icon-button-border, var(--tui-color-border));
+    --_bg-interact: var(--tui-icon-button-bg-interact, var(--tui-theme-secondary-subtle));
+  }
+  .tui-interface .tui-icon-button.is-style-outline.is-theme-primary {
+    --_border: var(--tui-icon-button-border, var(--tui-theme-primary-base));
+    --_bg-interact: var(--tui-icon-button-bg-interact, var(--tui-theme-primary-subtlest));
+    --_fg-interact: var(--tui-icon-button-fg-interact, var(--tui-theme-primary-strong));
+  }
+  .tui-interface .tui-icon-button.is-style-outline.is-theme-danger {
+    --_border: var(--tui-icon-button-border, var(--tui-theme-danger-base));
+    --_bg-interact: var(--tui-icon-button-bg-interact, var(--tui-theme-danger-subtlest));
+    --_fg-interact: var(--tui-icon-button-fg-interact, var(--tui-theme-danger-strong));
+  }
+  .tui-interface .tui-icon-button.is-style-solid {
+    --_bg: var(--tui-icon-button-bg, var(--tui-theme-secondary-subtle));
+    --_fg: var(--tui-icon-button-fg, var(--tui-color-fg));
+  }
+  .tui-interface .tui-icon-button.is-style-solid:hover, .tui-interface .tui-icon-button.is-style-solid:focus-visible, .tui-interface .tui-icon-button.is-style-solid:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-icon-button-bg-interact, var(--tui-theme-secondary-soft));
+  }
+  .tui-interface .tui-icon-button.is-style-solid.is-theme-primary {
+    --_bg: var(--tui-icon-button-bg, var(--tui-theme-primary-base));
+    --_fg: var(--tui-icon-button-fg, var(--tui-color-fg-on-accent));
+  }
+  .tui-interface .tui-icon-button.is-style-solid.is-theme-primary:hover, .tui-interface .tui-icon-button.is-style-solid.is-theme-primary:focus-visible, .tui-interface .tui-icon-button.is-style-solid.is-theme-primary:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-icon-button-bg-interact, var(--tui-theme-primary-stronger));
+  }
+  .tui-interface .tui-icon-button.is-style-solid.is-theme-danger {
+    --_bg: var(--tui-icon-button-bg, var(--tui-theme-danger-base));
+    --_fg: var(--tui-icon-button-fg, var(--tui-color-fg-on-accent));
+  }
+  .tui-interface .tui-icon-button.is-style-solid.is-theme-danger:hover, .tui-interface .tui-icon-button.is-style-solid.is-theme-danger:focus-visible, .tui-interface .tui-icon-button.is-style-solid.is-theme-danger:is(:active, [aria-pressed=true]) {
+    --_bg: var(--tui-icon-button-bg-interact, var(--tui-theme-danger-stronger));
+  }
+  .tui-interface .tui-icon-button[aria-busy=true] {
+    pointer-events: none;
+  }
+  .tui-interface .tui-icon-button[aria-busy=true] .tui-icon {
+    visibility: hidden;
+  }
+  .tui-interface .tui-icon-button__spinner {
+    position: absolute;
+    width: 1em;
+    height: 1em;
+    border: 0.15em solid currentColor;
+    border-right-color: transparent;
+    border-radius: 50%;
+    animation: tui-spin 0.85s linear infinite;
+  }
+  @media (forced-colors: active) {
+    .tui-icon-button {
+      forced-color-adjust: none;
+      background-color: Canvas;
+      color: CanvasText;
+      border-color: CanvasText;
+    }
+    .tui-icon-button:is(:hover, :active) {
+      background-color: Highlight;
+      color: Canvas;
+    }
+    .tui-icon-button:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .tui-icon-button {
+      transition: none;
+    }
+    .tui-icon-button__spinner {
+      animation: none;
+    }
+  }
+  .tui-modal {
+    --_z: var(--tui-modal-z, var(--tui-layer-modal, 1000));
+    --_backdrop: var(--tui-modal-backdrop, var(--tui-color-bg-overlay));
+    position: fixed;
+    inset: 0;
+    z-index: var(--_z);
+    pointer-events: auto;
+    display: flex;
+    justify-content: center;
+    align-items: flex-start;
+    overflow: auto;
+    padding-block: 1rem;
+  }
+  .tui-modal__backdrop {
+    position: fixed;
+    inset: 0;
+    background: var(--_backdrop);
+    transition: opacity var(--tui-motion-duration) var(--tui-motion-timing);
+    opacity: 0;
+  }
+  .tui-modal[data-state=open] .tui-modal__backdrop {
+    opacity: 1;
+  }
+  .tui-modal__dialog .tui-modal__close {
+    position: absolute;
+    top: var(--tui-spacing-sm);
+    inset-inline-end: var(--tui-spacing-sm);
+    z-index: 2;
+  }
+  .tui-modal__dialog {
+    --_max: var(--tui-modal-max, 720px);
+    --_bg: var(--tui-modal-bg, var(--tui-color-bg-surface));
+    --_border: var(--tui-modal-border, var(--tui-color-border));
+    --_radius: var(--tui-modal-radius, var(--tui-radius-lg));
+    --_padding: var(--tui-modal-padding, var(--tui-spacing-md));
+    --_shadow: var(--tui-modal-shadow, var(--tui-shadow-lg));
+    position: relative;
+    width: 100%;
+    max-inline-size: min(100vw - 2rem, var(--_max));
+    max-block-size: calc(100dvh - 2rem);
+    margin-block: auto;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    --_min-body: 8rem;
+    --_min-head: 0rem;
+    --_min-foot: 0rem;
+    min-block-size: calc(var(--_min-body) + var(--_min-head) + var(--_min-foot));
+  }
+  .tui-modal__dialog:has(> .tui-modal__head) {
+    --_min-head: 4rem;
+  }
+  .tui-modal__dialog:has(> .tui-modal__foot) {
+    --_min-foot: 4rem;
+  }
+  .tui-modal__dialog {
+    box-sizing: border-box;
+    border-style: solid;
+    border-width: var(--tui-border-width);
+    border-color: var(--_border);
+    border-radius: var(--_radius);
+    background-color: var(--_bg);
+    box-shadow: var(--_shadow);
+  }
+  .tui-modal__dialog .tui-modal__body {
+    flex: 1 1 auto;
+    min-height: 4.5rem;
+    display: flex;
+    flex-direction: column;
+  }
+  .tui-modal__dialog .tui-modal__body:first-child .tui-modal__body-inner {
+    padding-block-start: var(--_padding);
+  }
+  .tui-modal__dialog .tui-modal__body:last-child .tui-modal__body-inner {
+    padding-block-end: var(--_padding);
+  }
+  .tui-modal__dialog .tui-modal__body-inner {
+    flex: 1 1 auto;
+    overflow: auto;
+    padding-inline: var(--_padding);
+  }
+  .tui-modal__dialog .tui-modal__body-inner > *:first-child {
+    margin-block-start: unset;
+  }
+  .tui-modal__dialog .tui-modal__body-inner > *:last-child {
+    margin-block-end: unset;
+  }
+  .tui-modal__dialog .tui-modal__body-inner > p {
+    margin: 0;
+  }
+  .tui-modal__dialog .tui-modal__head {
+    padding-block: var(--_padding);
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+  }
+  .tui-modal__dialog .tui-modal__foot {
+    padding-block: var(--_padding);
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+  }
+  .tui-modal__dialog.is-size-sm {
+    --_max: var(--tui-modal-max, 480px);
+  }
+  .tui-modal__dialog.is-size-md {
+    --_max: var(--tui-modal-max, 720px);
+  }
+  .tui-modal__dialog.is-size-lg {
+    --_max: var(--tui-modal-max, 960px);
+  }
+  .tui-modal__dialog.is-sticky-head .tui-modal__head {
+    position: sticky;
+    top: 0;
+    background: inherit;
+    z-index: 1;
+  }
+  .tui-modal__dialog.is-sticky-foot .tui-modal__foot {
+    position: sticky;
+    bottom: 0;
+    background: inherit;
+    z-index: 1;
+  }
+  @media (prefers-reduced-motion: no-preference) {
+    .tui-modal__dialog {
+      transform: translateY(4px);
+      opacity: 0;
+      transition: transform var(--tui-motion-duration) var(--tui-motion-timing), opacity var(--tui-motion-duration) var(--tui-motion-timing);
+    }
+    .tui-modal[data-state=open] .tui-modal__dialog {
+      transform: none;
+      opacity: 1;
+    }
+  }
+  @media (forced-colors: active) {
+    .tui-modal__dialog {
+      border: 2px solid CanvasText;
+    }
+    .tui-modal__backdrop {
+      background: GrayText;
+      opacity: 0.5;
+    }
+  }
+  .tui-modal-open {
+    overflow: hidden;
+  }
+  :where(.tui-interface) .tui-notice {
+    --_bg: var(--tui-notice-bg, var(--tui-color-bg-muted));
+    --_border: var(--tui-notice-border, transparent);
+    --_stripe: var(--tui-notice-stripe, var(--tui-theme-primary-base));
+    --_fg: var(--tui-notice-fg, inherit);
+    --_radius: var(--tui-notice-radius, var(--tui-radius-md));
+    --_padding: var(--tui-notice-padding, var(--tui-spacing-sm));
+    --_foot-basis: var(--tui-notice-foot-basis, 500px);
+    --_gap: var(--tui-spacing-sm);
+    box-sizing: border-box;
+    container-type: inline-size;
+    container-name: tuiNotice;
+    position: relative;
+    width: 100%;
+    border-style: solid;
+    border-width: var(--tui-border-width);
+    border-color: var(--_border);
+    border-radius: var(--_radius);
+    background-color: var(--_bg);
+    color: var(--_fg);
+  }
+  :where(.tui-interface) .tui-notice__inner {
+    display: flex;
+    flex-direction: column;
+  }
+  :where(.tui-interface) .tui-notice__icon {
+    flex: 0 0 auto;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    line-height: 0;
+    font-size: var(--tui-typography-size-xl);
+  }
+  :where(.tui-interface) .tui-notice__title {
+    flex: 1 1 auto;
+    margin: 0;
+    font-weight: var(--tui-font-weight-semibold, 600);
+  }
+  :where(.tui-interface) .tui-notice__head {
+    padding-block: var(--_padding);
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    gap: var(--_gap);
+  }
+  :where(.tui-interface) .tui-notice__body {
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+  }
+  :where(.tui-interface) .tui-notice__body > *:first-child {
+    margin-block-start: unset;
+  }
+  :where(.tui-interface) .tui-notice__body > *:last-child {
+    margin-block-end: unset;
+  }
+  :where(.tui-interface) .tui-notice__body > p {
+    margin: 0;
+  }
+  :where(.tui-interface) .tui-notice__body:first-child {
+    padding-block-start: var(--_padding);
+  }
+  :where(.tui-interface) .tui-notice__body:last-child {
+    padding-block-end: var(--_padding);
+  }
+  :where(.tui-interface) .tui-notice__foot {
+    padding-block: var(--_padding);
+    padding-inline: var(--_padding);
+    width: 100%;
+    box-sizing: border-box;
+  }
+  :where(.tui-interface) .tui-notice.is-layout-inline {
+    display: flex;
+    align-items: center;
+  }
+  @container tuiNotice (width >= 400px) {
+    :where(.tui-interface) .tui-notice.is-layout-inline {
+      display: flex;
+      align-items: center;
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      gap: var(--_padding);
+      flex: 1 1 auto;
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__head {
+      padding-inline-start: var(--_padding);
+      padding-block: var(--_padding);
+      flex: 0 1 auto;
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__head:has(.tui-icon:only-child) {
+      flex: 0 0 max-content;
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__body {
+      flex: 2 1 auto;
+      padding-block: var(--_padding);
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__foot {
+      width: unset;
+      flex: 0 1 var(--_foot-basis);
+      padding-block: var(--_padding);
+      padding-inline-end: var(--_padding);
+      margin-inline-start: auto;
+      justify-content: flex-end;
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__head:not(:first-child),
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__body:not(:first-child),
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__foot:not(:first-child) {
+      padding-inline-start: 0;
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__head:not(:last-child),
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__body:not(:last-child),
+    :where(.tui-interface) .tui-notice.is-layout-inline .tui-notice__inner .tui-notice__foot:not(:last-child) {
+      padding-inline-end: 0;
+    }
+  }
+  :where(.tui-interface) .tui-notice.is-dismissible .tui-notice__inner {
+    padding-inline-end: calc(var(--_padding) + 2rem);
+  }
+  @container tuiNotice (width >= 400px) {
+    :where(.tui-interface) .tui-notice.is-layout-inline.is-dismissible .tui-notice__inner {
+      padding-inline-end: 0;
+    }
+    :where(.tui-interface) .tui-notice.is-layout-inline.is-dismissible .tui-notice__inner .tui-notice__head:last-child,
+    :where(.tui-interface) .tui-notice.is-layout-inline.is-dismissible .tui-notice__inner .tui-notice__body:last-child,
+    :where(.tui-interface) .tui-notice.is-layout-inline.is-dismissible .tui-notice__inner .tui-notice__foot:last-child {
+      padding-inline-end: 0;
+    }
+  }
+  :where(.tui-interface) .tui-notice.has-stripe {
+    border-inline-start-width: 4px;
+    border-inline-start-color: var(--_stripe);
+  }
+  :where(.tui-interface) .tui-notice.is-theme-info {
+    --_bg: var(--tui-notice-bg, var(--tui-theme-primary-subtlest));
+    --_stripe: var(--tui-notice-stripe, var(--tui-theme-primary-base));
+  }
+  :where(.tui-interface) .tui-notice.is-theme-success {
+    --_bg: var(--tui-notice-bg, var(--tui-theme-success-subtlest));
+    --_stripe: var(--tui-notice-stripe, var(--tui-theme-success-base));
+  }
+  :where(.tui-interface) .tui-notice.is-theme-warning {
+    --_bg: var(--tui-notice-bg, var(--tui-theme-warning-subtlest));
+    --_stripe: var(--tui-notice-stripe, var(--tui-theme-warning-base));
+  }
+  :where(.tui-interface) .tui-notice.is-theme-danger {
+    --_bg: var(--tui-notice-bg, var(--tui-theme-danger-subtlest));
+    --_stripe: var(--tui-notice-stripe, var(--tui-theme-danger-base));
+  }
+  :where(.tui-interface) .tui-notice.is-style-elevated {
+    box-shadow: var(--tui-shadow-md);
+  }
+  :where(.tui-interface) .tui-notice.has-interaction {
+    cursor: pointer;
+    transition-property: background-color, border-color, box-shadow;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-notice.has-interaction:hover {
+    --_bg: var(--tui-color-bg-muted);
+  }
+  :where(.tui-interface) .tui-notice.has-interaction:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) .tui-notice.is-focusable:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) .tui-notice.is-disabled {
+    opacity: var(--tui-opacity-disabled);
+    pointer-events: none;
+  }
+  :where(.tui-interface) .tui-notice.is-exiting-collapse {
+    display: grid;
+    animation: tui-noticeExitCollapse 200ms var(--tui-motion-timing) forwards;
+  }
+  :where(.tui-interface) .tui-notice.is-exiting-collapse .tui-notice__inner {
+    min-height: 0;
+    overflow: hidden;
+  }
+  :where(.tui-interface) .tui-notice.is-exiting-fade {
+    animation: tui-noticeExitFade 200ms var(--tui-motion-timing) forwards;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-notice.is-exiting-collapse, :where(.tui-interface) .tui-notice.is-exiting-fade {
+      animation: none;
+      opacity: 0;
+    }
+  }
+  @keyframes tui-noticeExitCollapse {
+    0% {
+      grid-template-rows: 1fr;
+      opacity: 1;
+    }
+    100% {
+      grid-template-rows: 0fr;
+      opacity: 0;
+    }
+  }
+  @keyframes tui-noticeExitFade {
+    0% {
+      opacity: 1;
+      transform: scale(1);
+    }
+    100% {
+      opacity: 0;
+      transform: scale(0.95);
+    }
+  }
+  .tui-notice .tui-notice__dismiss {
+    position: absolute;
+    inset-block-start: var(--tui-notice-padding, var(--tui-spacing-sm));
+    inset-inline-end: var(--tui-notice-padding, var(--tui-spacing-sm));
+  }
+  .tui-notice.is-layout-inline .tui-notice__dismiss {
+    position: static;
+    flex-shrink: 0;
+    align-self: center;
+    margin-inline-start: var(--tui-spacing-sm);
+    margin-inline-end: var(--tui-notice-padding, var(--tui-spacing-sm));
+  }
+  :where(.tui-interface) .tui-overlap-stack {
+    display: inline-flex;
+    align-items: center;
+  }
+  :where(.tui-interface) .tui-overlap-stack__item {
+    position: relative;
+    display: inline-flex;
+  }
+  :where(.tui-interface) .tui-overlap-stack__item:not(:first-child) {
+    margin-inline-start: var(--tui-overlap-stack-overlap, -0.5rem);
+  }
+  :where(.tui-interface) .tui-overlap-stack__item.is-framed {
+    --_radius: var(--tui-overlap-stack-item-radius, var(--tui-radius-full));
+    --_border-width: var(--tui-overlap-stack-border-width, 0);
+    --_border-color: var(--tui-overlap-stack-border-color, var(--tui-color-bg-surface));
+    overflow: hidden;
+    border-radius: var(--_radius);
+    border: var(--_border-width) solid var(--_border-color);
+  }
+  :where(.tui-interface) .tui-overlap-stack__overflow {
+    --_bg: var(--tui-overlap-stack-overflow-bg, var(--tui-color-bg-muted));
+    --_fg: var(--tui-overlap-stack-overflow-fg, var(--tui-color-fg-muted));
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 1.5rem;
+    min-height: 1.5rem;
+    padding-inline: 0.25rem;
+    border-radius: var(--tui-radius-full);
+    background-color: var(--_bg);
+    color: var(--_fg);
+    font-size: 0.75rem;
+    font-weight: 500;
+  }
+  @media (forced-colors: active) {
+    :where(.tui-interface) .tui-overlap-stack__overflow {
+      border: 1px solid CanvasText;
+    }
+  }
+  .tui-pager {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--tui-pager-gap, var(--tui-spacing-md));
+    padding-block: var(--tui-spacing-md);
+  }
+  .tui-pager__nav {
+    display: flex;
+    align-items: center;
+    gap: 0;
+  }
+  .tui-pager__nav .tui-pager__item,
+  .tui-pager__nav .tui-pager__ellipsis {
+    --_border: var(--tui-button-border, var(--tui-color-border));
+    border-color: var(--_border) !important;
+    font-size: var(--tui-typography-size-sm);
+    padding-inline: 0.85em;
+    padding-block: 0.4em;
+  }
+  .tui-pager__nav .tui-pager__item:not(:first-child),
+  .tui-pager__nav .tui-pager__ellipsis:not(:first-child) {
+    border-start-start-radius: 0;
+    border-end-start-radius: 0;
+    border-inline-start-width: 0;
+  }
+  .tui-pager__nav .tui-pager__item:not(:last-child),
+  .tui-pager__nav .tui-pager__ellipsis:not(:last-child) {
+    border-start-end-radius: 0;
+    border-end-end-radius: 0;
+  }
+  .tui-pager__nav .tui-pager__ellipsis {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border: var(--tui-border-width) solid var(--_border);
+    background: transparent;
+    color: var(--tui-color-fg-muted);
+    border-radius: var(--tui-radius-sm);
+    cursor: default;
+    user-select: none;
+  }
+  .tui-pager__info {
+    display: flex;
+    align-items: center;
+    gap: var(--tui-spacing-sm);
+    margin-inline-start: auto;
+  }
+  .tui-pager__page-size-label {
+    display: flex;
+    align-items: center;
+    gap: var(--tui-spacing-xs);
+  }
+  :where(.tui-interface) .tui-rating {
+    --_active: var(--tui-rating-active, var(--tui-theme-warning-base));
+    --_inactive: var(--tui-rating-inactive, var(--tui-color-fg-muted));
+    --_scale: var(--tui-rating-scale, 2);
+    display: inline-flex;
+    align-items: center;
+  }
+  :where(.tui-interface) .tui-rating.is-size-sm {
+    font-size: calc(var(--tui-typography-size-sm) * var(--_scale));
+  }
+  :where(.tui-interface) .tui-rating.is-size-md {
+    font-size: calc(var(--tui-typography-size-md) * var(--_scale));
+  }
+  :where(.tui-interface) .tui-rating.is-size-lg {
+    font-size: calc(var(--tui-typography-size-lg) * var(--_scale));
+  }
+  :where(.tui-interface) .tui-rating.is-size-xl {
+    font-size: calc(var(--tui-typography-size-xl) * var(--_scale));
+  }
+  :where(.tui-interface) .tui-rating.is-theme-primary {
+    --_active: var(--tui-rating-active, var(--tui-theme-primary-base));
+  }
+  :where(.tui-interface) .tui-rating.is-theme-secondary {
+    --_active: var(--tui-rating-active, var(--tui-theme-secondary-base));
+  }
+  :where(.tui-interface) .tui-rating.is-theme-success {
+    --_active: var(--tui-rating-active, var(--tui-theme-success-base));
+  }
+  :where(.tui-interface) .tui-rating.is-theme-warning {
+    --_active: var(--tui-rating-active, var(--tui-theme-warning-base));
+  }
+  :where(.tui-interface) .tui-rating.is-theme-danger {
+    --_active: var(--tui-rating-active, var(--tui-theme-danger-base));
+  }
+  :where(.tui-interface) .tui-rating.is-disabled {
+    opacity: var(--tui-opacity-disabled);
+    pointer-events: none;
+  }
+  :where(.tui-interface) .tui-rating .tui-rating__item {
+    line-height: 1;
+    max-height: 1em;
+  }
+  :where(.tui-interface) .tui-rating label.tui-rating__star {
+    cursor: pointer;
+  }
+  :where(.tui-interface) .tui-rating .tui-rating__item:has(input:focus-visible) label.tui-rating__star {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+    border-radius: var(--tui-radius-sm);
+  }
+  :where(.tui-interface) .tui-rating .tui-rating__star {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-size: inherit;
+    color: var(--_inactive) !important;
+  }
+  :where(.tui-interface) .tui-rating .tui-rating__star .tui-icon {
+    flex: 0 0 auto;
+    font-size: inherit;
+  }
+  @media (hover: hover) {
+    :where(.tui-interface) .tui-rating .tui-rating__star:hover {
+      filter: brightness(0.95);
+    }
+  }
+  :where(.tui-interface) .tui-rating .tui-rating__star.is-active {
+    color: var(--_active) !important;
+  }
+  :where(.tui-interface) .tui-progress {
+    --_track: var(--tui-progress-track, var(--tui-color-border));
+    --_fill: var(--tui-progress-fill, var(--tui-theme-primary-base));
+    --_label: var(--tui-progress-label, var(--tui-color-fg));
+    --_radius: var(--tui-progress-radius, var(--tui-radius-md));
+    --tui-progress-value: 0;
+    --tui-progress-max: 100;
+    --_pct: calc((var(--tui-progress-value) / var(--tui-progress-max)) * 100);
+    color: var(--_label);
+  }
+  :where(.tui-interface) .tui-progress.is-size-xs {
+    font-size: var(--tui-typography-size-xs);
+  }
+  :where(.tui-interface) .tui-progress.is-size-sm {
+    font-size: var(--tui-typography-size-sm);
+  }
+  :where(.tui-interface) .tui-progress.is-size-md {
+    font-size: var(--tui-typography-size-md);
+  }
+  :where(.tui-interface) .tui-progress.is-size-lg {
+    font-size: var(--tui-typography-size-lg);
+  }
+  :where(.tui-interface) .tui-progress.is-mode-line .tui-progress__track {
+    position: relative;
+    inline-size: 100%;
+    block-size: 1em;
+    background: var(--_track) !important;
+    border-radius: var(--_radius);
+    overflow: clip;
+  }
+  :where(.tui-interface) .tui-progress.is-mode-line .tui-progress__bar {
+    block-size: 100%;
+    inline-size: calc(var(--_pct) * 1%);
+    background: var(--_fill) !important;
+    border-radius: var(--_radius);
+    transition: inline-size var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-progress.is-mode-line .tui-progress__label-wrapper {
+    position: absolute;
+    font-size: 1em;
+    line-height: 1;
+    inset: 0;
+    display: grid;
+    grid-template-columns: 1fr minmax(max-content, calc(100% - var(--_pct) * 1%));
+    transition: grid-template-columns var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-progress.is-mode-line .tui-progress__label.is-inside {
+    pointer-events: none;
+    min-width: max-content;
+    font-weight: bold;
+    background: color-mix(in oklab, var(--_track) 50%, transparent);
+    border-radius: var(--_radius);
+    padding-inline: 0.5em;
+    grid-column: 2;
+  }
+  :where(.tui-interface) .tui-progress.is-mode-circle .tui-progress__circle {
+    position: relative;
+    inline-size: 2em;
+  }
+  :where(.tui-interface) .tui-progress.is-mode-circle .tui-progress__circle__bar {
+    aspect-ratio: 1;
+    background: conic-gradient(var(--_fill) calc(var(--_pct) * 1%), var(--_track) 0) !important;
+    -webkit-mask: radial-gradient(closest-side, transparent 78%, #000 0);
+    mask: radial-gradient(closest-side, transparent 78%, #000 0);
+    border-radius: 50%;
+  }
+  :where(.tui-interface) .tui-progress.is-mode-circle .tui-progress__label.is-inside {
+    position: absolute;
+    inset: 0;
+    display: grid;
+    place-items: center;
+    font-size: 0.5em;
+    font-weight: bold;
+    pointer-events: none;
+  }
+  :where(.tui-interface) .tui-progress.is-mode-circle.is-variant-solid .tui-progress__circle__bar {
+    -webkit-mask: none;
+    mask: none;
+  }
+  :where(.tui-interface) .tui-progress .tui-progress__label {
+    font-weight: 600;
+    white-space: nowrap;
+  }
+  :where(.tui-interface) .tui-progress .tui-progress__label.is-end {
+    color: var(--tui-color-fg-muted);
+  }
+  :where(.tui-interface) .tui-progress .tui-progress__labels {
+    display: flex;
+    justify-content: space-between;
+    align-items: baseline;
+    gap: var(--tui-spacing-md);
+  }
+  :where(.tui-interface) .tui-progress.is-label-above .tui-progress__labels {
+    margin-block-end: var(--tui-spacing-xs);
+  }
+  :where(.tui-interface) .tui-progress.is-label-below .tui-progress__labels {
+    margin-block-start: var(--tui-spacing-xs);
+  }
+  :where(.tui-interface) .tui-progress .tui-progress__inline {
+    display: flex;
+    align-items: center;
+    gap: var(--tui-spacing-xs);
+  }
+  :where(.tui-interface) .tui-progress .tui-progress__inline .tui-progress__track {
+    flex: 1;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented {
+    --_z1: var(--tui-progress-z1-fill, var(--tui-theme-primary-base));
+    --_z2: var(--tui-progress-z2-fill, var(--tui-theme-warning-base));
+    --_z3: var(--tui-progress-z3-fill, var(--tui-theme-success-base));
+    --_z4: var(--tui-progress-z4-fill, var(--tui-theme-danger-base));
+    --_z5: var(--tui-progress-z5-fill, var(--tui-theme-info-base));
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__track {
+    display: flex;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar {
+    flex-shrink: 0;
+    block-size: 100%;
+    inline-size: var(--tui-segment-width);
+    transition: inline-size var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar:first-child {
+    border-radius: var(--_radius) 0 0 var(--_radius);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar:not(:first-child):not(:last-child) {
+    border-radius: 0;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar:last-child {
+    border-radius: 0 var(--_radius) var(--_radius) 0;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar:only-child {
+    border-radius: var(--_radius);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar.is-z1 {
+    background: var(--_z1) !important;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar.is-z2 {
+    background: var(--_z2) !important;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar.is-z3 {
+    background: var(--_z3) !important;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar.is-z4 {
+    background: var(--_z4) !important;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented.is-mode-line .tui-progress__bar.is-z5 {
+    background: var(--_z5) !important;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-labels {
+    display: flex;
+    gap: var(--tui-spacing-md);
+    margin-block-start: var(--tui-spacing-xs);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label {
+    display: inline-flex;
+    gap: 0.35em;
+    font-weight: 600;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label.is-z1 {
+    color: var(--_z1);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label.is-z2 {
+    color: var(--_z2);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label.is-z3 {
+    color: var(--_z3);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label.is-z4 {
+    color: var(--_z4);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label.is-z5 {
+    color: var(--_z5);
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label-text {
+    font-weight: 600;
+  }
+  :where(.tui-interface) .tui-progress.is-segmented .tui-progress__segment-label-value {
+    font-weight: 600;
+  }
+  :where(.tui-interface) .tui-progress.is-indeterminate.is-mode-line .tui-progress__bar {
+    animation: tui-progress-indeterminate 2s ease-in-out infinite backwards;
+  }
+  :where(.tui-interface) .tui-progress.is-indeterminate.is-mode-circle .tui-progress__circle__bar {
+    animation: tui-progress-spin 1s linear infinite;
+    background: conic-gradient(var(--_fill) 25%, var(--_track) 0) !important;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-progress.is-indeterminate.is-mode-line .tui-progress__bar {
+      animation: none;
+      inline-size: 50%;
+    }
+    :where(.tui-interface) .tui-progress.is-indeterminate.is-mode-circle .tui-progress__circle__bar {
+      animation: none;
+    }
+    :where(.tui-interface) .tui-progress .tui-progress__bar {
+      transition: none;
+    }
+  }
+  @keyframes tui-progress-indeterminate {
+    0% {
+      inline-size: 25%;
+      transform: translateX(-100%);
+    }
+    30% {
+      inline-size: 60%;
+    }
+    100% {
+      inline-size: 25%;
+      transform: translateX(420%);
+    }
+  }
+  @keyframes tui-progress-spin {
+    to {
+      transform: rotate(1turn);
+    }
+  }
+  :where(.tui-interface) .tui-segmented {
+    --_gap: var(--tui-segmented-gap, var(--tui-spacing-xs));
+    --_padding: var(--tui-segmented-padding, var(--tui-spacing-xs));
+    --_radius: var(--tui-segmented-radius, var(--tui-radius-lg));
+    --_bg: var(--tui-segmented-bg, var(--tui-color-bg-muted));
+    --_border: var(--tui-segmented-border, transparent);
+    display: inline-flex;
+    flex-wrap: wrap;
+    gap: var(--_gap);
+    padding: var(--_padding);
+    background: var(--_bg);
+    border: var(--tui-border-width) solid var(--_border);
+    border-radius: var(--_radius);
+  }
+  :where(.tui-interface) .tui-segmented.is-vertical {
+    flex-direction: column;
+  }
+  :where(.tui-interface) .tui-segmented[aria-disabled=true] {
+    opacity: var(--tui-opacity-disabled);
+  }
+  :where(.tui-interface) .tui-segmented.is-variant-outline {
+    --_bg: transparent;
+    --_border: var(--tui-segmented-border, var(--tui-color-border));
+  }
+  :where(.tui-interface) .tui-segmented.is-variant-underline {
+    --_bg: transparent;
+    --_padding: 0;
+    --_gap: var(--tui-segmented-gap, var(--tui-spacing-md));
+    border-radius: 0;
+  }
+  .tui-interface .tui-segmented__item {
+    --_item-padding: var(--tui-segmented-item-padding, var(--tui-spacing-sm) var(--tui-spacing-md));
+    --_item-radius: var(--tui-segmented-item-radius, var(--tui-radius-md));
+    --_item-bg: transparent;
+    --_item-fg: var(--tui-segmented-item-fg, var(--tui-color-fg-muted));
+    --_item-bg-active: var(--tui-segmented-item-bg-active, var(--tui-theme-primary-base));
+    --_item-fg-active: var(--tui-segmented-item-fg-active, var(--tui-color-fg-on-accent));
+    --_item-bg-hover: color-mix(in srgb, var(--tui-color-fg) 8%, transparent);
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--tui-spacing-xs);
+    padding: var(--_item-padding);
+    border: none;
+    border-radius: var(--_item-radius);
+    background: var(--_item-bg);
+    color: var(--_item-fg);
+    font: inherit;
+    font-size: var(--tui-font-size-sm);
+    font-weight: var(--tui-font-weight-medium, 500);
+    line-height: var(--tui-line-height-tight);
+    white-space: nowrap;
+    cursor: pointer;
+    transition-property: background-color, color;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+  }
+  .tui-interface .tui-segmented__item:hover:not([aria-disabled=true]):not([aria-checked=true]) {
+    background: var(--_item-bg-hover);
+    color: var(--tui-color-fg);
+  }
+  .tui-interface .tui-segmented__item:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+    z-index: 1;
+  }
+  .tui-interface .tui-segmented__item[aria-checked=true] {
+    background: var(--_item-bg-active);
+    color: var(--_item-fg-active);
+  }
+  .tui-interface .tui-segmented__item[aria-disabled=true] {
+    cursor: not-allowed;
+  }
+  .tui-interface .tui-segmented.is-variant-outline .tui-segmented__item {
+    --_item-radius: var(--tui-segmented-item-radius, var(--tui-radius-full));
+    border: var(--tui-border-width) solid var(--tui-color-border);
+  }
+  .tui-interface .tui-segmented.is-variant-outline .tui-segmented__item[aria-checked=true] {
+    border-color: var(--tui-theme-primary-base);
+    background: var(--tui-theme-primary-subtlest);
+    color: var(--tui-theme-primary-strong);
+  }
+  .tui-interface .tui-segmented.is-variant-underline .tui-segmented__item {
+    --_item-radius: 0;
+    --_item-fg: var(--tui-segmented-item-fg, var(--tui-color-fg));
+    --_indicator: var(--tui-segmented-indicator, var(--tui-theme-primary-base));
+    --_indicator-size: var(--tui-segmented-indicator-size, 2px);
+    position: relative;
+    padding-bottom: calc(var(--tui-spacing-sm) + var(--_indicator-size));
+  }
+  .tui-interface .tui-segmented.is-variant-underline .tui-segmented__item::after {
+    content: "";
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: var(--_indicator-size);
+    background: transparent;
+    transition: background-color var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  .tui-interface .tui-segmented.is-variant-underline .tui-segmented__item[aria-checked=true] {
+    background: transparent;
+    color: var(--tui-color-fg);
+    font-weight: var(--tui-font-weight-semibold, 600);
+  }
+  .tui-interface .tui-segmented.is-variant-underline .tui-segmented__item[aria-checked=true]::after {
+    background: var(--_indicator);
+  }
+  .tui-interface .tui-segmented.is-size-sm .tui-segmented__item {
+    --_item-padding: var(--tui-spacing-xs) var(--tui-spacing-sm);
+    font-size: var(--tui-font-size-xs);
+  }
+  :where(.tui-interface) .tui-segmented__item-icon {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    line-height: 1;
+    font-style: normal;
+    font-family: inherit;
+    min-width: 1em;
+    min-height: 1em;
+  }
+  :where(.tui-interface) .tui-segmented__item-label {
+    min-width: 0;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .tui-interface .tui-segmented__item {
+      transition: none;
+    }
+  }
+  @media (forced-colors: active) {
+    .tui-interface .tui-segmented__item[aria-checked=true] {
+      forced-color-adjust: none;
+      background: Highlight;
+      color: HighlightText;
+    }
+    .tui-interface .tui-segmented__item:focus-visible {
+      outline: 2px solid CanvasText;
+    }
+  }
+  :where(.tui-interface) .tui-sidebar {
+    --_width: var(--tui-sidebar-width, 320px);
+    --_bg: var(--tui-sidebar-bg, var(--tui-color-bg-surface));
+    --_border: var(--tui-sidebar-border, var(--tui-color-border));
+    --_padding: var(--tui-sidebar-padding, var(--tui-spacing-md));
+    width: var(--_width);
+    max-width: 100%;
+    background-color: var(--_bg);
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: hidden;
+  }
+  :where(.tui-interface) .tui-sidebar[data-position=left] {
+    border-right: var(--tui-border-width) solid var(--_border);
+  }
+  :where(.tui-interface) .tui-sidebar[data-position=right] {
+    border-left: var(--tui-border-width) solid var(--_border);
+  }
+  :where(.tui-interface) .tui-sidebar:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: calc(var(--tui-focus-ring-offset) * -1);
+  }
+  :where(.tui-interface) .tui-sidebar__header {
+    flex-shrink: 0;
+    padding: var(--_padding);
+    border-bottom: var(--tui-border-width) solid var(--_border);
+    display: flex;
+    flex-direction: column;
+    gap: var(--tui-spacing-sm);
+  }
+  :where(.tui-interface) .tui-sidebar__header h1, :where(.tui-interface) .tui-sidebar__header h2, :where(.tui-interface) .tui-sidebar__header h3, :where(.tui-interface) .tui-sidebar__header h4, :where(.tui-interface) .tui-sidebar__header h5, :where(.tui-interface) .tui-sidebar__header h6 {
+    margin: 0;
+  }
+  :where(.tui-interface) .tui-sidebar__nav {
+    flex: 1;
+    overflow-y: auto;
+    padding: var(--_padding);
+  }
+  :where(.tui-interface) .tui-sidebar-drawer {
+    --_z: var(--tui-sidebar-z, var(--tui-layer-modal, 1000));
+    position: fixed;
+    inset: 0;
+    z-index: var(--_z);
+    display: flex;
+  }
+  :where(.tui-interface) .tui-sidebar-drawer[data-position=right] {
+    justify-content: flex-end;
+  }
+  :where(.tui-interface) .tui-sidebar-drawer__backdrop {
+    position: absolute;
+    inset: 0;
+    background-color: var(--tui-color-bg-overlay, rgba(0, 0, 0, 0.5));
+    animation: tui-fadeFromTransparent var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-sidebar-drawer__panel {
+    position: relative;
+    z-index: 1;
+    max-width: 90vw;
+    height: 100%;
+  }
+  [data-position=left] > :where(.tui-interface) .tui-sidebar-drawer__panel {
+    animation: tui-slideInFromLeft var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  [data-position=right] > :where(.tui-interface) .tui-sidebar-drawer__panel {
+    animation: tui-slideInFromRight var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-sidebar-drawer__panel .tui-sidebar {
+    height: 100%;
+    border-left: none;
+    border-right: none;
+  }
+  @keyframes tui-slideInFromLeft {
+    from {
+      transform: translateX(-100%);
+    }
+    to {
+      transform: translateX(0);
+    }
+  }
+  @keyframes tui-slideInFromRight {
+    from {
+      transform: translateX(100%);
+    }
+    to {
+      transform: translateX(0);
+    }
+  }
+  body.tui-sidebar-drawer-open {
+    overflow: hidden;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-sidebar-drawer__backdrop,
+    :where(.tui-interface) .tui-sidebar-drawer__panel {
+      animation: none;
+    }
+  }
+  :where(.tui-interface) .tui-step-indicator {
+    display: inline-flex;
+  }
+  :where(.tui-interface) .tui-step-indicator.is-size-xs .tui-progress {
+    font-size: 8px;
+  }
+  :where(.tui-interface) .tui-step-indicator.is-size-sm .tui-progress {
+    font-size: 12px;
+  }
+  :where(.tui-interface) .tui-step-indicator.is-size-md .tui-progress {
+    font-size: 16px;
+  }
+  :where(.tui-interface) .tui-step-indicator.is-size-lg .tui-progress {
+    font-size: 20px;
+  }
+  :where(.tui-interface) .tui-step-indicator.is-status-locked.has-icon .tui-progress__circle__bar, :where(.tui-interface) .tui-step-indicator.is-status-not-started.has-icon .tui-progress__circle__bar {
+    background: var(--tui-progress-track, var(--tui-color-border)) !important;
+  }
+  :where(.tui-interface) .tui-step-indicator .tui-progress.is-mode-circle .tui-progress__label.is-inside {
+    font-size: 1.2em;
+  }
+  :where(.tui-interface) .tui-step-indicator__value {
+    font-size: 0.5em;
+    font-weight: var(--tui-font-weight-bold, 700);
+  }
+  :where(.tui-interface) .tui-step-indicator.is-status-not-started.has-icon .tui-icon {
+    color: var(--tui-color-fg-muted);
+  }
+  :where(.tui-interface) .tui-step-indicator.is-status-in-progress.has-icon .tui-icon {
+    color: var(--tui-theme-primary-base);
+  }
+  :where(.tui-interface) .tui-step-indicator.is-status-complete .tui-progress__circle__bar {
+    background: var(--tui-theme-success-base) !important;
+  }
+  :where(.tui-interface) .tui-step-indicator.is-status-complete .tui-icon {
+    color: var(--tui-color-fg-on-accent);
+  }
+  :where(.tui-interface) .tui-step-indicator.is-status-locked {
+    --tui-progress-track: var(--tui-color-border);
+  }
+  :where(.tui-interface) .tui-step-indicator.is-status-locked .tui-icon {
+    color: var(--tui-color-fg-muted);
+  }
+  :where(.tui-interface) .tui-steplist__list {
+    --_gap: var(--tui-steplist-gap, var(--tui-spacing-xs));
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: var(--_gap);
+  }
+  :where(.tui-interface) .tui-steplist__item {
+    --_padding: var(--tui-steplist-padding, var(--tui-spacing-sm));
+    --_radius: var(--tui-steplist-radius, var(--tui-radius-sm));
+    --_current-bg: var(--tui-steplist-current-bg, var(--tui-theme-primary-subtlest));
+    --_current-border: var(--tui-steplist-current-border, var(--tui-theme-primary-base));
+    --_hover-bg: var(--tui-steplist-hover-bg, var(--tui-color-bg-muted));
+    display: flex;
+    align-items: flex-start;
+    gap: var(--tui-spacing-sm);
+    width: 100%;
+    padding: var(--_padding);
+    padding-inline-start: calc(var(--_padding) - 3px);
+    border: none;
+    border-left: 3px solid transparent;
+    border-radius: var(--_radius);
+    background: transparent;
+    color: inherit;
+    font: inherit;
+    text-align: start;
+    text-decoration: none;
+    cursor: pointer;
+    transition-property: background-color, border-color;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+  }
+  :where(.tui-interface) .tui-steplist__item:hover:not([aria-disabled=true]):not(:disabled) {
+    background-color: var(--_hover-bg);
+  }
+  :where(.tui-interface) .tui-steplist__item:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+    z-index: 1;
+  }
+  :where(.tui-interface) .tui-steplist__item.is-current, :where(.tui-interface) .tui-steplist__item[aria-current] {
+    background-color: var(--_current-bg);
+    border-left-color: var(--_current-border);
+  }
+  :where(.tui-interface) .tui-steplist__item.is-disabled, :where(.tui-interface) .tui-steplist__item[aria-disabled=true], :where(.tui-interface) .tui-steplist__item:disabled {
+    cursor: not-allowed;
+    opacity: var(--tui-opacity-disabled);
+  }
+  :where(.tui-interface) .tui-steplist__indicator {
+    flex-shrink: 0;
+    margin-top: 0.325em;
+  }
+  :where(.tui-interface) .tui-steplist__content {
+    flex: 1;
+    min-width: 0;
+    line-height: var(--tui-line-height-normal, 1.5);
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-steplist__item {
+      transition: none;
+    }
+  }
+  :where(.tui-interface) .tui-table {
+    --_border: var(--tui-table-border, var(--tui-color-border));
+    --_bg: var(--tui-table-bg, transparent);
+    --_bg-head: var(--tui-table-bg-head, var(--tui-color-bg-surface));
+    --_fg: var(--tui-table-fg, var(--tui-color-fg));
+    --_padding: var(--tui-table-padding, var(--tui-spacing-sm));
+    font-size: var(--tui-typography-size-md);
+    width: 100%;
+    border-collapse: collapse;
+    border-bottom: var(--tui-border-width) solid var(--_border);
+    background: var(--_bg);
+  }
+  :where(.tui-interface) .tui-table__bulkActions {
+    display: flex;
+    align-items: center;
+    gap: var(--tui-spacing-sm);
+    padding-inline: var(--_padding);
+    padding-block: var(--_padding);
+  }
+  :where(.tui-interface) .tui-table__sortButton {
+    padding: unset;
+    display: inline-flex;
+    gap: 0.5em;
+    color: inherit;
+    background-color: transparent;
+    text-transform: inherit;
+    font-size: inherit;
+    font-weight: inherit;
+    border-radius: var(--tui-radius-sm);
+  }
+  :where(.tui-interface) .tui-table__sortButton:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) .tui-table__sortButton__icon {
+    min-width: 1em;
+  }
+  :where(.tui-interface) .tui-table input[type=checkbox] {
+    accent-color: var(--tui-theme-primary-base);
+  }
+  :where(.tui-interface) .tui-table input[type=checkbox]:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) .tui-table .tui-table__row.is-selected td,
+  :where(.tui-interface) .tui-table .tui-table__row.is-selected .tui-table__cell--body {
+    background-color: var(--tui-color-bg-surface-alt);
+  }
+  :where(.tui-interface) .tui-table .tui-table__row.is-selected td:first-child,
+  :where(.tui-interface) .tui-table .tui-table__row.is-selected .tui-table__cell--body:first-child {
+    box-shadow: inset 3px 0 0 var(--tui-theme-primary-base);
+  }
+  :where(.tui-interface) .tui-table__head, :where(.tui-interface) .tui-table__foot,
+  :where(.tui-interface) .tui-table thead,
+  :where(.tui-interface) .tui-table tfoot {
+    text-align: left;
+  }
+  :where(.tui-interface) .tui-table__head .tui-table__cell,
+  :where(.tui-interface) .tui-table__head th,
+  :where(.tui-interface) .tui-table__head td, :where(.tui-interface) .tui-table__foot .tui-table__cell,
+  :where(.tui-interface) .tui-table__foot th,
+  :where(.tui-interface) .tui-table__foot td,
+  :where(.tui-interface) .tui-table thead .tui-table__cell,
+  :where(.tui-interface) .tui-table thead th,
+  :where(.tui-interface) .tui-table thead td,
+  :where(.tui-interface) .tui-table tfoot .tui-table__cell,
+  :where(.tui-interface) .tui-table tfoot th,
+  :where(.tui-interface) .tui-table tfoot td {
+    color: var(--_fg);
+    background-color: var(--_bg-head);
+    text-transform: uppercase;
+    font-size: var(--tui-typography-size-sm);
+  }
+  :where(.tui-interface) .tui-table__body .tui-table__cell,
+  :where(.tui-interface) .tui-table__body th,
+  :where(.tui-interface) .tui-table__body td, :where(.tui-interface) .tui-table__foot .tui-table__cell,
+  :where(.tui-interface) .tui-table__foot th,
+  :where(.tui-interface) .tui-table__foot td,
+  :where(.tui-interface) .tui-table tbody .tui-table__cell,
+  :where(.tui-interface) .tui-table tbody th,
+  :where(.tui-interface) .tui-table tbody td,
+  :where(.tui-interface) .tui-table tfoot .tui-table__cell,
+  :where(.tui-interface) .tui-table tfoot th,
+  :where(.tui-interface) .tui-table tfoot td {
+    border-top: var(--tui-border-width) solid var(--_border);
+  }
+  :where(.tui-interface) .tui-table__cell,
+  :where(.tui-interface) .tui-table th,
+  :where(.tui-interface) .tui-table td {
+    padding-inline: var(--_padding);
+    padding-block: var(--_padding);
+  }
+  :where(.tui-interface) .tui-table .tui-button {
+    min-width: max-content;
+  }
+  :where(.tui-interface) .tui-table-container {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+  :where(.tui-interface) .tui-tabs {
+    display: flex;
+    flex-direction: column;
+    gap: var(--tui-spacing-md);
+  }
+  :where(.tui-interface) .tui-tabs[data-orientation=vertical] {
+    flex-direction: row;
+    align-items: flex-start;
+  }
+  :where(.tui-interface) .tui-tabs[data-orientation=vertical] .tui-tabs__list {
+    flex-direction: column;
+    align-items: stretch;
+    flex-wrap: nowrap;
+  }
+  :where(.tui-interface) .tui-tabs__list {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--tui-tabs-gap, var(--tui-spacing-xs));
+    align-items: center;
+  }
+  [data-variant=pill] :where(.tui-interface) .tui-tabs__list {
+    background: var(--tui-tabs-list-bg, var(--tui-color-bg-muted));
+    padding: var(--tui-tabs-list-padding, var(--tui-spacing-xs));
+    border-radius: var(--tui-tabs-list-radius, var(--tui-radius-lg));
+  }
+  [data-variant=underline] :where(.tui-interface) .tui-tabs__list {
+    gap: var(--tui-tabs-gap, var(--tui-spacing-md));
+    border-block-end: var(--tui-border-width) solid var(--tui-color-border);
+  }
+  [data-variant=outline] :where(.tui-interface) .tui-tabs__list {
+    gap: var(--tui-tabs-gap, var(--tui-spacing-xs));
+  }
+  .tui-interface .tui-tabs__tab {
+    --_bg: var(--tui-tabs-tab-bg, transparent);
+    --_fg: var(--tui-tabs-tab-fg, var(--tui-color-fg-muted));
+    --_border: var(--tui-tabs-tab-border, transparent);
+    --_bg-active: var(--tui-tabs-tab-bg-active, var(--tui-theme-primary-base, currentColor));
+    --_fg-active: var(--tui-tabs-tab-fg-active, var(--tui-color-fg-on-accent, #fff));
+    --_bg-hover: var(--tui-tabs-tab-bg-hover, var(--tui-color-bg-muted));
+    --_indicator: var(--tui-tabs-indicator, var(--tui-theme-primary-base, currentColor));
+    --_indicator-size: var(--tui-tabs-indicator-size, 2px);
+    --_padding: var(--tui-tabs-tab-padding, var(--tui-spacing-sm) var(--tui-spacing-md));
+    --_radius: var(--tui-tabs-tab-radius, var(--tui-radius-md));
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--tui-spacing-xs);
+    padding: var(--_padding);
+    border: none;
+    border-radius: var(--_radius);
+    background: var(--_bg);
+    color: var(--_fg);
+    font: inherit;
+    font-size: var(--tui-font-size-sm);
+    font-weight: var(--tui-font-weight-medium, 500);
+    line-height: var(--tui-line-height-tight);
+    text-decoration: none;
+    white-space: nowrap;
+    cursor: pointer;
+    transition-property: background-color, color, border-color;
+    transition-duration: var(--tui-motion-duration);
+    transition-timing-function: var(--tui-motion-timing);
+  }
+  .tui-interface .tui-tabs__tab:hover:not(:disabled):not([data-state=active]) {
+    background: var(--_bg-hover);
+    color: var(--tui-color-fg);
+  }
+  .tui-interface .tui-tabs__tab:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+    z-index: 1;
+  }
+  .tui-interface .tui-tabs__tab:disabled {
+    opacity: var(--tui-opacity-disabled);
+    cursor: not-allowed;
+  }
+  :where(.tui-interface) .tui-tabs__tab-label {
+    min-width: 0;
+  }
+  .tui-interface [data-variant=pill] .tui-tabs__tab {
+    --_radius: var(--tui-tabs-tab-radius, var(--tui-radius-md));
+    --_bg-hover: var(--tui-tabs-tab-bg-hover, color-mix(in srgb, var(--tui-color-fg) 8%, transparent));
+  }
+  .tui-interface [data-variant=pill] .tui-tabs__tab[data-state=active] {
+    background: var(--_bg-active);
+    color: var(--_fg-active);
+  }
+  .tui-interface [data-variant=underline] .tui-tabs__tab {
+    --_padding: var(--tui-tabs-tab-padding, var(--tui-spacing-sm) var(--tui-spacing-xs));
+    --_radius: 0;
+    --_bg-hover: transparent;
+    position: relative;
+    margin-block-end: calc(var(--tui-border-width) * -1);
+    border-bottom: var(--_indicator-size) solid transparent;
+    border-radius: 0;
+  }
+  .tui-interface [data-variant=underline] .tui-tabs__tab:hover:not(:disabled):not([data-state=active]) {
+    color: var(--tui-color-fg);
+  }
+  .tui-interface [data-variant=underline] .tui-tabs__tab[data-state=active] {
+    color: var(--tui-color-fg);
+    border-bottom-color: var(--_indicator);
+  }
+  .tui-interface [data-variant=underline] .tui-tabs__tab:focus-visible {
+    outline-offset: calc(var(--tui-focus-ring-offset) * -1);
+  }
+  .tui-interface [data-variant=outline] .tui-tabs__tab {
+    --_radius: var(--tui-tabs-tab-radius, var(--tui-radius-full));
+    --_border: var(--tui-tabs-tab-border, var(--tui-color-border));
+    --_bg-hover: var(--tui-tabs-tab-bg-hover, var(--tui-color-bg-muted));
+    border: var(--tui-border-width) solid var(--_border);
+  }
+  .tui-interface [data-variant=outline] .tui-tabs__tab[data-state=active] {
+    --_border: var(--tui-theme-primary-base, currentColor);
+    color: var(--tui-theme-primary-strong, currentColor);
+    background: var(--tui-theme-primary-subtlest, transparent);
+  }
+  :where(.tui-interface) .tui-tabs__panel[data-state=inactive] {
+    display: none;
+  }
+  :where(.tui-interface) .tui-tabs__panel:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  :where(.tui-interface) .tui-tabs__panel > *:first-child {
+    margin-block-start: 0;
+  }
+  :where(.tui-interface) .tui-tabs__panel > *:last-child {
+    margin-block-end: 0;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-tabs__tab {
+      transition: none;
+    }
+  }
+  @media (forced-colors: active) {
+    .tui-interface .tui-tabs__tab[data-state=active] {
+      forced-color-adjust: none;
+      background: Highlight;
+      color: HighlightText;
+    }
+    .tui-interface .tui-tabs__tab:focus-visible {
+      outline: 2px solid CanvasText;
+    }
+    .tui-interface [data-variant=underline] .tui-tabs__tab[data-state=active] {
+      background: transparent;
+      color: CanvasText;
+      border-bottom-color: Highlight;
+      border-bottom-width: 3px;
+    }
+    .tui-interface [data-variant=outline] .tui-tabs__tab {
+      border-color: CanvasText;
+    }
+    .tui-interface [data-variant=outline] .tui-tabs__tab[data-state=active] {
+      background: transparent;
+      color: CanvasText;
+      border-color: Highlight;
+      border-width: 2px;
+    }
+  }
+  :where(.tui-interface) .tui-toolbar {
+    --_gap: var(--tui-toolbar-gap, var(--tui-spacing-sm));
+    --_padding: var(--tui-toolbar-padding, 0);
+    display: flex;
+    align-items: center;
+    gap: var(--_gap);
+    padding: var(--_padding);
+  }
+  :where(.tui-interface) .tui-toolbar[aria-orientation=vertical] {
+    flex-direction: column;
+    align-items: stretch;
+  }
+  :where(.tui-interface) .tui-toolbar [data-tui-toolbar-item][aria-disabled=true],
+  :where(.tui-interface) .tui-toolbar [data-tui-toolbar-item]:disabled {
+    pointer-events: none;
+  }
+  :where(.tui-interface) .tui-toolbar [data-tui-toolbar-item]:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  .tui-toolbar__group {
+    display: flex;
+    align-items: center;
+    gap: var(--_gap);
+  }
+  .tui-toolbar[aria-orientation=vertical] .tui-toolbar__group {
+    flex-direction: column;
+    align-items: stretch;
+  }
+  :where(.tui-interface) .tui-tooltip {
+    --_bg: var(--tui-tooltip-bg, var(--tui-color-bg-inverted));
+    --_fg: var(--tui-tooltip-fg, var(--tui-color-fg-inverted));
+    --_radius: var(--tui-tooltip-radius, var(--tui-radius-xs));
+    --_z: var(--tui-tooltip-z, var(--tui-layer-top));
+    z-index: var(--_z);
+    width: max-content;
+    max-width: min(250px, 100vw - 2 * var(--tui-spacing-xs, 8px));
+    padding: 0.27em 0.54em;
+    pointer-events: auto;
+    background-color: var(--_bg);
+    color: var(--_fg);
+    border-radius: var(--_radius);
+    font-size: var(--tui-typography-size-xs, 11px);
+    line-height: 1.4;
+    animation: tui-fadeFromTransparent var(--tui-motion-duration) var(--tui-motion-timing);
+  }
+  :where(.tui-interface) [data-tooltip-open]:focus-visible {
+    outline: var(--tui-focus-ring-width) solid var(--tui-focus-ring-color);
+    outline-offset: var(--tui-focus-ring-offset);
+  }
+  @media (prefers-reduced-motion: reduce) {
+    :where(.tui-interface) .tui-tooltip {
+      animation: none;
+    }
+  }
+  @media (forced-colors: active) {
+    :where(.tui-interface) .tui-tooltip {
+      background-color: Canvas;
+      color: CanvasText;
+      border: 1px solid CanvasText;
+    }
+  }
+
+
+  .tui-interface .tui-visually-hidden, .tui-interface .tui-visually-hidden--focusable:not(:focus):not(:focus-within):not(:active) {
+    position: absolute !important;
+    width: 1px !important;
+    height: 1px !important;
+    padding: 0 !important;
+    margin: -1px !important;
+    overflow: hidden !important;
+    white-space: nowrap !important;
+    clip: rect(0, 0, 0, 0) !important;
+    clip-path: inset(50%) !important;
+    border: 0 !important;
+  }
+  .tui-interface .tui-position-static {
+    position: static !important;
+  }
+  .tui-interface .tui-position-relative {
+    position: relative !important;
+  }
+  .tui-interface .tui-position-absolute {
+    position: absolute !important;
+  }
+  .tui-interface .tui-stretched-link-container {
+    position: relative !important;
+  }
+  .tui-interface .tui-stretched-link::after {
+    content: "" !important;
+    position: absolute !important;
+    inset: 0 !important;
+  }
+  .tui-interface .tui-hidden {
+    display: none !important;
+  }
+  .tui-interface .is-layer-surface {
+    z-index: var(--tui-layer-surface) !important;
+  }
+  .tui-interface .is-layer-elevated {
+    z-index: var(--tui-layer-elevated) !important;
+  }
+  .tui-interface .is-layer-overlay {
+    z-index: var(--tui-layer-overlay) !important;
+  }
+  .tui-interface .is-layer-modal {
+    z-index: var(--tui-layer-modal) !important;
+  }
+  .tui-interface .is-layer-top {
+    z-index: var(--tui-layer-top) !important;
+  }
+  .tui-interface .tui-margin-none {
+    margin: 0 !important;
+  }
+  .tui-interface .tui-margin-block-none {
+    margin-block: 0 !important;
+  }
+  .tui-interface .tui-margin-block-start-none {
+    margin-block-start: 0 !important;
+  }
+  .tui-interface .tui-margin-block-end-none {
+    margin-block-end: 0 !important;
+  }
+  .tui-interface .tui-margin-inline-none {
+    margin-inline: 0 !important;
+  }
+  .tui-interface .tui-margin-inline-start-none {
+    margin-inline-start: 0 !important;
+  }
+  .tui-interface .tui-margin-inline-end-none {
+    margin-inline-end: 0 !important;
+  }
+  .tui-interface .tui-margin-auto {
+    margin: auto !important;
+  }
+  .tui-interface .tui-margin-block-auto {
+    margin-block: auto !important;
+  }
+  .tui-interface .tui-margin-block-start-auto {
+    margin-block-start: auto !important;
+  }
+  .tui-interface .tui-margin-block-end-auto {
+    margin-block-end: auto !important;
+  }
+  .tui-interface .tui-margin-inline-auto {
+    margin-inline: auto !important;
+  }
+  .tui-interface .tui-margin-inline-start-auto {
+    margin-inline-start: auto !important;
+  }
+  .tui-interface .tui-margin-inline-end-auto {
+    margin-inline-end: auto !important;
+  }
+  .tui-interface .tui-margin-xxs {
+    margin: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-margin-block-xxs {
+    margin-block: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-margin-block-start-xxs {
+    margin-block-start: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-margin-block-end-xxs {
+    margin-block-end: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-margin-inline-xxs {
+    margin-inline: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-margin-inline-start-xxs {
+    margin-inline-start: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-margin-inline-end-xxs {
+    margin-inline-end: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-margin-xs {
+    margin: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-margin-block-xs {
+    margin-block: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-margin-block-start-xs {
+    margin-block-start: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-margin-block-end-xs {
+    margin-block-end: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-margin-inline-xs {
+    margin-inline: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-margin-inline-start-xs {
+    margin-inline-start: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-margin-inline-end-xs {
+    margin-inline-end: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-margin-sm {
+    margin: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-margin-block-sm {
+    margin-block: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-margin-block-start-sm {
+    margin-block-start: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-margin-block-end-sm {
+    margin-block-end: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-margin-inline-sm {
+    margin-inline: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-margin-inline-start-sm {
+    margin-inline-start: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-margin-inline-end-sm {
+    margin-inline-end: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-margin-md {
+    margin: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-margin-block-md {
+    margin-block: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-margin-block-start-md {
+    margin-block-start: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-margin-block-end-md {
+    margin-block-end: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-margin-inline-md {
+    margin-inline: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-margin-inline-start-md {
+    margin-inline-start: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-margin-inline-end-md {
+    margin-inline-end: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-margin-lg {
+    margin: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-margin-block-lg {
+    margin-block: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-margin-block-start-lg {
+    margin-block-start: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-margin-block-end-lg {
+    margin-block-end: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-margin-inline-lg {
+    margin-inline: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-margin-inline-start-lg {
+    margin-inline-start: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-margin-inline-end-lg {
+    margin-inline-end: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-margin-xl {
+    margin: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-margin-block-xl {
+    margin-block: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-margin-block-start-xl {
+    margin-block-start: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-margin-block-end-xl {
+    margin-block-end: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-margin-inline-xl {
+    margin-inline: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-margin-inline-start-xl {
+    margin-inline-start: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-margin-inline-end-xl {
+    margin-inline-end: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-margin-xxl {
+    margin: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-margin-block-xxl {
+    margin-block: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-margin-block-start-xxl {
+    margin-block-start: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-margin-block-end-xxl {
+    margin-block-end: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-margin-inline-xxl {
+    margin-inline: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-margin-inline-start-xxl {
+    margin-inline-start: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-margin-inline-end-xxl {
+    margin-inline-end: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-padding-none {
+    padding: 0 !important;
+  }
+  .tui-interface .tui-padding-block-none {
+    padding-block: 0 !important;
+  }
+  .tui-interface .tui-padding-block-start-none {
+    padding-block-start: 0 !important;
+  }
+  .tui-interface .tui-padding-block-end-none {
+    padding-block-end: 0 !important;
+  }
+  .tui-interface .tui-padding-inline-none {
+    padding-inline: 0 !important;
+  }
+  .tui-interface .tui-padding-inline-start-none {
+    padding-inline-start: 0 !important;
+  }
+  .tui-interface .tui-padding-inline-end-none {
+    padding-inline-end: 0 !important;
+  }
+  .tui-interface .tui-padding-xxs {
+    padding: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-padding-block-xxs {
+    padding-block: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-padding-block-start-xxs {
+    padding-block-start: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-padding-block-end-xxs {
+    padding-block-end: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-padding-inline-xxs {
+    padding-inline: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-padding-inline-start-xxs {
+    padding-inline-start: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-padding-inline-end-xxs {
+    padding-inline-end: var(--tui-spacing-xxs) !important;
+  }
+  .tui-interface .tui-padding-xs {
+    padding: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-padding-block-xs {
+    padding-block: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-padding-block-start-xs {
+    padding-block-start: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-padding-block-end-xs {
+    padding-block-end: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-padding-inline-xs {
+    padding-inline: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-padding-inline-start-xs {
+    padding-inline-start: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-padding-inline-end-xs {
+    padding-inline-end: var(--tui-spacing-xs) !important;
+  }
+  .tui-interface .tui-padding-sm {
+    padding: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-padding-block-sm {
+    padding-block: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-padding-block-start-sm {
+    padding-block-start: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-padding-block-end-sm {
+    padding-block-end: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-padding-inline-sm {
+    padding-inline: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-padding-inline-start-sm {
+    padding-inline-start: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-padding-inline-end-sm {
+    padding-inline-end: var(--tui-spacing-sm) !important;
+  }
+  .tui-interface .tui-padding-md {
+    padding: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-padding-block-md {
+    padding-block: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-padding-block-start-md {
+    padding-block-start: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-padding-block-end-md {
+    padding-block-end: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-padding-inline-md {
+    padding-inline: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-padding-inline-start-md {
+    padding-inline-start: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-padding-inline-end-md {
+    padding-inline-end: var(--tui-spacing-md) !important;
+  }
+  .tui-interface .tui-padding-lg {
+    padding: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-padding-block-lg {
+    padding-block: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-padding-block-start-lg {
+    padding-block-start: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-padding-block-end-lg {
+    padding-block-end: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-padding-inline-lg {
+    padding-inline: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-padding-inline-start-lg {
+    padding-inline-start: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-padding-inline-end-lg {
+    padding-inline-end: var(--tui-spacing-lg) !important;
+  }
+  .tui-interface .tui-padding-xl {
+    padding: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-padding-block-xl {
+    padding-block: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-padding-block-start-xl {
+    padding-block-start: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-padding-block-end-xl {
+    padding-block-end: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-padding-inline-xl {
+    padding-inline: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-padding-inline-start-xl {
+    padding-inline-start: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-padding-inline-end-xl {
+    padding-inline-end: var(--tui-spacing-xl) !important;
+  }
+  .tui-interface .tui-padding-xxl {
+    padding: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-padding-block-xxl {
+    padding-block: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-padding-block-start-xxl {
+    padding-block-start: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-padding-block-end-xxl {
+    padding-block-end: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-padding-inline-xxl {
+    padding-inline: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-padding-inline-start-xxl {
+    padding-inline-start: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-padding-inline-end-xxl {
+    padding-inline-end: var(--tui-spacing-xxl) !important;
+  }
+  .tui-interface .tui-container {
+    container-name: var(--tui-container-name, tuiContainer) !important;
+    container-type: inline-size !important;
+  }
+  .tui-interface .tui-container--size {
+    container-name: var(--tui-container-name, tuiContainer) !important;
+    container-type: size !important;
+  }
+  .tui-interface .tui-grid,
+  .tui-interface .tui-flex,
+  .tui-interface .tui-stack,
+  .tui-interface .tui-inline-flex {
+    --tui-gap-inline: var(--tui-spacing-md);
+    --tui-gap-block: var(--tui-spacing-md);
+  }
+  .tui-interface .tui-grid {
+    display: grid !important;
+    grid-template-columns: repeat(var(--tui-grid-cols, 1), minmax(0, 1fr));
+    column-gap: var(--tui-gap-inline);
+    row-gap: var(--tui-gap-block);
+  }
+  .tui-interface .tui-grid--cols-1 {
+    --tui-grid-cols: 1;
+  }
+  .tui-interface .tui-grid--cols-2 {
+    --tui-grid-cols: 2;
+  }
+  .tui-interface .tui-grid--cols-3 {
+    --tui-grid-cols: 3;
+  }
+  .tui-interface .tui-grid--cols-4 {
+    --tui-grid-cols: 4;
+  }
+  .tui-interface .tui-grid--cols-5 {
+    --tui-grid-cols: 5;
+  }
+  .tui-interface .tui-grid--cols-6 {
+    --tui-grid-cols: 6;
+  }
+  .tui-interface .tui-grid--cols-7 {
+    --tui-grid-cols: 7;
+  }
+  .tui-interface .tui-grid--cols-8 {
+    --tui-grid-cols: 8;
+  }
+  .tui-interface .tui-grid--cols-9 {
+    --tui-grid-cols: 9;
+  }
+  .tui-interface .tui-grid--cols-10 {
+    --tui-grid-cols: 10;
+  }
+  .tui-interface .tui-grid--cols-11 {
+    --tui-grid-cols: 11;
+  }
+  .tui-interface .tui-grid--cols-12 {
+    --tui-grid-cols: 12;
+  }
+  .tui-interface .tui-grid--auto {
+    grid-template-columns: repeat(auto-fit, minmax(var(--tui-grid-min, 12rem), 1fr));
+  }
+  .tui-interface .tui-col-span-full {
+    grid-column: 1/-1;
+  }
+  .tui-interface .tui-col-span-1 {
+    grid-column: span 1/span 1;
+  }
+  .tui-interface .tui-col-span-2 {
+    grid-column: span 2/span 2;
+  }
+  .tui-interface .tui-col-span-3 {
+    grid-column: span 3/span 3;
+  }
+  .tui-interface .tui-col-span-4 {
+    grid-column: span 4/span 4;
+  }
+  .tui-interface .tui-col-span-5 {
+    grid-column: span 5/span 5;
+  }
+  .tui-interface .tui-col-span-6 {
+    grid-column: span 6/span 6;
+  }
+  .tui-interface .tui-col-span-7 {
+    grid-column: span 7/span 7;
+  }
+  .tui-interface .tui-col-span-8 {
+    grid-column: span 8/span 8;
+  }
+  .tui-interface .tui-col-span-9 {
+    grid-column: span 9/span 9;
+  }
+  .tui-interface .tui-col-span-10 {
+    grid-column: span 10/span 10;
+  }
+  .tui-interface .tui-col-span-11 {
+    grid-column: span 11/span 11;
+  }
+  .tui-interface .tui-col-span-12 {
+    grid-column: span 12/span 12;
+  }
+  .tui-interface .tui-row-span-full {
+    grid-row: 1/-1;
+  }
+  .tui-interface .tui-row-span-1 {
+    grid-row: span 1/span 1;
+  }
+  .tui-interface .tui-row-span-2 {
+    grid-row: span 2/span 2;
+  }
+  .tui-interface .tui-row-span-3 {
+    grid-row: span 3/span 3;
+  }
+  .tui-interface .tui-row-span-4 {
+    grid-row: span 4/span 4;
+  }
+  .tui-interface .tui-row-span-5 {
+    grid-row: span 5/span 5;
+  }
+  .tui-interface .tui-row-span-6 {
+    grid-row: span 6/span 6;
+  }
+  .tui-interface .tui-row-span-7 {
+    grid-row: span 7/span 7;
+  }
+  .tui-interface .tui-row-span-8 {
+    grid-row: span 8/span 8;
+  }
+  .tui-interface .tui-row-span-9 {
+    grid-row: span 9/span 9;
+  }
+  .tui-interface .tui-row-span-10 {
+    grid-row: span 10/span 10;
+  }
+  .tui-interface .tui-row-span-11 {
+    grid-row: span 11/span 11;
+  }
+  .tui-interface .tui-row-span-12 {
+    grid-row: span 12/span 12;
+  }
+  .tui-interface .tui-flex {
+    display: flex !important;
+    row-gap: var(--tui-gap-block);
+    column-gap: var(--tui-gap-inline);
+  }
+  .tui-interface .tui-flex.is-wrap {
+    flex-wrap: wrap !important;
+  }
+  .tui-interface .tui-flex.is-nowrap {
+    flex-wrap: nowrap !important;
+  }
+  .tui-interface .tui-flex > * {
+    min-width: 0;
+  }
+  .tui-interface .tui-inline-flex {
+    display: inline-flex !important;
+    row-gap: var(--tui-gap-block);
+    column-gap: var(--tui-gap-inline);
+  }
+  .tui-interface .tui-stack {
+    display: flex !important;
+    flex-direction: column;
+    row-gap: var(--tui-gap-block);
+  }
+  .tui-interface .tui-stack > * {
+    min-height: 0;
+  }
+  .tui-interface .is-align-stretch {
+    align-items: stretch;
+  }
+  .tui-interface .is-align-start {
+    align-items: start;
+  }
+  .tui-interface .is-align-center {
+    align-items: center;
+  }
+  .tui-interface .is-align-end {
+    align-items: end;
+  }
+  .tui-interface .is-justify-start {
+    justify-content: flex-start;
+  }
+  .tui-interface .is-justify-center {
+    justify-content: center;
+  }
+  .tui-interface .is-justify-end {
+    justify-content: flex-end;
+  }
+  .tui-interface .is-justify-between {
+    justify-content: space-between;
+  }
+  .tui-interface .is-justify-around {
+    justify-content: space-around;
+  }
+  .tui-interface .is-justify-evenly {
+    justify-content: space-evenly;
+  }
+  .tui-interface .is-align-self-start {
+    align-self: start;
+  }
+  .tui-interface .is-align-self-center {
+    align-self: center;
+  }
+  .tui-interface .is-align-self-end {
+    align-self: end;
+  }
+  .tui-interface .is-align-self-stretch {
+    align-self: stretch;
+  }
+  .tui-interface .is-place-start {
+    place-items: start;
+  }
+  .tui-interface .is-place-center {
+    place-items: center;
+  }
+  .tui-interface .is-place-end {
+    place-items: end;
+  }
+  .tui-interface ul.tui-grid,
+  .tui-interface ul.tui-stack,
+  .tui-interface ul.tui-inline-flex,
+  .tui-interface ul.tui-flex {
+    list-style: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+  }
+  .tui-interface ul.tui-grid > li,
+  .tui-interface ul.tui-stack > li,
+  .tui-interface ul.tui-inline-flex > li,
+  .tui-interface ul.tui-flex > li {
+    list-style: none !important;
+  }
+  .tui-interface .is-density-none {
+    --tui-gap-inline: 0;
+    --tui-gap-block: 0;
+  }
+  .tui-interface .is-density-inline-none {
+    --tui-gap-inline: 0;
+  }
+  .tui-interface .is-density-block-none {
+    --tui-gap-block: 0;
+  }
+  .tui-interface .is-density-xxs {
+    --tui-gap-inline: var(--tui-spacing-xxs);
+    --tui-gap-block: var(--tui-spacing-xxs);
+  }
+  .tui-interface .is-density-inline-xxs {
+    --tui-gap-inline: var(--tui-spacing-xxs);
+  }
+  .tui-interface .is-density-block-xxs {
+    --tui-gap-block: var(--tui-spacing-xxs);
+  }
+  .tui-interface .is-density-xs {
+    --tui-gap-inline: var(--tui-spacing-xs);
+    --tui-gap-block: var(--tui-spacing-xs);
+  }
+  .tui-interface .is-density-inline-xs {
+    --tui-gap-inline: var(--tui-spacing-xs);
+  }
+  .tui-interface .is-density-block-xs {
+    --tui-gap-block: var(--tui-spacing-xs);
+  }
+  .tui-interface .is-density-sm {
+    --tui-gap-inline: var(--tui-spacing-sm);
+    --tui-gap-block: var(--tui-spacing-sm);
+  }
+  .tui-interface .is-density-inline-sm {
+    --tui-gap-inline: var(--tui-spacing-sm);
+  }
+  .tui-interface .is-density-block-sm {
+    --tui-gap-block: var(--tui-spacing-sm);
+  }
+  .tui-interface .is-density-md {
+    --tui-gap-inline: var(--tui-spacing-md);
+    --tui-gap-block: var(--tui-spacing-md);
+  }
+  .tui-interface .is-density-inline-md {
+    --tui-gap-inline: var(--tui-spacing-md);
+  }
+  .tui-interface .is-density-block-md {
+    --tui-gap-block: var(--tui-spacing-md);
+  }
+  .tui-interface .is-density-lg {
+    --tui-gap-inline: var(--tui-spacing-lg);
+    --tui-gap-block: var(--tui-spacing-lg);
+  }
+  .tui-interface .is-density-inline-lg {
+    --tui-gap-inline: var(--tui-spacing-lg);
+  }
+  .tui-interface .is-density-block-lg {
+    --tui-gap-block: var(--tui-spacing-lg);
+  }
+  .tui-interface .is-density-xl {
+    --tui-gap-inline: var(--tui-spacing-xl);
+    --tui-gap-block: var(--tui-spacing-xl);
+  }
+  .tui-interface .is-density-inline-xl {
+    --tui-gap-inline: var(--tui-spacing-xl);
+  }
+  .tui-interface .is-density-block-xl {
+    --tui-gap-block: var(--tui-spacing-xl);
+  }
+  .tui-interface .is-density-xxl {
+    --tui-gap-inline: var(--tui-spacing-xxl);
+    --tui-gap-block: var(--tui-spacing-xxl);
+  }
+  .tui-interface .is-density-inline-xxl {
+    --tui-gap-inline: var(--tui-spacing-xxl);
+  }
+  .tui-interface .is-density-block-xxl {
+    --tui-gap-block: var(--tui-spacing-xxl);
+  }
+  .tui-interface .tui-text-xxs {
+    font-size: var(--tui-typography-size-xxs) !important;
+  }
+  .tui-interface .tui-text-xs {
+    font-size: var(--tui-typography-size-xs) !important;
+  }
+  .tui-interface .tui-text-sm {
+    font-size: var(--tui-typography-size-sm) !important;
+  }
+  .tui-interface .tui-text-md {
+    font-size: var(--tui-typography-size-md) !important;
+  }
+  .tui-interface .tui-text-lg {
+    font-size: var(--tui-typography-size-lg) !important;
+  }
+  .tui-interface .tui-text-xl {
+    font-size: var(--tui-typography-size-xl) !important;
+  }
+  .tui-interface .tui-text-xxl {
+    font-size: var(--tui-typography-size-xxl) !important;
+  }
+  .tui-interface .tui-text-bold {
+    font-weight: var(--tui-typography-weight-bold, 700) !important;
+  }
+  .tui-interface .tui-text-normal {
+    font-weight: var(--tui-typography-weight-normal, 400) !important;
+  }
+  .tui-interface .tui-text-primary {
+    color: var(--tui-theme-primary-base) !important;
+  }
+  .tui-interface .tui-text-secondary {
+    color: var(--tui-theme-secondary-base) !important;
+  }
+  .tui-interface .tui-text-info {
+    color: var(--tui-theme-info-base) !important;
+  }
+  .tui-interface .tui-text-warning {
+    color: var(--tui-theme-warning-base) !important;
+  }
+  .tui-interface .tui-text-danger {
+    color: var(--tui-theme-danger-base) !important;
+  }
+  .tui-interface .tui-text-success {
+    color: var(--tui-theme-success-base) !important;
+  }
+  .tui-interface .tui-text-white {
+    color: var(--tui-palette-color-white);
+  }
+  .tui-interface .tui-text-contrast-high {
+    color: var(--tui-typography-color-contrast-high);
+  }
+  .tui-interface .tui-text-contrast-low {
+    color: var(--tui-typography-color-contrast-low);
+  }
+  .tui-interface .tui-rounded-none {
+    border-radius: 0 !important;
+  }
+  .tui-interface .tui-rounded-xs {
+    border-radius: var(--tui-radius-xs) !important;
+  }
+  .tui-interface .tui-rounded-sm {
+    border-radius: var(--tui-radius-sm) !important;
+  }
+  .tui-interface .tui-rounded-md {
+    border-radius: var(--tui-radius-md) !important;
+  }
+  .tui-interface .tui-rounded-lg {
+    border-radius: var(--tui-radius-lg) !important;
+  }
+  .tui-interface .tui-rounded-xl {
+    border-radius: var(--tui-radius-xl) !important;
+  }
+  .tui-interface .tui-rounded-full {
+    border-radius: 9999px !important;
+  }
+  .tui-interface .tui-border {
+    border-width: var(--tui-border-width, 1px) !important;
+    border-style: solid !important;
+    border-color: currentColor !important;
+  }
+  .tui-interface .tui-border-0 {
+    border: 0 !important;
+  }
+  .tui-interface .tui-border-t {
+    border-top-width: var(--tui-border-width, 1px) !important;
+    border-top-style: solid !important;
+  }
+  .tui-interface .tui-border-b {
+    border-bottom-width: var(--tui-border-width, 1px) !important;
+    border-bottom-style: solid !important;
+  }
+  .tui-interface .tui-border-l {
+    border-left-width: var(--tui-border-width, 1px) !important;
+    border-left-style: solid !important;
+  }
+  .tui-interface .tui-border-r {
+    border-right-width: var(--tui-border-width, 1px) !important;
+    border-right-style: solid !important;
+  }
+  .tui-interface .tui-border-primary {
+    border-color: var(--tui-theme-primary-border, var(--tui-theme-primary-base)) !important;
+  }
+  .tui-interface .tui-border-secondary {
+    border-color: var(--tui-theme-secondary-border, var(--tui-theme-secondary-base)) !important;
+  }
+  .tui-interface .tui-border-info {
+    border-color: var(--tui-theme-info-border, var(--tui-theme-info-base)) !important;
+  }
+  .tui-interface .tui-border-warning {
+    border-color: var(--tui-theme-warning-border, var(--tui-theme-warning-base)) !important;
+  }
+  .tui-interface .tui-border-danger {
+    border-color: var(--tui-theme-danger-border, var(--tui-theme-danger-base)) !important;
+  }
+  .tui-interface .tui-border-success {
+    border-color: var(--tui-theme-success-border, var(--tui-theme-success-base)) !important;
+  }
+  .tui-interface .tui-border-contrast-high {
+    border-color: var(--tui-border-color-contrast-high, var(--tui-typography-color-contrast-high)) !important;
+  }
+  .tui-interface .tui-border-contrast-low {
+    border-color: var(--tui-border-color-contrast-low, var(--tui-typography-color-contrast-low)) !important;
+  }
+
+@keyframes tui-spin {
+  to {
+    transform: rotate(1turn);
+  }
+}