.slex-site-nav {
  position: relative;
}

.slex-site-nav-brand {
  min-width: 0;
}

.slex-site-nav-actions {
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center;
  gap: 0.375rem !important;
  width: max-content;
  min-width: max-content;
}

.slex-site-nav-links {
  display: none;
  align-items: center;
  justify-content: center;
  gap: clamp(1.25rem, 3vw, 2rem);
  color: var(--muted-foreground);
  font-size: 1rem;
  line-height: 1;
  min-width: 0;
}

.slex-site-nav-link {
  color: var(--muted-foreground);
  text-decoration: none;
  transition: color 150ms ease;
}

.slex-site-nav-link:hover,
.slex-site-nav-link:focus-visible,
.slex-site-nav-link.text-foreground {
  color: var(--foreground);
}

.slex-site-nav-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

.slex-site-footer-link,
.slex-doc-prose :where(a:not([class])),
.slex-static-prose :where(a:not([class])) {
  color: color-mix(in oklab, var(--primary) 88%, var(--foreground));
  text-decoration-color: color-mix(in oklab, var(--primary) 42%, transparent);
  text-underline-offset: 0.18em;
  transition:
    color 140ms ease,
    text-decoration-color 140ms ease;
}

.slex-doc-prose :where(a:not([class])),
.slex-static-prose :where(a:not([class])) {
  font-weight: 500;
}

.slex-site-footer-link:hover,
.slex-site-footer-link:focus-visible,
.slex-doc-prose :where(a:not([class]):hover),
.slex-doc-prose :where(a:not([class]):focus-visible),
.slex-static-prose :where(a:not([class]):hover),
.slex-static-prose :where(a:not([class]):focus-visible) {
  color: var(--foreground);
  text-decoration-color: currentColor;
}

.slex-site-footer-link:focus-visible,
.slex-doc-prose :where(a:not([class]):focus-visible),
.slex-static-prose :where(a:not([class]):focus-visible) {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

.slex-site-logo {
  display: inline-block;
  background: var(--primary);
  -webkit-mask: url("../assets/logo.svg") center / contain no-repeat;
  mask: url("../assets/logo.svg") center / contain no-repeat;
  transition: background-color 140ms ease;
}

.slex-site-icon-button {
  display: inline-grid !important;
  position: relative;
  width: 2.25rem !important;
  height: 2.25rem !important;
  min-height: 2.25rem !important;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid transparent !important;
  border-radius: calc(var(--radius) + 2px) !important;
  background: transparent !important;
  color: var(--muted-foreground) !important;
  padding: 0 !important;
  box-shadow: none !important;
  cursor: pointer;
  overflow: hidden;
  transition:
    background 150ms ease,
    color 150ms ease,
    box-shadow 150ms ease;
}

.slex-site-icon-button:hover {
  background: var(--accent) !important;
  color: var(--accent-foreground) !important;
}

.slex-site-icon-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent) !important;
}

.slex-site-icon-button :where(svg, .slex-icon) {
  width: 1rem !important;
  height: 1rem !important;
  margin: 0 !important;
}

.slex-site-language-control {
  position: relative;
  flex: 0 0 auto;
}

.slex-site-language-menu {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  z-index: 70;
  display: grid;
  min-width: 7.75rem;
  gap: 0.125rem;
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) + 2px);
  background: var(--popover, var(--background));
  color: var(--popover-foreground, var(--foreground));
  padding: 0.25rem;
  box-shadow: var(
    --shadow-md,
    0 6px 16px rgb(0 0 0 / 0.12),
    0 2px 4px rgb(0 0 0 / 0.08)
  );
}

.slex-site-language-menu[hidden] {
  display: none;
}

.slex-site-language-option {
  width: 100%;
  border: 0;
  border-radius: var(--radius);
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: 0.875rem;
  line-height: 1.25rem;
  outline: none;
  padding: 0.5rem 0.625rem;
  text-align: left;
  transition:
    background 120ms ease,
    color 120ms ease;
}

.slex-site-language-option:hover,
.slex-site-language-option:focus-visible,
.slex-site-language-option[aria-selected="true"] {
  background: var(--accent);
  color: var(--accent-foreground);
}

.slex-site-language-option[aria-selected="true"] {
  font-weight: 600;
}

.slex-site-language-option:focus-visible {
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--ring) 28%, transparent);
}

.slex-theme-icon {
  display: inline-flex;
  grid-area: 1 / 1;
}

#themeBtn .slex-theme-icon--dark {
  display: none;
}

.dark #themeBtn .slex-theme-icon--light {
  display: none;
}

.dark #themeBtn .slex-theme-icon--dark {
  display: inline-flex;
}

.slex-docs-shell {
  display: grid;
  box-sizing: border-box;
  width: min(100%, 92rem);
  max-width: none;
  margin: 0 auto;
  gap: 1.5rem;
  padding: 1.5rem 1rem;
  align-items: start;
}

.slex-docs-shell-sidebar {
  min-width: 0;
  padding-right: 0;
  scrollbar-width: none;
}

.slex-docs-shell-sidebar::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.slex-docs-flowbite-sidebar {
  width: min(18rem, calc(100vw - 2rem)) !important;
  max-width: calc(100vw - 2rem);
  border-right: 1px solid var(--border);
  background: var(--background) !important;
  color: var(--muted-foreground);
  padding: 0 !important;
  box-shadow: var(--shadow-lg);
}

.slex-docs-flowbite-sidebar > div {
  height: 100%;
  background: var(--background) !important;
  padding: 1rem !important;
  overflow-y: auto !important;
}

.slex-docs-flowbite-sidebar :where(ul, ol),
.slex-docs-flowbite-sidebar :where(li) {
  margin: 0;
  padding: 0;
  list-style: none;
}

.slex-docs-flowbite-sidebar :where(li)::marker {
  content: "";
}

.slex-docs-flowbite-sidebar :where(a) {
  display: flex;
  width: 100%;
  min-height: 2.35rem;
  align-items: center;
  border-radius: calc(var(--radius) + 2px);
  text-decoration: none !important;
}

.slex-docs-flowbite-sidebar :where(a:hover) {
  text-decoration: none !important;
}

.slex-docs-flowbite-sidebar :where(a:visited) {
  color: inherit;
}

.slex-docs-sidebar-item {
  margin: 0.0625rem 0;
  border: 1px solid transparent;
  background: transparent;
  color: var(--muted-foreground);
  padding: 0.4375rem 0.75rem;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.35;
  outline: none;
  transition:
    background-color 140ms ease,
    border-color 140ms ease,
    color 140ms ease;
}

.slex-docs-sidebar-item-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.slex-docs-sidebar-item:hover {
  background: color-mix(in oklab, var(--accent) 56%, transparent);
  color: var(--foreground);
}

.slex-docs-sidebar-item:focus-visible {
  background: color-mix(in oklab, var(--accent) 62%, transparent);
  border-color: color-mix(in oklab, var(--ring) 42%, transparent);
  color: var(--foreground);
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--ring) 14%, transparent);
}

.slex-docs-sidebar-item--active,
.slex-docs-sidebar-item--active:hover,
.slex-docs-sidebar-item--active:focus-visible {
  background: color-mix(in oklab, var(--accent) 88%, transparent);
  border-color: transparent;
  color: var(--foreground);
  font-weight: 650;
  box-shadow: none;
}

.slex-docs-section {
  margin: 0;
  padding: 0;
}

.slex-docs-section + .slex-docs-section {
  margin-top: 0.375rem;
}

.slex-docs-section-trigger {
  display: flex;
  width: 100%;
  min-height: 2.5rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border: 0;
  border-radius: calc(var(--radius) + 2px);
  background: transparent;
  color: var(--muted-foreground);
  padding: 0 0.625rem;
  font: inherit;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.25;
  cursor: pointer;
  transition: background 140ms ease, color 140ms ease;
}

.slex-docs-section-trigger:hover,
.slex-docs-section-trigger--open {
  color: var(--foreground);
}

.slex-docs-section-trigger:hover {
  background: color-mix(in oklab, var(--accent) 42%, transparent);
}

.slex-docs-section-trigger:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--ring) 18%, transparent);
}

.slex-docs-section-trigger-main {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 0.625rem;
}

.slex-docs-section-icon,
.slex-docs-section-caret {
  display: inline-flex;
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  color: currentColor;
}

.slex-docs-section-icon svg,
.slex-docs-section-caret svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
}

.slex-docs-section-caret {
  opacity: 0.74;
  transition: transform 140ms ease;
}

.slex-docs-section-trigger[aria-expanded="false"] .slex-docs-section-caret {
  transform: rotate(-90deg);
}

.slex-docs-section-panel {
  display: grid;
  grid-template-rows: 0fr;
  margin: 0 0 0 1.125rem;
  border-left: 1px solid transparent;
  opacity: 0;
  overflow: hidden;
  padding: 0 0 0 0.875rem;
  pointer-events: none;
  visibility: hidden;
  transition:
    grid-template-rows 180ms ease,
    opacity 140ms ease,
    margin 180ms ease,
    border-color 180ms ease,
    padding 180ms ease,
    visibility 0s linear 180ms;
}

.slex-docs-section-panel--open {
  grid-template-rows: 1fr;
  margin: 0.375rem 0 1rem 1.125rem;
  border-left-color: var(--border);
  opacity: 1;
  padding: 0.625rem 0 0.25rem 0.875rem;
  pointer-events: auto;
  visibility: visible;
  transition:
    grid-template-rows 180ms ease,
    opacity 140ms ease,
    margin 180ms ease,
    border-color 180ms ease,
    padding 180ms ease,
    visibility 0s;
}

.slex-docs-section-panel-inner {
  display: grid;
  min-height: 0;
  gap: 1.125rem;
  overflow: hidden;
}

.slex-docs-subgroup {
  display: grid;
  gap: 0.25rem;
}

.slex-docs-subgroup-title {
  color: color-mix(in oklab, var(--muted-foreground) 74%, transparent);
  padding: 0 0.625rem;
  font-size: 0.6875rem;
  font-weight: 650;
  letter-spacing: 0.04em;
  line-height: 1.5;
}

.slex-docs-subgroup-items {
  display: grid;
  gap: 0.0625rem;
}

@media (prefers-reduced-motion: reduce) {
  .slex-docs-section-panel {
    transition: none;
  }
}

.slex-docs-shell-main {
  display: grid;
  width: 100%;
  min-width: 0;
  align-content: start;
}

.slex-docs-shell-main .slex-doc-detail,
.slex-docs-shell-main .slex-doc-prose,
.slex-docs-shell-main .slex-doc-streamdown {
  width: 100%;
  max-width: none;
}

.slex-docs-shell > .slex-doc-detail-rail {
  min-width: 0;
}

.slex-docs-shell-playground {
  width: 100%;
  margin-bottom: 1.75rem;
}

.slex-docs-shell-empty {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--muted);
  color: var(--muted-foreground);
  padding: 1rem;
  font-size: 0.875rem;
}

.slex-docs-shell-main .slex-doc-detail-header {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 1rem;
  border-bottom: 0;
  padding-bottom: 0;
}

.slex-docs-mobile-toolbar {
  display: flex;
  position: fixed;
  top: 1.375rem;
  right: 7rem;
  z-index: 55;
  align-items: center;
  justify-content: flex-end;
}

.slex-docs-sidebar-trigger {
  background: transparent !important;
}

.slex-static-page,
.slex-docs-layout {
  box-sizing: border-box;
  width: min(100%, 88rem);
  margin: 0 auto;
  padding: 1.5rem 1rem;
}

.slex-static-home {
  min-height: calc(100vh - 5rem);
}

.slex-static-prose {
  width: min(100%, 52rem);
  min-width: 0;
  color: var(--foreground);
}

.slex-static-prose :where(h1) {
  margin: 0 0 1rem;
  color: var(--foreground);
  font-size: 2.25rem;
  font-weight: 750;
  line-height: 0.96;
  letter-spacing: 0;
}

.slex-static-prose :where(h2) {
  margin: 2.25rem 0 0.75rem;
  color: var(--foreground);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0;
}

.slex-static-prose :where(p),
.slex-static-prose :where(li) {
  color: var(--muted-foreground);
  font-size: 1rem;
  line-height: 1.75;
}

.slex-static-prose :where(ul, ol) {
  display: grid;
  gap: 0.375rem;
  margin: 1rem 0;
  padding-left: 1.25rem;
}

.slex-static-prose :where(.slex-streamdown-block, .slexkit-playground-shell) {
  margin-top: 1.5rem;
}

.slex-home-page {
  box-sizing: border-box;
  width: min(100%, 96rem);
  margin: 0 auto;
  padding: 4rem 1.5rem 7rem;
}

.slex-home-hero {
  display: grid;
  gap: 4rem;
  align-items: start;
  justify-items: center;
}

.slex-home-copy {
  display: flex;
  width: min(100%, 39rem);
  flex-direction: column;
  align-items: center;
  min-width: 0;
  margin: 0 auto;
  text-align: center;
}

.slex-home-brand-lockup {
  display: flex;
  min-width: 0;
  width: min(100%, 38rem);
  flex-direction: column;
  align-items: center;
  gap: 1.125rem;
}

.slex-home-brand-row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  min-width: 0;
}

.slex-home-brand-logo {
  width: 4.35rem;
  height: 4.35rem;
  flex: 0 0 auto;
  margin-top: 0;
  border-radius: calc(var(--radius) + 4px);
  transform: none;
}

.slex-home-brand-text {
  min-width: 0;
  text-align: center;
}

.slex-home-eyebrow {
  color: var(--muted-foreground);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: 0;
}

.slex-home-title {
  margin: 0;
  color: var(--foreground);
  font-size: 5.25rem;
  font-weight: 780;
  line-height: 0.94;
  letter-spacing: 0;
}

.slex-home-expanded-name {
  display: inline-flex;
  align-items: baseline;
  --slex-home-expanded-name-width: 0px;
  width: 0;
  max-width: 100%;
  gap: 0;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 0.75rem;
  border-right: 2px solid currentColor;
  color: color-mix(in oklab, var(--muted-foreground) 78%, transparent);
  font-size: 1.375rem;
  font-weight: 500;
  line-height: 1.4;
  overflow: hidden;
  white-space: nowrap;
  animation: slex-home-caret 900ms steps(1, end) infinite;
}

.slex-home-expanded-word {
  display: inline-flex;
  align-items: baseline;
  flex: 0 0 auto;
}

.slex-home-expanded-initial {
  color: var(--foreground);
  font-weight: 500;
}

.slex-home-expanded-rest {
  color: inherit;
  font-weight: 500;
}

.slex-home-expanded-char {
  display: inline-block;
}

.slex-home-expanded-space {
  width: 0.42em;
}

.slex-home-lede {
  width: min(100%, 39rem);
  margin: 0;
  color: var(--muted-foreground);
  font-size: 1.25rem;
  line-height: 1.6;
  text-align: center;
}

@keyframes slex-home-caret {
  0%,
  49% {
    border-color: currentColor;
  }

  50%,
  100% {
    border-color: transparent;
  }
}

@media (prefers-reduced-motion: reduce) {
  .slex-home-expanded-name {
    width: auto;
    border-right: 0;
    animation: none;
  }

  .slex-home-preview {
    animation: none;
  }
}

.slex-home-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 2.5rem;
}

.slex-home-action {
  display: inline-flex;
  min-height: 3rem;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) + 2px);
  background: transparent;
  color: var(--foreground);
  padding: 0 1.125rem;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  transition: background 150ms ease, border-color 150ms ease, color 150ms ease, transform 150ms ease;
}

.slex-home-action.primary {
  border-color: var(--foreground);
  background: var(--foreground);
  color: var(--background);
}

.slex-home-action:hover {
  transform: translateY(-1px);
}

.slex-home-action:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

.slex-home-preview {
  position: relative;
  width: min(100%, 72rem);
  min-width: 0;
  justify-self: center;
  animation: slex-home-preview-enter 680ms cubic-bezier(0.22, 1, 0.36, 1) 380ms both;
}

.slex-home-preview::before {
  position: absolute;
  inset: 0;
  border-radius: 1rem;
  box-shadow: 0 1.5rem 4rem color-mix(in oklab, var(--foreground) 12%, transparent);
  content: "";
  pointer-events: none;
}

.slex-home-preview-surface {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  border-radius: 1rem;
  background: transparent;
  overflow: visible;
  --slex-stat-initial-delay: 820ms;
}

.slex-home-preview-surface > .slexkit-root,
.slex-home-preview-surface > .slexkit-root > .slex-layout,
.slex-home-preview-surface .slex-home-playground {
  height: auto;
  min-height: 0;
}

.slex-home-preview-surface .slex-home-playground {
  border-radius: inherit;
}

.slex-home-playground .slex-playground-preview-pane,
.slex-home-playground .slex-playground-code-pane,
.slex-home-playground .slex-playground-live-pane {
  height: auto;
  min-height: 0;
}

.slex-home-playground .slex-playground-preview-pane {
  overflow: visible;
}

