/* Utilitários: substituem os antigos style="..." estáticos dos templates.
   Cada classe tem uma única declaração e usa !important para manter a precedência que o atributo style tinha.
   Ao redesenhar um componente, prefira trocar estes utilitários por uma classe do próprio componente. */
.u-ac-start {
  align-content: start !important;
}
.u-accent-accent {
  accent-color: var(--color-accent) !important;
}
.u-ai-center {
  align-items: center !important;
}
.u-ai-flex-end {
  align-items: flex-end !important;
}
.u-ai-flex-start {
  align-items: flex-start !important;
}
.u-ai-start {
  align-items: start !important;
}
.u-all-unset {
  all: unset !important;
}
.u-b-0 {
  border: 0 !important;
}
.u-bc-blue-line {
  border-color: var(--tone-blue-line) !important;
}
.u-bc-lav-line {
  border-color: var(--tone-lav-line) !important;
}
.u-bc-mint-line {
  border-color: var(--tone-mint-line) !important;
}
.u-bc-peach-line {
  border-color: var(--tone-peach-line) !important;
}
.u-bc-pink-line {
  border-color: var(--tone-pink-line) !important;
}
.u-bg-accent {
  background: var(--color-accent) !important;
}
.u-bg-accent-soft {
  background: var(--color-accent-soft) !important;
}
.u-bg-conic-gradient-lav-lineblue-linemint-lineyellow-linepink-linelav-line {
  background: conic-gradient(
    var(--tone-lav-line),
    var(--tone-blue-line),
    var(--tone-mint-line),
    var(--tone-yellow-line),
    var(--tone-pink-line),
    var(--tone-lav-line)
  ) !important;
}
.u-bg-currentcolor {
  background: currentColor !important;
}
.u-bg-none {
  background: none !important;
}
.u-bg-yellow-bg {
  background: var(--tone-yellow-bg) !important;
}
.u-bs-dashed {
  border-style: dashed !important;
}
.u-bt-1-solid-border {
  border-top: 1px solid var(--color-border) !important;
}
.u-c-accent {
  color: var(--color-accent) !important;
}
.u-c-danger {
  color: var(--color-danger) !important;
}
.u-c-lav-fg {
  color: var(--tone-lav-fg) !important;
}
.u-c-text {
  color: var(--color-text) !important;
}
.u-c-text-muted {
  color: var(--color-text-muted) !important;
}
.u-cols-auto-minmax-01fr {
  grid-template-columns: auto minmax(0, 1fr) !important;
}
.u-cols-minmax-01fr-auto {
  grid-template-columns: minmax(0, 1fr) auto !important;
}
.u-cols-repeat-21fr {
  grid-template-columns: repeat(2, 1fr) !important;
}
.u-cols-repeat-5minmax-01fr {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
.u-cols-repeat-71fr {
  grid-template-columns: repeat(7, 1fr) !important;
}
.u-cur-default {
  cursor: default !important;
}
.u-cur-pointer {
  cursor: pointer !important;
}
.u-d-block {
  display: block !important;
}
.u-d-flex {
  display: flex !important;
}
.u-d-grid {
  display: grid !important;
}
.u-d-inline-flex {
  display: inline-flex !important;
}
.u-ff-ui-monospacemonospace {
  font-family: ui-monospace, monospace !important;
}
.u-font-600-14-font-sans {
  font: 600 14px var(--font-sans) !important;
}
.u-fs-12 {
  font-size: 12px !important;
}
.u-fs-13 {
  font-size: 13px !important;
}
.u-fs-14 {
  font-size: 14px !important;
}
.u-fs-15 {
  font-size: 15px !important;
}
.u-fs-16 {
  font-size: 16px !important;
}
.u-fs-17 {
  font-size: 17px !important;
}
.u-fs-18 {
  font-size: 18px !important;
}
.u-fs-22 {
  font-size: 22px !important;
}
.u-fs-26 {
  font-size: 26px !important;
}
.u-fs-44 {
  font-size: 44px !important;
}
.u-fw-500 {
  font-weight: 500 !important;
}
.u-fw-600 {
  font-weight: 600 !important;
}
.u-fx-1 {
  flex: 1 !important;
}
.u-fx-1-1-180 {
  flex: 1 1 180px !important;
}
.u-fx-1-1-220 {
  flex: 1 1 220px !important;
}
.u-fx-1-1-260 {
  flex: 1 1 260px !important;
}
.u-fx-none {
  flex: none !important;
}
.u-fxw-nowrap {
  flex-wrap: nowrap !important;
}
.u-fxw-wrap {
  flex-wrap: wrap !important;
}
.u-gap-10 {
  gap: 10px !important;
}
.u-gap-12 {
  gap: 12px !important;
}
.u-gap-14 {
  gap: 14px !important;
}
.u-gap-16 {
  gap: 16px !important;
}
.u-gap-2 {
  gap: 2px !important;
}
.u-gap-2-10 {
  gap: 2px 10px !important;
}
.u-gap-20 {
  gap: 20px !important;
}
.u-gap-22 {
  gap: 22px !important;
}
.u-gap-24 {
  gap: 24px !important;
}
.u-gap-4 {
  gap: 4px !important;
}
.u-gap-6 {
  gap: 6px !important;
}
.u-gap-8 {
  gap: 8px !important;
}
.u-h-14 {
  height: 14px !important;
}
.u-h-20 {
  height: 20px !important;
}
.u-h-32 {
  height: 32px !important;
}
.u-h-36 {
  height: 36px !important;
}
.u-h-5 {
  height: 5px !important;
}
.u-jc-center {
  justify-content: center !important;
}
.u-jc-space-between {
  justify-content: space-between !important;
}
.u-ji-center {
  justify-items: center !important;
}
.u-js-center {
  justify-self: center !important;
}
.u-list-none {
  list-style: none !important;
}
.u-ls-p03em {
  letter-spacing: -0.03em !important;
}
.u-ls-p06em {
  letter-spacing: 0.06em !important;
}
.u-m-0 {
  margin: 0 !important;
}
.u-m-2-auto-0 {
  margin: 2px auto 0 !important;
}
.u-m-4-0-12 {
  margin: 4px 0 12px !important;
}
.u-maxw-140 {
  max-width: 140px !important;
}
.u-maxw-360 {
  max-width: 360px !important;
}
.u-maxw-46ch {
  max-width: 46ch !important;
}
.u-maxw-640 {
  max-width: 640px !important;
}
.u-maxw-none {
  max-width: none !important;
}
.u-mb-10 {
  margin-bottom: 10px !important;
}
.u-mb-12 {
  margin-bottom: 12px !important;
}
.u-mb-16 {
  margin-bottom: 16px !important;
}
.u-mb-2 {
  margin-bottom: 2px !important;
}
.u-mb-20 {
  margin-bottom: 20px !important;
}
.u-mb-4 {
  margin-bottom: 4px !important;
}
.u-mb-6 {
  margin-bottom: 6px !important;
}
.u-mb-8 {
  margin-bottom: 8px !important;
}
.u-minh-32 {
  min-height: 32px !important;
}
.u-minh-36 {
  min-height: 36px !important;
}
.u-minh-40 {
  min-height: 40px !important;
}
.u-minh-44 {
  min-height: 44px !important;
}
.u-minh-46 {
  min-height: 46px !important;
}
.u-minh-52 {
  min-height: 52px !important;
}
.u-minh-60 {
  min-height: 60px !important;
}
.u-minh-70 {
  min-height: 70px !important;
}
.u-minh-84 {
  min-height: 84px !important;
}
.u-minw-0 {
  min-width: 0 !important;
}
.u-minw-180 {
  min-width: 180px !important;
}
.u-minw-200 {
  min-width: 200px !important;
}
.u-minw-420 {
  min-width: 420px !important;
}
.u-minw-min-100pct280 {
  min-width: min(100%, 280px) !important;
}
.u-ml-auto {
  margin-left: auto !important;
}
.u-mr-auto {
  margin-right: auto !important;
}
.u-mt-10 {
  margin-top: 10px !important;
}
.u-mt-12 {
  margin-top: 12px !important;
}
.u-mt-14 {
  margin-top: 14px !important;
}
.u-mt-16 {
  margin-top: 16px !important;
}
.u-mt-20 {
  margin-top: 20px !important;
}
.u-mt-24 {
  margin-top: 24px !important;
}
.u-mt-4 {
  margin-top: 4px !important;
}
.u-mt-6 {
  margin-top: 6px !important;
}
.u-mt-8 {
  margin-top: 8px !important;
}
.u-mt-n4 {
  margin-top: -4px !important;
}
.u-of-hidden {
  overflow: hidden !important;
}
.u-op-p8 {
  opacity: 0.8 !important;
}
.u-ow-anywhere {
  overflow-wrap: anywhere !important;
}
.u-p-0 {
  padding: 0 !important;
}
.u-p-0-12 {
  padding: 0 12px !important;
}
.u-p-16 {
  padding: 16px !important;
}
.u-p-18 {
  padding: 18px !important;
}
.u-p-5-12 {
  padding: 5px 12px !important;
}
.u-pt-16 {
  padding-top: 16px !important;
}
.u-r-9 {
  border-radius: var(--radius-sm) !important;
}
.u-r-99 {
  border-radius: 99px !important;
}
.u-ta-center {
  text-align: center !important;
}
.u-td-none {
  text-decoration: none !important;
}
.u-tov-ellipsis {
  text-overflow: ellipsis !important;
}
.u-tr-stroke-dashoffset-1s-linear {
  transition: stroke-dashoffset 1s linear !important;
}
.u-tt-capitalize {
  text-transform: capitalize !important;
}
.u-tt-uppercase {
  text-transform: uppercase !important;
}
.u-w-0pct {
  width: 0% !important;
}
.u-w-100pct {
  width: 100% !important;
}
.u-w-20 {
  width: 20px !important;
}
.u-w-36 {
  width: 36px !important;
}
.u-w-5 {
  width: 5px !important;
}
.u-w-50pct {
  width: 50% !important;
}
.u-w-58pct {
  width: 58% !important;
}
.u-w-66pct {
  width: 66% !important;
}
.u-w-67pct {
  width: 67% !important;
}
.u-w-70pct {
  width: 70% !important;
}
.u-w-74pct {
  width: 74% !important;
}
.u-w-8 {
  width: 8px !important;
}
.u-w-82pct {
  width: 82% !important;
}
.u-w-96 {
  width: 96px !important;
}
.u-w-auto {
  width: auto !important;
}

/* Repetido aqui, depois dos utilitários: [hidden] continua escondendo mesmo com um utilitário de display. */
[hidden] {
  display: none !important;
}