/* Atomic utility classes generated from the style="" attributes that used to
   sit in the markup. They exist so the page CSP can be style-src 'self' with
   no 'unsafe-inline'; see public/_headers. One declaration per class, so a new
   combination needs no new CSS - just another class in the markup.
   Values that are computed at runtime are not here: those are set through the
   CSSOM (element.style.x = ...), which CSP allows.

   Each selector repeats its class (.u-x.u-x) purely to raise specificity to
   0,2,0. These replaced style="" attributes, which used to beat every rule in
   the cascade; as plain single classes they lost to ordinary component
   selectors like ".panel .body", which silently changed the layout. Repeating
   the class ties with those and this file loads last, so it wins. !important
   would also work but must not be used here: elements are shown and hidden at
   runtime with element.style.display, and an !important class would beat that
   inline value and break the toggling. */
.u-align-items-center.u-align-items-center { align-items: center; }
.u-border-0.u-border-0 { border: 0; }
.u-border-color-destructive.u-border-color-destructive { border-color: var(--destructive); }
.u-color-destructive.u-color-destructive { color: var(--destructive); }
.u-color-destructive-hard.u-color-destructive-hard { color: var(--destructive-hard); }
.u-color-muted-foreground.u-color-muted-foreground { color: var(--muted-foreground); }
.u-color-primary.u-color-primary { color: var(--primary); }
.u-color-success.u-color-success { color: var(--success); }
.u-cursor-pointer.u-cursor-pointer { cursor: pointer; }
.u-display-flex.u-display-flex { display: flex; }
.u-display-none.u-display-none { display: none; }
.u-flex-1.u-flex-1 { flex: 1; }
.u-font-size-11-5px.u-font-size-11-5px { font-size: 11.5px; }
.u-font-size-12-5px.u-font-size-12-5px { font-size: 12.5px; }
.u-font-size-13px.u-font-size-13px { font-size: 13px; }
.u-font-size-15px.u-font-size-15px { font-size: 15px; }
.u-font-weight-400.u-font-weight-400 { font-weight: 400; }
.u-font-weight-700.u-font-weight-700 { font-weight: 700; }
.u-gap-12px.u-gap-12px { gap: 12px; }
.u-gap-14px.u-gap-14px { gap: 14px; }
.u-gap-16px.u-gap-16px { gap: 16px; }
.u-gap-6px.u-gap-6px { gap: 6px; }
.u-grid-column-1-1.u-grid-column-1-1 { grid-column: 1 / -1; }
.u-margin-0.u-margin-0 { margin: 0; }
.u-margin-0-0-4px.u-margin-0-0-4px { margin: 0 0 4px; }
.u-margin-10px-0-0.u-margin-10px-0-0 { margin: 10px 0 0; }
.u-margin-2px-0-10px.u-margin-2px-0-10px { margin: -2px 0 10px; }
.u-margin-4px-0-14px.u-margin-4px-0-14px { margin: -4px 0 14px; }
.u-margin-bottom-0.u-margin-bottom-0 { margin-bottom: 0; }
.u-margin-bottom-12px.u-margin-bottom-12px { margin-bottom: 12px; }
.u-margin-bottom-14px.u-margin-bottom-14px { margin-bottom: 14px; }
.u-margin-left-auto.u-margin-left-auto { margin-left: auto; }
.u-margin-top-12px.u-margin-top-12px { margin-top: 12px; }
.u-margin-top-14px.u-margin-top-14px { margin-top: 14px; }
.u-margin-top-16px.u-margin-top-16px { margin-top: 16px; }
.u-margin-top-18px.u-margin-top-18px { margin-top: 18px; }
.u-margin-top-2px.u-margin-top-2px { margin-top: 2px; }
.u-margin-top-6px.u-margin-top-6px { margin-top: 6px; }
.u-margin-top-8px.u-margin-top-8px { margin-top: 8px; }
.u-max-height-340px.u-max-height-340px { max-height: 340px; }
.u-overflow-auto.u-overflow-auto { overflow: auto; }
.u-padding-0.u-padding-0 { padding: 0; }
.u-padding-10px-16px-0.u-padding-10px-16px-0 { padding: 10px 16px 0; }
.u-padding-18px.u-padding-18px { padding: 18px; }
.u-resize-vertical.u-resize-vertical { resize: vertical; }
.u-text-align-center.u-text-align-center { text-align: center; }
.u-text-align-right.u-text-align-right { text-align: right; }
.u-width-100.u-width-100 { width: 100%; }
.u-width-130px.u-width-130px { width: 130px; }
.u-width-132px.u-width-132px { width: 132px; }
.u-width-140px.u-width-140px { width: 140px; }
.u-width-52px.u-width-52px { width: 52px; }