.slex-home-playground .slex-playground-code,
.slex-home-playground .slex-playground-editor,
.slex-home-playground .slex-playground-editor.codemirror,
.slex-home-playground .slex-playground-editor .cm-editor,
.slex-home-playground .slex-playground-editor .cm-scroller {
  height: 100%;
  min-height: 0;
}

.slex-home-playground .slex-playground-live-code,
.slex-home-playground .slex-playground-live-preview {
  min-height: 0;
}

@keyframes slex-home-preview-enter {
  from {
    opacity: 0;
    transform: translateY(2rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.slex-docs-layout {
  display: grid;
  gap: 2rem;
  align-items: start;
}

.slex-docs-sidebar,
.slex-docs-toc {
  display: none;
}

.slex-docs-article {
  min-width: 0;
}

.slex-docs-title {
  margin: 0;
  color: var(--foreground);
  font-size: 2rem;
  font-weight: 750;
  line-height: 1;
  letter-spacing: 0;
}

.slex-docs-summary {
  width: min(100%, 48rem);
  margin: 0.875rem 0 0;
  color: var(--muted-foreground);
  font-size: 1rem;
  line-height: 1.65;
}

.slex-docs-markdown {
  margin-top: 2rem;
}

.slex-docs-markdown table {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 1rem 0;
  overflow-x: auto;
  border-collapse: collapse;
  color: var(--foreground);
  font-size: 0.875rem;
}

.slex-docs-markdown th,
.slex-docs-markdown td {
  border: 1px solid var(--border);
  padding: 0.625rem 0.75rem;
  text-align: left;
  vertical-align: top;
}

.slex-docs-markdown th {
  background: var(--muted);
  color: var(--muted-foreground);
  font-weight: 650;
}

.slex-doc-nav-group {
  display: grid;
  gap: 0.125rem;
}

.slex-doc-nav-group + .slex-doc-nav-group {
  margin-top: 1.25rem;
}

.slex-doc-nav-title,
.slex-docs-toc-title {
  margin: 0 0 0.5rem;
  color: var(--muted-foreground);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0;
}

.slex-doc-nav-link {
  display: block;
  min-width: 0;
  border-radius: calc(var(--radius) - 2px);
  color: var(--muted-foreground);
  padding: 0.4375rem 0.625rem;
  font-size: 0.875rem;
  line-height: 1.25;
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

.slex-doc-nav-link:hover,
.slex-doc-nav-link.active {
  background: var(--accent);
  color: var(--foreground);
}

.slex-doc-nav-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

.slex-docs-toc {
  color: var(--muted-foreground);
  font-size: 0.8125rem;
}

.slex-docs-toc .slex-toc-link {
  border-left: 1px solid transparent;
  border-radius: 0;
  margin-left: -1px;
  padding: 0.25rem 0 0.25rem 0.75rem;
}

.slex-docs-toc .slex-toc-link:hover,
.slex-docs-toc .slex-toc-link.active,
.slex-docs-toc .slex-toc-link--active {
  background: transparent;
  border-left-color: var(--foreground);
  color: var(--foreground);
}

.slex-docs-toc .slex-toc-link.depth-3 {
  padding-left: 1.25rem;
}

@media (min-width: 768px) {
  .slex-site-nav {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }

  .slex-site-nav-brand {
    justify-self: start;
  }

  .slex-site-nav-links {
    display: flex;
    justify-self: center;
  }

  .slex-site-nav-actions {
    justify-self: end;
  }
}

@media (min-width: 1024px) {
  .slex-docs-shell {
    grid-template-columns: minmax(15rem, 18rem) minmax(0, 1fr);
    gap: 2.25rem;
    padding: 2rem 2.5rem;
  }

  .slex-docs-shell-sidebar {
    display: block;
    position: sticky;
    top: 5rem;
    max-height: calc(100vh - 6rem);
    overflow: auto;
    align-self: start;
    border-right: 1px solid var(--border);
    padding-right: 1.5rem;
  }

  .slex-docs-flowbite-sidebar {
    display: block !important;
    position: static !important;
    width: 100% !important;
    max-width: none;
    border-right: 0;
    background: transparent !important;
    box-shadow: none;
  }

  .slex-docs-flowbite-sidebar > div {
    height: auto;
    background: transparent !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .slex-docs-mobile-toolbar {
    display: none;
  }

  .slex-docs-sidebar-trigger {
    display: none !important;
  }

  .slex-docs-shell-main {
    max-width: 62rem;
  }

  .slex-static-page,
  .slex-docs-layout {
    padding: 2rem;
  }

  .slex-static-prose :where(h1) {
    font-size: 4.75rem;
  }

  .slex-docs-title {
    font-size: 3.25rem;
  }

  .slex-docs-layout {
    grid-template-columns: 17rem minmax(0, 1fr);
  }

  .slex-home-page {
    padding: 5rem 2rem 7rem;
  }

  .slex-home-hero {
    gap: 4.5rem;
  }

  body[data-site-route="home"] > footer {
    display: none;
  }

  .slex-docs-sidebar {
    position: sticky;
    top: 5rem;
    display: block;
    max-height: calc(100vh - 6rem);
    overflow: auto;
    padding-right: 0.5rem;
    scrollbar-color: color-mix(in oklab, var(--muted-foreground) 42%, transparent) transparent;
    scrollbar-width: thin;
  }
}

@media (min-width: 1280px) {
  .slex-docs-shell {
    grid-template-columns: minmax(16rem, 19rem) minmax(0, 58rem) minmax(10rem, 13rem);
    width: min(100%, 106rem);
    gap: 2.5rem;
  }

  .slex-docs-shell-main {
    max-width: none;
  }

  .slex-docs-shell > .slex-doc-detail-rail {
    position: sticky;
    top: 5rem;
    display: block;
    margin-top: 0;
  }

  .slex-docs-shell-main .slex-doc-detail-header {
    display: none;
  }

  .slex-docs-layout {
    grid-template-columns: 17rem minmax(0, 1fr) 14rem;
  }

  .slex-docs-toc {
    position: sticky;
    top: 5rem;
    display: block;
    border-left: 1px solid var(--border);
  }
}

@media (max-width: 1023px) {
  .slex-docs-shell {
    padding: 1rem;
  }

  .slex-docs-shell-sidebar {
    display: contents;
  }

  .slex-docs-shell-main .slex-doc-detail-header {
    justify-content: flex-start;
    margin-top: 0.5rem;
  }

  .slex-static-prose {
    width: 100%;
  }

  .slex-home-page {
    padding-top: 4rem;
  }

  .slex-home-title {
    font-size: 4.25rem;
  }
}

@media (max-width: 480px) {
  .slex-docs-shell {
    padding-inline: 0.75rem;
  }

  .slex-static-page,
  .slex-docs-layout {
    padding-inline: 0.75rem;
  }

  .slex-home-page {
    padding: 3rem 1rem 4rem;
  }

  .slex-home-brand-lockup {
    gap: 0.75rem;
  }

  .slex-home-brand-logo {
    width: 2.45rem;
    height: 2.45rem;
    transform: none;
  }

  .slex-home-title {
    font-size: 3rem;
  }

  .slex-home-expanded-name {
    font-size: 1.0625rem;
  }

  .slex-home-lede {
    font-size: 1rem;
  }
}

.slex-toc {
  min-width: 0;
  color: var(--muted-foreground);
  font-size: 0.875rem;
}

.slex-toc-label {
  margin-bottom: 0.5rem;
  color: var(--muted-foreground);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: uppercase;
}

.slex-toc-list {
  display: grid;
  gap: 0.25rem;
}

.slex-toc-link {
  display: block;
  border-radius: calc(var(--radius) - 2px);
  color: var(--muted-foreground);
  padding: 0.375rem 0.5rem;
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease;
}

.slex-toc-link:hover,
.slex-toc-link--active {
  background: var(--accent);
  color: var(--accent-foreground);
}

.slex-toc-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

.slex-toc[data-orientation="horizontal"] {
  overflow-x: auto;
}

.slex-toc[data-orientation="horizontal"] .slex-toc-list {
  display: flex;
  width: max-content;
  min-width: 100%;
  gap: 0.25rem;
}

.slex-toc[data-orientation="horizontal"] .slex-toc-link {
  flex-shrink: 0;
  white-space: nowrap;
}

.slex-catalog {
  min-width: 0;
  color: var(--muted-foreground);
}

.slex-catalog-header {
  display: flex;
  min-height: 2rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.75rem;
}

.slex-catalog-label {
  color: var(--foreground);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.25;
}

.slex-catalog-count {
  color: var(--muted-foreground);
  font-size: 0.8125rem;
  line-height: 1.25;
}

.slex-catalog-list {
  display: grid;
  gap: 1rem;
  padding-top: 1rem;
}

.slex-catalog-section {
  display: grid;
  gap: 0.25rem;
}

.slex-catalog-group {
  display: flex;
  min-height: 1.5rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0 0.625rem;
  color: var(--muted-foreground);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0;
}

.slex-catalog-group-count {
  color: color-mix(in oklab, var(--muted-foreground) 72%, transparent);
  font-size: 0.6875rem;
  font-weight: 600;
}

.slex-catalog-section-list {
  display: grid;
  gap: 0.125rem;
}

.slex-catalog-item {
  display: flex;
  min-height: 2.125rem;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-radius: var(--radius);
  color: var(--muted-foreground);
  padding: 0.375rem 0.625rem;
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

.slex-catalog-item:hover,
.slex-catalog-item--active {
  background: var(--accent);
  color: var(--accent-foreground);
}

.slex-catalog-item--active {
  color: var(--foreground);
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--border) 60%, transparent);
}

.slex-catalog-item:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

.slex-catalog-title {
  min-width: 0;
  overflow: hidden;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.slex-catalog-status {
  flex-shrink: 0;
  color: var(--muted-foreground);
  font-size: 0.6875rem;
}

@media (max-width: 1279px) {
  .slex-doc-detail-rail {
    display: none !important;
  }
}

@media (max-width: 480px) {
  .slex-catalog-header,
  .slex-catalog-group,
  .slex-catalog-item {
    gap: 0.5rem;
  }

  .slex-catalog-title {
    white-space: normal;
  }
}

.slex-doc-detail-layout {
  display: grid;
  gap: 2rem;
  align-items: start;
}

.slex-doc-detail-content {
  min-width: 0;
}

.slex-doc-detail-rail {
  display: grid;
  gap: 0.875rem;
  align-self: start;
  color: var(--muted-foreground);
  font-size: 0.8125rem;
}

.slex-doc-detail-rail-title {
  margin-bottom: 0.625rem;
  color: var(--muted-foreground);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.2;
  padding-left: 0.75rem;
}

.slex-doc-detail-toc {
  display: grid;
  gap: 0.375rem;
  border-left: 1px solid var(--border);
}

.slex-doc-detail-toc-link {
  position: relative;
  display: flex;
  min-height: 1.5rem;
  align-items: center;
  border-left: 1px solid transparent;
  background: transparent;
  color: var(--muted-foreground);
  margin-left: -1px;
  padding-left: 0.75rem;
  line-height: 1.35;
  text-decoration: none;
  transition: color 150ms ease;
}

.slex-doc-detail-toc-link::before {
  content: none;
}

.slex-doc-detail-toc-link:hover,
.slex-doc-detail-toc-link--active {
  color: var(--foreground);
}

.slex-doc-detail-toc-link--active {
  border-left-color: var(--foreground);
  font-weight: 500;
}

.slex-doc-detail-actions {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 0.25rem;
}

.slex-doc-detail-actions--rail {
  display: grid;
  width: 100%;
  gap: 0.25rem;
  justify-items: start;
  margin-top: 0.625rem;
  border-top: 1px solid var(--border);
  padding-top: 0.75rem;
  padding-left: 0.75rem;
}

.slex-doc-detail-copy-action {
  position: relative;
  display: inline-flex;
}

.slex-doc-detail-action {
  display: inline-flex;
  min-height: 2rem;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border: 0;
  border-radius: calc(var(--radius) - 2px);
  background: transparent;
  color: var(--muted-foreground);
  padding: 0 0.5rem;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: background 150ms ease, color 150ms ease;
}

.slex-doc-detail-actions--rail .slex-doc-detail-action {
  min-height: 1.875rem;
  justify-content: flex-start;
  padding: 0 0.375rem;
}

.slex-doc-detail-action-icon {
  display: inline-flex;
  width: 0.875rem;
  height: 0.875rem;
  flex: 0 0 auto;
  color: currentColor;
}

.slex-doc-detail-action-icon svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
}

.slex-doc-detail-copy-feedback {
  position: absolute;
  bottom: calc(100% + 0.375rem);
  left: 50%;
  z-index: 20;
  width: max-content;
  max-width: min(12rem, calc(100vw - 2rem));
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) - 2px);
  background: var(--popover);
  color: var(--popover-foreground);
  padding: 0.375rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.25;
  box-shadow: var(--shadow-sm);
  pointer-events: none;
  transform: translateX(-50%);
  white-space: nowrap;
}

.slex-doc-detail-copy-feedback:empty {
  display: none;
}

.slex-doc-detail-copy-feedback[data-state="success"] {
  color: var(--popover-foreground);
}

.slex-doc-detail-copy-feedback[data-state="error"] {
  color: var(--destructive);
}

.slex-doc-detail-action:hover {
  background: var(--accent);
  color: var(--foreground);
}

.slex-doc-detail-action:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

@media (min-width: 1280px) {
  .slex-doc-detail-layout {
    grid-template-columns: minmax(0, 1fr) 15rem;
  }

  .slex-doc-detail-rail {
    position: sticky;
    top: 5rem;
  }
}

.slex-page {
  display: grid;
  width: calc(100% - 2rem);
  min-width: 0;
  gap: 3rem;
  margin: 0 auto;
  padding: 3rem 0;
}

.slex-page[data-density="compact"] {
  gap: 2rem;
}

.slex-heading,
.slex-section-header {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}

.slex-heading-eyebrow,
.slex-section-eyebrow {
  color: var(--muted-foreground);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: uppercase;
}

.slex-heading-meta {
  color: var(--muted-foreground);
  font-family: var(--font-mono, "Geist Mono", "Noto Sans Mono", "Noto Sans Mono CJK SC", "SFMono-Regular", "Cascadia Code", Consolas, monospace);
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: uppercase;
}

.slex-heading-title,
.slex-section-title {
  margin: 0;
  color: var(--foreground);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.slex-heading[data-level="1"] .slex-heading-title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height: 1;
}

.slex-heading[data-level="2"] .slex-heading-title,
.slex-section-title {
  font-size: 1.5rem;
}

.slex-heading[data-level="3"] .slex-heading-title {
  font-size: 1.25rem;
}

.slex-heading[data-level="4"] .slex-heading-title,
.slex-heading[data-level="5"] .slex-heading-title,
.slex-heading[data-level="6"] .slex-heading-title {
  font-size: 1rem;
}

.slex-heading-subtitle,
.slex-section-subtitle,
.slex-paragraph {
  margin: 0;
  color: var(--muted-foreground);
  font-size: 0.9375rem;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.slex-paragraph[data-tone="lead"] {
  font-size: 1.0625rem;
  line-height: 1.75;
}

.slex-list {
  display: grid;
  gap: 0.5rem;
  margin: 0;
  padding-left: 1.25rem;
  color: var(--foreground);
  font-size: 0.875rem;
  line-height: 1.6;
}

.slex-list-description {
  display: block;
  margin-top: 0.125rem;
  color: var(--muted-foreground);
}

.slex-hero {
  display: grid;
  min-width: 0;
  align-items: center;
  gap: 2rem;
}

.slex-hero[data-align="split"] {
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr);
}

.slex-hero[data-align="center"] {
  justify-items: center;
  text-align: center;
}

.slex-hero-copy {
  min-width: 0;
}

.slex-hero-eyebrow {
  color: var(--muted-foreground);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0;
}

.slex-hero-title {
  margin: 0.75rem 0 0;
  color: var(--foreground);
  font-size: clamp(2.5rem, 6vw, 4rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.slex-hero-subtitle {
  max-width: 38rem;
  margin: 1rem 0 0;
  color: var(--muted-foreground);
  font-size: 1.125rem;
  line-height: 1.7;
}

.slex-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
  margin-top: 1.75rem;
}

.slex-hero[data-align="center"] .slex-hero-actions {
  justify-content: center;
}

.slex-hero-action {
  display: inline-flex;
  min-height: 2.5rem;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: var(--radius);
  padding: 0 0.875rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.slex-hero-action--primary {
  border-color: var(--primary);
  background: var(--primary);
  color: var(--primary-foreground);
}

.slex-hero-action--primary:hover {
  background: color-mix(in oklab, var(--primary) 90%, var(--background));
}

.slex-hero-action--secondary {
  border-color: var(--input);
  background: var(--background);
  color: var(--foreground);
  box-shadow: var(--shadow-sm);
}

.slex-hero-action--secondary:hover {
  background: var(--accent);
  color: var(--accent-foreground);
}

.slex-hero-action:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 24%, transparent);
}

.slex-hero-media {
  min-width: 0;
}

.slex-page--site-home .slex-hero {
  gap: clamp(1.5rem, 3vw, 2.25rem);
  min-height: clamp(620px, calc(100svh - 7rem), 760px);
}

@media (min-width: 1024px) {
  .slex-page--site-home .slex-hero[data-align="split"] {
    grid-template-columns: minmax(320px, 0.66fr) minmax(600px, 1.34fr);
  }
}

.slex-page--site-home .slex-hero-eyebrow {
  text-transform: none;
}

.slex-page--site-home .slex-hero-media {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.slex-page--site-home .slex-playground {
  overflow: hidden;
  border: 1px solid color-mix(in oklab, var(--border) 62%, transparent);
  border-radius: calc(var(--radius) + 6px);
  background: var(--background);
  box-shadow: 0 14px 44px color-mix(in oklab, var(--foreground) 7%, transparent);
}

.slex-page--site-home .slex-playground,
.slex-page--site-home .slex-playground-preview-pane,
.slex-page--site-home .slex-playground-code-pane,
.slex-page--site-home .slex-playground-code,
.slex-page--site-home .slex-playground-live-pane,
.slex-page--site-home .slex-playground-code-scroll {
  height: auto;
  min-height: 0 !important;
}

.slex-page--site-home .slex-playground-editor,
.slex-page--site-home .slex-playground-editor.codemirror,
.slex-page--site-home .slex-playground-editor .cm-editor,
.slex-page--site-home .slex-playground-editor .cm-scroller {
  height: 100%;
}

.slex-page--site-home .slex-playground-preview-pane {
  background:
    linear-gradient(90deg, color-mix(in oklab, var(--muted) 38%, transparent) 1px, transparent 1px),
    linear-gradient(0deg, color-mix(in oklab, var(--muted) 38%, transparent) 1px, transparent 1px);
  background-size: 32px 32px;
  overflow: visible;
  padding: 2.5rem 1.5rem 1.5rem;
}

.slex-page--site-home .slex-playground-live-code,
.slex-page--site-home .slex-playground-live-preview {
  min-height: 0;
}

.slex-page--site-home .slex-playground-preview {
  width: min(100%, 980px);
}

.slex-formula-line {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: color-mix(in oklab, var(--muted) 72%, transparent);
  padding: 0.75rem 0.875rem;
  font-family: var(--font-mono, "Geist Mono", "Noto Sans Mono", "Noto Sans Mono CJK SC", "SFMono-Regular", "Cascadia Code", Consolas, monospace);
  color: var(--foreground);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.slex-rule-mark {
  display: block;
  width: 3.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: var(--primary);
  font-size: 0;
  line-height: 0;
}

.slex-rule-mark--success {
  background: var(--success);
}

.slex-rule-mark--warning {
  background: var(--warning);
}

.slex-skeleton-mark {
  display: block;
  height: 2rem;
  border-radius: calc(var(--radius) - 2px);
  background:
    linear-gradient(90deg, var(--muted) 0 31%, transparent 31% 34%, var(--muted) 34% 65%, transparent 65% 68%, var(--muted) 68% 100%);
  font-size: 0;
  line-height: 0;
}

.slex-diagram,
.slex-swatch {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: calc(var(--radius) + 2px);
  color: transparent;
  font-size: 0;
  line-height: 0;
}

.slex-swatch {
  height: 4rem;
  border-radius: calc(var(--radius) - 2px);
  background: var(--primary);
}

.slex-swatch[data-tone="info"] { background: var(--info); }
.slex-swatch[data-tone="success"] { background: var(--success); }
.slex-swatch[data-tone="warning"] { background: var(--warning); }
.slex-swatch[data-tone="destructive"] { background: var(--destructive); }
.slex-swatch[data-tone="neutral"] { background: var(--muted); }

.slex-diagram[data-kind="philosophy"] {
  min-height: 10rem;
  border: 1px solid var(--border);
  background:
    radial-gradient(circle at 50% 50%, var(--primary) 0 0.45rem, transparent 0.5rem),
    radial-gradient(circle at 28% 36%, color-mix(in oklab, var(--info) 85%, white) 0 0.35rem, transparent 0.4rem),
    radial-gradient(circle at 72% 36%, color-mix(in oklab, var(--success) 85%, white) 0 0.35rem, transparent 0.4rem),
    radial-gradient(circle at 50% 76%, color-mix(in oklab, var(--warning) 85%, white) 0 0.35rem, transparent 0.4rem),
    repeating-radial-gradient(circle at 50% 50%, transparent 0 2.35rem, color-mix(in oklab, var(--border) 70%, transparent) 2.4rem 2.45rem),
    var(--background);
}

.slex-diagram[data-kind="philosophy"]::before,
.slex-diagram[data-kind="philosophy"]::after {
  position: absolute;
  color: var(--muted-foreground);
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0;
  line-height: 1;
}

.slex-diagram[data-kind="philosophy"]::before {
  content: "RUNNABLE";
  left: 1rem;
  top: 1rem;
}

.slex-diagram[data-kind="philosophy"]::after {
  content: "CONVERGENT";
  right: 1rem;
  bottom: 1rem;
}

.slex-diagram[data-kind="markdown"],
.slex-diagram[data-kind="fence"],
.slex-diagram[data-kind="cards"] {
  height: 4.75rem;
  background: var(--muted);
}

.slex-diagram[data-kind="type"],
.slex-diagram[data-kind="icon"],
.slex-diagram[data-kind="font-sample"],
.slex-diagram[data-kind="alignment"] {
  min-height: 3.25rem;
  border-radius: calc(var(--radius) - 2px);
  background: var(--muted);
}

.slex-diagram[data-kind="type"]::before,
.slex-diagram[data-kind="type"]::after,
.slex-diagram[data-kind="alignment"]::before,
.slex-diagram[data-kind="alignment"]::after {
  content: "";
  position: absolute;
  left: 0.75rem;
  border-radius: 999px;
  background: var(--primary);
}

.slex-diagram[data-kind="type"]::before {
  top: 0.75rem;
  width: 4rem;
  height: 0.5rem;
}

.slex-diagram[data-kind="type"]::after {
  top: 1.5rem;
  width: 3rem;
  height: 0.45rem;
  background: var(--muted-foreground);
  box-shadow: 0 0.75rem 0 -0.05rem var(--muted-foreground);
}

.slex-diagram[data-kind="alignment"]::before {
  top: 1rem;
  width: 8rem;
  height: 0.4rem;
}

.slex-diagram[data-kind="alignment"]::after {
  top: 1.75rem;
  width: 6rem;
  height: 0.35rem;
  background: var(--muted-foreground);
}

.slex-diagram[data-kind="icon"]::before {
  content: "<> check close";
  position: absolute;
  left: 0.75rem;
  top: 0.9rem;
  color: var(--muted-foreground);
  font-size: 0.875rem;
  letter-spacing: 0;
  line-height: 1.2;
}

.slex-diagram[data-kind="font-sample"] {
  display: grid;
  min-height: 6.5rem;
  align-content: center;
  gap: 0.45rem;
  padding: 1rem;
  color: var(--foreground);
  font-size: 1rem;
  line-height: 1.3;
}

.slex-diagram[data-kind="font-sample"]::before,
.slex-diagram[data-kind="font-sample"]::after {
  display: block;
  letter-spacing: 0;
}

.slex-diagram[data-kind="font-sample"]::before {
  content: "SlexKit";
  font-size: 2rem;
  font-weight: 760;
}

.slex-diagram[data-kind="font-sample"]::after {
  content: "文档即工具，工具即文档";
  color: var(--muted-foreground);
  font-size: 1rem;
  font-weight: 500;
}

.slex-diagram[data-kind="state"] {
  height: 7rem;
  border: 1px solid var(--border);
  background:
    linear-gradient(var(--muted-foreground), var(--muted-foreground)) left 1rem top 1rem / 7rem 0.45rem no-repeat,
    linear-gradient(var(--info), var(--info)) left 10rem top 1rem / 7rem 0.45rem no-repeat,
    linear-gradient(var(--success), var(--success)) left 19rem top 1rem / 7rem 0.45rem no-repeat,
    linear-gradient(var(--border), var(--border)) left 1rem top 2.35rem / calc(100% - 2rem) 1px no-repeat,
    linear-gradient(var(--muted), var(--muted)) left 1rem top 3.15rem / calc(100% - 2rem) 0.8rem no-repeat,
    linear-gradient(var(--muted), var(--muted)) left 1rem top 4.55rem / calc(100% - 2rem) 0.8rem no-repeat,
    var(--background);
}

.slex-diagram[data-kind="markdown"]::before,
.slex-diagram[data-kind="fence"]::before,
.slex-diagram[data-kind="cards"]::before {
  content: "";
  position: absolute;
  inset: 0.9rem;
  border-radius: var(--radius);
}

.slex-diagram[data-kind="markdown"]::before {
  background:
    linear-gradient(var(--foreground), var(--foreground)) left 0 top 0 / 42% 0.45rem no-repeat,
    linear-gradient(var(--muted-foreground), var(--muted-foreground)) left 0 top 1.1rem / 82% 0.32rem no-repeat,
    linear-gradient(var(--muted-foreground), var(--muted-foreground)) left 0 top 1.8rem / 68% 0.32rem no-repeat;
}

.slex-diagram[data-kind="fence"]::before {
  border: 1px solid var(--border);
  background:
    linear-gradient(var(--info), var(--info)) left 0.7rem top 0.75rem / 4.5rem 0.38rem no-repeat,
    linear-gradient(var(--muted-foreground), var(--muted-foreground)) left 0.7rem top 1.65rem / 72% 0.28rem no-repeat,
    linear-gradient(var(--muted-foreground), var(--muted-foreground)) left 0.7rem top 2.3rem / 58% 0.28rem no-repeat,
    var(--background);
}

.slex-diagram[data-kind="cards"]::before {
  background:
    linear-gradient(var(--background), var(--background)) left 0 top 0 / 31% 100% no-repeat,
    linear-gradient(var(--background), var(--background)) left 50% top 0 / 31% 100% no-repeat,
    linear-gradient(var(--background), var(--background)) right 0 top 0 / 31% 100% no-repeat;
}

.slex-card--dashboard-shell {
  width: 100%;
  min-height: 30rem;
  padding: 1.5rem;
  border-radius: calc(var(--radius) + 6px);
  background:
    linear-gradient(90deg, color-mix(in oklab, var(--muted) 55%, transparent) 0 13rem, transparent 13rem),
    var(--card);
}

.slex-card--dashboard-shell > .slex-card-body {
  gap: 1.25rem;
}

.slex-card--dashboard-shell .slex-grid > * {
  min-width: 0;
}

.slex-card--dashboard-shell .slex-demo-span-2 {
  grid-column: span 2;
}

.slex-card--dashboard-shell .slex-stat {
  min-width: 0;
  padding: 0.875rem;
}

.slex-card--dashboard-shell .slex-stat-value {
  font-size: 1.35rem;
}

.slex-card--dashboard-shell .slex-stat-number {
  overflow-wrap: normal;
  word-break: keep-all;
}

.slex-demo-topbar {
  justify-content: space-between;
  border-bottom: 1px solid var(--border);
  padding-bottom: 1rem;
}

.slex-card--dashboard-panel {
  min-width: 0;
  min-height: 12rem;
  padding: 1rem;
  border-radius: var(--radius);
}

.slex-card--dashboard-panel .slex-card-title {
  margin-bottom: 0.625rem;
  padding-bottom: 0;
  border-bottom: 0;
  font-size: 0.9375rem;
}

.slex-card--dashboard-panel .slex-table {
  font-size: 0.8125rem;
}

.slex-dashboard-side {
  display: grid;
  min-width: 0;
  gap: 0.875rem;
}

@media (max-width: 767px) {
  .slex-card--dashboard-shell .slex-demo-span-2 {
    grid-column: auto;
  }
}

.slex-page--site-home .slex-section-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.slex-page--site-home .slex-section-action {
  grid-column: 2;
  grid-row: 1 / span 3;
  align-self: end;
}

.slex-page--site-home .slex-section-title,
.slex-page--site-design .slex-section-title {
  font-size: 1.5rem;
}

.slex-page--site-design {
  gap: 0;
}

.slex-design-shell {
  display: grid;
  gap: 2rem;
}

@media (min-width: 1024px) {
  .slex-design-shell {
    grid-template-columns: 13.75rem minmax(0, 1fr);
    align-items: start;
  }

  .slex-design-sidebar {
    position: sticky;
    top: 5rem;
  }
}

.slex-design-content {
  display: grid;
  gap: 2.5rem;
  min-width: 0;
}

.slex-page--site-design .slex-section {
  scroll-margin-top: 5.5rem;
}

.slex-card--rule,
.slex-card--swatch,
.slex-card--sample,
.slex-card--evidence,
.slex-page--site-home .slex-section .slex-card {
  min-height: 11rem;
}

.slex-card--rule .slex-card-title,
.slex-card--swatch .slex-card-title,
.slex-card--sample .slex-card-title,
.slex-card--evidence .slex-card-title,
.slex-page--site-home .slex-section .slex-card .slex-card-title {
  margin-top: 0.75rem;
  margin-bottom: 0.5rem;
  border-bottom: 0;
  padding-bottom: 0;
  font-size: 1rem;
}

.slex-card--swatch .slex-card-body {
  gap: 0.75rem;
}

.slex-card--evidence {
  background: color-mix(in oklab, var(--card) 88%, var(--muted));
}

.slex-card--evidence .slex-text--eyebrow {
  font-family: var(--font-mono, "Geist Mono", "Noto Sans Mono", "Noto Sans Mono CJK SC", "SFMono-Regular", "Cascadia Code", Consolas, monospace);
  text-transform: none;
}

@media (max-width: 900px) {
  .slex-hero[data-align="split"] {
    grid-template-columns: 1fr;
  }
}

.slex-doc-detail {
  min-width: 0;
  color: var(--foreground);
}

.slex-doc-detail-header {
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 1.25rem;
}

.slex-doc-detail-title {
  margin: 0.75rem 0 0;
  color: var(--foreground);
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.slex-doc-detail-summary {
  max-width: 45rem;
  margin: 0.5rem 0 0;
  color: var(--muted-foreground);
  font-size: 0.9375rem;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.slex-doc-prose {
  min-width: 0;
  max-width: 54rem;
  color: var(--foreground);
}

.slex-page--site-design .slex-doc-prose {
  max-width: none;
}

.slex-doc-streamdown {
  min-width: 0;
}

.slex-doc-streamdown li > p {
  display: inline;
  margin: 0;
}

.slex-doc-streamdown li > p + :is(.katex-display, pre, blockquote, ul, ol) {
  margin-top: 0.5rem;
}

.slex-doc-prose .slex-doc-slexkit-demo {
  width: 100% !important;
  max-width: none !important;
  margin: 1rem 0 1.5rem !important;
}

.slex-doc-prose .slex-doc-slexkit-demo--playground {
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  background: var(--card) !important;
  padding: 1rem !important;
  box-shadow: var(--shadow-sm);
}

.slex-doc-prose .slex-doc-slexkit-demo--component {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.slex-page--site-design .slex-doc-prose .slex-doc-slexkit-demo,
.slex-doc-prose [data-markdown-doc="design"] .slex-doc-slexkit-demo {
  margin: 1rem 0 1.75rem !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none;
}

.slex-doc-prose .slex-doc-slexkit-demo [data-streamdown="code-block-header"],
.slex-doc-prose .slex-doc-slexkit-demo .slex-streamdown-toolbar {
  display: none !important;
}

.slex-doc-prose .slex-doc-slexkit-demo .slex-streamdown-body {
  padding: 0;
}

.slex-doc-prose .slex-doc-slexkit-demo .slexkit-root {
  min-width: 0;
}

.slex-page--site-design .slex-doc-prose h1 {
  max-width: 48rem;
  margin: 0 0 0.625rem;
  color: var(--foreground);
  font-size: 1.75rem;
  font-weight: 760;
  line-height: 1.18;
  letter-spacing: 0;
}

.slex-page--site-design .slex-doc-prose h2 {
  margin-top: 2.25rem;
  font-size: 1.45rem;
}

.slex-page--site-design .slex-doc-prose p {
  max-width: 58rem;
  font-size: 0.9375rem;
}

.slex-page--site-design .slex-doc-slexkit-demo .slex-card {
  min-height: 0;
  border-color: color-mix(in oklab, var(--border) 78%, transparent);
  border-radius: var(--radius);
  background: var(--card);
  padding: 1rem;
  box-shadow: none;
}

.slex-page--site-design .slex-doc-slexkit-demo .slex-card:hover {
  border-color: var(--border);
  box-shadow: none;
}

.slex-page--site-design .slex-doc-slexkit-demo .slex-card .slex-card-body {
  gap: 0.75rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-card-title {
  margin: 0;
  border-bottom: 0;
  padding-bottom: 0;
  color: var(--foreground);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.25;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-swatch {
  order: -1;
  height: 4.5rem;
  border-radius: calc(var(--radius) - 2px);
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-diagram[data-kind="type"],
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-diagram[data-kind="icon"],
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-diagram[data-kind="font-sample"],
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-diagram[data-kind="alignment"] {
  min-height: 4.25rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-diagram[data-kind="font-sample"] {
  min-height: 6.5rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-text,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-column .slex-text {
  color: var(--muted-foreground);
  font-size: 0.875rem;
  line-height: 1.6;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-heading-eyebrow {
  color: var(--muted-foreground);
  font-family: var(--font-mono, "Geist Mono", "Noto Sans Mono", "Noto Sans Mono CJK SC", "SFMono-Regular", "Cascadia Code", Consolas, monospace);
  font-size: 0.7rem;
  font-weight: 600;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-heading {
  gap: 0.35rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-heading-title {
  color: var(--foreground);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.25;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-heading-meta {
  color: color-mix(in oklab, var(--muted-foreground) 72%, transparent);
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-diagram[data-kind="philosophy"] + .slex-grid .slex-card .slex-card-body {
  gap: 0.5rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-card-title {
  margin-bottom: 0.75rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-stat {
  min-height: 0;
  padding: 0.7rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-stat-label {
  font-size: 0.7rem;
  text-transform: none;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-stat-value {
  font-size: 1.125rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-stat-unit {
  font-size: 0.72rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-diagram[data-kind="philosophy"] + .slex-grid {
  margin-top: 0.75rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-doc-slexkit-demo .slex-card .slex-badge {
  margin-top: 0.125rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--mini,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--gate,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--tone,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--swatch-mini {
  min-height: 0;
  padding: 1rem;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--gate,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--tone {
  min-height: 9.25rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--mini .slex-card-body,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--gate .slex-card-body,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--tone .slex-card-body,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--swatch-mini .slex-card-body {
  gap: 0.75rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--mini .slex-card-title,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--gate .slex-card-title,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--tone .slex-card-title,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--swatch-mini .slex-card-title {
  margin: 0;
  padding-bottom: 0;
  border-bottom: 0;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.25;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--mini .slex-text,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--gate .slex-text,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--tone .slex-text,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--swatch-mini .slex-text {
  color: var(--muted-foreground);
  font-size: 0.875rem;
  line-height: 1.55;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--swatch-mini .slex-swatch {
  height: 3.25rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-card--tone .slex-badge {
  margin-top: 0.125rem;
}

:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-grid + .slex-grid,
:where(.slex-page--site-design, .slex-docs-markdown[data-markdown-doc="design"]) .slex-grid + .slex-diagram {
  margin-top: 0.75rem;
}

.slex-doc-prose .slex-doc-streamdown [data-streamdown="code-block"] {
  width: 100% !important;
  max-width: none !important;
  margin: 1rem 0 !important;
  gap: 0.375rem !important;
  border-color: var(--border) !important;
  border-radius: var(--radius) !important;
  background: var(--card) !important;
  padding: 0.5rem !important;
  box-shadow: var(--shadow-sm);
}

.slex-doc-playground-inline {
  display: block;
  width: 100%;
  margin: 1rem 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--background);
  box-shadow: var(--shadow-sm);
}

.slex-doc-prose .slex-doc-streamdown [data-streamdown="code-block-header"] {
  height: auto !important;
  min-height: 1.5rem;
  padding: 0 0.25rem;
  color: var(--muted-foreground) !important;
  font-size: 0.75rem !important;
}

.slex-doc-prose .slex-doc-streamdown [data-streamdown="code-block-body"] {
  border-color: var(--border) !important;
  border-radius: calc(var(--radius) - 2px) !important;
  background: var(--muted) !important;
  padding: 0.875rem !important;
}

.slex-doc-prose .slex-doc-streamdown [data-streamdown="code-block"] pre {
  margin: 0;
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.slex-doc-prose h2 {
  margin: 2rem 0 0.75rem;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.5rem;
  color: var(--foreground);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0;
}

.slex-doc-prose h2:first-child {
  margin-top: 0;
}

.slex-doc-prose h3 {
  margin: 1.25rem 0 0.5rem;
  color: var(--foreground);
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.35;
  letter-spacing: 0;
}

.slex-doc-prose p,
.slex-doc-prose li {
  color: var(--muted-foreground);
  font-size: 0.9375rem;
  line-height: 1.7;
}

.slex-doc-prose p {
  max-width: 48rem;
  margin: 0.75rem 0;
}

.slex-doc-prose ul,
.slex-doc-prose ol {
  display: grid;
  gap: 0.25rem;
  margin: 0.75rem 0;
  padding-left: 1.25rem;
}

.slex-doc-prose pre {
  overflow: auto;
  margin: 1rem 0;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--muted);
  color: var(--foreground);
  padding: 1rem;
  box-shadow: var(--shadow-sm);
}

.slex-doc-prose pre.slex-markdown-code {
  --slex-code-keyword: color-mix(in oklab, var(--info) 82%, var(--foreground));
  --slex-code-name: color-mix(in oklab, var(--foreground) 84%, var(--muted-foreground));
  --slex-code-string: color-mix(in oklab, var(--success) 82%, var(--foreground));
  --slex-code-literal: color-mix(in oklab, var(--warning) 82%, var(--foreground));
  --slex-code-function: color-mix(in oklab, var(--info) 64%, var(--foreground));
  --slex-code-punctuation: color-mix(in oklab, var(--muted-foreground) 82%, var(--foreground));
  --slex-code-comment: color-mix(in oklab, var(--muted-foreground) 76%, transparent);
}

.slex-doc-prose .slex-markdown-code .hljs {
  display: block;
  overflow-x: auto;
  background: transparent;
  color: inherit;
  padding: 0;
}

.slex-doc-prose .slex-markdown-code :where(.hljs-comment, .hljs-quote) {
  color: var(--slex-code-comment);
  font-style: italic;
}

.slex-doc-prose .slex-markdown-code :where(.hljs-keyword, .hljs-selector-tag, .hljs-built_in, .hljs-type) {
  color: var(--slex-code-keyword);
}

.slex-doc-prose .slex-markdown-code :where(.hljs-title, .hljs-title.function_, .hljs-title.class_, .hljs-section) {
  color: var(--slex-code-function);
}

.slex-doc-prose .slex-markdown-code :where(.hljs-name, .hljs-attribute, .hljs-attr, .hljs-property, .hljs-variable) {
  color: var(--slex-code-name);
}

.slex-doc-prose .slex-markdown-code :where(.hljs-number, .hljs-literal, .hljs-symbol, .hljs-bullet) {
  color: var(--slex-code-literal);
}

.slex-doc-prose .slex-markdown-code :where(.hljs-string, .hljs-regexp, .hljs-link) {
  color: var(--slex-code-string);
}

.slex-doc-prose .slex-markdown-code :where(.hljs-punctuation, .hljs-operator, .hljs-subst) {
  color: var(--slex-code-punctuation);
}

.slex-doc-prose code {
  font-family: var(--font-mono, "Geist Mono", "Noto Sans Mono", "Noto Sans Mono CJK SC", "SFMono-Regular", "Cascadia Code", Consolas, monospace);
  font-size: 0.8125rem;
}

.slex-doc-prose :not(pre) > code {
  border: 1px solid var(--border);
  border-radius: calc(var(--radius) - 4px);
  background: var(--muted);
  color: var(--foreground);
  padding: 0.0625rem 0.25rem;
}

.slex-doc-prose table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
  margin: 1rem 0;
  border-collapse: collapse;
  color: var(--foreground);
  font-size: 0.875rem;
}

.slex-doc-prose th,
.slex-doc-prose td {
  border: 1px solid var(--border);
  padding: 0.625rem 0.75rem;
  text-align: left;
  vertical-align: top;
}

.slex-doc-prose th {
  background: var(--muted);
  color: var(--muted-foreground);
  font-weight: 650;
}

@media (max-width: 640px) {
  .slex-heading[data-level="1"] .slex-heading-title,
  .slex-hero-title {
    font-size: 2.5rem;
  }

  .slex-hero {
    gap: 1.5rem;
  }

  .slex-hero-subtitle {
    font-size: 1rem;
  }

  .slex-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .slex-hero-action {
    width: 100%;
  }

  .slex-page--site-home .slex-hero {
    min-height: auto;
  }

  .slex-page--site-home .slex-section-header {
    grid-template-columns: 1fr;
  }

  .slex-page--site-home .slex-section-action {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
  }

  .slex-doc-detail-title {
    font-size: 1.5rem;
  }

  .slex-doc-prose pre {
    padding: 0.875rem;
  }

  .slex-page--site-design .slex-doc-slexkit-demo .slex-row--balanced-tiles[data-tile-kind="stat"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .slex-page--site-design .slex-doc-slexkit-demo .slex-row--balanced-tiles[data-tile-kind="stat"] > .slex-stat {
    grid-column: auto !important;
  }

  .slex-page--site-design
    .slex-doc-slexkit-demo
    .slex-row--balanced-tiles[data-tile-kind="stat"]
    > .slex-stat:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
  }

  .slex-diagram[data-kind="philosophy"] {
    background:
      radial-gradient(circle at 50% 50%, var(--primary) 0 0.45rem, transparent 0.5rem),
      radial-gradient(circle at 28% 38%, color-mix(in oklab, var(--info) 85%, white) 0 0.35rem, transparent 0.4rem),
      radial-gradient(circle at 72% 38%, color-mix(in oklab, var(--success) 85%, white) 0 0.35rem, transparent 0.4rem),
      radial-gradient(circle at 50% 75%, color-mix(in oklab, var(--warning) 85%, white) 0 0.35rem, transparent 0.4rem),
      radial-gradient(
        circle at 50% 50%,
        transparent 0 1.85rem,
        color-mix(in oklab, var(--border) 70%, transparent) 1.9rem 1.95rem,
        transparent 2rem 3.7rem,
        color-mix(in oklab, var(--border) 70%, transparent) 3.75rem 3.8rem,
        transparent 3.85rem 5.45rem,
        color-mix(in oklab, var(--border) 70%, transparent) 5.5rem 5.55rem,
        transparent 5.6rem
      ),
      var(--background);
  }

  .slex-diagram[data-kind="state"] {
    background:
      linear-gradient(var(--muted-foreground), var(--muted-foreground)) left 1rem top 1rem / 28% 0.45rem no-repeat,
      linear-gradient(var(--info), var(--info)) center top 1rem / 28% 0.45rem no-repeat,
      linear-gradient(var(--success), var(--success)) right 1rem top 1rem / 28% 0.45rem no-repeat,
      linear-gradient(var(--border), var(--border)) left 1rem top 2.35rem / calc(100% - 2rem) 1px no-repeat,
      linear-gradient(var(--muted), var(--muted)) left 1rem top 3.15rem / calc(100% - 2rem) 0.8rem no-repeat,
      linear-gradient(var(--muted), var(--muted)) left 1rem top 4.55rem / calc(100% - 2rem) 0.8rem no-repeat,
      var(--background);
  }
}

/* layer: properties */
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*, ::before, ::after, ::backdrop{--un-leading:initial;--un-bg-opacity:100%;--un-text-opacity:100%;--un-border-opacity:100%;--un-ring-opacity:100%;--un-ring-offset-opacity:100%;--un-space-y-reverse:initial;}}
@property --un-text-opacity{syntax:"<percentage>";inherits:false;initial-value:100%;}
@property --un-leading{syntax:"*";inherits:false;}
@property --un-border-opacity{syntax:"<percentage>";inherits:false;initial-value:100%;}
@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%;}
@property --un-ring-opacity{syntax:"<percentage>";inherits:false;initial-value:100%;}
@property --un-ring-offset-opacity{syntax:"<percentage>";inherits:false;initial-value:100%;}
@property --un-inset-ring-color{syntax:"*";inherits:false;}
@property --un-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}
@property --un-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}
@property --un-inset-shadow-color{syntax:"*";inherits:false;}
@property --un-ring-color{syntax:"*";inherits:false;}
@property --un-ring-inset{syntax:"*";inherits:false;}
@property --un-ring-offset-color{syntax:"*";inherits:false;}
@property --un-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}
@property --un-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0px;}
@property --un-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}
@property --un-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000;}
@property --un-shadow-color{syntax:"*";inherits:false;}
@property --un-backdrop-blur{syntax:"*";inherits:false;}
@property --un-backdrop-brightness{syntax:"*";inherits:false;}
@property --un-backdrop-contrast{syntax:"*";inherits:false;}
@property --un-backdrop-grayscale{syntax:"*";inherits:false;}
@property --un-backdrop-hue-rotate{syntax:"*";inherits:false;}
@property --un-backdrop-invert{syntax:"*";inherits:false;}
@property --un-backdrop-opacity{syntax:"*";inherits:false;}
@property --un-backdrop-saturate{syntax:"*";inherits:false;}
@property --un-backdrop-sepia{syntax:"*";inherits:false;}
@property --un-space-y-reverse{syntax:"*";inherits:false;initial-value:0;}
/* layer: theme */
:root, :host {
--spacing: 0.25rem;
--font-sans: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
--font-mono: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
--fontWeight-medium: 500;
--text-xs-fontSize: 0.75rem;
--text-xs-lineHeight: 1rem;
--fontWeight-semibold: 600;
--tracking-normal: 0em;
--radius-lg: 0.5rem;
--default-transition-timingFunction: cubic-bezier(0.4, 0, 0.2, 1);
--default-transition-duration: 150ms;
--radius-md: 0.375rem;
--text-sm-fontSize: 0.875rem;
--text-sm-lineHeight: 1.25rem;
--fontWeight-bold: 700;
--text-base-fontSize: 1rem;
--text-base-lineHeight: 1.5rem;
--text-lg-fontSize: 1.125rem;
--text-lg-lineHeight: 1.75rem;
--radius-DEFAULT: 0.25rem;
--radius-xs: 0.125rem;
--radius-sm: 0.25rem;
--radius-none: 0;
--colors-gray-500: oklch(55.1% 0.027 264.364);
--colors-red-500: oklch(63.7% 0.237 25.331);
--colors-orange-500: oklch(70.5% 0.213 47.604);
--colors-amber-500: oklch(76.9% 0.188 70.08);
--colors-yellow-500: oklch(79.5% 0.184 86.047);
--colors-lime-500: oklch(76.8% 0.233 130.85);
--colors-green-500: oklch(72.3% 0.219 149.579);
--colors-emerald-500: oklch(69.6% 0.17 162.48);
--colors-teal-500: oklch(70.4% 0.14 182.503);
--colors-cyan-500: oklch(71.5% 0.143 215.221);
--colors-sky-500: oklch(68.5% 0.169 237.323);
--colors-blue-500: oklch(62.3% 0.214 259.815);
--colors-indigo-500: oklch(58.5% 0.233 277.117);
--colors-violet-500: oklch(60.6% 0.25 292.717);
--colors-purple-500: oklch(62.7% 0.265 303.9);
--colors-fuchsia-500: oklch(66.7% 0.295 322.15);
--colors-pink-500: oklch(65.6% 0.241 354.308);
--colors-rose-500: oklch(64.5% 0.246 16.439);
--colors-gray-400: oklch(70.7% 0.022 261.325);
--colors-red-400: oklch(70.4% 0.191 22.216);
--colors-orange-400: oklch(75% 0.183 55.934);
--colors-amber-400: oklch(82.8% 0.189 84.429);
--colors-yellow-400: oklch(85.2% 0.199 91.936);
--colors-lime-400: oklch(84.1% 0.238 128.85);
--colors-green-400: oklch(79.2% 0.209 151.711);
--colors-emerald-400: oklch(76.5% 0.177 163.223);
--colors-teal-400: oklch(77.7% 0.152 181.912);
--colors-cyan-400: oklch(78.9% 0.154 211.53);
--colors-sky-400: oklch(74.6% 0.16 232.661);
--colors-blue-400: oklch(70.7% 0.165 254.624);
--colors-indigo-400: oklch(67.3% 0.182 276.935);
--colors-violet-400: oklch(70.2% 0.183 293.541);
--colors-purple-400: oklch(71.4% 0.203 305.504);
--colors-fuchsia-400: oklch(74% 0.238 322.16);
--colors-pink-400: oklch(71.8% 0.202 349.761);
--colors-rose-400: oklch(71.2% 0.194 13.428);
--colors-gray-200: oklch(92.8% 0.006 264.531);
--colors-red-200: oklch(88.5% 0.062 18.334);
--colors-orange-200: oklch(90.1% 0.076 70.697);
--colors-amber-200: oklch(92.4% 0.12 95.746);
--colors-yellow-200: oklch(94.5% 0.129 101.54);
--colors-lime-200: oklch(93.8% 0.127 124.321);
--colors-green-200: oklch(92.5% 0.084 155.995);
--colors-emerald-200: oklch(90.5% 0.093 164.15);
--colors-teal-200: oklch(91% 0.096 180.426);
--colors-cyan-200: oklch(91.7% 0.08 205.041);
--colors-sky-200: oklch(90.1% 0.058 230.902);
--colors-blue-200: oklch(88.2% 0.059 254.128);
--colors-indigo-200: oklch(87% 0.065 274.039);
--colors-violet-200: oklch(89.4% 0.057 293.283);
--colors-purple-200: oklch(90.2% 0.063 306.703);
--colors-fuchsia-200: oklch(90.3% 0.076 319.62);
--colors-pink-200: oklch(89.9% 0.061 343.231);
--colors-rose-200: oklch(89.2% 0.058 10.001);
--colors-gray-800: oklch(27.8% 0.033 256.848);
--colors-gray-300: oklch(87.2% 0.01 258.338);
--colors-red-800: oklch(44.4% 0.177 26.899);
--colors-red-300: oklch(80.8% 0.114 19.571);
--colors-orange-800: oklch(47% 0.157 37.304);
--colors-orange-300: oklch(83.7% 0.128 66.29);
--colors-amber-800: oklch(47.3% 0.137 46.201);
--colors-amber-300: oklch(87.9% 0.169 91.605);
--colors-yellow-800: oklch(47.6% 0.114 61.907);
--colors-yellow-300: oklch(90.5% 0.182 98.111);
--colors-lime-800: oklch(45.3% 0.124 130.933);
--colors-lime-300: oklch(89.7% 0.196 126.665);
--colors-green-800: oklch(44.8% 0.119 151.328);
--colors-green-300: oklch(87.1% 0.15 154.449);
--colors-emerald-800: oklch(43.2% 0.095 166.913);
--colors-emerald-300: oklch(84.5% 0.143 164.978);
--colors-teal-800: oklch(43.7% 0.078 188.216);
--colors-teal-300: oklch(85.5% 0.138 181.071);
--colors-cyan-800: oklch(45% 0.085 224.283);
--colors-cyan-300: oklch(86.5% 0.127 207.078);
--colors-sky-800: oklch(44.3% 0.11 240.79);
--colors-sky-300: oklch(82.8% 0.111 230.318);
--colors-blue-800: oklch(42.4% 0.199 265.638);
--colors-blue-300: oklch(80.9% 0.105 251.813);
--colors-indigo-800: oklch(39.8% 0.195 277.366);
--colors-indigo-300: oklch(78.5% 0.115 274.713);
--colors-violet-800: oklch(43.2% 0.232 292.759);
--colors-violet-300: oklch(81.1% 0.111 293.571);
--colors-purple-800: oklch(43.8% 0.218 303.724);
--colors-purple-300: oklch(82.7% 0.119 306.383);
--colors-fuchsia-800: oklch(45.2% 0.211 324.591);
--colors-fuchsia-300: oklch(83.3% 0.145 321.434);
--colors-pink-800: oklch(45.9% 0.187 3.815);
--colors-pink-300: oklch(82.3% 0.12 346.018);
--colors-rose-800: oklch(45.5% 0.188 13.697);
--colors-rose-300: oklch(81% 0.117 11.638);
--fontWeight-normal: 400;
--colors-gray-50: oklch(98.5% 0.002 247.839);
--colors-gray-900: oklch(21% 0.034 264.665);
--text-xl-fontSize: 1.25rem;
--text-xl-lineHeight: 1.75rem;
--colors-gray-100: oklch(96.7% 0.003 264.542);
--colors-gray-700: oklch(37.3% 0.034 259.733);
--colors-white: #fff;
--colors-gray-600: oklch(44.6% 0.03 256.802);
}
/* layer: preflights */

:root {
color-scheme: light;
}

:root:where(.dark, [data-theme="dark"]) {
color-scheme: dark;
}

.slexkit-theme-uno,
.slexkit-theme-flowbite,
body.slexkit-theme-uno {
color-scheme: light;
--background: #fff;
--foreground: oklch(14.1% 0.005 285.823);
--card: #fff;
--card-foreground: oklch(14.1% 0.005 285.823);
--popover: #fff;
--popover-foreground: oklch(14.1% 0.005 285.823);
--primary: oklch(21% 0.006 285.885);
--primary-foreground: oklch(98.5% 0 0);
--secondary: oklch(96.7% 0.001 286.375);
--secondary-foreground: oklch(21% 0.006 285.885);
--muted: oklch(96.7% 0.001 286.375);
--muted-foreground: oklch(55.2% 0.016 285.938);
--accent: oklch(96.7% 0.001 286.375);
--accent-foreground: oklch(21% 0.006 285.885);
--info: oklch(48.8% 0.243 264.376);
--info-foreground: #fff;
--success: oklch(59.6% 0.145 163.225);
--success-foreground: #fff;
--warning: oklch(66.6% 0.179 58.318);
--warning-foreground: oklch(14.1% 0.005 285.823);
--destructive: oklch(57.7% 0.245 27.325);
--destructive-foreground: oklch(98.5% 0 0);
--border: oklch(92% 0.004 286.32);
--input: oklch(92% 0.004 286.32);
--ring: oklch(14.1% 0.005 285.823);
--radius: 0.5rem;
--slex-control-height: 2.25rem;
--slex-primary-50: oklch(98.5% 0 0);
--slex-primary-100: oklch(96.7% 0.001 286.375);
--slex-primary-200: oklch(92% 0.004 286.32);
--slex-primary-300: oklch(87.1% 0.006 286.286);
--slex-primary-400: oklch(70.5% 0.015 286.067);
--slex-primary-500: oklch(55.2% 0.016 285.938);
--slex-primary-600: oklch(44.2% 0.017 285.786);
--slex-primary-700: oklch(37% 0.013 285.805);
--slex-primary-800: oklch(27.4% 0.006 286.033);
--slex-primary-900: oklch(21% 0.006 285.885);
--slex-primary-950: oklch(14.1% 0.005 285.823);
}

:where(.dark, [data-theme="dark"]) .slexkit-theme-uno,
.slexkit-theme-uno:where(.dark, [data-theme="dark"]),
:where(.dark, [data-theme="dark"]) .slexkit-theme-flowbite,
.slexkit-theme-flowbite:where(.dark, [data-theme="dark"]),
:where(.dark, [data-theme="dark"]) body.slexkit-theme-uno,
body.slexkit-theme-uno:where(.dark, [data-theme="dark"]) {
color-scheme: dark;
--background: oklch(14.1% 0.005 285.823);
--foreground: oklch(98.5% 0 0);
--card: oklch(21% 0.006 285.885);
--card-foreground: oklch(98.5% 0 0);
--popover: oklch(21% 0.006 285.885);
--popover-foreground: oklch(98.5% 0 0);
--primary: oklch(98.5% 0 0);
--primary-foreground: oklch(14.1% 0.005 285.823);
--secondary: oklch(27.4% 0.006 286.033);
--secondary-foreground: oklch(98.5% 0 0);
--muted: oklch(27.4% 0.006 286.033);
--muted-foreground: oklch(70.5% 0.015 286.067);
--accent: oklch(27.4% 0.006 286.033);
--accent-foreground: oklch(98.5% 0 0);
--info: oklch(62.3% 0.214 259.815);
--info-foreground: oklch(14.1% 0.005 285.823);
--success: oklch(76.5% 0.177 163.223);
--success-foreground: oklch(14.1% 0.005 285.823);
--warning: oklch(82.8% 0.189 84.429);
--warning-foreground: oklch(14.1% 0.005 285.823);
--destructive: oklch(70.4% 0.191 22.216);
--destructive-foreground: oklch(14.1% 0.005 285.823);
--border: oklch(27.4% 0.006 286.033);
--input: oklch(37% 0.013 285.805);
--ring: oklch(87.1% 0.006 286.286);
--radius: 0.5rem;
--slex-control-height: 2.25rem;
--slex-primary-50: oklch(98.5% 0 0);
--slex-primary-100: oklch(96.7% 0.001 286.375);
--slex-primary-200: oklch(92% 0.004 286.32);
--slex-primary-300: oklch(87.1% 0.006 286.286);
--slex-primary-400: oklch(70.5% 0.015 286.067);
--slex-primary-500: oklch(55.2% 0.016 285.938);
--slex-primary-600: oklch(44.2% 0.017 285.786);
--slex-primary-700: oklch(37% 0.013 285.805);
--slex-primary-800: oklch(27.4% 0.006 286.033);
--slex-primary-900: oklch(21% 0.006 285.885);
--slex-primary-950: oklch(14.1% 0.005 285.823);
}

/* layer: shortcuts */
.site-example-desc{font-size:13px;color:color-mix(in srgb, var(--muted-foreground) var(--un-text-opacity), transparent) /* var(--muted-foreground) */;margin-top:calc(var(--spacing) * 2);}
.site-example-title{font-size:15px;--un-tracking:var(--tracking-normal);letter-spacing:var(--tracking-normal);--un-font-weight:var(--fontWeight-semibold);font-weight:var(--fontWeight-semibold);margin:calc(var(--spacing) * 0);}
.ui-button{font-size:var(--text-sm-fontSize);line-height:var(--un-leading, var(--text-sm-lineHeight));--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium);padding-inline:calc(var(--spacing) * 3);-webkit-appearance:none;appearance:none;border-width:1px;border-color:transparent;border-radius:var(--radius-md);--un-border-style:solid;border-style:solid;text-decoration:none;display:inline-flex;height:calc(var(--spacing) * 9);white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to;transition-timing-function:var(--un-ease, var(--default-transition-timingFunction));transition-duration:var(--un-duration, var(--default-transition-duration));align-items:center;justify-content:center;}
.site-example-card{color:color-mix(in srgb, var(--card-foreground) var(--un-text-opacity), transparent) /* var(--card-foreground) */;padding:calc(var(--spacing) * 4);border-width:1px;border-color:color-mix(in srgb, var(--border) var(--un-border-opacity), transparent) /* var(--border) */;border-radius:var(--radius-lg);--un-border-style:solid;border-style:solid;background-color:color-mix(in srgb, var(--card) var(--un-bg-opacity), transparent) /* var(--card) */;display:flex;flex-direction:column;min-height:92px;cursor:pointer;--un-shadow:0 1px 3px 0 var(--un-shadow-color, rgb(0 0 0 / 0.1)),0 1px 2px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to;transition-timing-function:var(--un-ease, var(--default-transition-timingFunction));transition-duration:var(--un-duration, var(--default-transition-duration));}
.ui-button-outline{color:color-mix(in srgb, var(--foreground) var(--un-text-opacity), transparent) /* var(--foreground) */;border-width:1px;border-color:color-mix(in srgb, var(--input) var(--un-border-opacity), transparent) /* var(--input) */;background-color:color-mix(in srgb, var(--background) var(--un-bg-opacity), transparent) /* var(--background) */;--un-shadow:0 1px 3px 0 var(--un-shadow-color, rgb(0 0 0 / 0.1)),0 1px 2px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.ui-button-primary{color:color-mix(in srgb, var(--primary-foreground) var(--un-text-opacity), transparent) /* var(--primary-foreground) */;border-width:1px;border-color:color-mix(in srgb, var(--primary) var(--un-border-opacity), transparent) /* var(--primary) */;background-color:color-mix(in srgb, var(--primary) var(--un-bg-opacity), transparent) /* var(--primary) */;--un-shadow:0 1px 3px 0 var(--un-shadow-color, rgb(0 0 0 / 0.1)),0 1px 2px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.ui-button-secondary{color:color-mix(in srgb, var(--secondary-foreground) var(--un-text-opacity), transparent) /* var(--secondary-foreground) */;background-color:color-mix(in srgb, var(--secondary) var(--un-bg-opacity), transparent) /* var(--secondary) */;--un-shadow:0 1px 3px 0 var(--un-shadow-color, rgb(0 0 0 / 0.1)),0 1px 2px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.site-example-card:hover{color:color-mix(in srgb, var(--accent-foreground) var(--un-text-opacity), transparent) /* var(--accent-foreground) */;background-color:color-mix(in srgb, var(--accent) var(--un-bg-opacity), transparent) /* var(--accent) */;}
.ui-button-outline:hover{color:color-mix(in srgb, var(--accent-foreground) var(--un-text-opacity), transparent) /* var(--accent-foreground) */;background-color:color-mix(in srgb, var(--accent) var(--un-bg-opacity), transparent) /* var(--accent) */;}
.ui-button-secondary:hover{color:color-mix(in srgb, var(--accent-foreground) var(--un-text-opacity), transparent) /* var(--accent-foreground) */;background-color:color-mix(in srgb, var(--accent) var(--un-bg-opacity), transparent) /* var(--accent) */;}
.focus-visible\:slex-token-focus:focus-visible{--un-outline-style:none;outline-style:none;--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(2px + var(--un-ring-offset-width)) var(--un-ring-color, currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:color-mix(in srgb, var(--ring) var(--un-ring-opacity), transparent) /* var(--ring) */;--un-ring-offset-width:2px;--un-ring-offset-shadow:var(--un-ring-inset,) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-offset-color:color-mix(in srgb, var(--background) var(--un-ring-offset-opacity), transparent) /* var(--background) */;}
.ui-button:focus-visible{--un-outline-style:none;outline-style:none;--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(2px + var(--un-ring-offset-width)) var(--un-ring-color, currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:color-mix(in srgb, var(--ring) var(--un-ring-opacity), transparent) /* var(--ring) */;--un-ring-offset-width:2px;--un-ring-offset-shadow:var(--un-ring-inset,) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-offset-color:color-mix(in srgb, var(--background) var(--un-ring-offset-opacity), transparent) /* var(--background) */;}
.ui-button-primary:hover{opacity:90%;}
.ui-button:disabled{opacity:50%;pointer-events:none;}
.container{width:100%;}
@media (min-width: 40rem){
.container{max-width:40rem;}
}
@media (min-width: 48rem){
.container{max-width:48rem;}
}
@media (min-width: 64rem){
.container{max-width:64rem;}
}
@media (min-width: 80rem){
.container{max-width:80rem;}
}
@media (min-width: 96rem){
.container{max-width:96rem;}
}
/* layer: default */
.text-\[13px\]{font-size:13px;}
.text-base{font-size:var(--text-base-fontSize);line-height:var(--un-leading, var(--text-base-lineHeight));}
.text-lg{font-size:var(--text-lg-fontSize);line-height:var(--un-leading, var(--text-lg-lineHeight));}
.text-sm{font-size:var(--text-sm-fontSize);line-height:var(--un-leading, var(--text-sm-lineHeight));}
.text-xl{font-size:var(--text-xl-fontSize);line-height:var(--un-leading, var(--text-xl-lineHeight));}
.text-xs{font-size:var(--text-xs-fontSize);line-height:var(--un-leading, var(--text-xs-lineHeight));}
.dark .dark\:text-gray-400{color:color-mix(in srgb, var(--colors-gray-400) var(--un-text-opacity), transparent) /* oklch(70.7% 0.022 261.325) */;}
.dark .dark\:text-primary-900{color:color-mix(in srgb, var(--slex-primary-900) var(--un-text-opacity), transparent) /* var(--slex-primary-900) */;}
.dark .dark\:text-white{color:color-mix(in srgb, var(--colors-white) var(--un-text-opacity), transparent) /* #fff */;}
.text-accent-foreground{color:color-mix(in srgb, var(--accent-foreground) var(--un-text-opacity), transparent) /* var(--accent-foreground) */;}
.text-amber-500{color:color-mix(in srgb, var(--colors-amber-500) var(--un-text-opacity), transparent) /* oklch(76.9% 0.188 70.08) */;}
.text-blue-500{color:color-mix(in srgb, var(--colors-blue-500) var(--un-text-opacity), transparent) /* oklch(62.3% 0.214 259.815) */;}
.text-cyan-500{color:color-mix(in srgb, var(--colors-cyan-500) var(--un-text-opacity), transparent) /* oklch(71.5% 0.143 215.221) */;}
.text-destructive{color:color-mix(in srgb, var(--destructive) var(--un-text-opacity), transparent) /* var(--destructive) */;}
.text-emerald-500{color:color-mix(in srgb, var(--colors-emerald-500) var(--un-text-opacity), transparent) /* oklch(69.6% 0.17 162.48) */;}
.text-foreground{color:color-mix(in srgb, var(--foreground) var(--un-text-opacity), transparent) /* var(--foreground) */;}
.text-fuchsia-500{color:color-mix(in srgb, var(--colors-fuchsia-500) var(--un-text-opacity), transparent) /* oklch(66.7% 0.295 322.15) */;}
.text-gray-500{color:color-mix(in srgb, var(--colors-gray-500) var(--un-text-opacity), transparent) /* oklch(55.1% 0.027 264.364) */;}
.text-gray-800{color:color-mix(in srgb, var(--colors-gray-800) var(--un-text-opacity), transparent) /* oklch(27.8% 0.033 256.848) */;}
.text-gray-900{color:color-mix(in srgb, var(--colors-gray-900) var(--un-text-opacity), transparent) /* oklch(21% 0.034 264.665) */;}
.text-green-500{color:color-mix(in srgb, var(--colors-green-500) var(--un-text-opacity), transparent) /* oklch(72.3% 0.219 149.579) */;}
.text-indigo-500{color:color-mix(in srgb, var(--colors-indigo-500) var(--un-text-opacity), transparent) /* oklch(58.5% 0.233 277.117) */;}
.text-lime-500{color:color-mix(in srgb, var(--colors-lime-500) var(--un-text-opacity), transparent) /* oklch(76.8% 0.233 130.85) */;}
.text-muted-foreground{color:color-mix(in srgb, var(--muted-foreground) var(--un-text-opacity), transparent) /* var(--muted-foreground) */;}
.text-orange-500{color:color-mix(in srgb, var(--colors-orange-500) var(--un-text-opacity), transparent) /* oklch(70.5% 0.213 47.604) */;}
.text-pink-500{color:color-mix(in srgb, var(--colors-pink-500) var(--un-text-opacity), transparent) /* oklch(65.6% 0.241 354.308) */;}
.text-primary-500{color:color-mix(in srgb, var(--slex-primary-500) var(--un-text-opacity), transparent) /* var(--slex-primary-500) */;}
.text-primary-800{color:color-mix(in srgb, var(--slex-primary-800) var(--un-text-opacity), transparent) /* var(--slex-primary-800) */;}
.text-purple-500{color:color-mix(in srgb, var(--colors-purple-500) var(--un-text-opacity), transparent) /* oklch(62.7% 0.265 303.9) */;}
.text-red-500{color:color-mix(in srgb, var(--colors-red-500) var(--un-text-opacity), transparent) /* oklch(63.7% 0.237 25.331) */;}
.text-rose-500{color:color-mix(in srgb, var(--colors-rose-500) var(--un-text-opacity), transparent) /* oklch(64.5% 0.246 16.439) */;}
.text-sky-500{color:color-mix(in srgb, var(--colors-sky-500) var(--un-text-opacity), transparent) /* oklch(68.5% 0.169 237.323) */;}
.text-teal-500{color:color-mix(in srgb, var(--colors-teal-500) var(--un-text-opacity), transparent) /* oklch(70.4% 0.14 182.503) */;}
.text-violet-500{color:color-mix(in srgb, var(--colors-violet-500) var(--un-text-opacity), transparent) /* oklch(60.6% 0.25 292.717) */;}
.text-yellow-500{color:color-mix(in srgb, var(--colors-yellow-500) var(--un-text-opacity), transparent) /* oklch(79.5% 0.184 86.047) */;}
.dark .dark\:hover\:text-amber-300:hover{color:color-mix(in srgb, var(--colors-amber-300) var(--un-text-opacity), transparent) /* oklch(87.9% 0.169 91.605) */;}
.dark .dark\:hover\:text-blue-300:hover{color:color-mix(in srgb, var(--colors-blue-300) var(--un-text-opacity), transparent) /* oklch(80.9% 0.105 251.813) */;}
.dark .dark\:hover\:text-cyan-300:hover{color:color-mix(in srgb, var(--colors-cyan-300) var(--un-text-opacity), transparent) /* oklch(86.5% 0.127 207.078) */;}
.dark .dark\:hover\:text-emerald-300:hover{color:color-mix(in srgb, var(--colors-emerald-300) var(--un-text-opacity), transparent) /* oklch(84.5% 0.143 164.978) */;}
.dark .dark\:hover\:text-fuchsia-300:hover{color:color-mix(in srgb, var(--colors-fuchsia-300) var(--un-text-opacity), transparent) /* oklch(83.3% 0.145 321.434) */;}
.dark .dark\:hover\:text-gray-300:hover{color:color-mix(in srgb, var(--colors-gray-300) var(--un-text-opacity), transparent) /* oklch(87.2% 0.01 258.338) */;}
.dark .dark\:hover\:text-green-300:hover{color:color-mix(in srgb, var(--colors-green-300) var(--un-text-opacity), transparent) /* oklch(87.1% 0.15 154.449) */;}
.dark .dark\:hover\:text-indigo-300:hover{color:color-mix(in srgb, var(--colors-indigo-300) var(--un-text-opacity), transparent) /* oklch(78.5% 0.115 274.713) */;}
.dark .dark\:hover\:text-lime-300:hover{color:color-mix(in srgb, var(--colors-lime-300) var(--un-text-opacity), transparent) /* oklch(89.7% 0.196 126.665) */;}
.dark .dark\:hover\:text-orange-300:hover{color:color-mix(in srgb, var(--colors-orange-300) var(--un-text-opacity), transparent) /* oklch(83.7% 0.128 66.29) */;}
.dark .dark\:hover\:text-pink-300:hover{color:color-mix(in srgb, var(--colors-pink-300) var(--un-text-opacity), transparent) /* oklch(82.3% 0.12 346.018) */;}
.dark .dark\:hover\:text-primary-300:hover{color:color-mix(in srgb, var(--slex-primary-300) var(--un-text-opacity), transparent) /* var(--slex-primary-300) */;}
.dark .dark\:hover\:text-purple-300:hover{color:color-mix(in srgb, var(--colors-purple-300) var(--un-text-opacity), transparent) /* oklch(82.7% 0.119 306.383) */;}
.dark .dark\:hover\:text-red-300:hover{color:color-mix(in srgb, var(--colors-red-300) var(--un-text-opacity), transparent) /* oklch(80.8% 0.114 19.571) */;}
.dark .dark\:hover\:text-rose-300:hover{color:color-mix(in srgb, var(--colors-rose-300) var(--un-text-opacity), transparent) /* oklch(81% 0.117 11.638) */;}
.dark .dark\:hover\:text-sky-300:hover{color:color-mix(in srgb, var(--colors-sky-300) var(--un-text-opacity), transparent) /* oklch(82.8% 0.111 230.318) */;}
.dark .dark\:hover\:text-teal-300:hover{color:color-mix(in srgb, var(--colors-teal-300) var(--un-text-opacity), transparent) /* oklch(85.5% 0.138 181.071) */;}
.dark .dark\:hover\:text-violet-300:hover{color:color-mix(in srgb, var(--colors-violet-300) var(--un-text-opacity), transparent) /* oklch(81.1% 0.111 293.571) */;}
.dark .dark\:hover\:text-yellow-300:hover{color:color-mix(in srgb, var(--colors-yellow-300) var(--un-text-opacity), transparent) /* oklch(90.5% 0.182 98.111) */;}
.hover\:text-accent-foreground:hover{color:color-mix(in srgb, var(--accent-foreground) var(--un-text-opacity), transparent) /* var(--accent-foreground) */;}
.text-inherit{color:inherit;}
.leading-6{--un-leading:calc(var(--spacing) * 6);line-height:calc(var(--spacing) * 6);}
.font-bold{--un-font-weight:var(--fontWeight-bold);font-weight:var(--fontWeight-bold);}
.font-medium{--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium);}
.font-mono{font-family:var(--font-mono);}
.font-normal{--un-font-weight:var(--fontWeight-normal);font-weight:var(--fontWeight-normal);}
.font-sans{font-family:var(--font-sans);}
.font-semibold{--un-font-weight:var(--fontWeight-semibold);font-weight:var(--fontWeight-semibold);}
.tab{-moz-tab-size:4;-o-tab-size:4;tab-size:4;}
.m-0{margin:calc(var(--spacing) * 0);}
.m-0\.5{margin:calc(var(--spacing) * 0.5);}
.m-2{margin:calc(var(--spacing) * 2);}
.m1{margin:calc(var(--spacing) * 1);}
.mx-auto{margin-inline:auto;}
.group:has(ul) .group-has-\[ul\]\:ms-6{margin-inline-start:calc(var(--spacing) * 6);}
.mb-3{margin-bottom:calc(var(--spacing) * 3);}
.mb-5{margin-bottom:calc(var(--spacing) * 5);}
.me-2{margin-inline-end:calc(var(--spacing) * 2);}
.me-3{margin-inline-end:calc(var(--spacing) * 3);}
.ms{margin-inline-start:calc(var(--spacing) * 4);}
.ms-3{margin-inline-start:calc(var(--spacing) * 3);}
.mt-4{margin-top:calc(var(--spacing) * 4);}
.mt-6{margin-top:calc(var(--spacing) * 6);}
.p-0{padding:calc(var(--spacing) * 0);}
.p-0\.5{padding:calc(var(--spacing) * 0.5);}
.p-1\.5{padding:calc(var(--spacing) * 1.5);}
.p-2{padding:calc(var(--spacing) * 2);}
.p-2\.5{padding:calc(var(--spacing) * 2.5);}
.p-4{padding:calc(var(--spacing) * 4);}
.px,
.px-4{padding-inline:calc(var(--spacing) * 4);}
.px-2\.5{padding-inline:calc(var(--spacing) * 2.5);}
.px-3{padding-inline:calc(var(--spacing) * 3);}
.px-6{padding-inline:calc(var(--spacing) * 6);}
.py-0\.5{padding-block:calc(var(--spacing) * 0.5);}
.py-2{padding-block:calc(var(--spacing) * 2);}
.py-2\.5{padding-block:calc(var(--spacing) * 2.5);}
.py-3{padding-block:calc(var(--spacing) * 3);}
.py-4{padding-block:calc(var(--spacing) * 4);}
.py-7{padding-block:calc(var(--spacing) * 7);}
.ps-2\.5{padding-inline-start:calc(var(--spacing) * 2.5);}
.pt-1{padding-top:calc(var(--spacing) * 1);}
.pt-4{padding-top:calc(var(--spacing) * 4);}
.text-left{text-align:left;}
.focus\:outline-hidden:focus{outline-style:none;}
.scroll-smooth{scroll-behavior:smooth;}
.b,
.border{border-width:1px;}
.border-b{border-bottom-width:1px;}
.border-e{border-inline-end-width:1px;}
.border-l{border-left-width:1px;}
.border-r{border-right-width:1px;}
.border-s{border-inline-start-width:1px;}
.border-t{border-top-width:1px;}
.border-border{border-color:color-mix(in srgb, var(--border) var(--un-border-opacity), transparent) /* var(--border) */;}
.border-destructive{border-color:color-mix(in srgb, var(--destructive) var(--un-border-opacity), transparent) /* var(--destructive) */;}
.border-gray-200{border-color:color-mix(in srgb, var(--colors-gray-200) var(--un-border-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.border-transparent{border-color:transparent;}
.dark .dark\:border-gray-700{border-color:color-mix(in srgb, var(--colors-gray-700) var(--un-border-opacity), transparent) /* oklch(37.3% 0.034 259.733) */;}
.rounded{border-radius:var(--radius-DEFAULT);}
.rounded-lg{border-radius:var(--radius-lg);}
.rounded-md{border-radius:var(--radius-md);}
.rounded-none{border-radius:var(--radius-none);}
.rounded-sm{border-radius:var(--radius-sm);}
.rounded-xs{border-radius:var(--radius-xs);}
.border-inherit{--un-border-style:inherit;border-style:inherit;}
.bg-accent{background-color:color-mix(in srgb, var(--accent) var(--un-bg-opacity), transparent) /* var(--accent) */;}
.bg-background{background-color:color-mix(in srgb, var(--background) var(--un-bg-opacity), transparent) /* var(--background) */;}
.bg-background\/95{background-color:color-mix(in srgb, var(--background) 95%, transparent) /* var(--background) */;}
.bg-foreground\/35{background-color:color-mix(in srgb, var(--foreground) 35%, transparent) /* var(--foreground) */;}
.bg-gray-200{background-color:color-mix(in srgb, var(--colors-gray-200) var(--un-bg-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.bg-gray-50{background-color:color-mix(in srgb, var(--colors-gray-50) var(--un-bg-opacity), transparent) /* oklch(98.5% 0.002 247.839) */;}
.bg-gray-900{background-color:color-mix(in srgb, var(--colors-gray-900) var(--un-bg-opacity), transparent) /* oklch(21% 0.034 264.665) */;}
.bg-inherit{background-color:inherit;}
.bg-primary-100{background-color:color-mix(in srgb, var(--slex-primary-100) var(--un-bg-opacity), transparent) /* var(--slex-primary-100) */;}
.bg-primary-50{background-color:color-mix(in srgb, var(--slex-primary-50) var(--un-bg-opacity), transparent) /* var(--slex-primary-50) */;}
.bg-transparent{background-color:transparent;}
.dark .dark\:bg-gray-700{background-color:color-mix(in srgb, var(--colors-gray-700) var(--un-bg-opacity), transparent) /* oklch(37.3% 0.034 259.733) */;}
.dark .dark\:bg-gray-800{background-color:color-mix(in srgb, var(--colors-gray-800) var(--un-bg-opacity), transparent) /* oklch(27.8% 0.033 256.848) */;}
.dark .dark\:bg-primary-200{background-color:color-mix(in srgb, var(--slex-primary-200) var(--un-bg-opacity), transparent) /* var(--slex-primary-200) */;}
.dark .dark\:bg-primary-900{background-color:color-mix(in srgb, var(--slex-primary-900) var(--un-bg-opacity), transparent) /* var(--slex-primary-900) */;}
.dark .dark\:hover\:bg-amber-800:hover{background-color:color-mix(in srgb, var(--colors-amber-800) var(--un-bg-opacity), transparent) /* oklch(47.3% 0.137 46.201) */;}
.dark .dark\:hover\:bg-blue-800:hover{background-color:color-mix(in srgb, var(--colors-blue-800) var(--un-bg-opacity), transparent) /* oklch(42.4% 0.199 265.638) */;}
.dark .dark\:hover\:bg-cyan-800:hover{background-color:color-mix(in srgb, var(--colors-cyan-800) var(--un-bg-opacity), transparent) /* oklch(45% 0.085 224.283) */;}
.dark .dark\:hover\:bg-emerald-800:hover{background-color:color-mix(in srgb, var(--colors-emerald-800) var(--un-bg-opacity), transparent) /* oklch(43.2% 0.095 166.913) */;}
.dark .dark\:hover\:bg-fuchsia-800:hover{background-color:color-mix(in srgb, var(--colors-fuchsia-800) var(--un-bg-opacity), transparent) /* oklch(45.2% 0.211 324.591) */;}
.dark .dark\:hover\:bg-gray-700:hover{background-color:color-mix(in srgb, var(--colors-gray-700) var(--un-bg-opacity), transparent) /* oklch(37.3% 0.034 259.733) */;}
.dark .dark\:hover\:bg-gray-800:hover{background-color:color-mix(in srgb, var(--colors-gray-800) var(--un-bg-opacity), transparent) /* oklch(27.8% 0.033 256.848) */;}
.dark .dark\:hover\:bg-green-800:hover{background-color:color-mix(in srgb, var(--colors-green-800) var(--un-bg-opacity), transparent) /* oklch(44.8% 0.119 151.328) */;}
.dark .dark\:hover\:bg-indigo-800:hover{background-color:color-mix(in srgb, var(--colors-indigo-800) var(--un-bg-opacity), transparent) /* oklch(39.8% 0.195 277.366) */;}
.dark .dark\:hover\:bg-lime-800:hover{background-color:color-mix(in srgb, var(--colors-lime-800) var(--un-bg-opacity), transparent) /* oklch(45.3% 0.124 130.933) */;}
.dark .dark\:hover\:bg-orange-800:hover{background-color:color-mix(in srgb, var(--colors-orange-800) var(--un-bg-opacity), transparent) /* oklch(47% 0.157 37.304) */;}
.dark .dark\:hover\:bg-pink-800:hover{background-color:color-mix(in srgb, var(--colors-pink-800) var(--un-bg-opacity), transparent) /* oklch(45.9% 0.187 3.815) */;}
.dark .dark\:hover\:bg-primary-800:hover{background-color:color-mix(in srgb, var(--slex-primary-800) var(--un-bg-opacity), transparent) /* var(--slex-primary-800) */;}
.dark .dark\:hover\:bg-purple-800:hover{background-color:color-mix(in srgb, var(--colors-purple-800) var(--un-bg-opacity), transparent) /* oklch(43.8% 0.218 303.724) */;}
.dark .dark\:hover\:bg-red-800:hover{background-color:color-mix(in srgb, var(--colors-red-800) var(--un-bg-opacity), transparent) /* oklch(44.4% 0.177 26.899) */;}
.dark .dark\:hover\:bg-rose-800:hover{background-color:color-mix(in srgb, var(--colors-rose-800) var(--un-bg-opacity), transparent) /* oklch(45.5% 0.188 13.697) */;}
.dark .dark\:hover\:bg-sky-800:hover{background-color:color-mix(in srgb, var(--colors-sky-800) var(--un-bg-opacity), transparent) /* oklch(44.3% 0.11 240.79) */;}
.dark .dark\:hover\:bg-teal-800:hover{background-color:color-mix(in srgb, var(--colors-teal-800) var(--un-bg-opacity), transparent) /* oklch(43.7% 0.078 188.216) */;}
.dark .dark\:hover\:bg-violet-800:hover{background-color:color-mix(in srgb, var(--colors-violet-800) var(--un-bg-opacity), transparent) /* oklch(43.2% 0.232 292.759) */;}
.dark .dark\:hover\:bg-yellow-800:hover{background-color:color-mix(in srgb, var(--colors-yellow-800) var(--un-bg-opacity), transparent) /* oklch(47.6% 0.114 61.907) */;}
.hover\:bg-accent:hover{background-color:color-mix(in srgb, var(--accent) var(--un-bg-opacity), transparent) /* var(--accent) */;}
.hover\:bg-amber-200:hover{background-color:color-mix(in srgb, var(--colors-amber-200) var(--un-bg-opacity), transparent) /* oklch(92.4% 0.12 95.746) */;}
.hover\:bg-blue-200:hover{background-color:color-mix(in srgb, var(--colors-blue-200) var(--un-bg-opacity), transparent) /* oklch(88.2% 0.059 254.128) */;}
.hover\:bg-cyan-200:hover{background-color:color-mix(in srgb, var(--colors-cyan-200) var(--un-bg-opacity), transparent) /* oklch(91.7% 0.08 205.041) */;}
.hover\:bg-emerald-200:hover{background-color:color-mix(in srgb, var(--colors-emerald-200) var(--un-bg-opacity), transparent) /* oklch(90.5% 0.093 164.15) */;}
.hover\:bg-fuchsia-200:hover{background-color:color-mix(in srgb, var(--colors-fuchsia-200) var(--un-bg-opacity), transparent) /* oklch(90.3% 0.076 319.62) */;}
.hover\:bg-gray-100:hover{background-color:color-mix(in srgb, var(--colors-gray-100) var(--un-bg-opacity), transparent) /* oklch(96.7% 0.003 264.542) */;}
.hover\:bg-gray-200:hover{background-color:color-mix(in srgb, var(--colors-gray-200) var(--un-bg-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.hover\:bg-green-200:hover{background-color:color-mix(in srgb, var(--colors-green-200) var(--un-bg-opacity), transparent) /* oklch(92.5% 0.084 155.995) */;}
.hover\:bg-indigo-200:hover{background-color:color-mix(in srgb, var(--colors-indigo-200) var(--un-bg-opacity), transparent) /* oklch(87% 0.065 274.039) */;}
.hover\:bg-lime-200:hover{background-color:color-mix(in srgb, var(--colors-lime-200) var(--un-bg-opacity), transparent) /* oklch(93.8% 0.127 124.321) */;}
.hover\:bg-orange-200:hover{background-color:color-mix(in srgb, var(--colors-orange-200) var(--un-bg-opacity), transparent) /* oklch(90.1% 0.076 70.697) */;}
.hover\:bg-pink-200:hover{background-color:color-mix(in srgb, var(--colors-pink-200) var(--un-bg-opacity), transparent) /* oklch(89.9% 0.061 343.231) */;}
.hover\:bg-primary-200:hover{background-color:color-mix(in srgb, var(--slex-primary-200) var(--un-bg-opacity), transparent) /* var(--slex-primary-200) */;}
.hover\:bg-purple-200:hover{background-color:color-mix(in srgb, var(--colors-purple-200) var(--un-bg-opacity), transparent) /* oklch(90.2% 0.063 306.703) */;}
.hover\:bg-red-200:hover{background-color:color-mix(in srgb, var(--colors-red-200) var(--un-bg-opacity), transparent) /* oklch(88.5% 0.062 18.334) */;}
.hover\:bg-rose-200:hover{background-color:color-mix(in srgb, var(--colors-rose-200) var(--un-bg-opacity), transparent) /* oklch(89.2% 0.058 10.001) */;}
.hover\:bg-sky-200:hover{background-color:color-mix(in srgb, var(--colors-sky-200) var(--un-bg-opacity), transparent) /* oklch(90.1% 0.058 230.902) */;}
.hover\:bg-teal-200:hover{background-color:color-mix(in srgb, var(--colors-teal-200) var(--un-bg-opacity), transparent) /* oklch(91% 0.096 180.426) */;}
.hover\:bg-violet-200:hover{background-color:color-mix(in srgb, var(--colors-violet-200) var(--un-bg-opacity), transparent) /* oklch(89.4% 0.057 293.283) */;}
.hover\:bg-yellow-200:hover{background-color:color-mix(in srgb, var(--colors-yellow-200) var(--un-bg-opacity), transparent) /* oklch(94.5% 0.129 101.54) */;}
.opacity-75{opacity:75%;}
.disabled\:opacity-50:disabled{opacity:50%;}
.no-underline{text-decoration:none;}
.flex{display:flex;}
.inline-flex{display:inline-flex;}
.flex-1{flex:1 1 0%;}
.shrink-0{flex-shrink:0;}
.flex-col{flex-direction:column;}
.flex-wrap{flex-wrap:wrap;}
.gap-1{gap:calc(var(--spacing) * 1);}
.gap-2\.5{gap:calc(var(--spacing) * 2.5);}
.gap-3{gap:calc(var(--spacing) * 3);}
.gap-4{gap:calc(var(--spacing) * 4);}
.gap-5{gap:calc(var(--spacing) * 5);}
.gap-6{gap:calc(var(--spacing) * 6);}
.gap-x-4{column-gap:calc(var(--spacing) * 4);}
.gap-y-2{row-gap:calc(var(--spacing) * 2);}
.grid{display:grid;}
.inline-grid{display:inline-grid;}
.grid-rows-\[auto_1fr\]{grid-template-rows:auto 1fr;}
.h-\[10px\]{height:10px;}
.h-16{height:calc(var(--spacing) * 16);}
.h-20{height:calc(var(--spacing) * 20);}
.h-3{height:calc(var(--spacing) * 3);}
.h-3\.5{height:calc(var(--spacing) * 3.5);}
.h-5{height:calc(var(--spacing) * 5);}
.h-6{height:calc(var(--spacing) * 6);}
.h-7{height:calc(var(--spacing) * 7);}
.h-9{height:calc(var(--spacing) * 9);}
.h-full{height:100%;}
.h1{height:calc(var(--spacing) * 1);}
.max-w-\[1180px\]{max-width:1180px;}
.max-w-\[1520px\]{max-width:1520px;}
.min-h-screen{min-height:100vh;}
.min-w-0{min-width:calc(var(--spacing) * 0);}
.w-\[10px\]{width:10px;}
.w-\[min\(17\.5rem\,calc\(100vw-5rem\)\)\]{width:min(17.5rem,calc(100vw - 5rem));}
.w-3{width:calc(var(--spacing) * 3);}
.w-3\.5{width:calc(var(--spacing) * 3.5);}
.w-5{width:calc(var(--spacing) * 5);}
.w-6{width:calc(var(--spacing) * 6);}
.w-64{width:calc(var(--spacing) * 64);}
.w-7{width:calc(var(--spacing) * 7);}
.w-9{width:calc(var(--spacing) * 9);}
.w-full{width:100%;}
.inline{display:inline;}
.\!block{display:block !important;}
.block{display:block;}
.hidden{display:none;}
.visible{visibility:visible;}
.collapse{visibility:collapse;}
.disabled\:cursor-not-allowed:disabled{cursor:not-allowed;}
.pointer-events-none{pointer-events:none;}
.resize{resize:both;}
.whitespace-normal{white-space:normal;}
.whitespace-nowrap{white-space:nowrap;}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.focus\:ring-0:focus{--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(0px + var(--un-ring-offset-width)) var(--un-ring-color, currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.focus\:ring-1:focus{--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(1px + var(--un-ring-offset-width)) var(--un-ring-color, currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.focus\:ring-2:focus{--un-ring-shadow:var(--un-ring-inset,) 0 0 0 calc(2px + var(--un-ring-offset-width)) var(--un-ring-color, currentColor);box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.dark .dark\:focus\:ring-gray-600:focus{--un-ring-color:color-mix(in srgb, var(--colors-gray-600) var(--un-ring-opacity), transparent) /* oklch(44.6% 0.03 256.802) */;}
.focus\:ring-amber-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-amber-400) var(--un-ring-opacity), transparent) /* oklch(82.8% 0.189 84.429) */;}
.focus\:ring-blue-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-blue-400) var(--un-ring-opacity), transparent) /* oklch(70.7% 0.165 254.624) */;}
.focus\:ring-cyan-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-cyan-400) var(--un-ring-opacity), transparent) /* oklch(78.9% 0.154 211.53) */;}
.focus\:ring-emerald-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-emerald-400) var(--un-ring-opacity), transparent) /* oklch(76.5% 0.177 163.223) */;}
.focus\:ring-fuchsia-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-fuchsia-400) var(--un-ring-opacity), transparent) /* oklch(74% 0.238 322.16) */;}
.focus\:ring-gray-200:focus{--un-ring-color:color-mix(in srgb, var(--colors-gray-200) var(--un-ring-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.focus\:ring-gray-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-gray-400) var(--un-ring-opacity), transparent) /* oklch(70.7% 0.022 261.325) */;}
.focus\:ring-green-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-green-400) var(--un-ring-opacity), transparent) /* oklch(79.2% 0.209 151.711) */;}
.focus\:ring-indigo-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-indigo-400) var(--un-ring-opacity), transparent) /* oklch(67.3% 0.182 276.935) */;}
.focus\:ring-lime-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-lime-400) var(--un-ring-opacity), transparent) /* oklch(84.1% 0.238 128.85) */;}
.focus\:ring-orange-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-orange-400) var(--un-ring-opacity), transparent) /* oklch(75% 0.183 55.934) */;}
.focus\:ring-pink-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-pink-400) var(--un-ring-opacity), transparent) /* oklch(71.8% 0.202 349.761) */;}
.focus\:ring-primary-400:focus{--un-ring-color:color-mix(in srgb, var(--slex-primary-400) var(--un-ring-opacity), transparent) /* var(--slex-primary-400) */;}
.focus\:ring-purple-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-purple-400) var(--un-ring-opacity), transparent) /* oklch(71.4% 0.203 305.504) */;}
.focus\:ring-red-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-red-400) var(--un-ring-opacity), transparent) /* oklch(70.4% 0.191 22.216) */;}
.focus\:ring-rose-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-rose-400) var(--un-ring-opacity), transparent) /* oklch(71.2% 0.194 13.428) */;}
.focus\:ring-sky-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-sky-400) var(--un-ring-opacity), transparent) /* oklch(74.6% 0.16 232.661) */;}
.focus\:ring-teal-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-teal-400) var(--un-ring-opacity), transparent) /* oklch(77.7% 0.152 181.912) */;}
.focus\:ring-violet-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-violet-400) var(--un-ring-opacity), transparent) /* oklch(70.2% 0.183 293.541) */;}
.focus\:ring-yellow-400:focus{--un-ring-color:color-mix(in srgb, var(--colors-yellow-400) var(--un-ring-opacity), transparent) /* oklch(85.2% 0.199 91.936) */;}
.shadow-xl{--un-shadow:0 20px 25px -5px var(--un-shadow-color, rgb(0 0 0 / 0.1)),0 8px 10px -6px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-inset-shadow), var(--un-inset-ring-shadow), var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
.-rotate-135{rotate:-135deg;}
.-rotate-45{rotate:-45deg;}
.rotate-135{rotate:135deg;}
.rotate-45{rotate:45deg;}
.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--un-ease, var(--default-transition-timingFunction));transition-duration:var(--un-duration, var(--default-transition-duration));}
.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to;transition-timing-function:var(--un-ease, var(--default-transition-timingFunction));transition-duration:var(--un-duration, var(--default-transition-duration));}
.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--un-ease, var(--default-transition-timingFunction));transition-duration:var(--un-duration, var(--default-transition-duration));}
.duration-75{--un-duration:75ms;transition-duration:75ms;}
.content-start{align-content:flex-start;}
.items-center{align-items:center;}
.self-center{align-self:center;}
.inset-0{inset:calc(var(--spacing) * 0);}
.start-0{inset-inline-start:calc(var(--spacing) * 0);}
.left-0{left:calc(var(--spacing) * 0);}
.top-0{top:calc(var(--spacing) * 0);}
.justify-between{justify-content:space-between;}
.place-items-center{place-items:center;}
.absolute{position:absolute;}
.fixed{position:fixed;}
.relative{position:relative;}
.sticky{position:sticky;}
.static{position:static;}
.z-\[60\]{z-index:60;}
.z-40{z-index:40;}
.z-50{z-index:50;}
.overflow-x-hidden{overflow-x:hidden;}
.overflow-y-auto{overflow-y:auto;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}
.backdrop-blur{--un-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,);backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,);}
.backdrop-blur-\[2px\]{--un-backdrop-blur:blur(2px);-webkit-backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,);backdrop-filter:var(--un-backdrop-blur,) var(--un-backdrop-brightness,) var(--un-backdrop-contrast,) var(--un-backdrop-grayscale,) var(--un-backdrop-hue-rotate,) var(--un-backdrop-invert,) var(--un-backdrop-opacity,) var(--un-backdrop-saturate,) var(--un-backdrop-sepia,);}
.scroll-pt-20{scroll-padding-top:calc(var(--spacing) * 20);}
.table{display:table;}
.space-y-0{
:where(&>:not(:last-child)){--un-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 0) * var(--un-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 0) * calc(1 - var(--un-space-y-reverse)));}
}
.space-y-2{
:where(&>:not(:last-child)){--un-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--un-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--un-space-y-reverse)));}
}
@media (forced-colors: active){
.focus\:outline-hidden:focus{outline:2px solid transparent;outline-offset:2px;}
}
@supports (color: color-mix(in lab, red, red)){
.dark .dark\:text-gray-400{color:color-mix(in oklab, var(--colors-gray-400) var(--un-text-opacity), transparent) /* oklch(70.7% 0.022 261.325) */;}
.dark .dark\:text-white{color:color-mix(in oklab, var(--colors-white) var(--un-text-opacity), transparent) /* #fff */;}
.text-amber-500{color:color-mix(in oklab, var(--colors-amber-500) var(--un-text-opacity), transparent) /* oklch(76.9% 0.188 70.08) */;}
.text-blue-500{color:color-mix(in oklab, var(--colors-blue-500) var(--un-text-opacity), transparent) /* oklch(62.3% 0.214 259.815) */;}
.text-cyan-500{color:color-mix(in oklab, var(--colors-cyan-500) var(--un-text-opacity), transparent) /* oklch(71.5% 0.143 215.221) */;}
.text-emerald-500{color:color-mix(in oklab, var(--colors-emerald-500) var(--un-text-opacity), transparent) /* oklch(69.6% 0.17 162.48) */;}
.text-fuchsia-500{color:color-mix(in oklab, var(--colors-fuchsia-500) var(--un-text-opacity), transparent) /* oklch(66.7% 0.295 322.15) */;}
.text-gray-500{color:color-mix(in oklab, var(--colors-gray-500) var(--un-text-opacity), transparent) /* oklch(55.1% 0.027 264.364) */;}
.text-gray-800{color:color-mix(in oklab, var(--colors-gray-800) var(--un-text-opacity), transparent) /* oklch(27.8% 0.033 256.848) */;}
.text-gray-900{color:color-mix(in oklab, var(--colors-gray-900) var(--un-text-opacity), transparent) /* oklch(21% 0.034 264.665) */;}
.text-green-500{color:color-mix(in oklab, var(--colors-green-500) var(--un-text-opacity), transparent) /* oklch(72.3% 0.219 149.579) */;}
.text-indigo-500{color:color-mix(in oklab, var(--colors-indigo-500) var(--un-text-opacity), transparent) /* oklch(58.5% 0.233 277.117) */;}
.text-lime-500{color:color-mix(in oklab, var(--colors-lime-500) var(--un-text-opacity), transparent) /* oklch(76.8% 0.233 130.85) */;}
.text-orange-500{color:color-mix(in oklab, var(--colors-orange-500) var(--un-text-opacity), transparent) /* oklch(70.5% 0.213 47.604) */;}
.text-pink-500{color:color-mix(in oklab, var(--colors-pink-500) var(--un-text-opacity), transparent) /* oklch(65.6% 0.241 354.308) */;}
.text-purple-500{color:color-mix(in oklab, var(--colors-purple-500) var(--un-text-opacity), transparent) /* oklch(62.7% 0.265 303.9) */;}
.text-red-500{color:color-mix(in oklab, var(--colors-red-500) var(--un-text-opacity), transparent) /* oklch(63.7% 0.237 25.331) */;}
.text-rose-500{color:color-mix(in oklab, var(--colors-rose-500) var(--un-text-opacity), transparent) /* oklch(64.5% 0.246 16.439) */;}
.text-sky-500{color:color-mix(in oklab, var(--colors-sky-500) var(--un-text-opacity), transparent) /* oklch(68.5% 0.169 237.323) */;}
.text-teal-500{color:color-mix(in oklab, var(--colors-teal-500) var(--un-text-opacity), transparent) /* oklch(70.4% 0.14 182.503) */;}
.text-violet-500{color:color-mix(in oklab, var(--colors-violet-500) var(--un-text-opacity), transparent) /* oklch(60.6% 0.25 292.717) */;}
.text-yellow-500{color:color-mix(in oklab, var(--colors-yellow-500) var(--un-text-opacity), transparent) /* oklch(79.5% 0.184 86.047) */;}
.dark .dark\:hover\:text-amber-300:hover{color:color-mix(in oklab, var(--colors-amber-300) var(--un-text-opacity), transparent) /* oklch(87.9% 0.169 91.605) */;}
.dark .dark\:hover\:text-blue-300:hover{color:color-mix(in oklab, var(--colors-blue-300) var(--un-text-opacity), transparent) /* oklch(80.9% 0.105 251.813) */;}
.dark .dark\:hover\:text-cyan-300:hover{color:color-mix(in oklab, var(--colors-cyan-300) var(--un-text-opacity), transparent) /* oklch(86.5% 0.127 207.078) */;}
.dark .dark\:hover\:text-emerald-300:hover{color:color-mix(in oklab, var(--colors-emerald-300) var(--un-text-opacity), transparent) /* oklch(84.5% 0.143 164.978) */;}
.dark .dark\:hover\:text-fuchsia-300:hover{color:color-mix(in oklab, var(--colors-fuchsia-300) var(--un-text-opacity), transparent) /* oklch(83.3% 0.145 321.434) */;}
.dark .dark\:hover\:text-gray-300:hover{color:color-mix(in oklab, var(--colors-gray-300) var(--un-text-opacity), transparent) /* oklch(87.2% 0.01 258.338) */;}
.dark .dark\:hover\:text-green-300:hover{color:color-mix(in oklab, var(--colors-green-300) var(--un-text-opacity), transparent) /* oklch(87.1% 0.15 154.449) */;}
.dark .dark\:hover\:text-indigo-300:hover{color:color-mix(in oklab, var(--colors-indigo-300) var(--un-text-opacity), transparent) /* oklch(78.5% 0.115 274.713) */;}
.dark .dark\:hover\:text-lime-300:hover{color:color-mix(in oklab, var(--colors-lime-300) var(--un-text-opacity), transparent) /* oklch(89.7% 0.196 126.665) */;}
.dark .dark\:hover\:text-orange-300:hover{color:color-mix(in oklab, var(--colors-orange-300) var(--un-text-opacity), transparent) /* oklch(83.7% 0.128 66.29) */;}
.dark .dark\:hover\:text-pink-300:hover{color:color-mix(in oklab, var(--colors-pink-300) var(--un-text-opacity), transparent) /* oklch(82.3% 0.12 346.018) */;}
.dark .dark\:hover\:text-purple-300:hover{color:color-mix(in oklab, var(--colors-purple-300) var(--un-text-opacity), transparent) /* oklch(82.7% 0.119 306.383) */;}
.dark .dark\:hover\:text-red-300:hover{color:color-mix(in oklab, var(--colors-red-300) var(--un-text-opacity), transparent) /* oklch(80.8% 0.114 19.571) */;}
.dark .dark\:hover\:text-rose-300:hover{color:color-mix(in oklab, var(--colors-rose-300) var(--un-text-opacity), transparent) /* oklch(81% 0.117 11.638) */;}
.dark .dark\:hover\:text-sky-300:hover{color:color-mix(in oklab, var(--colors-sky-300) var(--un-text-opacity), transparent) /* oklch(82.8% 0.111 230.318) */;}
.dark .dark\:hover\:text-teal-300:hover{color:color-mix(in oklab, var(--colors-teal-300) var(--un-text-opacity), transparent) /* oklch(85.5% 0.138 181.071) */;}
.dark .dark\:hover\:text-violet-300:hover{color:color-mix(in oklab, var(--colors-violet-300) var(--un-text-opacity), transparent) /* oklch(81.1% 0.111 293.571) */;}
.dark .dark\:hover\:text-yellow-300:hover{color:color-mix(in oklab, var(--colors-yellow-300) var(--un-text-opacity), transparent) /* oklch(90.5% 0.182 98.111) */;}
.border-gray-200{border-color:color-mix(in oklab, var(--colors-gray-200) var(--un-border-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.dark .dark\:border-gray-700{border-color:color-mix(in oklab, var(--colors-gray-700) var(--un-border-opacity), transparent) /* oklch(37.3% 0.034 259.733) */;}
.bg-gray-200{background-color:color-mix(in oklab, var(--colors-gray-200) var(--un-bg-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.bg-gray-50{background-color:color-mix(in oklab, var(--colors-gray-50) var(--un-bg-opacity), transparent) /* oklch(98.5% 0.002 247.839) */;}
.bg-gray-900{background-color:color-mix(in oklab, var(--colors-gray-900) var(--un-bg-opacity), transparent) /* oklch(21% 0.034 264.665) */;}
.dark .dark\:bg-gray-700{background-color:color-mix(in oklab, var(--colors-gray-700) var(--un-bg-opacity), transparent) /* oklch(37.3% 0.034 259.733) */;}
.dark .dark\:bg-gray-800{background-color:color-mix(in oklab, var(--colors-gray-800) var(--un-bg-opacity), transparent) /* oklch(27.8% 0.033 256.848) */;}
.dark .dark\:hover\:bg-amber-800:hover{background-color:color-mix(in oklab, var(--colors-amber-800) var(--un-bg-opacity), transparent) /* oklch(47.3% 0.137 46.201) */;}
.dark .dark\:hover\:bg-blue-800:hover{background-color:color-mix(in oklab, var(--colors-blue-800) var(--un-bg-opacity), transparent) /* oklch(42.4% 0.199 265.638) */;}
.dark .dark\:hover\:bg-cyan-800:hover{background-color:color-mix(in oklab, var(--colors-cyan-800) var(--un-bg-opacity), transparent) /* oklch(45% 0.085 224.283) */;}
.dark .dark\:hover\:bg-emerald-800:hover{background-color:color-mix(in oklab, var(--colors-emerald-800) var(--un-bg-opacity), transparent) /* oklch(43.2% 0.095 166.913) */;}
.dark .dark\:hover\:bg-fuchsia-800:hover{background-color:color-mix(in oklab, var(--colors-fuchsia-800) var(--un-bg-opacity), transparent) /* oklch(45.2% 0.211 324.591) */;}
.dark .dark\:hover\:bg-gray-700:hover{background-color:color-mix(in oklab, var(--colors-gray-700) var(--un-bg-opacity), transparent) /* oklch(37.3% 0.034 259.733) */;}
.dark .dark\:hover\:bg-gray-800:hover{background-color:color-mix(in oklab, var(--colors-gray-800) var(--un-bg-opacity), transparent) /* oklch(27.8% 0.033 256.848) */;}
.dark .dark\:hover\:bg-green-800:hover{background-color:color-mix(in oklab, var(--colors-green-800) var(--un-bg-opacity), transparent) /* oklch(44.8% 0.119 151.328) */;}
.dark .dark\:hover\:bg-indigo-800:hover{background-color:color-mix(in oklab, var(--colors-indigo-800) var(--un-bg-opacity), transparent) /* oklch(39.8% 0.195 277.366) */;}
.dark .dark\:hover\:bg-lime-800:hover{background-color:color-mix(in oklab, var(--colors-lime-800) var(--un-bg-opacity), transparent) /* oklch(45.3% 0.124 130.933) */;}
.dark .dark\:hover\:bg-orange-800:hover{background-color:color-mix(in oklab, var(--colors-orange-800) var(--un-bg-opacity), transparent) /* oklch(47% 0.157 37.304) */;}
.dark .dark\:hover\:bg-pink-800:hover{background-color:color-mix(in oklab, var(--colors-pink-800) var(--un-bg-opacity), transparent) /* oklch(45.9% 0.187 3.815) */;}
.dark .dark\:hover\:bg-purple-800:hover{background-color:color-mix(in oklab, var(--colors-purple-800) var(--un-bg-opacity), transparent) /* oklch(43.8% 0.218 303.724) */;}
.dark .dark\:hover\:bg-red-800:hover{background-color:color-mix(in oklab, var(--colors-red-800) var(--un-bg-opacity), transparent) /* oklch(44.4% 0.177 26.899) */;}
.dark .dark\:hover\:bg-rose-800:hover{background-color:color-mix(in oklab, var(--colors-rose-800) var(--un-bg-opacity), transparent) /* oklch(45.5% 0.188 13.697) */;}
.dark .dark\:hover\:bg-sky-800:hover{background-color:color-mix(in oklab, var(--colors-sky-800) var(--un-bg-opacity), transparent) /* oklch(44.3% 0.11 240.79) */;}
.dark .dark\:hover\:bg-teal-800:hover{background-color:color-mix(in oklab, var(--colors-teal-800) var(--un-bg-opacity), transparent) /* oklch(43.7% 0.078 188.216) */;}
.dark .dark\:hover\:bg-violet-800:hover{background-color:color-mix(in oklab, var(--colors-violet-800) var(--un-bg-opacity), transparent) /* oklch(43.2% 0.232 292.759) */;}
.dark .dark\:hover\:bg-yellow-800:hover{background-color:color-mix(in oklab, var(--colors-yellow-800) var(--un-bg-opacity), transparent) /* oklch(47.6% 0.114 61.907) */;}
.hover\:bg-amber-200:hover{background-color:color-mix(in oklab, var(--colors-amber-200) var(--un-bg-opacity), transparent) /* oklch(92.4% 0.12 95.746) */;}
.hover\:bg-blue-200:hover{background-color:color-mix(in oklab, var(--colors-blue-200) var(--un-bg-opacity), transparent) /* oklch(88.2% 0.059 254.128) */;}
.hover\:bg-cyan-200:hover{background-color:color-mix(in oklab, var(--colors-cyan-200) var(--un-bg-opacity), transparent) /* oklch(91.7% 0.08 205.041) */;}
.hover\:bg-emerald-200:hover{background-color:color-mix(in oklab, var(--colors-emerald-200) var(--un-bg-opacity), transparent) /* oklch(90.5% 0.093 164.15) */;}
.hover\:bg-fuchsia-200:hover{background-color:color-mix(in oklab, var(--colors-fuchsia-200) var(--un-bg-opacity), transparent) /* oklch(90.3% 0.076 319.62) */;}
.hover\:bg-gray-100:hover{background-color:color-mix(in oklab, var(--colors-gray-100) var(--un-bg-opacity), transparent) /* oklch(96.7% 0.003 264.542) */;}
.hover\:bg-gray-200:hover{background-color:color-mix(in oklab, var(--colors-gray-200) var(--un-bg-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.hover\:bg-green-200:hover{background-color:color-mix(in oklab, var(--colors-green-200) var(--un-bg-opacity), transparent) /* oklch(92.5% 0.084 155.995) */;}
.hover\:bg-indigo-200:hover{background-color:color-mix(in oklab, var(--colors-indigo-200) var(--un-bg-opacity), transparent) /* oklch(87% 0.065 274.039) */;}
.hover\:bg-lime-200:hover{background-color:color-mix(in oklab, var(--colors-lime-200) var(--un-bg-opacity), transparent) /* oklch(93.8% 0.127 124.321) */;}
.hover\:bg-orange-200:hover{background-color:color-mix(in oklab, var(--colors-orange-200) var(--un-bg-opacity), transparent) /* oklch(90.1% 0.076 70.697) */;}
.hover\:bg-pink-200:hover{background-color:color-mix(in oklab, var(--colors-pink-200) var(--un-bg-opacity), transparent) /* oklch(89.9% 0.061 343.231) */;}
.hover\:bg-purple-200:hover{background-color:color-mix(in oklab, var(--colors-purple-200) var(--un-bg-opacity), transparent) /* oklch(90.2% 0.063 306.703) */;}
.hover\:bg-red-200:hover{background-color:color-mix(in oklab, var(--colors-red-200) var(--un-bg-opacity), transparent) /* oklch(88.5% 0.062 18.334) */;}
.hover\:bg-rose-200:hover{background-color:color-mix(in oklab, var(--colors-rose-200) var(--un-bg-opacity), transparent) /* oklch(89.2% 0.058 10.001) */;}
.hover\:bg-sky-200:hover{background-color:color-mix(in oklab, var(--colors-sky-200) var(--un-bg-opacity), transparent) /* oklch(90.1% 0.058 230.902) */;}
.hover\:bg-teal-200:hover{background-color:color-mix(in oklab, var(--colors-teal-200) var(--un-bg-opacity), transparent) /* oklch(91% 0.096 180.426) */;}
.hover\:bg-violet-200:hover{background-color:color-mix(in oklab, var(--colors-violet-200) var(--un-bg-opacity), transparent) /* oklch(89.4% 0.057 293.283) */;}
.hover\:bg-yellow-200:hover{background-color:color-mix(in oklab, var(--colors-yellow-200) var(--un-bg-opacity), transparent) /* oklch(94.5% 0.129 101.54) */;}
.dark .dark\:focus\:ring-gray-600:focus{--un-ring-color:color-mix(in oklab, var(--colors-gray-600) var(--un-ring-opacity), transparent) /* oklch(44.6% 0.03 256.802) */;}
.focus\:ring-amber-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-amber-400) var(--un-ring-opacity), transparent) /* oklch(82.8% 0.189 84.429) */;}
.focus\:ring-blue-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-blue-400) var(--un-ring-opacity), transparent) /* oklch(70.7% 0.165 254.624) */;}
.focus\:ring-cyan-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-cyan-400) var(--un-ring-opacity), transparent) /* oklch(78.9% 0.154 211.53) */;}
.focus\:ring-emerald-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-emerald-400) var(--un-ring-opacity), transparent) /* oklch(76.5% 0.177 163.223) */;}
.focus\:ring-fuchsia-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-fuchsia-400) var(--un-ring-opacity), transparent) /* oklch(74% 0.238 322.16) */;}
.focus\:ring-gray-200:focus{--un-ring-color:color-mix(in oklab, var(--colors-gray-200) var(--un-ring-opacity), transparent) /* oklch(92.8% 0.006 264.531) */;}
.focus\:ring-gray-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-gray-400) var(--un-ring-opacity), transparent) /* oklch(70.7% 0.022 261.325) */;}
.focus\:ring-green-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-green-400) var(--un-ring-opacity), transparent) /* oklch(79.2% 0.209 151.711) */;}
.focus\:ring-indigo-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-indigo-400) var(--un-ring-opacity), transparent) /* oklch(67.3% 0.182 276.935) */;}
.focus\:ring-lime-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-lime-400) var(--un-ring-opacity), transparent) /* oklch(84.1% 0.238 128.85) */;}
.focus\:ring-orange-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-orange-400) var(--un-ring-opacity), transparent) /* oklch(75% 0.183 55.934) */;}
.focus\:ring-pink-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-pink-400) var(--un-ring-opacity), transparent) /* oklch(71.8% 0.202 349.761) */;}
.focus\:ring-purple-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-purple-400) var(--un-ring-opacity), transparent) /* oklch(71.4% 0.203 305.504) */;}
.focus\:ring-red-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-red-400) var(--un-ring-opacity), transparent) /* oklch(70.4% 0.191 22.216) */;}
.focus\:ring-rose-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-rose-400) var(--un-ring-opacity), transparent) /* oklch(71.2% 0.194 13.428) */;}
.focus\:ring-sky-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-sky-400) var(--un-ring-opacity), transparent) /* oklch(74.6% 0.16 232.661) */;}
.focus\:ring-teal-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-teal-400) var(--un-ring-opacity), transparent) /* oklch(77.7% 0.152 181.912) */;}
.focus\:ring-violet-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-violet-400) var(--un-ring-opacity), transparent) /* oklch(70.2% 0.183 293.541) */;}
.focus\:ring-yellow-400:focus{--un-ring-color:color-mix(in oklab, var(--colors-yellow-400) var(--un-ring-opacity), transparent) /* oklch(85.2% 0.199 91.936) */;}
}
@media (min-width: 40rem){
.sm\:px-10{padding-inline:calc(var(--spacing) * 10);}
.sm\:px-6{padding-inline:calc(var(--spacing) * 6);}
.sm\:h-7{height:calc(var(--spacing) * 7);}
.sm\:block{display:block;}
.sm\:hidden{display:none;}
}
@media (min-width: 48rem){
.md\:flex-row{flex-direction:row;}
.md\:block{display:block;}
.md\:hidden{display:none;}
.md\:items-center{align-items:center;}
.md\:justify-between{justify-content:space-between;}
}
@media (min-width: 64rem){
.lg\:block{display:block;}
.lg\:hidden{display:none;}
}
@media (min-width: 80rem){
.xl\:block{display:block;}
.xl\:hidden{display:none;}
}
@media (min-width: 96rem){
.\32 xl\:block{display:block;}
.\32 xl\:hidden{display:none;}
}