/* canvas/src/skill-illustration-v1.css */
.dx-skill-illustration {
  background: #101c28;
  color: #adc8db;
}
.dx-skill-illustration > svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.dx-tech-grid {
  stroke: #304253;
  opacity: .4;
  stroke-width: .55;
}
.dx-tech-drawing {
  stroke: #b2d0e2;
}
.dx-tech-accent {
  stroke: #71d4bd;
  stroke-width: 2;
}
.dx-tech-label {
  font:
    8px ui-monospace,
    SFMono-Regular,
    monospace;
  letter-spacing: 1px;
  fill: #8da6ba;
}
.dx-skill-artwork-caption {
  position: absolute;
  inset: auto 0 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
  background: #0d1723f5;
  padding: 5px 7px;
  color: #edf5fa;
  font-size: 10px;
  line-height: 1.25;
}
.dx-skill-artwork-caption > small {
  font-size: 8px;
  letter-spacing: .02em;
  color: #a8bdcc;
}
.dx-creative-card .dx-skill-artwork-caption > small {
  margin: 0;
  color: #a8bdcc;
  font-size: 8px;
}
.dx-skill-settings-thumb {
  display: block;
  width: 144px;
  flex: none;
}
.dx-skill-settings-thumb .dx-skill-illustration {
  aspect-ratio: 4/3;
}
@media (max-width: 600px) {
  .dx-skill-settings-thumb {
    width: 120px;
  }
}

/* canvas/src/skill-demo-thumbnail-v1.css */
.dx-skill-demo {
  background: #0d0f12;
}
.dx-library-thumbnail.dx-skill-demo > img {
  position: absolute;
  inset: 0;
}
.dx-library-thumbnail.dx-skill-demo > .dx-skill-demo-fill {
  object-fit: cover;
  filter: blur(18px) saturate(1.15);
  transform: scale(1.25);
  opacity: .8;
}
.dx-library-thumbnail.dx-skill-demo > .dx-skill-demo-image {
  object-fit: contain;
}
.dx-creative-detail > .dx-library-thumbnail.dx-skill-demo > img {
  background: none;
}
.dx-creative-demo-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 0;
  color: var(--dx-text-soft);
  font-size: calc(12px * var(--canvas-text-scale));
}
.dx-creative-demo-status.is-error {
  color: var(--dx-danger,#dc2626);
}

/* canvas/src/creative-library-v1.css */
.dx-creative-library {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-height: 0;
  color: var(--dx-text);
  font-size: calc(12px * var(--canvas-text-scale));
  overflow: hidden;
}
.dx-creative-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  flex: none;
}
.dx-creative-header h2 {
  font-size: calc(14px * var(--canvas-text-scale));
  font-weight: 600;
  margin: 0;
}
.dx-creative-library button {
  cursor: pointer;
}
.dx-creative-library button:disabled {
  cursor: default;
  opacity: .5;
}
.dx-creative-header > button,
.dx-creative-search > button,
.dx-creative-count button {
  border: 0;
  background: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 6px;
}
.dx-creative-library button:focus-visible,
.dx-creative-library a:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-creative-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 12px 10px;
  position: relative;
  flex: none;
}
.dx-creative-search > svg {
  position: absolute;
  left: 10px;
  pointer-events: none;
}
.dx-creative-search input {
  padding-left: 32px;
  padding-right: 30px;
  min-width: 0;
  width: 100%;
  font-size: inherit;
}
.dx-creative-search > button {
  position: absolute;
  right: 2px;
}
.dx-creative-tabs {
  display: flex;
  gap: 4px;
  padding: 0 12px 10px;
  flex-wrap: wrap;
  flex: none;
}
.dx-creative-tabs button,
.dx-creative-source button {
  border: 0;
  border-radius: 6px;
  background: none;
  padding: 7px 8px;
  font: inherit;
  font-size: calc(11px * var(--canvas-text-scale));
  line-height: 1.2;
}
.dx-creative-tabs button[aria-pressed=true],
.dx-creative-count button[aria-pressed=true] {
  background: var(--dx-surface-inset);
  font-weight: 600;
}
.dx-creative-source {
  display: flex;
  gap: 0;
  padding: 0 6px 7px;
  border-bottom: 1px solid var(--dx-border);
  flex-wrap: wrap;
  flex: none;
}
.dx-creative-source button[aria-pressed=true] {
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 5px;
}
.dx-creative-count {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 12px;
  color: var(--dx-text-soft);
  flex: none;
  font-size: calc(11px * var(--canvas-text-scale));
}
.dx-creative-count > div {
  display: flex;
  gap: 2px;
}
.dx-creative-scroll {
  overflow: auto;
  overscroll-behavior: contain;
  min-height: 80px;
  flex: 1;
  padding: 5px 12px 14px;
}
.dx-creative-items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 10px;
  align-content: start;
}
.dx-creative-card {
  position: relative;
  min-width: 0;
}
.dx-creative-card-main {
  display: block;
  width: 100%;
  background: none;
  border: 0;
  text-align: left;
  padding: 0;
  border-radius: 8px;
}
.dx-creative-card-copy {
  display: block;
  padding: 7px 25px 0 0;
  min-height: 45px;
}
.dx-creative-card strong {
  display: block;
  font-size: calc(12px * var(--canvas-text-scale));
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.dx-creative-card small {
  display: block;
  margin-top: 3px;
  font-size: calc(10px * var(--canvas-text-scale));
  line-height: 1.35;
  color: var(--dx-text-soft);
}
.dx-creative-add {
  position: absolute;
  right: 0;
  bottom: 5px;
  border: 1px solid var(--dx-border);
  background: var(--dx-surface);
  border-radius: 6px;
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
}
.dx-creative-card-main:hover .dx-library-thumbnail {
  outline: 1px solid var(--dx-text-soft);
  outline-offset: 2px;
}
.dx-library-thumbnail {
  position: relative;
  display: block;
  aspect-ratio: 3/2;
  overflow: hidden;
  border-radius: 8px;
  background: #192024;
  color: #fff;
}
.dx-library-thumbnail > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx-library-thumbnail .dx-library-after {
  position: absolute;
  inset: 0;
  clip-path: inset(0 0 0 50%);
}
.dx-library-thumbnail .dx-library-split {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  border-left: 1px solid #fff9;
}
.dx-library-thumbnail .dx-library-labels {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  background: #000b;
  padding: 4px 6px;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 500;
  color: #fff;
}
.dx-library-thumbnail svg {
  display: block;
  width: 100%;
  height: 100%;
}
.dx-library-cover-title {
  position: absolute;
  inset: auto 8px 12px;
  color: white;
  text-shadow: 0 1px 4px #000;
  font-weight: 600;
  font-size: 15px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.dx-library-cover-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 30%, #000c);
}
.dx-creative-items.is-list {
  grid-template-columns: 1fr;
  gap: 12px;
}
.dx-creative-items.is-list .dx-creative-card-main {
  display: flex;
  align-items: center;
  gap: 10px;
}
.dx-creative-items.is-list .dx-library-thumbnail {
  width: 92px;
  flex: none;
}
.dx-creative-items.is-list .dx-creative-card-copy {
  padding-top: 0;
  min-height: 0;
}
.dx-creative-items.is-list .dx-creative-add {
  bottom: calc(50% - 12px);
}
.dx-creative-detail {
  overflow: auto;
  overscroll-behavior: contain;
  padding: 0 14px 16px;
  flex: 1;
  min-height: 80px;
}
.dx-creative-back {
  display: flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: 0;
  padding: 3px 0 12px;
  font: inherit;
}
.dx-creative-detail h3 {
  font-size: calc(18px * var(--canvas-text-scale));
  line-height: 1.2;
  margin: 16px 0 8px;
  font-weight: 600;
}
.dx-creative-detail p {
  line-height: 1.5;
  margin: 8px 0 12px;
}
.dx-creative-origin,
.dx-creative-help {
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale));
  line-height: 1.45;
}
.dx-creative-discovery {
  padding: 8px 12px 0;
  margin: 0;
  flex: none;
}
.dx-creative-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 12px 0 18px;
}
.dx-creative-tags span {
  padding: 4px 6px;
  border-radius: 6px;
  background: var(--dx-surface-inset);
  font-size: calc(10px * var(--canvas-text-scale));
}
.dx-creative-detail-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 18px;
  align-items: flex-start;
}
.dx-creative-detail a {
  color: inherit;
  display: flex;
  gap: 5px;
  align-items: center;
  text-underline-offset: 3px;
}
.dx-creative-detail pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: inherit;
  font-size: calc(11px * var(--canvas-text-scale));
  max-height: 200px;
  overflow: auto;
  background: var(--dx-surface-inset);
  padding: 10px;
  border-radius: 6px;
}
.dx-creative-empty {
  padding: 20px 4px;
  line-height: 1.5;
}
.dx-creative-empty h3 {
  font-size: inherit;
  margin: 0 0 8px;
}
.dx-creative-library footer {
  flex: none;
  padding: 10px 12px;
  border-top: 1px solid var(--dx-border);
  background: var(--dx-surface);
  max-height: 35%;
  overflow: auto;
}
.dx-creative-library footer > div {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.dx-creative-library footer p {
  margin: 0 0 9px;
  line-height: 1.4;
  font-size: calc(11px * var(--canvas-text-scale));
}
.dx-creative-library footer p svg {
  display: inline;
  vertical-align: middle;
  margin-right: 4px;
}
.dx-creative-library [role=alert] {
  color: var(--dx-danger,#dc2626);
}
@media (prefers-reduced-motion: no-preference) {
  .dx-creative-card-main .dx-library-thumbnail {
    transition: outline-color 120ms ease-out;
  }
}
@media (max-height: 650px) {
  .dx-creative-header {
    padding: 8px 12px;
  }
  .dx-creative-tabs {
    padding-bottom: 5px;
  }
  .dx-creative-library footer {
    padding: 6px 12px;
  }
}
.dx-assets-panel-host:has(.dx-creative-library) {
  width: min(420px, calc((100dvw - 24px - var(--canvas-nav-width) * var(--canvas-ui-scale)) / var(--canvas-ui-scale)));
  height: calc((100dvh - 130px) / var(--canvas-ui-scale)) !important;
}
.dx-creative-header > button,
.dx-creative-search > button,
.dx-creative-count button,
.dx-creative-tabs button,
.dx-creative-source button,
.dx-creative-card-main,
.dx-creative-add,
.dx-creative-back {
  color: inherit;
}
.dx-creative-scroll,
.dx-creative-detail {
  min-height: 0;
}
@media (max-width: 1000px) {
  .dx-creative-tabs,
  .dx-creative-source {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  .dx-creative-tabs button,
  .dx-creative-source button {
    white-space: nowrap;
    flex: none;
  }
  .dx-creative-library footer {
    max-height: 25%;
  }
}
@media (max-width: 760px) {
  .dx-assets-panel-host:has(.dx-creative-library) {
    width: calc((100dvw - 24px) / var(--canvas-ui-scale));
  }
}
@media (max-width: 1000px) {
  .dx-assets-panel-host:has(.dx-creative-library) {
    height: calc((100dvh - 208px) / var(--canvas-ui-scale)) !important;
  }
  .dx-creative-header {
    padding: 8px 12px;
  }
  .dx-creative-search {
    margin-bottom: 6px;
  }
  .dx-creative-tabs {
    padding-bottom: 4px;
  }
  .dx-creative-source {
    padding-bottom: 4px;
  }
  .dx-creative-detail > .dx-library-thumbnail {
    height: 135px;
    aspect-ratio: auto;
  }
  .dx-creative-detail > .dx-library-thumbnail > img {
    object-fit: contain;
    background: #192024;
  }
  .dx-creative-items.is-grid .dx-library-thumbnail {
    aspect-ratio: 16/9;
  }
}
.dx-library-comparison {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px;
  background: #ffffffa0;
}
.dx-library-comparison-cell {
  position: relative;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  background: #192024;
}
.dx-library-comparison-cell > img,
.dx-library-comparison .dx-library-after {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  clip-path: none;
}
.dx-library-comparison .dx-library-labels {
  justify-content: center;
}
.dx-library-rendering {
  position: absolute;
  inset: 0 0 20px;
  display: grid;
  place-items: center;
  padding: 4px;
  text-align: center;
  font-size: 9px;
  color: #c3c8cb;
}
.dx-library-output-example {
  background: #121517;
}
.dx-library-example-stage {
  position: absolute;
  inset: 5px 5px 31px;
  container-type: size;
  display: grid;
  place-items: center;
}
.dx-library-example-frame {
  position: relative;
  width: min(100cqw, calc(100cqh * var(--dx-example-ratio)));
  aspect-ratio: var(--dx-example-ratio);
  overflow: hidden;
  border-radius: 2px;
  outline: 1px solid #ffffff40;
}
.dx-library-example-frame > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx-library-output-example.is-monochrome img {
  filter: grayscale(1);
}
.dx-library-example-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0 4px;
  font-size: 9px;
  line-height: 1.25;
  background: #0d1012;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
}
.dx-library-example-caption small {
  font-size: 8px;
  color: #c3c8cb;
}
.dx-library-thumbnail svg.dx-library-media-mark {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 14px;
  height: 14px;
  color: #fff;
  filter: drop-shadow(0 1px 2px #000);
}
.dx-library-no-preview {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--dx-surface-inset);
  color: var(--dx-text-soft);
  text-align: center;
  padding: 10px;
  font-size: 11px;
  line-height: 1.3;
}
.dx-library-no-preview > span {
  color: var(--dx-text);
  font-weight: 500;
}
.dx-library-no-preview small {
  font-size: 10px;
}
.dx-library-phrase {
  white-space: nowrap;
}
.dx-library-thumbnail.dx-library-no-preview > svg {
  width: 24px;
  height: 24px;
  flex: none;
}
.dx-creative-detail .dx-library-thumbnail.dx-library-no-preview > svg {
  width: 34px;
  height: 34px;
}
.dx-creative-items.is-list .dx-library-example-stage {
  inset: 3px 3px 17px;
}
.dx-creative-items.is-list .dx-library-example-caption {
  height: 16px;
  font-size: 8px;
}
.dx-creative-items.is-list .dx-library-example-caption small,
.dx-creative-items.is-list .dx-library-no-preview small {
  display: none;
}
.dx-creative-items.is-list .dx-library-no-preview {
  padding: 4px;
  font-size: 9px;
  gap: 3px;
}
.dx-creative-items.is-list .dx-library-labels > span + span {
  display: none;
}
@container (min-width:570px) {
  .dx-creative-items:not(.is-list) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@container (min-width:760px) {
  .dx-creative-items:not(.is-list) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* canvas/src/creative-library-panel-v2.css */
.dx-creative-library-host {
  position: absolute;
  z-index: 32;
  zoom: var(--canvas-ui-scale);
  container-type: inline-size;
  box-sizing: border-box;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--dx-surface);
  color: var(--dx-text);
  pointer-events: auto;
}
.dx-creative-library-host[hidden] {
  display: none;
}
.dx-creative-library-host[data-front=true] {
  z-index: 55;
}
.dx-creative-library-host[data-palette-interaction=resizing] {
  -webkit-user-select: none;
  user-select: none;
}
.dx-creative-library-host[data-palette-interaction=moving] {
  -webkit-user-select: none;
  user-select: none;
  box-shadow: 0 12px 30px #0003;
}
.dx-creative-library-host .dx-creative-header {
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-creative-library-host[data-palette-interaction=moving] .dx-creative-header {
  cursor: grabbing;
}
.dx-creative-library-host .dx-creative-header:focus {
  outline: none;
}
.dx-creative-library-host .dx-creative-header:focus-visible {
  outline: 1px solid var(--dx-text-soft);
  outline-offset: -4px;
  border-radius: 10px;
}
.dx-creative-library-host .dx-creative-header button {
  cursor: pointer;
}
.dx-creative-library-host .dx-creative-library footer {
  padding-right: 24px;
}
.dx-library-resize {
  position: absolute;
  z-index: 3;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-library-resize-n,
.dx-library-resize-s {
  left: 14px;
  right: 14px;
  height: 6px;
  cursor: ns-resize;
}
.dx-library-resize-n {
  top: 0;
}
.dx-library-resize-s {
  bottom: 0;
}
.dx-library-resize-e,
.dx-library-resize-w {
  top: 14px;
  bottom: 14px;
  width: 6px;
  cursor: ew-resize;
}
.dx-library-resize-e {
  right: 0;
}
.dx-library-resize-w {
  left: 0;
}
.dx-library-resize-ne,
.dx-library-resize-nw,
.dx-library-resize-sw {
  width: 14px;
  height: 14px;
}
.dx-library-resize-ne {
  top: 0;
  right: 0;
  cursor: nesw-resize;
}
.dx-library-resize-nw {
  top: 0;
  left: 0;
  cursor: nwse-resize;
}
.dx-library-resize-sw {
  bottom: 0;
  left: 0;
  cursor: nesw-resize;
}
.dx-library-resize-se {
  bottom: 0;
  right: 0;
  width: 18px;
  height: 18px;
  cursor: nwse-resize;
  border-radius: 4px 4px 11px 4px;
}
.dx-library-resize-se:after {
  content: "";
  position: absolute;
  right: 3px;
  bottom: 3px;
  width: 10px;
  height: 10px;
  background:
    linear-gradient(
      135deg,
      transparent 0 46%,
      var(--dx-text-soft) 46% 54%,
      transparent 54% 71%,
      var(--dx-text-soft) 71% 79%,
      transparent 79%);
}
.dx-library-resize-se:hover:after,
.dx-creative-library-host[data-palette-interaction=resizing] .dx-library-resize-se:after {
  background:
    linear-gradient(
      135deg,
      transparent 0 46%,
      var(--dx-text) 46% 54%,
      transparent 54% 71%,
      var(--dx-text) 71% 79%,
      transparent 79%);
}
.dx-library-resize-se:focus-visible {
  outline: 0;
  box-shadow: inset 0 0 0 2px var(--dx-text);
  background: var(--dx-hover);
}
.dx-creative-library-host {
  container-type: size;
}
@container (max-height:359px) {
  .dx-creative-library-host .dx-creative-library {
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .dx-creative-library-host .dx-creative-scroll,
  .dx-creative-library-host .dx-creative-detail {
    flex: none;
    min-height: 150px;
  }
}

/* canvas/src/titlebar-navigation-v1.css */
.dx-canvas-app.has-browser-titlebar {
  top: 42px;
  height: calc(100% - 42px);
}
.dx-browser-titlebar {
  position: absolute;
  left: 0;
  right: 0;
  top: -42px;
  height: 42px;
  background: var(--dx-surface);
  z-index: 44;
}
.dx-titlebar-navigation {
  position: absolute;
  top: 4px;
  left: max(94px, calc((var(--canvas-nav-width) - 34px) * var(--canvas-ui-scale,1)));
  transition: left 240ms cubic-bezier(.22, 1, .36, 1);
}
.dx-titlebar-navigation button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(30px * var(--canvas-ui-scale,1));
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
  cursor: pointer;
}
.dx-titlebar-navigation svg {
  width: calc(19px * var(--canvas-ui-scale,1));
  height: calc(19px * var(--canvas-ui-scale,1));
}
.dx-titlebar-navigation button:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-titlebar-navigation button:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-canvas-app.has-browser-titlebar > .dx-titlebar-actions,
.dx-canvas-app.has-browser-titlebar .dx-theme-control {
  top: -36px;
}
.dx-rail-brand .dx-brand .df-brand-image {
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  .dx-titlebar-navigation {
    transition: none;
  }
}
.has-electron-titlebar .dx-browser-titlebar {
  -webkit-app-region: drag;
  -webkit-user-select: none;
  user-select: none;
}
.has-electron-titlebar .dx-titlebar-navigation,
.has-electron-titlebar .dx-titlebar-actions,
.has-electron-titlebar .dx-theme-control {
  -webkit-app-region: no-drag;
}
.dx-titlebar-caption {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font:
    500 12px -apple-system,
    BlinkMacSystemFont,
    sans-serif;
  color: var(--dx-text-soft);
  pointer-events: none;
}

/* canvas/src/themed-select-v1.css */
.dx-select-trigger[data-slot] {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  width: auto;
  height: auto;
  min-height: 28px;
  padding: 4px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
  text-align: left;
  box-shadow: none;
  -webkit-user-select: none;
  user-select: none;
  outline: none;
}
.dx-select-trigger[data-slot] > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-select-trigger[data-slot] > svg {
  width: 13px;
  height: 13px;
  flex: none;
  color: var(--dx-text-soft);
}
.dx-select-trigger[data-slot]:hover:not(:disabled) {
  background: var(--dx-hover);
}
.dx-select-trigger[data-slot]:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.dx-select-trigger[data-slot]:focus {
  outline: none;
  box-shadow: none;
}
.dx-select-trigger[data-slot]:focus-visible {
  border-color: var(--dx-text);
  outline: none;
  box-shadow: none;
}
.dx-select-menu[data-slot] {
  z-index: 110;
  min-width: var(--radix-select-trigger-width);
  max-width: calc(100vw - 24px);
  max-height: min(360px, var(--radix-select-content-available-height));
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: 400 calc(13px * var(--canvas-text-scale,1) * var(--canvas-ui-scale,1))/1.4 var(--dx-font-sans);
  box-shadow: none;
  animation: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-select-menu [data-slot=select-label] {
  padding: 7px 8px 4px;
  font: inherit;
  font-size: .85em;
  font-weight: 500;
  color: var(--dx-text-soft);
}
.dx-select-menu [role=option] {
  min-height: 30px;
  padding: 6px 30px 6px 8px;
  border-radius: 3px;
  font: inherit;
  color: var(--dx-text);
  outline: none;
  cursor: default;
}
.dx-select-menu [role=option][data-highlighted] {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  outline: none;
}
.dx-select-menu [role=option][data-disabled] {
  opacity: .45;
}
.dx-select-menu [data-slot=select-scroll-up-button],
.dx-select-menu [data-slot=select-scroll-down-button] {
  color: var(--dx-text-soft);
  background: var(--dx-surface);
}
.dx-select-trigger.dx-model-picker {
  width: 100%;
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-conversation-output .dx-select-trigger {
  flex: 1;
}
.dx-appearance-setting .dx-select-trigger {
  max-width: 65%;
}
@media (forced-colors: active) {
  .dx-select-menu [role=option][data-highlighted] {
    outline: 1px solid Highlight;
  }
  .dx-select-trigger[data-slot]:focus-visible {
    border-color: Highlight;
  }
}

/* canvas/src/generation-request-settings-v1.css */
.dx-request-settings {
  display: grid;
  gap: 12px;
  min-width: 0;
  margin-bottom: 28px;
}
.dx-request-settings h3,
.dx-request-settings h4,
.dx-request-settings p {
  margin: 0;
}
.dx-request-settings > p,
.dx-request-settings-field > p {
  color: var(--dx-text-soft);
  overflow-wrap: anywhere;
}
.dx-request-settings-model,
.dx-request-settings-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.dx-request-settings .dx-select-trigger {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.dx-request-settings-field > label {
  font-weight: 500;
}
.dx-request-settings .dx-generation-options {
  max-height: none;
  overflow: visible;
  border: 0;
  padding: 0;
  margin: 0;
}
.dx-request-settings .dx-comfy-selection {
  max-height: none;
  overflow: visible;
}
.dx-conversation > .dx-conversation-history {
  scrollbar-width: thin;
  scrollbar-color: var(--dx-text-faint) transparent;
}

/* canvas/src/settings-tabs-v1.css */
.dx-settings-tabs {
  --dx-settings-row-height: max(54px, calc(48px * var(--canvas-text-scale, 1)));
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  color: var(--dx-text, #1f1f1f);
  background: var(--dx-bg, transparent);
  font-family: var(--dx-font-sans, Roboto, Arial, sans-serif);
}
.dx-settings-tabs,
.dx-settings-tabs *,
.dx-settings-tabs *::before,
.dx-settings-tabs *::after {
  box-sizing: border-box;
}
.dx-settings-tablist {
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
  width: 100%;
  max-width: 960px;
  height: var(--dx-settings-row-height);
  min-width: 0;
  margin: 0 auto;
  padding: 0 24px;
  overflow-x: auto;
  overflow-y: hidden;
  border-bottom: 1px solid var(--dx-border, #d6d6d6);
  scrollbar-width: thin;
  scrollbar-color: var(--dx-border, #d6d6d6) transparent;
  overscroll-behavior-x: contain;
}
.dx-settings-tablist::-webkit-scrollbar {
  height: 8px;
}
.dx-settings-tablist::-webkit-scrollbar-track {
  background: transparent;
}
.dx-settings-tablist::-webkit-scrollbar-thumb {
  background: var(--dx-border, #d6d6d6);
}
.dx-app-settings .dx-settings-tabs .dx-settings-tab {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 0 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--dx-text-soft, #616161);
  font-family: var(--dx-font-sans, Roboto, Arial, sans-serif);
  font-size: calc(10px * var(--canvas-text-scale, 1));
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.dx-settings-tab > svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
}
.dx-settings-tab::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 0;
  background: var(--dx-text, #1f1f1f);
  pointer-events: none;
  transition: height 300ms ease-out;
}
.dx-settings-tab[aria-selected=true]::after {
  height: 2px;
}
.dx-settings-tab:hover::after,
.dx-settings-tab:focus-visible::after {
  height: 4px;
}
.dx-app-settings .dx-settings-tabs .dx-settings-tab[aria-selected=true],
.dx-app-settings .dx-settings-tabs .dx-settings-tab:hover,
.dx-app-settings .dx-settings-tabs .dx-settings-tab:focus-visible {
  color: var(--dx-text, #1f1f1f);
}
.dx-app-settings .dx-settings-tabs .dx-settings-tab:focus-visible {
  outline: 2px solid var(--dx-text, #1f1f1f);
  outline-offset: -2px;
}
.dx-settings-panel {
  display: block;
  flex: 1 1 auto;
  width: 100%;
  max-width: 960px;
  min-width: 0;
  min-height: 0;
  margin: 0 auto;
  padding: 24px 24px 32px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.dx-settings-panel[hidden] {
  display: none !important;
}
.dx-settings-panel:focus-visible {
  outline: 2px solid var(--dx-text, #1f1f1f);
  outline-offset: -2px;
}
.dx-settings-panel-content {
  width: 100%;
  max-width: 680px;
  min-width: 0;
  overflow: visible;
}
@media (prefers-reduced-motion: reduce) {
  .dx-settings-tab::after {
    transition: none;
  }
}
@media (max-width: 640px) {
  .dx-settings-tablist {
    padding-inline: 16px;
  }
  .dx-settings-panel {
    padding: 20px 16px 28px;
  }
}
.dx-app-settings.dx-app-settings-tabbed {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: 0;
}
.dx-app-settings.dx-app-settings-tabbed > header {
  width: 100%;
  max-width: 960px;
  flex: none;
  margin: 0 auto;
  padding: 0 24px;
}
.dx-app-settings.dx-app-settings-tabbed h1 {
  font-weight: 700;
  margin-top: 16px;
}
.dx-app-settings.dx-app-settings-tabbed h3 {
  font-weight: 700;
}
.dx-app-settings-tabbed > .dx-settings-tabs {
  flex: 1;
  max-width: 960px;
  height: auto;
  margin: 0 auto;
  zoom: var(--canvas-ui-scale,1);
}
.dx-app-settings-tabbed .dx-settings-panel {
  container-type: inline-size;
  scrollbar-color: var(--dx-border) transparent;
}
.dx-app-settings-tabbed .dx-settings-panel-content {
  padding-bottom: 0;
  overflow-wrap: anywhere;
}
.dx-app-settings-tabbed .dx-settings-panel-content > section:first-child {
  margin-top: 0;
}
.dx-app-settings-tabbed .dx-settings-panel-content > h3:first-child,
.dx-app-settings-tabbed .dx-settings-panel-content > section:first-child > h3:first-child {
  margin-top: 0;
}
.dx-app-settings-tabbed .dx-skill-list {
  max-height: none;
  overflow: visible;
}
.dx-app-settings-tabbed .dx-settings-panel [data-slot=button] {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}
@container (max-width:480px) {
  .dx-settings-panel .dx-appearance-setting {
    align-items: flex-start;
    flex-direction: column;
  }
  .dx-settings-panel .dx-appearance-setting .dx-select-trigger {
    max-width: 100%;
    width: 100%;
  }
  .dx-settings-panel .dx-provider-row {
    flex-wrap: wrap;
  }
  .dx-settings-panel .dx-provider-row > div {
    min-width: 0;
    flex-basis: calc(100% - 32px);
  }
  .dx-settings-panel .dx-provider-actions,
  .dx-settings-panel .vq-actions {
    flex-wrap: wrap;
  }
}
@media (max-width: 640px) {
  .dx-app-settings.dx-app-settings-tabbed > header {
    padding-inline: 16px;
  }
}

/* canvas/src/skill-library-v1.css */
.dx-skill-library {
  margin-block: 24px;
  min-width: 0;
}
.dx-skill-toolbar {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 10px;
  margin-block: 10px;
}
.dx-skill-grow {
  flex: 1;
  min-width: 160px;
}
.dx-skill-library label {
  display: grid;
  gap: 5px;
}
.dx-skill-library input:not([type=checkbox]):not([type=file]) {
  width: 100%;
  min-width: 0;
}
.dx-skill-list {
  list-style: none;
  margin: 12px 0;
  padding: 0;
  max-height: 520px;
  overflow: auto;
  scrollbar-color: var(--dx-border) transparent;
}
.dx-skill-list > li {
  padding: 16px 0;
  border-bottom: 1px solid var(--dx-border);
  overflow-wrap: anywhere;
}
.dx-skill-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.dx-skill-list small {
  display: block;
  color: var(--dx-text-muted);
  margin-top: 3px;
}
.dx-skill-library .dx-skill-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-skill-toggle input {
  accent-color: var(--dx-text);
  width: 16px;
  height: 16px;
}
.dx-skill-switches {
  display: grid;
  gap: 10px;
  justify-items: start;
}
.dx-skill-list p {
  max-width: 65ch;
}
.dx-skill-library a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-skill-library a svg {
  display: inline;
  vertical-align: middle;
}
.dx-skill-library summary {
  cursor: pointer;
}
.dx-skill-library button:focus-visible,
.dx-skill-library a:focus-visible,
.dx-skill-library summary:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-skill-link-form {
  margin-top: 24px;
  padding-top: 12px;
  border-top: 1px solid var(--dx-border);
}
.dx-skill-upload input {
  max-width: 100%;
  font: inherit;
}
.dx-skill-preview {
  margin-top: 20px;
  padding-top: 12px;
  border-top: 1px solid var(--dx-border);
  overflow-wrap: anywhere;
}
.dx-skill-preview pre {
  white-space: pre-wrap;
  max-height: 260px;
  overflow: auto;
  font: inherit;
  line-height: 1.5;
}
@media (max-width: 600px) {
  .dx-skill-row {
    align-items: flex-start;
  }
  .dx-skill-list {
    max-height: 60vh;
  }
  .dx-skill-grow {
    min-width: 120px;
  }
  .dx-skill-toolbar {
    align-items: stretch;
  }
}

/* canvas/src/share-menu-v1.css */
.dx-share-trigger {
  position: absolute;
  right: 62px;
  top: 6px;
  z-index: 66;
}
.dx-share-trigger > button {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 0 9px;
  border: 0;
  border-radius: 6px;
  background: var(--dx-bg);
  color: var(--dx-text-soft);
  font: inherit;
  font-size: calc(12px * var(--canvas-text-scale));
}
.dx-share-trigger > button:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-share-trigger > button:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-share-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.dx-share-form > label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: calc(12px * var(--canvas-text-scale));
  color: var(--dx-text);
}
.dx-share-form .dx-share-check {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.dx-share-project {
  overflow-wrap: anywhere;
  font-size: calc(14px * var(--canvas-text-scale));
}
.dx-share-destination,
.dx-share-result-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.dx-share-destination > span {
  flex: 1;
  min-width: 100px;
  overflow-wrap: anywhere;
  font-size: calc(12px * var(--canvas-text-scale));
}
.dx-share-note,
.dx-share-count,
.dx-share-result p,
.dx-share-connect p,
.dx-share-folders p {
  font-size: calc(12px * var(--canvas-text-scale));
  line-height: 1.5;
  color: var(--dx-text-soft);
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-share-note {
  max-width: 65ch;
}
.dx-share-count {
  font-variant-numeric: tabular-nums;
}
.dx-share-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 4px;
}
.dx-share-result {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dx-share-result p {
  color: var(--dx-text);
}
.dx-share-error {
  font-size: calc(12px * var(--canvas-text-scale));
  color: var(--dx-text);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.dx-share-folders {
  max-height: 200px;
  overflow: auto;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  padding: 8px;
}
.dx-share-folders > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-share-folders strong {
  overflow-wrap: anywhere;
  font-size: calc(12px * var(--canvas-text-scale));
}
.dx-share-folders > button {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 0;
  background: transparent;
  color: var(--dx-text);
  text-align: left;
  overflow-wrap: anywhere;
  font-size: calc(12px * var(--canvas-text-scale));
}
.dx-share-folders > button:hover {
  background: var(--dx-hover);
}
.dx-share-spin {
  display: inline-block;
  animation: dx-share-spin 1s linear infinite;
}
@keyframes dx-share-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .dx-share-spin {
    animation: none;
  }
}
@media (max-width: 500px) {
  .dx-share-trigger > button span {
    display: none;
  }
}
.dx-google-share {
  width: 520px;
  max-width: min(520px, calc((100vw - 32px)/var(--canvas-ui-scale,1)));
  padding: 24px 0 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: var(--dx-surface) !important;
  color: var(--dx-text);
  display: flex !important;
  flex-direction: column;
}
.dx-google-share .dx-share-heading {
  padding: 0 48px 20px 24px;
  flex: none;
  text-align: left;
}
.dx-google-share [data-slot=dialog-title] {
  font: 500 calc(22px * var(--canvas-text-scale,1))/1.3 var(--dx-font-sans);
  overflow-wrap: anywhere;
}
.dx-google-share [data-slot=dialog-description] {
  font: 400 calc(12px * var(--canvas-text-scale,1))/1.5 var(--dx-font-sans);
  color: var(--dx-text-soft);
  margin-top: 6px;
}
.dx-share-scroll {
  overflow-y: auto;
  min-height: 0;
  overscroll-behavior: contain;
}
.dx-share-main {
  padding: 0 24px;
  overflow-y: visible;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  overscroll-behavior: contain;
}
.dx-share-add {
  margin: 0 0 24px;
}
.dx-google-share input[data-slot=input] {
  height: auto;
  min-height: 44px;
  padding: 10px 13px;
  border-radius: 6px;
  background: transparent;
  font-size: calc(13px * var(--canvas-text-scale,1));
  line-height: 1.4;
}
.dx-share-invite-options {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 12px;
}
.dx-share-invite-options > .dx-select-trigger {
  width: auto;
  min-width: 105px;
}
.dx-share-invite-options > .dx-share-check {
  flex: 1;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-google-share input[type=checkbox] {
  accent-color: var(--dx-text);
  width: 15px;
  height: 15px;
  flex: none;
}
.dx-share-section {
  margin: 0 0 24px;
  min-width: 0;
}
.dx-share-section h3 {
  font: 500 calc(15px * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
  margin: 0 0 12px;
}
.dx-share-people {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.dx-share-person,
.dx-share-general-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.dx-share-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  background: var(--dx-surface-inset);
  color: var(--dx-text-soft);
  border-radius: 50%;
  font: 500 calc(15px * var(--canvas-text-scale,1))/1 var(--dx-font-sans);
}
.dx-share-person-name {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
  overflow-wrap: anywhere;
}
.dx-share-person-name strong {
  font-size: calc(13px * var(--canvas-text-scale,1));
  line-height: 1.4;
  font-weight: 500;
}
.dx-share-person-name span,
.dx-share-role {
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.4;
  color: var(--dx-text-soft);
}
.dx-share-role {
  flex: none;
}
.dx-share-person > .dx-select-trigger {
  width: auto;
  max-width: 42%;
  flex: none;
}
.dx-google-share .dx-select-trigger {
  min-height: 34px;
  height: auto;
  padding: 5px 9px;
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.4;
}
.dx-share-person > .dx-select-trigger,
.dx-share-general-detail > .dx-select-trigger {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
.dx-share-person > .dx-select-trigger:hover,
.dx-share-general-detail > .dx-select-trigger:hover {
  background: var(--dx-hover);
}
.dx-share-person > .dx-select-trigger:focus-visible,
.dx-share-general-detail > .dx-select-trigger:focus-visible {
  border-color: var(--dx-text);
}
.dx-share-general-detail {
  flex: 1;
  min-width: 0;
}
.dx-share-general-detail > .dx-select-trigger {
  width: auto;
  max-width: 100%;
  margin-left: -9px;
  font-weight: 500;
}
.dx-share-general-detail p {
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
  color: var(--dx-text-soft);
  margin: 2px 0 0;
  overflow-wrap: anywhere;
}
.dx-share-copy-info {
  display: flex;
  align-items: center;
  gap: 12px;
  border-top: 1px solid var(--dx-border);
  padding-top: 15px;
}
.dx-share-copy-info p {
  flex: 1;
  margin: 0;
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.55;
  color: var(--dx-text-soft);
}
.dx-share-copy-info p > span {
  display: block;
}
.dx-share-copy-info .dx-share-changed {
  color: var(--dx-text);
  font-weight: 500;
}
.dx-google-share .dx-share-settings-button {
  padding: 8px;
  flex: none;
  width: 36px;
  height: 36px;
}
.dx-share-footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 18px 24px 24px;
  flex: none;
  background: var(--dx-surface);
}
.dx-share-footer > div {
  display: flex;
  gap: 8px;
  margin-left: auto;
  flex: none;
}
.dx-share-footer [data-slot=button] {
  min-height: 36px;
  height: auto;
  border-radius: 999px;
  padding: 8px 20px;
  line-height: 1.4;
}
.dx-share-footer > div > [data-slot=button]:last-child {
  min-width: 82px;
}
.dx-share-main > label {
  display: flex;
  flex-direction: column;
  gap: 7px;
  font-size: calc(12px * var(--canvas-text-scale,1));
  margin-bottom: 16px;
}
.dx-share-main > .dx-share-note {
  margin: 12px 0;
}
.dx-share-main > .dx-share-back {
  align-self: flex-start;
  margin: -8px 0 16px -8px;
}
.dx-share-location {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.dx-share-location span {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: calc(13px * var(--canvas-text-scale,1));
}
.dx-share-location svg {
  flex: none;
}
.dx-share-main > .dx-share-folders {
  flex: none;
  margin-top: 12px;
}
.dx-share-status {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
}
.dx-share-status:has(span:empty) {
  display: none;
}
.dx-share-status:not(:has(span:empty)) {
  margin-top: 14px;
}
.dx-share-links {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.dx-share-links a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: calc(11px * var(--canvas-text-scale,1));
  text-decoration: underline;
  text-underline-offset: 3px;
  color: var(--dx-text-soft);
}
.dx-share-links a:hover {
  color: var(--dx-text);
}
.dx-share-links input {
  width: 100%;
}
.dx-share-loading {
  padding: 20px 0 36px;
  font-size: calc(13px * var(--canvas-text-scale,1));
  color: var(--dx-text-soft);
}
.dx-google-share .dx-share-connect {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 24px;
}
.dx-google-share .dx-share-connect p {
  flex-basis: 100%;
}
.dx-google-share .dx-share-error {
  margin: 12px 0 0;
}
.dx-google-share .dx-share-error p {
  margin: 0 0 8px;
}
@media (max-width: 600px) {
  .dx-google-share {
    padding-top: 18px !important;
  }
  .dx-google-share .dx-share-heading {
    padding: 0 40px 18px 18px;
  }
  .dx-share-main {
    padding: 0 18px;
  }
  .dx-share-footer {
    padding: 16px 18px 18px;
  }
  .dx-share-footer [data-slot=button] {
    padding: 8px 14px;
  }
  .dx-share-person,
  .dx-share-general-row {
    gap: 8px;
  }
  .dx-share-avatar {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }
  .dx-share-location {
    align-items: flex-start;
    flex-wrap: wrap;
  }
}
.dx-share-discard {
  margin-top: 14px;
  padding: 12px;
  background: var(--dx-surface-inset);
  border-radius: 8px;
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-share-discard p {
  margin: 0 0 8px;
}
.dx-share-discard button + button {
  margin-left: 8px;
}
.dx-share-recipients {
  margin: 20px 0 0;
  padding-top: 18px;
  border-top: 1px solid var(--dx-border);
}
.dx-share-progress {
  margin-top: 20px;
  padding: 14px;
  border-radius: 10px;
  background: var(--dx-surface-inset);
}
.dx-share-progress-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-share-progress-label strong {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.dx-share-progress-track {
  height: 6px;
  margin: 10px 0;
  background: var(--dx-border);
  border-radius: 999px;
  overflow: hidden;
}
.dx-share-progress-track > div {
  height: 100%;
  background: var(--dx-text);
  border-radius: inherit;
  transition: width .2s ease;
}
.dx-share-progress p {
  margin: 6px 0 0;
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.5;
  color: var(--dx-text-soft);
  overflow-wrap: anywhere;
}
.dx-share-progress button {
  margin-top: 10px;
}
@media (prefers-reduced-motion: reduce) {
  .dx-share-progress-track > div {
    transition: none;
  }
}

/* canvas/src/history-palette-v1.css */
[data-radix-popper-content-wrapper]:has(> .dx-history-palette) {
  transform: none !important;
  will-change: auto !important;
  left: 0 !important;
  top: 0 !important;
  min-width: 0 !important;
}
.dx-recovery-menu.dx-history-palette {
  position: fixed;
  box-sizing: border-box;
  max-width: none;
  max-height: none;
  visibility: hidden;
}
.dx-history-palette[style*="left:"] {
  visibility: visible;
}
.dx-history-palette > header {
  flex: none;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-history-palette > header:focus-visible {
  outline: 1px solid var(--dx-text-soft);
  outline-offset: -4px;
  border-radius: 8px;
}
.dx-history-palette > header button {
  cursor: pointer;
}
.dx-history-palette[data-palette-interaction=moving] > header {
  cursor: grabbing;
}
.dx-history-body {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
  overflow: auto;
  overscroll-behavior: contain;
}
.dx-history-body > .dx-recovery-list {
  flex: 1;
  min-height: 100px;
}
.dx-history-body > .dx-history-views,
.dx-history-body > .dx-history-retention,
.dx-history-body > .dx-history-controls,
.dx-history-body > .dx-recovery-caption {
  flex: none;
}
.dx-history-resize {
  position: absolute;
  z-index: 3;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-history-resize-n,
.dx-history-resize-s {
  left: 10px;
  right: 10px;
  height: 6px;
  cursor: ns-resize;
}
.dx-history-resize-n {
  top: 0;
}
.dx-history-resize-s {
  bottom: 0;
}
.dx-history-resize-e,
.dx-history-resize-w {
  top: 10px;
  bottom: 10px;
  width: 6px;
  cursor: ew-resize;
}
.dx-history-resize-e {
  right: 0;
}
.dx-history-resize-w {
  left: 0;
}
.dx-history-resize-ne,
.dx-history-resize-se,
.dx-history-resize-sw,
.dx-history-resize-nw {
  width: 12px;
  height: 12px;
}
.dx-history-resize-ne {
  right: 0;
  top: 0;
  cursor: nesw-resize;
}
.dx-history-resize-se {
  right: 0;
  bottom: 0;
  cursor: nwse-resize;
}
.dx-history-resize-sw {
  left: 0;
  bottom: 0;
  cursor: nesw-resize;
}
.dx-history-resize-nw {
  left: 0;
  top: 0;
  cursor: nwse-resize;
}
.dx-history-resize-se:after {
  content: "";
  position: absolute;
  right: 3px;
  bottom: 3px;
  width: 5px;
  height: 5px;
  border-right: 1px solid var(--dx-text-faint);
  border-bottom: 1px solid var(--dx-text-faint);
}
.dx-titlebar-actions {
  position: absolute;
  right: 62px;
  top: 6px;
  z-index: 66;
  display: flex;
  align-items: center;
  gap: 6px;
}
.dx-titlebar-actions > .dx-share-trigger {
  position: static;
}
.dx-history-trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: var(--dx-bg);
  color: var(--dx-text-soft);
}
.dx-history-trigger:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-history-trigger:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-history-native-anchor {
  position: fixed;
  right: 133px;
  top: 0;
  width: 30px;
  height: 0;
  pointer-events: none;
}

/* canvas/src/recovery-menus-v1.css */
.dx-recovery-menu {
  z-index: 120;
  width: min(380px, calc(100vw - 24px));
  max-height: min(560px, var(--radix-popover-content-available-height,80vh));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  font: 400 calc(12px * var(--canvas-text-scale,1))/1.45 var(--dx-font-sans);
  outline: none;
}
.dx-recovery-menu header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px 6px;
  gap: 16px;
}
.dx-recovery-menu h2 {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}
.dx-recovery-menu h3 {
  margin: 8px 14px;
  font-size: 11px;
  font-weight: 500;
  color: var(--dx-text-soft);
}
.dx-recovery-menu button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 5px 7px;
  border-radius: 5px;
  background: transparent;
  color: inherit;
  font: inherit;
}
.dx-recovery-menu button:hover {
  background: var(--dx-hover);
}
.dx-recovery-menu button:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: -2px;
}
.dx-recovery-menu button:disabled {
  opacity: .45;
  cursor: default;
}
.dx-recovery-menu .dx-recovery-close {
  color: var(--dx-text-soft);
  font-size: 11px;
}
.dx-recovery-caption {
  margin: 4px 14px 12px;
  color: var(--dx-text-soft);
  font-size: 11px;
  line-height: 1.5;
}
.dx-history-controls {
  display: flex;
  gap: 8px;
  padding: 6px 14px;
}
.dx-history-controls button {
  flex: 1;
  justify-content: flex-start;
  border: 1px solid var(--dx-border);
}
.dx-history-controls kbd {
  margin-left: auto;
  font: inherit;
  font-size: 10px;
  color: var(--dx-text-soft);
}
.dx-recovery-list {
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  min-height: 0;
}
.dx-recovery-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  border-top: 1px solid var(--dx-border);
}
.dx-recovery-list li > span {
  flex: 1;
  min-width: 0;
}
.dx-recovery-list strong {
  display: block;
  font-weight: 500;
  overflow-wrap: anywhere;
}
.dx-recovery-list small {
  display: block;
  color: var(--dx-text-soft);
  font-size: 11px;
  margin-top: 2px;
  overflow-wrap: anywhere;
}
.dx-recovery-list time {
  flex: none;
  color: var(--dx-text-soft);
  font-size: 10px;
  white-space: nowrap;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.dx-recovery-list svg {
  flex: none;
  color: var(--dx-text-soft);
}
.dx-recovery-menu .dx-recovery-empty {
  margin: 0;
  padding: 18px 14px;
  color: var(--dx-text-soft);
  line-height: 1.6;
}
.dx-recovery-empty button {
  margin-left: 8px;
  text-decoration: underline;
}
.dx-recovery-menu .dx-trash-selection {
  margin: 0 14px 12px;
  justify-content: flex-start;
  border: 1px solid var(--dx-border);
}
.dx-recovery-menu .dx-restore-item {
  flex: none;
  font-size: 11px;
}
.dx-history-views {
  display: flex;
  gap: 4px;
  padding: 4px 14px 10px;
}
.dx-history-views button {
  font-size: 11px;
  color: var(--dx-text-soft);
}
.dx-history-views button[aria-pressed=true] {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-history-session {
  margin-bottom: 10px;
}
.dx-history-states li {
  padding: 0;
}
.dx-history-states .dx-history-state {
  width: 100%;
  padding: 11px 14px;
  border-radius: 0;
  gap: 10px;
  text-align: left;
  justify-content: flex-start;
}
.dx-history-state > span {
  flex: 1;
  min-width: 0;
}
.dx-history-states .dx-history-state:disabled {
  opacity: 1;
}
.dx-history-states .dx-history-state:disabled:hover {
  background: transparent;
}
.dx-history-state:disabled small {
  color: var(--dx-text-soft);
}
.dx-history-retention {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-top: 1px solid var(--dx-border);
  color: var(--dx-text-soft);
  font-size: 11px;
}
.dx-history-retention small {
  display: block;
  font-size: 10px;
  margin-top: 3px;
}
.dx-history-retention button {
  flex: none;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* canvas/src/asset-browser-v1.css */
.dx-folder-assets {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 0;
  color: var(--dx-text);
  background: var(--dx-bg);
  font-size: calc(12px * var(--canvas-text-scale));
  overflow: hidden;
  -webkit-user-select: text;
  user-select: text;
}
.dx-folder-assets button,
.dx-folder-assets input {
  font: inherit;
  color: inherit;
  min-width: 0;
}
.dx-folder-assets button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  padding: 8px;
  cursor: pointer;
  flex-shrink: 0;
}
.dx-folder-assets button:hover:not(:disabled) {
  background: var(--dx-hover);
}
.dx-folder-assets button:disabled {
  opacity: .45;
  cursor: default;
}
.dx-folder-assets button:focus-visible,
.dx-folder-assets input:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-folder-assets-header {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-folder-assets-header h2 {
  font: inherit;
  font-weight: 600;
  margin: 0;
  font-size: calc(13px * var(--canvas-text-scale));
}
.dx-folder-assets-sources {
  display: flex;
  gap: 3px;
  padding: 10px 10px 0;
}
.dx-folder-assets-sources button {
  flex: 1;
  font-size: calc(11px * var(--canvas-text-scale));
  padding: 8px 5px;
}
.dx-folder-assets-sources button[aria-pressed=true] {
  background: var(--dx-hover);
  font-weight: 600;
}
.dx-folder-assets-source {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-folder-assets-source > label,
.dx-folder-assets-source > small,
.dx-folder-assets-source > p {
  width: 100%;
  margin: 0;
  color: var(--dx-text-soft);
  line-height: 1.5;
}
.dx-folder-assets-source > small {
  font-size: calc(10px * var(--canvas-text-scale));
  overflow-wrap: anywhere;
}
.dx-folder-assets-source .dx-folder-assets-choose {
  justify-content: flex-start;
  width: 100%;
  background: var(--dx-hover);
}
.dx-folder-assets-location {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
}
.dx-folder-assets-location input,
.dx-folder-assets-search input {
  background: transparent;
  border: 0;
  padding: 8px;
  flex: 1;
  width: 0;
  caret-color: var(--dx-text);
}
.dx-folder-assets input::placeholder {
  color: var(--dx-text-soft);
  opacity: 1;
}
.dx-folder-assets-path {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 7px 8px 0;
}
.dx-folder-assets-path strong {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
}
.dx-folder-assets-search {
  display: flex;
  align-items: center;
  gap: 2px;
  margin: 6px 12px;
  padding-left: 8px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  color: var(--dx-text-soft);
}
.dx-folder-assets-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--dx-border) transparent;
}
.dx-folder-assets-list {
  flex: none;
  overflow: visible;
  padding: 5px 8px;
}
.dx-folder-assets-list > p {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 6px;
  line-height: 1.5;
  color: var(--dx-text-soft);
}
.dx-folder-assets-list .dx-folder-assets-empty {
  display: block;
}
.dx-folder-assets-list .dx-folder-assets-folder {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  gap: 10px;
  padding: 10px 7px;
  text-align: left;
}
.dx-folder-assets-folder > span {
  flex: 1;
  overflow-wrap: anywhere;
}
.dx-folder-assets-file {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 6px;
  border-radius: 6px;
  cursor: pointer;
}
.dx-folder-assets-file:hover,
.dx-folder-assets-file.is-selected {
  background: var(--dx-hover);
}
.dx-folder-assets-file.is-unavailable {
  opacity: .55;
  cursor: default;
}
.dx-folder-assets-file > input {
  flex-shrink: 0;
  accent-color: var(--dx-text);
  margin: 0;
}
.dx-folder-assets-preview {
  display: flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--dx-text-soft);
}
.dx-folder-assets-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dx-folder-assets-file-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.dx-folder-assets-file-copy strong {
  font-weight: 400;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.dx-folder-assets-file-copy small {
  color: var(--dx-text-soft);
  font-size: calc(10px * var(--canvas-text-scale));
  font-variant-numeric: tabular-nums;
}
.dx-folder-assets footer {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px;
  border-top: 1px solid var(--dx-border);
}
.dx-folder-assets footer > span {
  color: var(--dx-text-soft);
}
.dx-folder-assets footer > button {
  background: var(--dx-hover);
}
.dx-folder-assets-error,
.dx-folder-assets-notice {
  margin: 6px 12px;
  padding: 8px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.dx-folder-assets-notice {
  color: var(--dx-text-soft);
}
.dx-folder-assets-more {
  width: 100%;
  margin-top: 6px;
}
.dx-folder-assets-spin {
  animation: dx-folder-assets-spin 1s linear infinite;
  flex-shrink: 0;
}
@keyframes dx-folder-assets-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .dx-folder-assets-spin {
    animation: none;
  }
}

/* canvas/src/asset-folder-drop-v1.css */
.dx-folder-assets {
  position: relative;
}
.dx-folder-assets-dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  margin: 6px 4px;
  padding: 16px 12px;
  border: 1px dashed var(--dx-border);
  border-radius: 8px;
  color: var(--dx-text-soft);
  text-align: center;
  line-height: 1.5;
}
.dx-folder-assets-dropzone p {
  margin: 0;
  color: var(--dx-text);
}
.dx-folder-assets-dropzone small {
  font-size: calc(11px * var(--canvas-text-scale));
}
.dx-folder-assets-drop {
  position: absolute;
  inset: 8px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 16px;
  border: 2px dashed var(--dx-text);
  border-radius: 10px;
  background: var(--dx-bg);
  color: var(--dx-text);
  text-align: center;
  pointer-events: none;
}
.dx-folder-assets-drop strong {
  font-weight: 600;
}
.dx-folder-assets-drop span {
  max-width: 26ch;
  color: var(--dx-text-soft);
  line-height: 1.45;
}

/* canvas/src/library-browser-v1.css */
.dx-file-browser-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: #0005;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
.dx-file-browser-backdrop[hidden],
.dx-assets-panel-host[hidden] {
  display: none !important;
}
.dx-assets-panel-host.dx-file-browser-window {
  position: fixed;
  z-index: 81;
  zoom: var(--canvas-ui-scale);
  max-height: none;
  border: 1px solid var(--dx-border);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 18px 70px #0007;
  background: var(--dx-bg);
  box-sizing: border-box;
  pointer-events: auto;
  container-type: inline-size;
}
.dx-file-browser {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  min-height: 0;
  color: var(--dx-text);
  font-size: calc(13px * var(--canvas-text-scale));
  background: var(--dx-bg);
}
.dx-file-browser button,
.dx-file-browser input,
.dx-file-browser select {
  font: inherit;
  color: inherit;
  min-width: 0;
}
.dx-file-browser button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: transparent;
  border: 0;
  border-radius: 7px;
  padding: 9px;
  cursor: pointer;
}
.dx-file-browser button:hover:not(:disabled) {
  background: var(--dx-hover);
}
.dx-file-browser button:disabled {
  opacity: .45;
  cursor: default;
}
.dx-file-browser button:focus-visible,
.dx-file-browser input:focus-visible,
.dx-file-browser select:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-file-browser select,
.dx-file-browser input {
  background: var(--dx-bg);
  border: 1px solid var(--dx-border);
  border-radius: 7px;
  padding: 8px;
}
.dx-file-browser-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: none;
  min-height: 56px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--dx-border);
  cursor: grab;
  touch-action: none;
}
.dx-file-browser-types {
  display: flex;
  gap: 6px;
}
.dx-file-browser-types button {
  font-size: calc(17px * var(--canvas-text-scale));
  padding: 10px 16px;
  color: var(--dx-text-soft);
}
.dx-file-browser-types [aria-selected=true] {
  color: var(--dx-text);
  background: var(--dx-hover);
  font-weight: 600;
}
.dx-file-browser .dx-file-browser-close {
  padding: 10px;
}
.dx-file-browser-layout {
  display: flex;
  flex: 1;
  min-height: 0;
}
.dx-file-browser-nav {
  flex: none;
  width: 180px;
  border-right: 1px solid var(--dx-border);
  padding: 18px 10px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.dx-file-browser-nav > button {
  justify-content: flex-start;
  padding: 12px 10px;
  color: var(--dx-text-soft);
}
.dx-file-browser-nav [aria-current=page] {
  background: var(--dx-hover);
  color: var(--dx-text);
  font-weight: 600;
}
.dx-file-browser-nav-bottom {
  margin-top: auto;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale));
}
.dx-file-browser-main {
  position: relative;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.dx-file-browser-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  padding: 14px 16px;
  flex: none;
  border-bottom: 1px solid var(--dx-border);
}
.dx-file-browser-toolbar > strong {
  font-weight: 500;
  max-width: 25%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-file-browser-search {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 8px;
  border: 1px solid var(--dx-border);
  border-radius: 7px;
  flex: 1;
  min-width: 90px;
  max-width: 280px;
  color: var(--dx-text-soft);
}
.dx-file-browser-search input {
  border: 0;
  min-width: 0;
  width: 100%;
  background: transparent;
}
.dx-file-browser-toolbar [aria-pressed=true] {
  background: var(--dx-hover);
}
.dx-file-browser-items {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 18px;
  align-content: start;
  gap: 14px;
  overscroll-behavior: contain;
}
.dx-file-browser-items.is-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
}
.dx-file-browser .dx-file-browser-item {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--dx-border);
  border-radius: 9px;
  display: flex;
  text-align: left;
  flex-direction: column;
  gap: 0;
  align-items: stretch;
}
.dx-file-browser .dx-file-browser-item.is-selected {
  outline: 2px solid var(--dx-text);
  outline-offset: -2px;
  background: var(--dx-hover);
}
.dx-file-browser-thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 145px;
  background: var(--dx-surface);
  color: var(--dx-text-soft);
  padding: 12px;
}
.dx-file-browser-thumbnail > svg {
  width: 40px;
  height: 40px;
  stroke-width: 1.2;
}
.dx-file-browser-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dx-file-browser-item-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px;
  min-width: 0;
}
.dx-file-browser-item-copy strong {
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-file-browser-item-copy small {
  font-size: calc(11px * var(--canvas-text-scale));
  color: var(--dx-text-soft);
  line-height: 1.45;
}
.dx-file-browser-offline {
  display: flex;
  gap: 5px;
  align-items: center;
}
.dx-file-browser-folder-hint {
  padding: 0 12px 12px;
  font-size: 11px;
  color: var(--dx-text-soft);
}
.dx-file-browser-items.is-list {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.dx-file-browser .is-list .dx-file-browser-item {
  flex-direction: row;
  align-items: center;
  border-color: transparent;
  flex: none;
  min-height: 64px;
}
.is-list .dx-file-browser-thumbnail {
  height: 48px;
  width: 64px;
  padding: 7px;
  flex: none;
}
.is-list .dx-file-browser-thumbnail svg {
  height: 25px;
  width: 25px;
}
.is-list .dx-file-browser-item-copy {
  flex: 1;
}
.is-list .dx-file-browser-folder-hint {
  padding: 12px;
}
.dx-file-browser-empty {
  grid-column: 1/-1;
  text-align: center;
  color: var(--dx-text-soft);
  padding: 50px 16px;
  line-height: 1.6;
}
.dx-file-browser-warning {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 18px;
  color: var(--dx-text-soft);
  background: var(--dx-surface);
  font-size: 12px;
}
.dx-file-browser-warning > span {
  flex: 1;
}
.dx-file-browser-more {
  padding: 8px 16px;
}
.dx-file-browser-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 18px;
  border-top: 1px solid var(--dx-border);
  flex: none;
}
.dx-file-browser-footer > span {
  color: var(--dx-text-soft);
}
.dx-file-browser-footer > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
}
.dx-file-browser button.is-primary {
  background: var(--dx-text);
  color: var(--dx-bg);
}
.dx-file-browser button.is-primary:hover {
  opacity: .85;
  background: var(--dx-text);
}
.dx-file-browser-message {
  margin: 0;
  padding: 10px 18px;
  border-top: 1px solid var(--dx-border);
  color: var(--dx-text-soft);
}
.dx-file-browser-message.is-error {
  color: var(--dx-danger,var(--dx-text));
}
.dx-file-browser-progress {
  flex: none;
  padding: 12px 18px;
  border-top: 1px solid var(--dx-border);
}
.dx-file-browser-progress > div {
  display: flex;
  align-items: center;
  gap: 14px;
}
.dx-file-browser-progress strong {
  font-weight: 500;
  flex: 1;
}
.dx-file-browser-progress progress {
  display: block;
  width: 100%;
  height: 7px;
  accent-color: var(--dx-text);
}
.dx-file-browser-local-assets {
  flex: 1;
  min-height: 0;
}
.dx-file-browser-local-assets .dx-folder-assets-header,
.dx-file-browser-local-assets .dx-folder-assets-sources {
  display: none;
}
.dx-file-browser-local-assets .dx-folder-assets-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 6px;
  padding: 16px;
}
.dx-file-browser-local-assets .dx-folder-assets-dropzone,
.dx-file-browser-local-assets .dx-folder-assets-empty {
  grid-column: 1/-1;
}
.dx-file-browser-local-assets .dx-folder-assets-source {
  padding: 16px;
}
.dx-file-browser-local-assets .dx-folder-assets-choose {
  width: auto;
  padding: 12px;
}
.dx-file-browser-local-assets .dx-folder-assets-file {
  min-width: 0;
}
.dx-file-browser-local-assets .dx-folder-assets-preview {
  width: 70px;
  height: 70px;
}
.dx-file-browser-local-assets .dx-folder-assets-dropzone {
  min-height: 240px;
  margin: 20px;
}
.dx-file-browser-access {
  position: absolute;
  right: 16px;
  bottom: 16px;
  max-width: 480px;
  width: calc(100% - 32px);
  max-height: calc(100% - 32px);
  overflow: auto;
  padding: 20px;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  background: var(--dx-bg);
  box-shadow: 0 12px 40px #0006;
  box-sizing: border-box;
}
.dx-file-browser-access > div,
.dx-file-browser-access form {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.dx-file-browser-access h3,
.dx-file-browser-access > div > span {
  flex: 1;
  overflow-wrap: anywhere;
}
.dx-file-browser-access h3 {
  margin: 0;
  font-size: 16px;
}
.dx-file-browser-access form input {
  flex: 1;
  min-width: 100px;
}
.dx-file-browser-access p {
  color: var(--dx-text-soft);
  line-height: 1.5;
}
.dx-file-browser-resize {
  position: absolute;
  z-index: 4;
  touch-action: none;
}
.dx-file-browser-resize-n,
.dx-file-browser-resize-s {
  left: 14px;
  right: 14px;
  height: 6px;
  cursor: ns-resize;
}
.dx-file-browser-resize-n {
  top: 0;
}
.dx-file-browser-resize-s {
  bottom: 0;
}
.dx-file-browser-resize-e,
.dx-file-browser-resize-w {
  top: 14px;
  bottom: 14px;
  width: 6px;
  cursor: ew-resize;
}
.dx-file-browser-resize-e {
  right: 0;
}
.dx-file-browser-resize-w {
  left: 0;
}
.dx-file-browser-resize-ne,
.dx-file-browser-resize-nw,
.dx-file-browser-resize-se,
.dx-file-browser-resize-sw {
  width: 16px;
  height: 16px;
}
.dx-file-browser-resize-ne {
  top: 0;
  right: 0;
  cursor: nesw-resize;
}
.dx-file-browser-resize-nw {
  top: 0;
  left: 0;
  cursor: nwse-resize;
}
.dx-file-browser-resize-se {
  bottom: 0;
  right: 0;
  cursor: nwse-resize;
  background:
    linear-gradient(
      135deg,
      transparent 50%,
      var(--dx-border) 50% 57%,
      transparent 57% 70%,
      var(--dx-border) 70% 77%,
      transparent 77%);
  border: 0;
}
.dx-file-browser-resize-sw {
  bottom: 0;
  left: 0;
  cursor: nesw-resize;
}
@container (max-width:700px) {
  .dx-file-browser-nav {
    width: 132px;
    padding: 10px 5px;
  }
  .dx-file-browser-nav > button {
    gap: 6px;
    padding: 10px 7px;
  }
  .dx-file-browser-nav > button span {
    font-size: 12px;
  }
  .dx-file-browser-toolbar {
    padding: 8px;
  }
  .dx-file-browser-toolbar > strong {
    display: none;
  }
  .dx-file-browser-toolbar select {
    max-width: 140px;
  }
  .dx-file-browser-items {
    padding: 12px;
    gap: 10px;
  }
  .dx-file-browser-items.is-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }
  .dx-file-browser-footer > div {
    gap: 3px;
  }
  .dx-file-browser-footer button,
  .dx-file-browser-footer select {
    font-size: 11px;
    padding: 8px;
  }
  .dx-file-browser-thumbnail {
    height: 110px;
  }
}
@container (max-width:480px) {
  .dx-file-browser-layout {
    flex-direction: column;
  }
  .dx-file-browser-nav {
    flex-direction: row;
    width: auto;
    border-right: 0;
    border-bottom: 1px solid var(--dx-border);
    padding: 6px;
  }
  .dx-file-browser-nav > button {
    flex: 1;
    justify-content: center;
    flex-direction: column;
    gap: 3px;
  }
  .dx-file-browser-nav-bottom {
    display: none;
  }
  .dx-file-browser-heading {
    padding: 4px 8px;
    min-height: 48px;
  }
  .dx-file-browser-types button {
    font-size: 15px;
    padding: 8px;
  }
  .dx-file-browser-toolbar {
    gap: 3px;
  }
  .dx-file-browser-items.is-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .dx-file-browser-footer {
    padding: 8px;
  }
  .dx-file-browser-footer > span {
    display: none;
  }
  .dx-file-browser-access {
    padding: 12px;
  }
}
.dx-cloud-storage-settings {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--dx-border);
  margin-bottom: 18px;
}
.dx-cloud-storage-settings label {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.dx-cloud-storage-settings select,
.dx-cloud-storage-settings button {
  font: inherit;
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 7px;
  background: var(--dx-bg);
  padding: 8px 10px;
}
.dx-cloud-storage-settings p {
  line-height: 1.6;
}
.dx-cloud-storage-settings a {
  color: inherit;
  text-decoration: underline;
}
.dx-cloud-project-banner {
  position: absolute;
  top: 42px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 26;
  padding: 6px 12px;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  background: var(--dx-bg);
  color: var(--dx-text-soft);
  font-size: 11px;
  max-width: 70%;
  text-align: center;
  pointer-events: none;
}
[data-cloud-project-role=viewer] .dx-prompt-dock {
  display: none;
}
.dx-file-browser-progress progress {
  appearance: none;
  border: 0;
  background: var(--dx-border);
  border-radius: 4px;
  overflow: hidden;
}
.dx-file-browser-progress progress::-webkit-progress-bar {
  background: var(--dx-border);
}
.dx-file-browser-progress progress::-webkit-progress-value {
  background: var(--dx-text);
}
.dx-file-browser-progress progress::-moz-progress-bar {
  background: var(--dx-text);
}
.dx-file-browser .dx-create-project {
  justify-content: flex-start;
}
.dx-create-project .dx-file-browser-thumbnail > svg {
  width: 58px;
  height: 58px;
  stroke-width: 1.4;
}
.is-list .dx-create-project .dx-file-browser-thumbnail > svg {
  width: 34px;
  height: 34px;
}
.dx-project-card-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
[data-slot=dialog-overlay]:has(+ .dx-project-card-dialog) {
  z-index: 130;
}
.dx-scaled-dialog.dx-project-card-dialog {
  z-index: 131;
}

/* canvas/src/assets-panel-host-v1.css */
.dx-assets-panel-host {
  position: absolute;
  z-index: 32;
  left: calc(12px / var(--canvas-ui-scale));
  top: calc(48px / var(--canvas-ui-scale));
  width: min(340px, calc((100dvw - 24px - var(--canvas-nav-width) * var(--canvas-ui-scale)) / var(--canvas-ui-scale)));
  height: calc((100dvh - 130px) / var(--canvas-ui-scale));
  max-height: 720px;
  zoom: var(--canvas-ui-scale);
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--dx-surface);
  box-sizing: border-box;
  pointer-events: auto;
}
.dx-assets-panel-host[hidden] {
  display: none;
}
@media (max-width: 760px) {
  .dx-assets-panel-host {
    width: calc((100dvw - 24px) / var(--canvas-ui-scale));
    max-height: none;
  }
}
@media (max-width: 480px) and (max-height: 600px) {
  .dx-assets-panel-host .dx-folder-assets-header,
  .dx-assets-panel-host .dx-folder-assets footer {
    padding: 6px 8px;
  }
  .dx-assets-panel-host .dx-folder-assets-header button,
  .dx-assets-panel-host .dx-folder-assets footer button {
    padding: 6px;
  }
  .dx-assets-panel-host .dx-folder-assets footer {
    flex-wrap: nowrap;
  }
  .dx-assets-panel-host .dx-folder-assets footer > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: calc(10px * var(--canvas-text-scale));
  }
}
.dx-assets-panel-host[data-front=true] {
  z-index: 55;
}

/* canvas/src/chat-message-copy.css */
.dx-chat-message {
  position: relative;
  min-width: 0;
  min-height: 28px;
  padding-inline-end: 38px;
}
.dx-chat-message-body {
  min-width: 0;
}
.dx-chat-message > .dx-chat-copy {
  position: absolute;
  inset-block-start: 2px;
  inset-inline-end: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 28px;
  height: 28px;
  padding: 0;
  margin: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--dx-text-soft);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  z-index: 1;
}
.dx-chat-message:hover > .dx-chat-copy,
.dx-chat-message:focus-within > .dx-chat-copy,
.dx-chat-message > .dx-chat-copy[data-feedback=copied],
.dx-chat-message > .dx-chat-copy[data-feedback=error] {
  opacity: 1;
  pointer-events: auto;
}
.dx-chat-message > .dx-chat-copy:hover,
.dx-chat-message > .dx-chat-copy:focus-visible {
  color: var(--dx-text);
  background: var(--dx-hover);
  border-color: var(--dx-border);
}
.dx-chat-message > .dx-chat-copy:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 1px;
}
.dx-chat-message > .dx-chat-copy[data-feedback=copied] {
  color: var(--dx-text);
}
.dx-chat-copy-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.dx-chat-copy-status--error {
  display: block;
  position: static;
  width: auto;
  height: auto;
  padding: 4px 8px;
  margin: 4px 0 0;
  overflow: visible;
  clip: auto;
  clip-path: none;
  white-space: normal;
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.35;
  color: var(--dx-text);
  background: var(--dx-hover);
  border: 1px solid var(--dx-border);
  border-radius: 6px;
}
@media (hover: none), (pointer: coarse) {
  .dx-chat-message > .dx-chat-copy {
    opacity: 1;
    pointer-events: auto;
  }
}

/* canvas/src/disclosure-v1.css */
:root {
  --dx-disclosure-chevron-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='m9%2018%206-6-6-6'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");
}
details > summary {
  list-style: none;
}
details > summary::-webkit-details-marker {
  display: none;
}
details > summary::marker {
  content: "";
}
details > summary::before {
  content: "";
  display: inline-block;
  inline-size: calc(12px * var(--canvas-text-scale, 1));
  block-size: calc(12px * var(--canvas-text-scale, 1));
  flex: 0 0 auto;
  margin-inline-end: 6px;
  vertical-align: middle;
  align-self: center;
  background-color: currentColor;
  -webkit-mask: var(--dx-disclosure-chevron-mask) center / contain no-repeat;
  mask: var(--dx-disclosure-chevron-mask) center / contain no-repeat;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: none;
}
details[open] > summary::before {
  transform: rotate(90deg);
}
svg.dx-disclosure-chevron {
  inline-size: calc(12px * var(--canvas-text-scale, 1));
  block-size: calc(12px * var(--canvas-text-scale, 1));
  flex: 0 0 auto;
  vertical-align: middle;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: none;
}
svg.dx-disclosure-chevron[data-expanded=true] {
  transform: rotate(90deg);
}
.dx-preset-active > summary::before {
  margin-inline-end: 0;
}
@media (forced-colors: active) {
  details > summary::before {
    forced-color-adjust: none;
    background-color: CanvasText;
  }
}

/* canvas/src/grokbot-connection-v1.css */
.dx-grok-settings {
  display: grid;
  gap: 12px;
  max-width: 700px;
}
.dx-grok-settings h3 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-grok-settings label {
  display: grid;
  gap: 8px;
}
.dx-grok-settings p {
  margin: 0;
}
.dx-grok-results article {
  padding: 12px 0;
  border-top: 1px solid var(--dx-border);
}
.dx-grok-reply p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.dx-grok-reply {
  padding: 12px;
  background: var(--dx-surface-2);
  border-radius: 8px;
  margin: 10px 0;
}
.dx-grok-settings [role=alert] {
  color: var(--dx-danger);
}
.dx-grok-media-settings {
  display: grid;
  gap: 12px;
  border-top: 1px solid var(--dx-border);
  padding-top: 16px;
  margin-top: 8px;
}
.dx-grok-media-settings h4 {
  margin: 0;
}
.dx-grok-media-settings fieldset {
  display: grid;
  gap: 12px;
  border: 0;
  padding: 0;
  margin: 0;
}
.dx-grok-media-settings input {
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
  min-height: 36px;
  padding: 8px 10px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  font: inherit;
}
.dx-grok-media-settings input:focus {
  border-color: var(--dx-text);
  outline: none;
  box-shadow: none;
}

/* canvas/src/draggable-panels-v1.css */
.dx-panel-drag-handle {
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-panel-drag-handle:focus {
  outline: none;
}
.dx-panel-drag-handle:focus-visible {
  outline: 1px solid var(--dx-text-soft);
  outline-offset: -3px;
  border-radius: 6px;
}
[data-panel-dragging=true] .dx-panel-drag-handle {
  cursor: grabbing;
}
.dx-panel-drag-handle button {
  cursor: pointer;
}
.dx-generation-wait {
  display: block;
  margin-top: 6px;
  color: var(--dx-text-soft);
  font-size: inherit;
}

/* canvas/src/production-v1.css */
.dx-production-panel {
  position: absolute;
  z-index: 65;
  right: 24px;
  top: 64px;
  width: min(660px, calc(100% - 32px));
  max-height: calc(100% - 88px);
  display: flex;
  flex-direction: column;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  overflow: hidden;
  font-size: calc(13px * var(--canvas-text-scale,1));
  line-height: 1.5;
}
.dx-production-panel > header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid var(--dx-border);
  flex-shrink: 0;
  background: var(--dx-surface);
}
.dx-production-panel h2 {
  font-size: calc(15px * var(--canvas-text-scale,1));
  font-weight: 600;
  margin: 0;
}
.dx-production-panel button {
  touch-action: manipulation;
}
.dx-production-panel > header button,
.dx-timeline-source button,
.dx-folder-files button {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 0;
  background: transparent;
  color: var(--dx-text-soft);
  border-radius: 5px;
}
.dx-production-panel > header button:hover,
.dx-timeline-source button:hover,
.dx-folder-files button:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-production-body {
  overflow: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 0;
}
.dx-production-body p {
  margin: 0;
  color: var(--dx-text-soft);
  max-width: 72ch;
}
.dx-production-body label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dx-production-body footer,
.dx-production-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.dx-production-body input[type=number] {
  min-width: 0;
  width: 100%;
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  padding: 5px 7px;
  font: inherit;
  font-variant-numeric: tabular-nums;
}
.dx-production-body [role=alert] {
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  padding: 10px;
}
.dx-production-body summary {
  cursor: pointer;
  color: var(--dx-text);
}
.dx-production-timeline {
  padding: 14px 0;
  border-top: 1px solid var(--dx-border);
}
.dx-production-timeline p {
  margin: 8px 0;
}
.dx-output-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 130px;
  gap: 8px;
}
.dx-production-timeline ol {
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.dx-timeline-source {
  display: flex;
  gap: 6px;
  align-items: center;
}
.dx-timeline-source > span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-cut-fields {
  display: grid;
  grid-template-columns: 100px 100px 1fr auto;
  gap: 10px;
  align-items: end;
  padding-left: 20px;
  color: var(--dx-text-soft);
}
.dx-cut-fields a {
  color: var(--dx-text);
  font-size: calc(12px * var(--canvas-text-scale,1));
  text-underline-offset: 3px;
}
.dx-production-body .dx-production-check {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.dx-production-check input {
  accent-color: var(--dx-text);
}
.dx-plan-link {
  display: flex;
  width: 100%;
  justify-content: space-between;
  padding: 10px 0;
  color: var(--dx-text);
  border: 0;
  border-bottom: 1px solid var(--dx-border);
  background: transparent;
  text-align: left;
}
.dx-plan-link span {
  color: var(--dx-text-soft);
}
.dx-folder-card {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  color: var(--dx-text);
}
.dx-folder-image {
  position: relative;
  width: 82%;
  height: 70%;
  max-height: 190px;
}
.dx-folder-image > svg {
  width: 100%;
  height: 100%;
  color: var(--dx-text-soft);
  fill: var(--dx-surface);
}
.dx-folder-mosaic {
  position: absolute;
  inset: 30% 19% 18%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 5px;
  overflow: hidden;
}
.dx-folder-mosaic > span {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 0;
  background: var(--dx-surface-inset);
  color: var(--dx-text-soft);
  border-radius: 6px;
  overflow: hidden;
}
.dx-folder-mosaic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx-folder-card > strong {
  max-width: 90%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 16px;
}
.dx-folder-card > span {
  color: var(--dx-text-soft);
  font-size: 13px;
}
.dx-folder-files {
  max-height: 240px;
  overflow: auto;
  margin-top: 10px;
}
.dx-folder-files > div {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid var(--dx-border);
}
.dx-folder-files img {
  width: 40px;
  height: 32px;
  object-fit: contain;
  background: var(--dx-surface-inset);
  border-radius: 6px;
}
.dx-folder-files span {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
@media (max-width: 650px) {
  .dx-production-panel {
    right: 16px;
    top: 24px;
    max-height: calc(100% - 48px);
  }
  .dx-cut-fields {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .dx-cut-fields > span:empty {
    display: none;
  }
  .dx-output-title {
    grid-template-columns: 1fr;
  }
  .dx-production-body {
    padding: 12px;
  }
}
.dx-production-panel {
  font-family: var(--dx-font-sans);
  scrollbar-color: var(--dx-border) transparent;
  box-sizing: border-box;
}
.dx-production-panel :is(button, input, textarea, summary):focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-production-panel button:disabled {
  opacity: .4;
  cursor: default;
}
.dx-production-panel :is(input, textarea) {
  caret-color: var(--dx-text);
}
.dx-production-panel button {
  text-transform: none;
  letter-spacing: normal;
}
.dx-production-panel :is([data-slot=input], [data-slot=textarea]) {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  font: inherit;
}
.dx-production-panel :is(input, textarea, [data-slot=select-trigger]):is(:focus, :focus-visible) {
  outline: none;
  box-shadow: none;
  border-color: var(--dx-text-soft);
}
.dx-production-panel [data-slot=button] {
  font-size: inherit;
  height: auto;
  min-height: 2.3em;
  white-space: normal;
}
.dx-production-panel .dx-select-trigger {
  font: inherit;
}
.dx-production-panel h3 {
  font-size: 1.15em;
}
.dx-production-actions {
  flex-wrap: wrap;
}

/* canvas/src/icon-workflow-v1.css */
.dx-icon-workflow {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--dx-text);
  font-size: inherit;
}
.dx-icon-app {
  border-top: 1px solid var(--dx-border);
  padding: 12px 0;
}
.dx-icon-app > summary {
  cursor: pointer;
  line-height: 1.5;
  padding: 4px 0;
}
.dx-icon-app > summary span {
  display: block;
  margin-left: 16px;
  color: var(--dx-text-soft);
  font-size: .92em;
}
.dx-icon-options {
  list-style: none;
  padding: 0;
  margin: 12px 0;
}
.dx-icon-options > li {
  padding: 12px 0;
  border-bottom: 1px solid var(--dx-border);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}
.dx-icon-options p {
  margin: 4px 0 8px;
  line-height: 1.5;
}
.dx-icon-previews {
  display: flex;
  gap: 8px;
  align-items: center;
}
.dx-icon-previews a {
  display: block;
  max-width: calc(50% - 4px);
  border-radius: 8px;
}
.dx-icon-previews img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 8px;
}
.dx-icon-workflow a:focus-visible,
.dx-icon-workflow summary:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 3px;
}
.dx-icon-revise {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  margin: 16px 0;
}
.dx-icon-revise button {
  align-self: flex-start;
  white-space: normal;
  text-align: left;
}
.dx-icon-workflow form > label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dx-icon-workflow form > button {
  margin-top: 8px;
}
.dx-icon-download {
  display: inline-block;
  margin-top: 12px;
  text-underline-offset: 3px;
  color: inherit;
}
.dx-icon-workflow button {
  max-width: 100%;
  white-space: normal;
}

/* canvas/src/codex-handoff-v1.css */
.dx-codex-handoff {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
}
.dx-codex-handoff a {
  font-size: 12px;
}
.dx-codex-handoff p {
  flex-basis: 100%;
  margin: 0;
}

/* canvas/src/command-queue-v1.css */
.dx-command-queue {
  list-style: none;
  margin: 0 8px;
  padding: 0;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  background: var(--dx-surface);
  max-height: min(32vh, 280px);
  overflow-y: auto;
  overscroll-behavior: contain;
  flex: none;
}
.dx-command-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 9px 10px;
  color: var(--dx-text);
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
}
.dx-command-row + .dx-command-row {
  border-top: 1px solid var(--dx-border);
}
.dx-command-row > svg {
  flex: none;
  margin-top: 3px;
  color: var(--dx-text-soft);
}
.dx-command-copy {
  min-width: 0;
  flex: 1;
}
.dx-command-copy > p {
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.dx-command-status {
  font-size: calc(10px * var(--canvas-text-scale,1));
  color: var(--dx-text-soft);
}
.dx-command-copy > .dx-command-error {
  margin-top: 5px;
  color: var(--dx-text);
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-command-actions {
  display: flex;
  gap: 2px;
  flex-wrap: wrap;
  justify-content: flex-end;
  flex: none;
  max-width: 100px;
}
.dx-command-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 28px;
  min-width: 28px;
  padding: 3px 5px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
  font: inherit;
  font-size: calc(11px * var(--canvas-text-scale,1));
  cursor: pointer;
}
.dx-command-actions button:hover {
  color: var(--dx-text);
  background: var(--dx-hover);
}
.dx-command-actions button:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 1px;
}
.dx-prompt-bar {
  position: relative;
}
@media (max-width: 600px) {
  .dx-command-row {
    gap: 5px;
    padding-inline: 7px;
  }
  .dx-command-actions {
    max-width: 75px;
  }
  .dx-command-steer span {
    font-size: calc(10px * var(--canvas-text-scale,1));
  }
}

/* canvas/src/steer-guard-v1.css */
.dx-command-actions {
  max-width: 136px;
}
.dx-command-steer span {
  white-space: nowrap;
}
@media (max-width: 600px) {
  .dx-command-actions {
    max-width: 116px;
  }
}

/* canvas/src/parallel-requests-v1.css */
.dx-job-execution .dx-job-stop {
  box-sizing: border-box;
  justify-self: start;
  min-height: 28px;
  height: auto;
  padding: 4px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
  font-size: calc(12px * var(--canvas-text-scale,1));
  white-space: normal;
}
.dx-job-execution .dx-job-stop:hover:not(:disabled) {
  color: var(--dx-text);
  background: var(--dx-hover);
}
.dx-job-execution .dx-job-stop:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 1px;
}
.dx-job-execution .dx-job-stop:disabled {
  opacity: .6;
}
.dx-command-actions .dx-command-stop svg {
  color: currentColor;
}

/* canvas/src/comparable-model-v1.css */
.dx-command-copy .dx-command-use-model {
  display: inline-flex;
  align-items: center;
  margin-top: 6px;
  max-width: 100%;
  min-height: 28px;
  padding: 4px 9px;
  border: 1px solid var(--dx-text);
  border-radius: 5px;
  background: var(--dx-text);
  color: var(--dx-bg);
  font: inherit;
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.3;
  white-space: normal;
  text-align: left;
  cursor: pointer;
}
.dx-command-copy .dx-command-use-model:hover {
  opacity: .9;
}
.dx-command-copy .dx-command-use-model:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}

/* canvas/src/failure-actions-v1.css */
.dx-failure-actions {
  position: relative;
  display: grid;
  gap: 8px;
  min-width: 0;
}
.dx-failure-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.dx-failure-status:empty {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.dx-failure-status:focus {
  outline: none;
}
.dx-conversation .dx-job-execution .dx-failure-buttons button,
.dx-conversation .dx-job-execution .dx-failure-buttons .dx-failure-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  box-sizing: border-box;
  max-width: 100%;
  min-height: 30px;
  height: auto;
  padding: 6px 9px;
  white-space: normal;
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.3;
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text);
  text-decoration: none;
  cursor: pointer;
}
.dx-conversation .dx-job-execution .dx-failure-buttons button:hover:not(:disabled),
.dx-conversation .dx-job-execution .dx-failure-buttons .dx-failure-link:hover {
  border-color: var(--dx-text);
}
.dx-conversation .dx-job-execution .dx-failure-buttons button:focus-visible,
.dx-conversation .dx-job-execution .dx-failure-buttons .dx-failure-link:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 3px;
}
.dx-conversation .dx-job-execution .dx-failure-buttons .is-primary {
  border: 1px solid var(--dx-text);
  background: var(--dx-text);
  color: var(--dx-bg);
}
.dx-conversation .dx-job-execution .dx-failure-buttons .is-primary:hover:not(:disabled) {
  color: var(--dx-bg);
  opacity: .9;
}
.dx-conversation .dx-job-execution .dx-failure-buttons button:disabled {
  opacity: .6;
  cursor: default;
}

/* canvas/src/job-execution-v1.css */
.dx-job-execution {
  display: grid;
  gap: 8px;
  min-width: 0;
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-job-execution p {
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-job-execution progress {
  width: 100%;
  height: 6px;
  accent-color: var(--dx-text);
}
.dx-job-execution figure {
  margin: 0;
  display: grid;
  gap: 4px;
}
.dx-job-execution img {
  max-width: 100%;
  max-height: 180px;
  object-fit: contain;
  justify-self: start;
  border-radius: 6px;
}
.dx-job-execution figcaption {
  font-size: inherit;
  color: var(--dx-text-soft);
}
.dx-job-execution button {
  justify-self: start;
}
.dx-conversation .dx-job-execution .dx-design-resume {
  box-sizing: border-box;
  max-width: 100%;
  min-height: 30px;
  height: auto;
  padding: 6px 9px;
  white-space: normal;
  font-size: calc(12px * var(--canvas-text-scale,1));
  border: 1px solid var(--dx-text);
  border-radius: 5px;
  background: var(--dx-text);
  color: var(--dx-bg);
}
.dx-conversation .dx-job-execution .dx-design-resume:hover {
  color: var(--dx-bg);
  opacity: .9;
}
.dx-conversation .dx-job-execution .dx-design-resume:disabled {
  opacity: .6;
}
.dx-job-retry {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-conversation .dx-job-execution .dx-job-retry-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: transparent;
  color: var(--dx-text);
  cursor: pointer;
}
.dx-conversation .dx-job-execution .dx-job-retry-icon:hover:not(:disabled) {
  background: var(--dx-surface-hover,var(--dx-bg));
  border-color: var(--dx-text);
}
.dx-conversation .dx-job-execution .dx-job-retry-icon:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 3px;
}
.dx-conversation .dx-job-execution .dx-job-retry-icon:disabled {
  opacity: .5;
  cursor: default;
}
.dx-video-edit-offer {
  position: relative;
  display: grid;
  gap: 8px;
  min-width: 0;
}
.dx-video-edit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.dx-video-edit-status:empty {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.dx-video-edit-status:focus {
  outline: none;
}
.dx-conversation .dx-job-execution .dx-video-edit-actions button {
  box-sizing: border-box;
  max-width: 100%;
  min-height: 30px;
  height: auto;
  padding: 6px 9px;
  white-space: normal;
  font-size: calc(12px * var(--canvas-text-scale,1));
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text);
}
.dx-conversation .dx-job-execution .dx-video-edit-actions button:hover:not(:disabled) {
  border-color: var(--dx-text);
}
.dx-conversation .dx-job-execution .dx-video-edit-actions button:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 3px;
}
.dx-conversation .dx-job-execution .dx-video-edit-actions .dx-video-edit-retry {
  border: 1px solid var(--dx-text);
  background: var(--dx-text);
  color: var(--dx-bg);
}
.dx-conversation .dx-job-execution .dx-video-edit-actions .dx-video-edit-retry:hover:not(:disabled) {
  color: var(--dx-bg);
  opacity: .9;
}
.dx-conversation .dx-job-execution .dx-video-edit-actions button:disabled {
  opacity: .6;
}

/* canvas/src/prompt-shorten-v1.css */
.dx-prompt-shorten {
  display: grid;
  gap: 8px;
  min-width: 0;
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-prompt-shorten p {
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-prompt-shorten .dx-inline-help {
  margin: 0;
}
.dx-prompt-shorten-offer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  color: var(--dx-text-soft);
}
.dx-conversation .dx-prompt-shorten .dx-prompt-shorten-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  height: auto;
  padding: 6px 10px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: transparent;
  color: var(--dx-text);
  white-space: normal;
  font-size: inherit;
  cursor: pointer;
}
.dx-conversation .dx-prompt-shorten .dx-prompt-shorten-button:hover:not(:disabled) {
  background: var(--dx-surface-hover,var(--dx-bg));
  border-color: var(--dx-text);
}
.dx-conversation .dx-prompt-shorten .dx-prompt-shorten-button:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 3px;
}
.dx-conversation .dx-prompt-shorten .dx-prompt-shorten-button:disabled {
  opacity: .6;
  cursor: default;
}
.dx-prompt-shorten-draft {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.dx-prompt-shorten-draft label {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: var(--dx-text-soft);
}
.dx-prompt-shorten-draft label span {
  font-variant-numeric: tabular-nums;
}
.dx-prompt-shorten-draft label span.is-over,
.dx-prompt-shorten-over {
  color: var(--dx-danger,#e5484d);
}
.dx-prompt-shorten-draft textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 120px;
  max-height: 320px;
  resize: vertical;
  padding: 8px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: var(--dx-bg);
  color: var(--dx-text);
  font: inherit;
  line-height: 1.45;
}
.dx-prompt-shorten-draft textarea:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 1px;
}
.dx-prompt-shorten-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.dx-conversation .dx-prompt-shorten .dx-prompt-shorten-send {
  box-sizing: border-box;
  min-height: 30px;
  height: auto;
  padding: 6px 9px;
  white-space: normal;
  font-size: inherit;
  border: 1px solid var(--dx-text);
  border-radius: 5px;
  background: var(--dx-text);
  color: var(--dx-bg);
}
.dx-conversation .dx-prompt-shorten .dx-prompt-shorten-send:disabled {
  opacity: .5;
}

/* canvas/src/auto-mode-v1.css */
.dx-skill-source {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.dx-skill-source label {
  display: grid;
  gap: 6px;
}
.dx-skill-file input {
  max-width: 100%;
  font: inherit;
  color: inherit;
}
.dx-skill-source p {
  overflow-wrap: anywhere;
}
.dx-skill-source button {
  font: inherit;
  color: inherit;
  text-decoration: underline;
  background: none;
  border: 0;
  cursor: pointer;
}

/* canvas/src/skill-choices-v1.css */
.dx-skill-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  margin: 4px 0 2px;
}
.dx-conversation .dx-skill-choices button {
  max-width: 100%;
  min-height: 32px;
  padding: 6px 12px;
  border: 1px solid var(--dx-border);
  border-radius: 16px;
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  font: inherit;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
  cursor: pointer;
}
.dx-conversation .dx-skill-choices button:hover:not(:disabled) {
  background: var(--dx-hover);
}
.dx-conversation .dx-skill-choices button:disabled {
  color: var(--dx-text-faint);
  cursor: default;
}

/* canvas/src/conversation-resize-v1.css */
.dx-canvas-app .dx-prompt-dock .dx-conversation[data-conversation-resizable=true] {
  position: relative;
  align-self: flex-end;
  box-sizing: border-box;
  flex: none;
  min-height: 0;
  max-height: none;
  max-width: none;
  translate: none !important;
}
.dx-conversation-resize {
  position: absolute;
  z-index: 4;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-conversation-resize-n {
  top: 0;
  left: 8px;
  right: 8px;
  height: 6px;
  cursor: ns-resize;
}
.dx-conversation-resize-w,
.dx-conversation-resize-e {
  top: 6px;
  bottom: 6px;
  width: 6px;
  cursor: ew-resize;
}
.dx-conversation-resize-w {
  left: 0;
}
.dx-conversation-resize-e {
  right: 0;
}
.dx-conversation-resize:focus-visible {
  outline: 1px solid var(--dx-text-soft);
  outline-offset: -1px;
  background: var(--dx-hover);
}
.dx-conversation[data-conversation-resizing=n],
.dx-conversation[data-conversation-resizing=n] * {
  cursor: ns-resize !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}
.dx-conversation[data-conversation-resizing=w],
.dx-conversation[data-conversation-resizing=w] *,
.dx-conversation[data-conversation-resizing=e],
.dx-conversation[data-conversation-resizing=e] * {
  cursor: ew-resize !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}
@media not all and (max-width: 760px) {
  .dx-canvas-app .dx-prompt-dock.is-expanded {
    width: min(var(--dx-conversation-dock-width,307px), calc((100vw - var(--canvas-nav-width) * var(--canvas-ui-scale) - 36px) / var(--canvas-ui-scale)));
  }
}
.dx-conversation .dx-conversation-history {
  margin-right: 6px;
  padding-right: 6px;
  scrollbar-gutter: stable;
  scrollbar-width: auto;
  scrollbar-color: auto;
}
.dx-conversation .dx-conversation-history::-webkit-scrollbar {
  width: 12px;
}
.dx-conversation .dx-conversation-history::-webkit-scrollbar-track {
  background: transparent;
}
.dx-conversation .dx-conversation-history::-webkit-scrollbar-thumb {
  min-height: 32px;
  border: 3px solid transparent;
  border-radius: 6px;
  background: var(--dx-text-faint) padding-box;
}
.dx-conversation .dx-conversation-history::-webkit-scrollbar-thumb:hover,
.dx-conversation .dx-conversation-history::-webkit-scrollbar-thumb:active {
  background-color: var(--dx-text-soft);
}
.dx-conversation .dx-conversation-reference-overlay {
  right: 24px;
}

/* canvas/src/pasted-references-v1.css */
.dx-prompt-bar.has-pasted {
  flex-wrap: wrap;
  row-gap: 6px;
}
.dx-pasted-references {
  order: -1;
  flex: 1 0 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 4px 4px 0 2px;
  list-style: none;
  min-width: 0;
}
.dx-pasted-references > li {
  position: relative;
  flex: none;
  width: 48px;
  height: 48px;
}
.dx-pasted-references img {
  display: block;
  box-sizing: border-box;
  width: 48px;
  height: 48px;
  object-fit: cover;
  border: 1px solid var(--dx-border);
  border-radius: 10px;
  background: var(--dx-surface-inset);
  cursor: default;
}
.dx-pasted-references img:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 1px;
}
.dx-pasted-references > li.is-saving img {
  opacity: .55;
}
.dx-pasted-references > li > .dx-spin {
  position: absolute;
  inset: 0;
  margin: auto;
  color: var(--dx-text);
  pointer-events: none;
}
.dx-pasted-references > li > button {
  position: absolute;
  top: -6px;
  right: -6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  padding: 0;
  margin: 0;
  border: 1px solid var(--dx-border);
  border-radius: 50%;
  background: var(--dx-surface);
  color: var(--dx-text-soft);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
}
.dx-pasted-references > li:hover > button,
.dx-pasted-references > li:focus-within > button {
  opacity: 1;
  pointer-events: auto;
}
.dx-pasted-references > li > button:hover,
.dx-pasted-references > li > button:focus-visible {
  color: var(--dx-text);
  background: var(--dx-hover);
}
.dx-pasted-references > li > button:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 1px;
}
@media (hover: none), (pointer: coarse) {
  .dx-pasted-references > li > button {
    opacity: 1;
    pointer-events: auto;
  }
}
.dx-pasted-history {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 2px 0 6px;
}
.dx-pasted-history img {
  display: block;
  width: 48px;
  height: 48px;
  object-fit: cover;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  background: var(--dx-surface-inset);
}

/* canvas/src/generation-plans-v1.css */
.dx-input-plans {
  min-width: 0;
}
.dx-input-plan {
  padding: 16px 0;
  border-bottom: 1px solid var(--dx-border);
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.dx-input-plan header {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 0;
  border: 0;
}
.dx-input-plan h3 {
  font-size: calc(13px * var(--canvas-text-scale,1));
  font-weight: 600;
  margin: 0;
}
.dx-input-plan p {
  margin: 10px 0;
}
.dx-input-plan button {
  cursor: pointer;
}
.dx-input-plan button:disabled {
  cursor: default;
  opacity: .5;
}
.dx-input-plan header button {
  background: transparent;
  border: 0;
  padding: 3px;
  color: inherit;
}
.dx-plan-request {
  white-space: pre-wrap;
}
.dx-plan-sources {
  list-style: none;
  padding: 0;
  margin: 12px 0;
}
.dx-plan-sources li {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin: 7px 0;
}
.dx-plan-sources svg {
  flex: 0 0 auto;
  margin-top: 2px;
}
.dx-plan-sources small,
.dx-plan-rows small {
  display: block;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-input-plan summary {
  cursor: pointer;
  padding: 4px 0;
}
.dx-plan-rows {
  max-height: 220px;
  overflow-y: auto;
  padding: 6px 4px 6px 24px;
  font-variant-numeric: tabular-nums;
}
.dx-plan-rows li {
  margin: 6px 0;
  padding-left: 2px;
}
.dx-plan-sample {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  width: 100%;
}
.dx-plan-sample img {
  display: block;
  width: 100%;
  max-height: 280px;
  object-fit: contain;
  background: var(--dx-surface-inset);
}
.dx-plan-sample span {
  display: block;
  margin: 6px 0 12px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-plan-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 12px 0;
}
.dx-plan-actions button {
  font-size: calc(12px * var(--canvas-text-scale,1));
  white-space: normal;
  height: auto;
  min-height: 30px;
}
.dx-plan-yolo,
.dx-plan-error button {
  background: transparent;
  border: 0;
  color: inherit;
  padding: 4px 0;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-plan-model {
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-plan-error {
  font-size: calc(12px * var(--canvas-text-scale,1));
  overflow-wrap: anywhere;
}
.dx-input-plan :is(button, summary):focus-visible {
  outline: 1px solid currentColor;
  outline-offset: 3px;
}
.dx-conversation .dx-conversation-model .dx-model-picker {
  flex: 1 1 0;
  width: 0;
  min-width: 0;
}
.dx-conversation .dx-plan-actions button {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
  flex-shrink: 1;
  padding: 6px 9px;
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  color: var(--dx-text);
}
.dx-conversation .dx-plan-actions .dx-plan-primary {
  background: var(--dx-text);
  color: var(--dx-bg);
  border-color: var(--dx-text);
}
.dx-conversation .dx-plan-actions .dx-plan-yolo {
  border: 0;
  padding: 4px 0;
  color: var(--dx-text-soft);
}
.dx-conversation .dx-plan-sample {
  display: block;
  padding: 0;
  color: var(--dx-text);
}
.dx-plan-cost-consent {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: var(--dx-font-body,12px);
  line-height: 1.5;
  margin: 12px 0;
  overflow-wrap: anywhere;
}
.dx-plan-cost-consent input {
  flex: none;
  margin-top: 4px;
}
.dx-plan-yolo:disabled {
  opacity: .5;
  cursor: not-allowed;
}
.dx-input-plan[data-output-format=gif] .dx-plan-sample img {
  --dx-artwork-preview-paper: #fff;
  background-color: var(--dx-artwork-preview-paper);
}
.dx-input-plan h3 {
  min-width: 0;
  flex: 1;
}
.dx-input-plan .dx-plan-disclosure {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  min-height: 28px;
  text-align: left;
  font: inherit;
  line-height: 1.5;
  color: inherit;
}
.dx-plan-disclosure .dx-disclosure-chevron {
  flex: none;
  margin-top: 3px;
}
.dx-plan-disclosure span {
  min-width: 0;
}
.dx-input-plan header > button {
  flex: none;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
}
.dx-input-plan .dx-plan-state {
  color: var(--dx-text-soft);
  margin: 4px 0 0;
}
.dx-plan-reminder > span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.dx-plan-reminder strong {
  display: block;
  font-weight: 500;
}
.dx-plan-reminder > span > span {
  display: block;
  color: var(--dx-text-soft);
}
.dx-plan-reminder button {
  flex: none;
  min-height: 32px;
  padding: 4px 8px;
  font: inherit;
  color: var(--dx-text);
  background: transparent;
  border: 0;
  border-radius: 5px;
  cursor: pointer;
}
.dx-plan-reminder button:hover {
  background: var(--dx-hover);
}
.dx-plan-reminder-review {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-plan-reminder .dx-plan-reminder-close {
  display: grid;
  place-items: center;
  width: 32px;
  padding: 4px;
}
.dx-plan-reminder button:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-canvas-app > .dx-message.dx-plan-reminder {
  top: auto;
  height: auto;
  max-height: min(160px, 30vh);
  overflow: auto;
}
@media (max-width: 760px) {
  .dx-canvas-app:has(.dx-canvas-controls:not([hidden])) > .dx-plan-reminder {
    display: none;
  }
  .dx-canvas-app > .dx-message.dx-plan-reminder {
    top: auto;
    bottom: var(--compact-panel-bottom,84px);
    left: 12px;
    right: 12px;
    width: auto;
    max-width: none;
    transform: none;
  }
}

/* canvas/src/color-grade-v1.css */
.dx-grade-editor {
  position: fixed;
  z-index: 66;
  inset: 82px 18px 90px auto;
  width: min(440px, calc(100vw - 36px));
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  font-family: var(--font-sans);
  font-size: calc(13px * var(--canvas-text-scale,1));
  overflow: hidden;
  scrollbar-color: var(--dx-border) transparent;
}
.dx-grade-editor > header,
.dx-grade-editor > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  flex-shrink: 0;
}
.dx-grade-editor > header {
  border-bottom: 1px solid var(--dx-border);
}
.dx-grade-editor > footer {
  border-top: 1px solid var(--dx-border);
  flex-wrap: wrap;
}
.dx-grade-editor h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: calc(17px * var(--canvas-text-scale,1));
  margin: 0;
}
.dx-grade-editor header button {
  padding: 6px;
  border-radius: 5px;
}
.dx-grade-editor header button:hover {
  background: var(--dx-hover);
}
.dx-grade-scroll {
  overflow: auto;
  min-height: 0;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dx-grade-editor label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: inherit;
}
.dx-grade-editor p {
  margin: 0;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.dx-grade-intro,
.dx-grade-editor details p {
  color: var(--dx-text-soft);
}
.dx-grade-inline {
  display: flex;
  align-items: end;
  gap: 8px;
  flex-wrap: wrap;
}
.dx-grade-inline > label {
  max-width: 100px;
}
.dx-grade-inline a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--dx-text);
  text-decoration: underline;
  text-underline-offset: 3px;
  padding: 6px;
}
.dx-grade-preview {
  min-height: 120px;
  background: var(--dx-surface-inset);
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden;
}
.dx-grade-preview > p {
  padding: 20px;
  text-align: center;
  color: var(--dx-text-soft);
}
.dx-grade-preview img {
  display: block;
  width: 100%;
  max-height: 280px;
  object-fit: contain;
  background: #000;
}
.dx-grade-preview-caption {
  padding: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  font-variant-numeric: tabular-nums;
}
.dx-grade-preview-caption button {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-grade-controls {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.dx-grade-value {
  display: grid;
  grid-template-columns: minmax(50px, 1fr) 92px;
  gap: 12px;
  align-items: center;
  margin-top: 6px;
}
.dx-grade-value input[type=range] {
  width: 100%;
  accent-color: var(--dx-text);
  cursor: pointer;
}
.dx-grade-value input[type=number] {
  font-variant-numeric: tabular-nums;
}
.dx-grade-editor .dx-grade-control-mode {
  margin-top: 8px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  color: var(--dx-text-soft);
}
.dx-grade-control-mode > [role=combobox] {
  max-width: 145px;
}
.dx-grade-editor details {
  border-top: 1px solid var(--dx-border);
  padding-top: 12px;
}
.dx-grade-editor summary {
  cursor: pointer;
}
.dx-grade-editor details p {
  margin-top: 10px;
}
.dx-grade-editor ol {
  padding-left: 22px;
  line-height: 1.6;
}
.dx-grade-editor [role=alert] {
  padding: 10px;
  background: var(--dx-surface-inset);
  border: 1px solid var(--dx-border);
  border-radius: 6px;
}
.dx-grade-job {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: space-between;
}
.dx-grade-editor :is(input, button, [role=combobox]) {
  font-size: inherit;
}
.dx-grade-editor button {
  white-space: normal;
}
.dx-grade-editor button:disabled,
.dx-grade-editor input:disabled {
  opacity: .6;
  cursor: default;
}
.dx-grade-editor :is(button, a, summary, input[type=range]):focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-grade-editor input:not([type=range]):focus-visible {
  outline: none;
  box-shadow: none;
  border-color: var(--dx-text);
}
.dx-grade-editor:focus {
  outline: none;
}
@media (max-height: 650px) {
  .dx-grade-editor {
    top: 55px;
    bottom: 60px;
  }
  .dx-grade-preview img {
    max-height: 180px;
  }
}
.dx-grade-scroll > * {
  flex-shrink: 0;
}
.dx-grade-preview img {
  flex: none;
  height: auto;
}
.dx-grade-editor > footer {
  display: block;
}
.dx-grade-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
.dx-grade-feedback {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 180px;
  overflow: auto;
  margin-bottom: 12px;
}
.dx-grade-feedback:empty {
  display: none;
}
.dx-grade-job {
  flex-wrap: wrap;
}
.dx-grade-feedback [role=alert] {
  margin: 0;
}

/* canvas/src/presets-v1.css */
.dx-preset-card {
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 16px;
  background: var(--dx-surface);
  color: var(--dx-text);
  overflow: hidden;
  text-align: left;
}
.dx-preset-card strong {
  font-size: 18px;
  line-height: 1.2;
  text-wrap: balance;
}
.dx-preset-card p {
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}
.dx-preset-card span,
.dx-preset-card small {
  font-size: 12px;
  color: var(--dx-text-soft);
}
.dx-preset-card .dx-preset-excerpt {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.dx-preset-card button {
  margin-top: auto;
}
.dx-preset-active {
  font-size: calc(12px * var(--canvas-text-scale,1));
  background: var(--dx-surface);
  color: var(--dx-text);
  max-width: 100%;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  padding: 10px 12px;
  margin: 6px 0;
}
.dx-preset-active summary {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 7px;
}
.dx-preset-active > div {
  max-height: 240px;
  overflow: auto;
  padding-top: 10px;
}
.dx-preset-active button {
  display: block;
  text-align: left;
  padding: 6px;
  width: 100%;
}
.dx-preset-active small {
  display: block;
  color: var(--dx-text-soft);
  margin-top: 3px;
}
.dx-preset-active p {
  margin: 8px 0;
  overflow-wrap: anywhere;
}
.dx-preset-add {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: calc(12px * var(--canvas-text-scale,1));
  padding: 8px;
}
.dx-preset-editor {
  position: fixed;
  z-index: 65;
  right: 18px;
  top: 82px;
  bottom: 100px;
  width: min(380px, calc(100vw - 36px));
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
}
.dx-preset-editor header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-preset-editor h2 {
  font-size: calc(17px * var(--canvas-text-scale,1));
  margin: 0;
}
.dx-preset-editor header button {
  padding: 6px;
}
.dx-preset-fields {
  overflow: auto;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dx-preset-fields label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-preset-fields p {
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
  color: var(--dx-text-soft);
  margin: 0;
}
.dx-preset-fields [role=alert] {
  color: var(--dx-text);
}
.dx-preset-fields footer {
  display: flex;
  gap: 8px;
}
.dx-preset-editor textarea {
  resize: vertical;
  min-height: 120px;
}
.dx-preset-editor,
.dx-preset-card,
.dx-preset-active {
  font-family: var(--font-sans);
  scrollbar-color: var(--dx-border) transparent;
}
.dx-preset-editor :is(button, input, textarea):focus-visible,
.dx-preset-active :is(button, summary):focus-visible,
.dx-preset-card button:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-preset-card button {
  padding: 6px 10px;
  background: var(--dx-surface-inset);
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  color: var(--dx-text);
  cursor: pointer;
}
.dx-preset-active button:hover,
.dx-preset-editor header button:hover {
  background: var(--dx-surface-inset);
}
.dx-preset-card > header {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  flex-shrink: 0;
}
.dx-preset-card > header > svg {
  flex: 0 0 22px;
  width: 22px !important;
  height: 22px !important;
}
.dx-preset-card > span,
.dx-preset-card > small,
.dx-preset-card > button {
  flex-shrink: 0;
}
.dx-preset-card > p:not(.dx-preset-excerpt) {
  flex-shrink: 0;
}
.dx-preset-editor :is(input, textarea, button, [role=combobox]) {
  font-size: calc(13px * var(--canvas-text-scale,1));
}
.dx-preset-fields footer {
  flex-wrap: wrap;
}
.dx-preset-fields footer button {
  white-space: normal;
  height: auto;
  min-height: 32px;
}
.dx-preset-active button,
.dx-preset-active summary {
  font-size: inherit;
  overflow-wrap: anywhere;
}
.dx-preset-active small {
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-preset-editor header {
  flex-shrink: 0;
}
.dx-preset-fields {
  min-height: 0;
}

/* canvas/src/auto-selection-settings-v1.css */
.dx-auto-selection-form {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.dx-auto-selection-details {
  display: grid;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.dx-auto-selection-legend {
  padding: 0;
  color: var(--dx-text);
  font-family: var(--dx-font-sans);
  font-weight: 600;
}
.dx-auto-selection-form .dx-request-settings-field {
  min-width: 0;
}
.dx-auto-selection-select-wrap {
  width: 100%;
  min-width: 0;
}
.dx-auto-selection-select-wrap > *,
.dx-auto-selection-select-wrap select {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
.dx-auto-selection-help,
.dx-auto-selection-note,
.dx-auto-selection-status {
  margin: 0;
  color: var(--dx-text-soft);
  font-family: var(--dx-font-sans);
  font-size: inherit;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.dx-auto-selection-error {
  margin: 0;
  color: var(--dx-text);
  font-family: var(--dx-font-sans);
  font-size: inherit;
  font-weight: 600;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.dx-auto-selection-rules-heading,
.dx-auto-selection-rules-title {
  margin: 0;
  color: var(--dx-text);
  font-family: var(--dx-font-sans);
  line-height: 1.4;
}
.dx-auto-selection-rules-heading {
  font-size: inherit;
}
.dx-auto-selection-rules-title {
  font-size: inherit;
  font-weight: 600;
}
.dx-auto-selection-add-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  min-width: 0;
  max-width: 100%;
}
.dx-auto-selection-add-row > .dx-request-settings-field {
  flex: 1 1 220px;
  min-width: 0;
}
.dx-auto-selection-add-row > button {
  flex: 0 0 auto;
  max-width: 100%;
}
.dx-auto-selection-rule-list {
  display: grid;
  gap: 0;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid var(--dx-border);
  background: var(--dx-surface-inset);
}
.dx-auto-selection-rule-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
  padding: 8px 10px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-auto-selection-rule-row:last-child {
  border-bottom: 0;
}
.dx-auto-selection-rule-text {
  flex: 1 1 180px;
  min-width: 0;
  color: var(--dx-text);
  font-family: var(--dx-font-sans);
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.dx-auto-selection-rule-action {
  color: var(--dx-text);
  font-weight: 600;
}
.dx-auto-selection-rule-target {
  color: var(--dx-text-soft);
}
.dx-auto-selection-rule-row > button {
  flex: 0 0 auto;
  max-width: 100%;
}
.dx-auto-selection-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
}
.dx-auto-selection-actions > button {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
}
@media (max-width: 420px) {
  .dx-auto-selection-add-row > .dx-request-settings-field {
    flex-basis: 100%;
  }
  .dx-auto-selection-add-row > button {
    width: 100%;
  }
  .dx-auto-selection-actions {
    display: grid;
  }
  .dx-auto-selection-actions > button {
    width: 100%;
  }
}
.dx-auto-selection-details[hidden] {
  display: none;
}
.dx-auto-selection-form input,
.dx-auto-selection-form textarea {
  font: inherit;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}

/* canvas/src/comfy-workflow-artifact-v1.css */
.dx-comfy-card {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
  background: var(--dx-surface);
  color: var(--dx-text);
  overflow: hidden;
  font-family: var(--font-sans);
}
.dx-comfy-card header,
.dx-comfy-selection > strong {
  display: flex;
  align-items: flex-start;
  gap: 9px;
}
.dx-comfy-card header svg {
  width: 24px !important;
  height: 24px !important;
  flex: none;
}
.dx-comfy-card strong {
  font-size: 17px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.dx-comfy-card p {
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
}
.dx-comfy-card span,
.dx-comfy-card small {
  font-size: 12px;
  color: var(--dx-text-soft);
}
.dx-comfy-card button {
  margin-top: auto;
  flex-shrink: 0;
}
.dx-comfy-selection {
  border: 1px solid var(--dx-border);
  border-radius: 10px;
  background: var(--dx-surface);
  padding: 12px;
  margin: 6px 0;
  color: var(--dx-text);
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-comfy-selection p {
  line-height: 1.5;
}
.dx-comfy-selection > strong > svg {
  flex-shrink: 0;
}
.dx-comfy-editor {
  position: fixed;
  z-index: 66;
  right: 18px;
  top: 82px;
  bottom: 100px;
  width: min(560px, calc(100vw - 36px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  font-family: var(--font-sans);
}
.dx-comfy-editor > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-shrink: 0;
  padding: 16px 18px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-comfy-editor h2 {
  font-size: calc(17px * var(--canvas-text-scale,1));
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-comfy-editor > header button {
  padding: 6px;
  flex-shrink: 0;
}
.dx-comfy-fields {
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  scrollbar-color: var(--dx-border) transparent;
}
.dx-comfy-fields > label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dx-comfy-fields p {
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
  margin: 0;
}
.dx-comfy-fields > label,
.dx-comfy-fields a {
  font-size: calc(13px * var(--canvas-text-scale,1));
}
.dx-comfy-fields a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-comfy-actions,
.dx-comfy-fields footer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.dx-comfy-editor :is(button, input, [role=combobox]) {
  font-size: calc(13px * var(--canvas-text-scale,1));
}
.dx-comfy-editor button {
  white-space: normal;
  height: auto;
  min-height: 32px;
}
.dx-comfy-editor [role=alert] {
  border-left: 1px solid var(--dx-text);
  padding-left: 10px;
}
.dx-comfy-editor :is(button, a):focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-comfy-fields .dx-workflows > p:first-child,
.dx-comfy-fields .dx-workflow-upload {
  display: none;
}

/* canvas/src/project-menu-v1.css */
.dx-sidebar-header {
  position: relative;
}
.dx-sidebar-brand {
  min-width: 0;
}
.dx-sidebar-brand strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-project-menu {
  min-width: 220px;
  max-width: min(360px, calc(100vw - 32px));
  max-height: min(520px, var(--radix-dropdown-menu-content-available-height));
  overflow: auto;
}
.dx-project-menu [role=menuitem] {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-project-menu [role=menuitem] > svg {
  flex-shrink: 0;
}
.dx-project-menu [role=menuitem].dx-project-menu-danger {
  color: var(--dx-error-ink);
}
.dx-project-menu [role=menuitem].dx-project-menu-danger[data-disabled] {
  opacity: .5;
}
.dx-project-menu [role=menuitem] > span {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-project-error {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  box-sizing: border-box;
  max-height: 160px;
  overflow: auto;
  padding: 12px;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  z-index: 30;
}
.dx-project-error button {
  display: block;
  margin-top: 8px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-project-menu-label {
  padding: 8px 8px 4px;
  color: var(--dx-text-soft);
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-project-result-count {
  margin: 0;
  color: var(--dx-text-soft);
}
.dx-project-results {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: min(360px, 45dvh);
  overflow: auto;
}
.dx-project-result {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  width: 100%;
  padding: 10px 12px;
  text-align: left;
  border-radius: 6px;
}
.dx-project-result:hover {
  background: var(--dx-hover);
}
.dx-project-result > span {
  flex: 1;
  min-width: 0;
}
.dx-project-result strong,
.dx-project-result small {
  display: block;
  overflow-wrap: anywhere;
}
.dx-project-result strong {
  font-weight: 500;
}
.dx-project-result small {
  margin-top: 2px;
  color: var(--dx-text-soft);
}
.dx-project-result > svg {
  flex-shrink: 0;
}
.dx-project-result,
.dx-project-result-count {
  font-size: calc(13px * var(--canvas-text-scale,1));
  line-height: 1.4;
}
.dx-project-result small {
  font-size: calc(12px * var(--canvas-text-scale,1));
}

/* canvas/src/visionquest-v1.css */
.vq-controls {
  color: var(--dx-text);
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.45;
  border: 1px solid var(--dx-border);
  border-radius: 9px;
  background: var(--dx-surface);
  padding: 7px 9px;
}
.vq-summary,
.vq-actions,
.vq-btn {
  display: flex;
  align-items: center;
  gap: 7px;
}
.vq-summary {
  justify-content: space-between;
  gap: 8px;
}
.vq-status {
  color: var(--dx-text-soft);
}
.vq-options-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
  cursor: pointer;
}
.vq-options-toggle:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.vq-options {
  padding-top: 4px;
}
.vq-options p {
  margin: 4px 0 9px;
  color: var(--dx-text-soft);
}
.vq-actions {
  flex-wrap: wrap;
  gap: 5px;
}
.vq-btn {
  border: 1px solid var(--dx-border);
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  border-radius: 6px;
  min-height: 30px;
  padding: 5px 7px;
  font: inherit;
  cursor: pointer;
}
.vq-btn:hover {
  background: var(--dx-hover);
}
.vq-btn:focus-visible,
.vq-options-toggle:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.vq-btn[aria-pressed=true] {
  border-color: var(--dx-text-soft);
}
.vq-command {
  margin: 5px 0 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow-wrap: anywhere;
  color: var(--dx-text);
}
.vq-notice {
  margin: 6px 0 0;
  overflow-wrap: anywhere;
  color: var(--dx-text-soft);
}
.vq-error {
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.vq-error svg {
  flex-shrink: 0;
  margin-top: 2px;
}
.vq-spin {
  animation: dx-spin .8s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  .vq-spin {
    animation: none;
  }
}
.vq-draft {
  align-self: flex-end;
  background: none;
  border: 0;
  color: var(--dx-text-soft);
  font: inherit;
  font-size: 11px;
  cursor: pointer;
  padding: 4px;
}
.vq-draft:hover {
  text-decoration: underline;
}
.dx-prompt-bar > .vq-options-toggle {
  width: 18px;
  height: 28px;
  margin-left: -3px;
}
.vq-dismiss {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
  cursor: pointer;
}
.vq-dismiss:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.vq-dismiss:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-voice-words {
  display: grid;
  gap: 10px;
}
.dx-voice-words > label {
  display: grid;
  gap: 5px;
}
.dx-voice-words input {
  width: 100%;
  min-width: 0;
}
.dx-voice-words p {
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-voice-example {
  color: var(--dx-text);
}
.vq-recovery {
  margin-top: 9px;
}
.vq-recovery p {
  flex-basis: 100%;
  margin: 2px 0 0;
  color: var(--dx-text-soft);
  overflow-wrap: anywhere;
}
.vq-recovery .vq-btn {
  max-width: 100%;
  white-space: normal;
  text-align: start;
}
.vq-recovery svg {
  flex-shrink: 0;
}
.vq-btn:disabled {
  opacity: .6;
  cursor: default;
}

/* canvas/src/auto-options-v1.css */
.auto-options {
  color: var(--dx-text);
  font: inherit;
  max-width: 100%;
  min-width: 0;
}
.auto-options__intro,
.auto-options__help {
  margin: 0;
  color: var(--dx-text-soft);
  font: inherit;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.auto-options__intro {
  padding: 0 0 6px;
}
.auto-options__details {
  border-top: 1px solid var(--dx-border);
  min-width: 0;
}
.auto-options__summary {
  color: var(--dx-text);
  cursor: pointer;
  font: inherit;
  line-height: 1.4;
  overflow-wrap: anywhere;
  padding: 8px 0;
}
.auto-options__summary:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 4px;
}
.auto-options__content {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 0 0 10px;
}
.auto-options__field {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.auto-options__label {
  color: var(--dx-text);
  font: inherit;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.auto-options__optional {
  color: var(--dx-text-soft);
}
.auto-options__input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  padding: 6px 8px;
  color: var(--dx-text);
  background: transparent;
  font: inherit;
  line-height: 1.4;
}
.auto-options__input::placeholder {
  color: var(--dx-text-soft);
  opacity: 1;
}
.auto-options__help {
  padding: 0;
}
.auto-options .auto-options__label {
  display: block;
}

/* canvas/src/generation-connections-v1.css */
.dx-provider-check input[type=checkbox] {
  accent-color: var(--dx-text);
}
.dx-connection-meta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  color: var(--dx-text-soft);
  font-size: 12px;
  margin-top: 4px;
}
.dx-connection-test {
  white-space: nowrap;
}
.dx-connection-status {
  margin: 8px 0;
  font-size: 12px;
  overflow-wrap: anywhere;
}
.dx-cloudflare-credits {
  margin: 4px 0 12px 26px;
  font: var(--dx-type-caption);
  overflow-wrap: anywhere;
}
.dx-cloudflare-credits p {
  margin: 4px 0;
}
.dx-cloudflare-credits-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.dx-generation-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
  font: var(--dx-type-caption);
}
.dx-generation-options:empty {
  display: none;
}
.dx-generation-options label {
  display: flex;
  align-items: center;
  gap: 7px;
}
.dx-generation-options input[type=number] {
  max-width: 170px;
}
.dx-generation-options p {
  flex-basis: 100%;
  margin: 0;
  color: var(--dx-text-soft);
  line-height: 1.5;
}
.dx-conversation .dx-generation-options {
  padding: 0 12px 10px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-workflow-upload {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  cursor: pointer;
}
.dx-workflow-upload input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  width: 100%;
}
.dx-workflow-upload:focus-within {
  border-color: var(--dx-text);
  outline: none;
  box-shadow: none;
}
.dx-workflow {
  border-top: 1px solid var(--dx-border);
  margin-top: 12px;
  padding-top: 8px;
}
.dx-workflow-heading {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-workflow-heading > button:first-child {
  margin-right: auto;
  max-width: 75%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dx-workflow-heading > span {
  font-size: 12px;
  color: var(--dx-text-soft);
}
.dx-workflow-fields {
  display: grid;
  gap: 10px;
  margin: 12px 0;
}
.dx-workflow-fields > label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dx-workflow-fields fieldset {
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  max-height: 180px;
  overflow: auto;
  padding: 10px;
}
.dx-workflow-fields fieldset label {
  margin: 6px 0;
}
.dx-workflow-fields small {
  color: var(--dx-text-soft);
}
.dx-media-result {
  min-width: 0;
  grid-column: 1/-1;
}
.dx-media-result > .dx-media-player:not(.is-audio) {
  height: 160px;
  border-radius: 6px;
}
.dx-media-player.is-audio.is-compact {
  height: auto;
  min-height: 40px;
  padding: 0;
  gap: 0;
  background: transparent;
}
.dx-media-player.is-audio.is-compact .dx-media-transport {
  position: relative;
  inset: auto;
  width: 100%;
}
.dx-media-player.is-compact .dx-media-error {
  position: relative;
  inset: auto;
  margin: 6px 0;
}
.dx-media-result > button {
  border: 0;
  background: none;
  color: var(--dx-text-soft);
  text-align: left;
  padding: 6px 0;
  font: inherit;
  cursor: pointer;
}
.dx-subscription-connections {
  margin-top: 24px;
  border-top: 1px solid var(--dx-border);
  padding-top: 16px;
}
.dx-subscription-connections p {
  color: var(--dx-text-soft);
}
@media (max-width: 600px) {
  .dx-provider-row {
    flex-wrap: wrap;
  }
  .dx-provider-row > div {
    min-width: 180px;
  }
  .dx-generation-options {
    gap: 8px;
  }
  .dx-workflow-heading > button:first-child {
    max-width: 65%;
  }
}
.dx-cloudflare-models {
  display: grid;
  gap: 18px;
  margin: 8px 0;
}
.dx-cloudflare-models fieldset {
  min-width: 0;
  border: 0;
  padding: 0;
  margin: 0;
}
.dx-cloudflare-models legend {
  font-weight: 600;
  margin-bottom: 8px;
}
.dx-cloudflare-models fieldset .dx-provider-check {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0;
}
.dx-cloudflare-models p {
  color: var(--dx-text-soft);
  line-height: 1.5;
  margin: 8px 0 0;
}
.dx-cloudflare-model-list {
  max-height: 300px;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 4px 12px 4px 0;
  scrollbar-color: var(--dx-border) transparent;
  scrollbar-width: thin;
}
.dx-cloudflare-model-list:focus-visible {
  outline: 1px solid var(--dx-text-soft);
  outline-offset: 4px;
}
.dx-cloudflare-provider + .dx-cloudflare-provider {
  margin-top: 20px;
}
.dx-cloudflare-provider > strong {
  font-size: 13px;
  color: var(--dx-text-soft);
}
.dx-cloudflare-models .dx-provider-check {
  align-items: flex-start !important;
  cursor: pointer;
}
.dx-cloudflare-models .dx-provider-check input {
  margin-top: 5px;
  flex-shrink: 0;
}
.dx-cloudflare-models .dx-provider-check small {
  display: block;
  color: var(--dx-text-soft);
  font-size: 12px;
  line-height: 1.5;
}
.dx-cloudflare-selection-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
#cloudflare-model-search:focus {
  border-color: var(--dx-text-soft);
  outline: none;
  box-shadow: none;
}
.dx-workflow-controls {
  width: 100%;
  min-width: 0;
}
.dx-workflow-control-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  gap: 12px;
}
.dx-workflow-control label,
.dx-parameter-fields > label,
.dx-workflow-fields details > label,
.dx-workflow-output > label {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-width: 0;
}
.dx-workflow-control input,
.dx-workflow-control textarea,
.dx-parameter-fields input {
  width: 100%;
  min-width: 0;
}
.dx-workflow-control input[type=checkbox] {
  width: auto;
  align-self: flex-start;
  accent-color: var(--dx-text);
}
.dx-workflow-control small,
.dx-parameter-editor summary > span {
  color: var(--dx-text-soft);
  font-size: 12px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.dx-workflow-control label > span {
  overflow-wrap: anywhere;
}
.dx-workflow-controls details > summary,
.dx-workflow-fields details > summary {
  cursor: pointer;
  padding: 10px 0;
  font-weight: 500;
}
.dx-workflow-controls p {
  margin-top: 10px !important;
}
.dx-workflow-controls details[open] > .dx-workflow-control-grid {
  padding-bottom: 10px;
}
.dx-workflow-reset {
  border: 0;
  background: none;
  color: var(--dx-text);
  text-decoration: underline;
  font: inherit;
  padding: 8px 0;
  cursor: pointer;
}
.dx-workflow-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.dx-workflow-actions > strong {
  margin-right: auto;
}
.dx-parameter-editor {
  border-top: 1px solid var(--dx-border);
  min-width: 0;
}
.dx-parameter-editor summary {
  overflow-wrap: anywhere;
}
.dx-parameter-editor summary > span {
  display: block;
  margin-left: 16px;
}
.dx-parameter-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 4px 0 12px;
}
.dx-parameter-fields fieldset,
.dx-parameter-range {
  grid-column: 1/-1;
}
.dx-parameter-range {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.dx-parameter-range label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dx-parameter-fields .dx-provider-check {
  flex-direction: row;
  align-items: center;
}
.dx-parameter-fields .dx-provider-check input {
  width: auto;
}
.dx-parameter-bindings > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.dx-parameter-bindings span {
  overflow-wrap: anywhere;
}
.dx-workflow-output {
  border-top: 1px solid var(--dx-border);
  padding-top: 10px;
  display: grid;
  gap: 8px;
}
.dx-workflow-fields details > label {
  margin: 10px 0;
}
.dx-workflow-fields summary:focus-visible,
.dx-workflow-controls summary:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 3px;
  border-radius: 6px;
}
@media (max-width: 600px) {
  .dx-parameter-fields {
    grid-template-columns: 1fr;
  }
  .dx-parameter-fields fieldset,
  .dx-parameter-range {
    grid-column: auto;
  }
}
.dx-conversation .dx-generation-options {
  flex-shrink: 0;
  max-height: 48%;
  overflow: auto;
  overscroll-behavior: contain;
}
fieldset.dx-workflow-fields {
  border: 0;
  padding: 0;
  min-width: 0;
}

/* canvas/src/diffusion-apps-v1.css */
.dx-presentation {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 0;
  overflow: hidden;
  background: var(--dx-surface);
  color: var(--dx-text);
  font-size: 12px;
}
.dx-presentation-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  background: var(--dx-surface);
}
.dx-presentation-stage iframe {
  position: absolute;
  left: 0;
  top: 0;
  border: 0;
  transform-origin: top left;
  pointer-events: none;
  max-width: none !important;
  max-height: none !important;
}
.dx-presentation-stage p {
  padding: 16px;
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-presentation-caption {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 10px;
  border-top: 1px solid var(--dx-border);
  min-width: 0;
}
.dx-presentation-caption > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-presentation-caption small {
  flex: none;
  color: var(--dx-text-soft);
}
.dx-presentation-controls {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  padding: 4px 8px;
}
.dx-presentation-controls button,
.dx-presentation-controls a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  min-width: 28px;
  color: inherit;
}
.dx-presentation-controls button:disabled {
  opacity: .4;
}
.dx-presentation-controls span,
.dx-presentation-note {
  color: var(--dx-text-soft);
  font-size: 11px;
}
.dx-presentation-note {
  padding: 0 10px 8px;
  overflow-wrap: anywhere;
}
.dx-diffusion-inputs .dx-office-search {
  grid-template-columns: minmax(0, 1fr) auto;
}
.dx-diffusion-inputs .dx-office-search input {
  width: 100%;
  min-width: 0;
}

/* canvas/src/office-connections-v1.css */
.dx-office {
  padding: 12px 0;
  border-bottom: 1px solid var(--dx-border);
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
  min-width: 0;
}
.dx-office-heading,
.dx-office-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.dx-office-heading {
  justify-content: space-between;
}
.dx-office-heading button {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--dx-text-soft);
}
.dx-office-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin: 12px 0;
}
.dx-office-search > button:first-child {
  grid-column: 1/-1;
}
.dx-office-search input {
  min-width: 0;
  width: 100%;
}
.dx-office-results {
  list-style: none;
  margin: 0;
  padding: 0;
}
.dx-office-results li {
  padding: 12px 0;
  border-bottom: 1px solid var(--dx-border);
  overflow-wrap: anywhere;
}
.dx-office-result-title {
  display: flex;
  align-items: flex-start;
  gap: 6px;
}
.dx-office-result-title svg {
  flex: none;
  margin-top: 2px;
}
.dx-office-results small {
  display: block;
  color: var(--dx-text-soft);
  margin: 4px 0;
}
.dx-office p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 8px 0;
}
.dx-office-results p {
  max-height: 5em;
  overflow: auto;
}
.dx-office-actions a {
  display: inline-flex;
  padding: 6px;
}
.dx-office-actions button,
.dx-office-email > button {
  height: auto;
  white-space: normal;
  overflow-wrap: anywhere;
  font: inherit;
}
.dx-office-email {
  margin-top: 16px;
}
.dx-office-email pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: 300px;
  overflow: auto;
  font: inherit;
}
.dx-office-email > button {
  display: flex;
  margin: 8px 0;
  max-width: 100%;
}
.dx-office-request {
  color: var(--dx-text-soft);
}
.dx-office-settings h4 {
  margin: 18px 0 6px;
}
.dx-office-settings form {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.dx-office-settings label {
  font-weight: 500;
}
.dx-office-settings a {
  text-decoration: underline;
}
.dx-office-settings p {
  overflow-wrap: anywhere;
}
.dx-office-calendar {
  grid-column: 1/-1;
  display: grid;
  gap: 8px;
  min-width: 0;
}
.dx-office-calendar label {
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
}
.dx-office-calendar small {
  color: var(--dx-text-soft);
}
.dx-office-settings details p {
  max-width: 65ch;
}

/* canvas/src/search-results-dialog-v1.css */
.dx-scaled-dialog.dx-search-picker {
  --dx-search-picker-ui: 1;
  --dx-search-picker-text: var(--canvas-text-scale, var(--dx-search-picker-ui));
  --dx-search-picker-gap: calc(0.75rem * var(--dx-search-picker-ui));
  --dx-search-picker-pad: calc(1rem * var(--dx-search-picker-ui));
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: min(840px, calc((100vw - 32px) / var(--canvas-ui-scale,1)));
  max-width: min(840px, calc((100vw - 32px) / var(--canvas-ui-scale,1)));
  height: min(840px, calc((100dvh - 32px) / var(--canvas-ui-scale,1)));
  max-height: calc((100dvh - 32px) / var(--canvas-ui-scale,1));
  padding: 0;
  gap: 0;
  overflow: hidden;
  font-family: var(--dx-font-sans, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif);
  font-size: calc(0.8125rem * var(--dx-search-picker-text));
  line-height: 1.45;
  color: var(--dx-text, #18181b);
  background: var(--dx-surface, #ffffff);
  border: 1px solid var(--dx-border, #d4d4d8);
  border-radius: calc(10px * var(--dx-search-picker-ui));
}
.dx-search-picker,
.dx-search-picker *,
.dx-search-picker *::before,
.dx-search-picker *::after {
  box-sizing: border-box;
}
.dx-search-picker .dx-search-picker__header {
  flex: 0 0 auto;
  padding: calc(1rem * var(--dx-search-picker-ui)) var(--dx-search-picker-pad) calc(0.5rem * var(--dx-search-picker-ui));
  gap: calc(0.25rem * var(--dx-search-picker-ui));
  text-align: left;
}
.dx-search-picker .dx-search-picker__title {
  margin: 0;
  color: var(--dx-text, #18181b);
  font-size: calc(1.0625rem * var(--dx-search-picker-text));
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0;
}
.dx-search-picker .dx-search-picker__description {
  margin: 0;
  color: var(--dx-text-soft, #71717a);
  font-size: 0.875em;
}
.dx-search-picker .dx-search-picker__form {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: calc(0.5rem * var(--dx-search-picker-ui));
  padding: 0 var(--dx-search-picker-pad) var(--dx-search-picker-gap);
}
.dx-search-picker .dx-search-picker__query-row {
  display: flex;
  align-items: center;
  gap: calc(0.5rem * var(--dx-search-picker-ui));
}
.dx-search-picker .dx-search-picker__input {
  flex: 1 1 auto;
  min-width: 0;
  font: inherit;
}
.dx-search-picker .dx-search-picker__search-button,
.dx-search-picker .dx-search-picker__more-button,
.dx-search-picker .dx-search-picker__cancel-button,
.dx-search-picker .dx-search-picker__primary-button {
  font: inherit;
}
.dx-search-picker .dx-search-picker__search-button {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: calc(0.375rem * var(--dx-search-picker-ui));
}
.dx-search-picker .dx-search-picker__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.dx-search-picker .dx-search-picker__error {
  flex: 0 0 auto;
  margin: 0 var(--dx-search-picker-pad) var(--dx-search-picker-gap);
  padding: calc(0.5rem * var(--dx-search-picker-ui)) calc(0.75rem * var(--dx-search-picker-ui));
  color: var(--dx-text, #18181b);
  background: var(--dx-hover, rgba(0, 0, 0, 0.04));
  border: 1px solid var(--dx-border, #d4d4d8);
  border-radius: calc(6px * var(--dx-search-picker-ui));
  font-size: 0.875em;
}
.dx-search-picker .dx-search-picker__results {
  flex: 1 1 auto;
  min-height: 0;
  padding: 0 var(--dx-search-picker-pad) var(--dx-search-picker-gap);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.dx-search-picker .dx-search-picker__list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--dx-border, #d4d4d8);
}
.dx-search-picker .dx-search-picker__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: calc(0.5rem * var(--dx-search-picker-ui));
  border-bottom: 1px solid var(--dx-border, #d4d4d8);
}
.dx-search-picker .dx-search-picker__select {
  appearance: none;
  width: 100%;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: calc(0.5rem * var(--dx-search-picker-ui));
  padding: calc(0.625rem * var(--dx-search-picker-ui)) 0;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.dx-search-picker .dx-search-picker__select:hover,
.dx-search-picker .dx-search-picker__select[aria-pressed=true] {
  background: var(--dx-hover, rgba(0, 0, 0, 0.04));
}
.dx-search-picker .dx-search-picker__select:focus-visible {
  outline: 1px solid var(--dx-text, #18181b);
  outline-offset: -1px;
}
.dx-search-picker .dx-search-picker__index {
  min-width: calc(2rem * var(--dx-search-picker-ui));
  color: var(--dx-text-soft, #71717a);
  font-variant-numeric: tabular-nums;
}
.dx-search-picker .dx-search-picker__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: calc(0.125rem * var(--dx-search-picker-ui));
}
.dx-search-picker .dx-search-picker__name {
  color: var(--dx-text, #18181b);
  font-weight: 500;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.dx-search-picker .dx-search-picker__detail {
  color: var(--dx-text-soft, #71717a);
  font-size: 0.875em;
  overflow-wrap: anywhere;
}
.dx-search-picker .dx-search-picker__open {
  display: inline-flex;
  align-items: center;
  gap: calc(0.25rem * var(--dx-search-picker-ui));
  margin-top: calc(0.625rem * var(--dx-search-picker-ui));
  padding: calc(0.125rem * var(--dx-search-picker-ui)) calc(0.25rem * var(--dx-search-picker-ui));
  color: var(--dx-text-soft, #71717a);
  border-radius: calc(4px * var(--dx-search-picker-ui));
  font-size: 0.8125em;
  text-decoration: none;
  white-space: nowrap;
}
.dx-search-picker .dx-search-picker__open:hover {
  color: var(--dx-text, #18181b);
  background: var(--dx-hover, rgba(0, 0, 0, 0.04));
}
.dx-search-picker .dx-search-picker__open:focus-visible {
  outline: 1px solid var(--dx-text, #18181b);
  outline-offset: 1px;
}
.dx-search-picker .dx-search-picker__more {
  display: flex;
  justify-content: center;
  padding: calc(0.75rem * var(--dx-search-picker-ui)) 0 calc(0.25rem * var(--dx-search-picker-ui));
}
.dx-search-picker .dx-search-picker__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(0.375rem * var(--dx-search-picker-ui));
  min-height: calc(10rem * var(--dx-search-picker-ui));
  padding: var(--dx-search-picker-gap);
  color: var(--dx-text-soft, #71717a);
  text-align: center;
}
.dx-search-picker .dx-search-picker__empty-title {
  margin: 0;
  color: var(--dx-text, #18181b);
  font-weight: 600;
}
.dx-search-picker .dx-search-picker__empty-copy {
  max-width: 34ch;
  margin: 0;
  font-size: 0.875em;
}
.dx-search-picker .dx-search-picker__footer {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--dx-search-picker-gap);
  padding: calc(0.75rem * var(--dx-search-picker-ui)) var(--dx-search-picker-pad);
  background: var(--dx-surface, #ffffff);
  border-top: 1px solid var(--dx-border, #d4d4d8);
}
.dx-search-picker .dx-search-picker__selection {
  min-width: 0;
  overflow: hidden;
  color: var(--dx-text-soft, #71717a);
  font-size: 0.875em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-search-picker .dx-search-picker__actions {
  flex: 0 0 auto;
  display: flex;
  gap: calc(0.5rem * var(--dx-search-picker-ui));
}
.dx-search-picker .dx-search-picker__primary-button {
  display: inline-flex;
  align-items: center;
  gap: calc(0.375rem * var(--dx-search-picker-ui));
}
.dx-search-picker .dx-search-picker__spinner {
  animation: dx-search-picker-spin 1s linear infinite;
}
@keyframes dx-search-picker-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (max-height: 34rem) {
  .dx-scaled-dialog.dx-search-picker {
    max-height: calc((100dvh - 16px) / var(--canvas-ui-scale,1));
  }
  .dx-search-picker .dx-search-picker__header {
    padding-top: calc(0.75rem * var(--dx-search-picker-ui));
  }
  .dx-search-picker .dx-search-picker__form {
    padding-bottom: calc(0.5rem * var(--dx-search-picker-ui));
  }
  .dx-search-picker .dx-search-picker__footer {
    padding-top: calc(0.5rem * var(--dx-search-picker-ui));
    padding-bottom: calc(0.5rem * var(--dx-search-picker-ui));
  }
}
@media (max-width: 32rem) {
  .dx-scaled-dialog.dx-search-picker {
    width: calc((100vw - 16px) / var(--canvas-ui-scale,1));
    max-height: calc((100dvh - 16px) / var(--canvas-ui-scale,1));
  }
  .dx-search-picker .dx-search-picker__footer {
    align-items: stretch;
    flex-direction: column;
  }
  .dx-search-picker .dx-search-picker__actions {
    justify-content: flex-end;
  }
}
.dx-search-picker .dx-search-picker__header {
  padding-right: 44px;
}
.dx-search-picker .dx-search-picker__scope {
  flex: 0 0 auto;
  margin: 0 16px 10px;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale,1));
  max-height: 3.8em;
  overflow: auto;
}
.dx-search-picker [data-slot=button] {
  height: auto;
  min-height: 32px;
  padding: 6px 10px;
  white-space: normal;
}
.dx-search-picker .dx-search-picker__input {
  height: auto;
  min-height: 34px;
  padding: 7px 10px;
}
.dx-search-picker .dx-search-picker__select:disabled {
  opacity: .55;
  cursor: wait;
}
@media (prefers-reduced-motion: reduce) {
  .dx-search-picker .dx-search-picker__spinner {
    animation: none;
  }
}
@media (max-width: 650px) {
  .dx-search-picker .dx-search-picker__open-label,
  .dx-search-picker .dx-search-picker__search-button span {
    display: none;
  }
  .dx-search-picker .dx-search-picker__open {
    padding: 8px;
    margin-top: 6px;
  }
  .dx-search-picker .dx-search-picker__index {
    min-width: 1.25rem;
  }
  .dx-search-picker .dx-search-picker__selection {
    white-space: normal;
    font-size: calc(11px * var(--canvas-text-scale,1));
    line-height: 1.4;
  }
}
.dx-search-picker .dx-search-picker__view {
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  padding: 0 16px 8px;
}
.dx-search-picker__view button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 28px;
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  background: transparent;
  color: var(--dx-text-soft);
}
.dx-search-picker__view button[aria-pressed=true] {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-search-picker__view button:focus-visible,
.dx-search-picker__mic:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-search-picker .dx-search-picker__list.is-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 12px;
  border: 0;
}
.dx-search-picker .is-grid .dx-search-picker__row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  overflow: hidden;
  min-width: 0;
}
.dx-search-picker .is-grid .dx-search-picker__select {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  padding: 0 10px 8px;
  height: 100%;
  align-content: start;
  border-radius: 0;
}
.dx-search-picker .dx-search-picker__preview {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--dx-canvas);
  height: 132px;
}
.dx-search-picker .is-grid .dx-search-picker__preview {
  grid-column: 1/-1;
  margin: 0 -10px 2px;
}
.dx-search-picker__preview img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: repeating-conic-gradient(#b9b9b9 0% 25%, #dedede 0% 50%) 50%/16px 16px;
}
.dx-search-picker .dx-search-picker__fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px;
  font-size: .85em;
  color: var(--dx-text-soft);
}
.dx-search-picker .dx-search-picker__index {
  min-width: 1.4em;
  font-weight: 600;
  color: var(--dx-text);
  font-variant-numeric: tabular-nums;
}
.dx-search-picker .is-grid .dx-search-picker__name {
  overflow-wrap: anywhere;
}
.dx-search-picker .is-grid .dx-search-picker__detail {
  font-size: .82em;
}
.dx-search-picker .is-grid .dx-search-picker__open {
  margin: 0;
  padding: 6px 10px;
  align-self: flex-end;
}
.dx-search-picker .is-list .dx-search-picker__select {
  grid-template-columns: 64px auto minmax(0, 1fr);
  align-items: center;
}
.dx-search-picker .is-list .dx-search-picker__preview {
  height: 52px;
  border-radius: 4px;
}
.dx-search-picker .is-list .dx-search-picker__fallback span {
  display: none;
}
.dx-search-picker .dx-search-picker__footer {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.dx-search-picker .dx-search-picker__footer-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.dx-search-picker .dx-search-picker__voice {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.dx-search-picker .dx-search-picker__mic {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border: 1px solid var(--dx-border);
  border-radius: 50%;
  background: var(--dx-hover);
  color: var(--dx-text-soft);
  cursor: pointer;
}
.dx-search-picker .dx-search-picker__voice-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.dx-search-picker .dx-search-picker__voice-hint {
  font-size: .875em;
  color: var(--dx-text-soft);
}
.dx-search-picker .dx-search-picker__transcript {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
  font-size: .875em;
}
.dx-search-picker .dx-search-picker__selection {
  white-space: normal;
  overflow-wrap: anywhere;
}
@media (max-width: 450px) {
  .dx-search-picker .dx-search-picker__list.is-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .dx-search-picker .dx-search-picker__footer-row {
    flex-direction: column;
    align-items: stretch;
  }
}
[data-slot=dialog-overlay]:has(+ .dx-search-picker) {
  z-index: 130;
}
.dx-scaled-dialog.dx-search-picker {
  z-index: 131;
}

/* canvas/src/selection-color-v1.css */
.dx-canvas-app {
  --canvas-selection-default:#000000;
  --canvas-selection-color:var(--canvas-selection-custom,var(--canvas-selection-default));
}
html.dark .dx-canvas-app {
  --canvas-selection-default:#c8ff00;
}
.dx-selection-outline,
.dx-selection-marquee {
  --dx-selection:var(--canvas-selection-color);
}
.dx-selection-color-setting {
  min-width: 0;
}
.dx-selection-color-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}
.dx-selection-color-controls input[type=color] {
  width: 36px;
  height: 28px;
  padding: 2px;
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  background: var(--dx-surface);
  cursor: pointer;
  flex: none;
}
.dx-selection-color-controls input[type=color]:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-selection-color-controls input[type=color]:disabled {
  cursor: not-allowed;
  opacity: .5;
}
.dx-selection-color-controls input:not([type=color]) {
  width: 112px;
  min-width: 0;
  height: 28px;
  font: inherit;
}
.dx-selection-color-setting p {
  color: var(--dx-text-soft);
}
.dx-selection-color-setting [role=alert] {
  color: var(--dx-text);
}

/* canvas/src/account-login-v1.css */
.dx-profile-avatar.is-signed-out {
  background: transparent;
  color: var(--dx-text-soft,currentColor);
}
.dx-profile-avatar.is-signed-out > span {
  display: grid;
  place-items: center;
  background: transparent;
}
.dx-account-login {
  width: min(440px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  gap: 16px;
}
.dx-account-login-icon {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--dx-surface-raised,rgba(128,128,128,.1));
  color: var(--dx-text-soft,currentColor);
}
.dx-account-login > p {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--dx-text-soft,currentColor);
}
.dx-account-login [role=alert] {
  color: var(--destructive,#db6868);
}
.dx-account-login > button:not([data-slot=dialog-close]) {
  width: 100%;
  min-height: 40px;
  white-space: normal;
}

/* canvas/src/account-profile-v1.css */
.dx-account-settings {
  max-width: 680px;
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--dx-border,rgba(128,128,128,.3));
}
.dx-account-description,
.dx-account-help {
  max-width: 65ch;
  line-height: 1.55;
}
.dx-account-help {
  font-size: calc(12px * var(--canvas-text-scale,1));
  color: var(--dx-text-soft,#a1a6ae);
}
.dx-account-preview-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 20px 0;
}
.dx-account-preview-row > div:last-child {
  min-width: 0;
  display: grid;
  gap: 3px;
  overflow-wrap: anywhere;
}
.dx-account-preview-row span {
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-account-preview {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  color: #141414;
}
.dx-account-preview > span {
  font-size: 24px;
  font-weight: 600;
}
.dx-account-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx-account-settings fieldset {
  border: 0;
  padding: 0;
  margin: 0 0 16px;
}
.dx-account-settings legend {
  margin-bottom: 8px;
}
.dx-account-colors {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.dx-account-colors button {
  width: 36px;
  height: 36px;
  border: 2px solid transparent;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #141414;
  cursor: pointer;
}
.dx-account-colors button[aria-pressed=true] {
  border-color: currentColor;
}
.dx-account-colors button:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}
.dx-account-colors button:hover {
  filter: brightness(.94);
}
.dx-account-colors button:disabled {
  opacity: .5;
  cursor: wait;
}
.dx-account-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}
.dx-account-file {
  display: none;
}
.dx-account-manage {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: 0;
  padding: 4px 0;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.dx-account-settings [role=alert] {
  color: inherit;
  font-weight: 500;
}
.dx-account-settings [role=status] {
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx-profile-avatar:has(img) > span {
  display: none;
}

/* canvas/src/workspace-tree-v1.css */
.dx-workspace-tree-row {
  cursor: pointer;
  gap: 6px;
  min-height: 30px;
  -webkit-user-select: none;
  user-select: none;
}
.dx-workspace-tree-row:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: -2px;
}
.dx-workspace-tree-row.is-multiselected {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  box-shadow: inset 2px 0 var(--dx-text-soft);
}
.dx-workspace-tree-row .dx-workspace-title {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-workspace-tree-row svg {
  flex: none;
}
.dx-workspace-tree-row .dx-layer-rename {
  user-select: text;
  -webkit-user-select: text;
}
.dx-workspace-disclosure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 24px;
  flex: none !important;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--dx-text-soft);
}
.dx-workspace-tree-row .dx-workspace-disclosure:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-workspace-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none !important;
  width: 13px;
  height: 13px;
  border: 1px solid var(--dx-text-faint);
  border-radius: 5px;
  color: var(--dx-text);
}
.dx-workspace-selection {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px 7px;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-workspace-selection > span {
  flex: 1;
  min-width: 0;
}
.dx-workspace-group-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 6px;
  border-radius: 5px;
  color: var(--dx-text);
}
.dx-workspace-group-action:hover {
  background: var(--dx-hover);
}
.dx-workspace-selection button:disabled,
.dx-sidebar-workspaces button:disabled {
  opacity: .45;
  cursor: default;
}
.dx-workspace-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 8px;
}
.dx-workspace-error {
  padding: 8px 12px;
  font-size: calc(12px * var(--canvas-text-scale,1));
  color: var(--dx-text);
  line-height: 1.5;
}
.dx-workspace-error button {
  margin-left: 8px;
  text-decoration: underline;
}
.dx-workspace-group-form > .dx-select-trigger {
  width: 100%;
  align-self: stretch;
}
.dx-workspace-loading {
  margin-inline-end: 12px;
  font-size: .85em;
  color: var(--dx-text-soft);
}

/* canvas/src/layer-rename-v1.css */
.dx-canvas-app .dx-layer-rename {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 22px;
  padding: 1px 0;
  border: 0;
  border-bottom: 1px solid var(--dx-text-soft);
  border-radius: 0;
  background: transparent;
  color: var(--dx-text);
  font: inherit;
  outline: none;
  box-shadow: none;
  caret-color: var(--dx-text);
  appearance: none;
}
.dx-canvas-app .dx-layer-rename:focus,
.dx-canvas-app .dx-layer-rename:focus-visible {
  outline: none;
  box-shadow: none;
  border-color: var(--dx-text-soft);
}
.dx-layer-rename::selection {
  background: color-mix(in srgb, var(--dx-text) 22%, transparent);
  color: var(--dx-text);
}

/* canvas/src/sidebar-sections-v1.css */
.dx-workspace-sidebar:has(.dx-sidebar-search) {
  min-height: 280px;
}
.dx-sidebar-sections {
  display: grid;
  flex: 1;
  min-height: 0;
  align-content: start;
  overflow: hidden;
}
.dx-sidebar-workspace-pane,
.dx-sidebar-layer-pane {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
.dx-sidebar-sections .dx-sidebar-workspaces,
.dx-sidebar-sections .dx-sidebar-layers {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.dx-sidebar-sections .dx-sidebar-workspaces {
  border-bottom: 0;
}
.dx-sidebar-sections .dx-sidebar-section-heading,
.dx-sidebar-sections .dx-workspace-selection {
  flex: none;
}
.dx-sidebar-sections .dx-sidebar-empty {
  margin: 0;
  padding: 4px 12px;
}
.dx-sidebar-sections [role=tree],
.dx-sidebar-sections .dx-layer-list {
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--dx-text-faint) transparent;
}
.dx-sidebar-sections [role=tree]::-webkit-scrollbar,
.dx-sidebar-sections .dx-layer-list::-webkit-scrollbar {
  width: 6px;
}
.dx-sidebar-sections [role=tree]::-webkit-scrollbar-thumb,
.dx-sidebar-sections .dx-layer-list::-webkit-scrollbar-thumb {
  background: var(--dx-text-faint);
  border-radius: 5px;
}
.dx-sidebar-divider {
  position: relative;
  z-index: 2;
  min-height: 1px;
  background: var(--dx-border);
  cursor: row-resize;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-sidebar-divider::before {
  content: "";
  position: absolute;
  inset: -4px 0;
}
.dx-sidebar-divider:focus-visible {
  background: var(--dx-text);
  outline: none;
  box-shadow: none;
}
.dx-sidebar-divider[aria-disabled=true] {
  cursor: default;
  background: var(--dx-border);
}
.dx-sidebar-divider[aria-disabled=true]::before {
  display: none;
}
.dx-sidebar-sections.is-resizing,
.dx-sidebar-sections.is-resizing * {
  cursor: row-resize !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

/* canvas/src/artifact-context-v1.css */
.dx-artifact-context {
  width: 720px;
  max-width: calc(100vw - 32px);
  max-height: calc(100dvh - 48px);
  overflow-y: auto;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  font: var(--dx-type-body);
  overscroll-behavior: contain;
}
.dx-artifact-context p {
  font: var(--dx-type-compact-body);
  color: var(--dx-text-soft);
  overflow-wrap: anywhere;
}
.dx-artifact-context h3 {
  font: var(--dx-type-body);
  font-weight: 600;
  margin: 0;
}
.dx-artifact-context-meta {
  margin: 0 0 4px;
}
.dx-artifact-prompt {
  margin-top: 20px;
  min-width: 0;
}
.dx-artifact-prompt > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.dx-artifact-prompt pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font: var(--dx-type-body);
  margin: 0;
  padding: 12px;
  background: var(--dx-surface-inset);
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  max-height: 280px;
  overflow: auto;
  -webkit-user-select: text;
  user-select: text;
  cursor: text;
  overscroll-behavior: contain;
}
.dx-artifact-context button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: var(--dx-type-compact-body);
  cursor: pointer;
}
.dx-artifact-context button:hover {
  background: var(--dx-surface-inset);
}
.dx-artifact-context :is(button, pre, summary):focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-artifact-context :is(pre, button, summary) {
  scrollbar-color: var(--dx-border) transparent;
}
.dx-artifact-context footer {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 24px;
}
.dx-artifact-context footer span {
  font: var(--dx-type-compact-body);
  color: var(--dx-text-soft);
}
.dx-artifact-project-context,
.dx-artifact-previous {
  margin-top: 24px;
  border-top: 1px solid var(--dx-border);
  padding-top: 16px;
}
.dx-artifact-context summary {
  cursor: pointer;
  overflow-wrap: anywhere;
  padding: 4px 0;
  color: var(--dx-text);
}
.dx-artifact-previous details {
  margin-top: 12px;
}
.dx-artifact-context [data-slot=dialog-description] {
  overflow-wrap: anywhere;
}
@media (max-width: 600px) {
  .dx-artifact-context {
    padding: 20px;
    max-height: calc(100dvh - 24px);
  }
  .dx-artifact-prompt pre {
    max-height: 220px;
  }
}

/* canvas/src/palette-trash-v1.css */
.dx-palette-trash.is-drop-target {
  background: var(--dx-hover);
  color: var(--dx-text);
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-workspace-tree-row[draggable=true],
.dx-layer-row[draggable=true] {
  -webkit-user-drag: element;
}
.dx-palette-trash[aria-disabled=true]:not(.is-drop-target) {
  opacity: .4;
  cursor: default;
}
.dx-palette-trash[aria-disabled=true]:not(.is-drop-target):hover {
  background: transparent;
  color: var(--dx-text-soft);
}

/* canvas/src/palette-floor-v1.css */
.dx-workspace-sidebar[data-palette-floor=true]:not(.is-collapsed) {
  max-height: var(--palette-max-height);
  min-height: min(240px, var(--palette-room));
}
.dx-workspace-sidebar[data-palette-floor=true]:not(.is-collapsed):has(.dx-sidebar-search) {
  min-height: min(280px, var(--palette-room));
}

/* canvas/src/layer-groups-v1.css */
.dx-layer-group {
  position: relative;
  border-radius: 6px;
}
.dx-layer-group-row {
  padding-left: 2px;
}
.dx-layer-group-disclosure {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 18px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--dx-text-soft);
  cursor: pointer;
}
.dx-layer-group-disclosure:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-layer-group-disclosure:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: -2px;
}
.dx-layer-thumbnail.dx-layer-group-icon {
  color: var(--dx-text);
}
html.dark .dx-layer-thumbnail.dx-layer-group-icon {
  color: var(--canvas-highlight);
}
.dx-layer-group-members {
  position: relative;
}
.dx-layer-group-members::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 0;
  bottom: 8px;
  width: 1px;
  background: var(--dx-border);
  pointer-events: none;
}
.dx-layer-group-members > .dx-layer-row {
  padding-left: 24px;
}
.dx-layer-row.is-partial {
  box-shadow: inset 2px 0 var(--dx-text-soft);
}
.dx-layer-group.is-drop-target {
  background: var(--dx-hover);
  outline: 2px solid var(--dx-text);
  outline-offset: -2px;
}
.dx-layer-list.is-ungroup-target {
  outline: 1px dashed var(--dx-text-soft);
  outline-offset: -3px;
}
.dx-asset-menu .dx-menu-shortcut {
  margin-left: auto;
  padding-left: 16px;
  color: var(--dx-text-soft);
  font-size: .92em;
}
.dx-layer-row.is-group-member {
  padding-left: 24px;
}

/* canvas/src/trash-panel-v1.css */
.dx-trash-panel {
  position: absolute;
  z-index: 29;
  zoom: var(--canvas-ui-scale);
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  min-height: 0;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--dx-bg);
  color: var(--dx-text);
  font-size: calc(12px * var(--canvas-text-scale));
  pointer-events: auto;
}
.dx-trash-panel[hidden] {
  display: none;
}
.dx-trash-panel[data-front=true] {
  z-index: 55;
}
.dx-trash-panel[data-palette-interaction] {
  -webkit-user-select: none;
  user-select: none;
}
.dx-trash-panel button,
.dx-trash-panel input {
  font: inherit;
  color: inherit;
  min-width: 0;
}
.dx-trash-panel button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  padding: 6px 8px;
  cursor: pointer;
  flex-shrink: 0;
}
.dx-trash-panel button:hover:not(:disabled) {
  background: var(--dx-hover);
}
.dx-trash-panel button:disabled {
  opacity: .45;
  cursor: default;
}
.dx-trash-panel button:focus-visible,
.dx-trash-panel input:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-trash-panel-header {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 8px 8px 12px;
  border-bottom: 1px solid var(--dx-border);
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-trash-panel[data-palette-interaction=moving] .dx-trash-panel-header {
  cursor: grabbing;
}
.dx-trash-panel-header:focus {
  outline: none;
}
.dx-trash-panel-header:focus-visible {
  outline: 1px solid var(--dx-text-soft);
  outline-offset: -4px;
  border-radius: 10px;
}
.dx-trash-panel-header h2 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font: inherit;
  font-weight: 600;
  font-size: calc(13px * var(--canvas-text-scale));
}
.dx-trash-panel-header h2 svg {
  color: var(--dx-text-soft);
}
.dx-trash-panel-header button {
  padding: 6px;
}
.dx-trash-filters {
  flex: none;
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  padding: 8px 10px 0;
}
.dx-trash-panel .dx-trash-filters button {
  flex: 1 1 auto;
  white-space: nowrap;
  gap: 5px;
  padding: 7px 4px;
  font-size: calc(11px * var(--canvas-text-scale));
  color: var(--dx-text-soft);
}
.dx-trash-panel .dx-trash-filters button[aria-pressed=true] {
  background: var(--dx-hover);
  color: var(--dx-text);
  font-weight: 600;
}
.dx-trash-filters span {
  font-variant-numeric: tabular-nums;
  font-weight: 400;
  color: var(--dx-text-soft);
}
.dx-trash-search {
  flex: none;
  display: flex;
  align-items: center;
  gap: 2px;
  margin: 8px 12px 0;
  padding-left: 8px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  color: var(--dx-text-soft);
}
.dx-trash-search input {
  flex: 1;
  width: 0;
  padding: 7px 8px;
  border: 0;
  background: transparent;
  caret-color: var(--dx-text);
}
.dx-trash-search input::placeholder {
  color: var(--dx-text-soft);
  opacity: 1;
}
.dx-trash-search:focus-within {
  border-color: var(--dx-text-soft);
}
.dx-trash-panel .dx-trash-search input:focus-visible {
  outline: none;
}
.dx-trash-caption {
  flex: none;
  margin: 8px 12px 6px;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale));
  line-height: 1.5;
}
.dx-trash-note {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0 12px 6px;
  padding: 8px 10px;
  border-radius: 6px;
  background: var(--dx-hover);
  line-height: 1.45;
}
.dx-trash-note.is-error {
  color: var(--dx-danger,var(--dx-text));
}
.dx-trash-note button {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-trash-list {
  flex: 1;
  min-height: 0;
  margin: 0;
  padding: 0 0 18px;
  list-style: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-top: 1px solid var(--dx-border);
}
.dx-trash-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 7px 8px 7px 12px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-trash-thumb {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 5px;
  background: var(--dx-hover);
  color: var(--dx-text-soft);
  overflow: hidden;
}
.dx-trash-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx-trash-copy {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.dx-trash-copy strong {
  font-weight: 500;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.dx-trash-copy small {
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale));
  overflow-wrap: anywhere;
}
.dx-trash-copy time {
  color: var(--dx-text-soft);
  font-size: calc(10px * var(--canvas-text-scale));
  font-variant-numeric: tabular-nums;
}
.dx-trash-copy time.is-soon {
  color: var(--dx-text);
  font-weight: 500;
}
.dx-trash-panel .dx-trash-restore {
  font-size: calc(11px * var(--canvas-text-scale));
}
.dx-trash-list .dx-trash-empty {
  display: block;
  min-height: 0;
  padding: 18px 12px;
  border: 0;
  color: var(--dx-text-soft);
  line-height: 1.6;
}
.dx-trash-panel {
  container-type: inline-size;
}
@container (max-width:340px) {
  .dx-trash-restore > span {
    display: none;
  }
}
.dx-trash-resize {
  position: absolute;
  z-index: 3;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-trash-resize-n,
.dx-trash-resize-s {
  left: 14px;
  right: 14px;
  height: 6px;
  cursor: ns-resize;
}
.dx-trash-resize-n {
  top: 0;
}
.dx-trash-resize-s {
  bottom: 0;
}
.dx-trash-resize-e,
.dx-trash-resize-w {
  top: 14px;
  bottom: 14px;
  width: 6px;
  cursor: ew-resize;
}
.dx-trash-resize-e {
  right: 0;
}
.dx-trash-resize-w {
  left: 0;
}
.dx-trash-resize-ne,
.dx-trash-resize-nw,
.dx-trash-resize-sw {
  width: 14px;
  height: 14px;
}
.dx-trash-resize-ne {
  top: 0;
  right: 0;
  cursor: nesw-resize;
}
.dx-trash-resize-nw {
  top: 0;
  left: 0;
  cursor: nwse-resize;
}
.dx-trash-resize-sw {
  bottom: 0;
  left: 0;
  cursor: nesw-resize;
}
.dx-trash-panel .dx-trash-resize-se {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 18px;
  height: 18px;
  padding: 0;
  cursor: nwse-resize;
  border-radius: 4px 4px 11px 4px;
}
.dx-trash-resize-se:after {
  content: "";
  position: absolute;
  right: 3px;
  bottom: 3px;
  width: 10px;
  height: 10px;
  background:
    linear-gradient(
      135deg,
      transparent 0 46%,
      var(--dx-text-soft) 46% 54%,
      transparent 54% 71%,
      var(--dx-text-soft) 71% 79%,
      transparent 79%);
}
.dx-trash-panel .dx-trash-resize-se:hover:not(:disabled) {
  background: transparent;
}
.dx-trash-resize-se:hover:after,
.dx-trash-panel[data-palette-interaction=resizing] .dx-trash-resize-se:after {
  background:
    linear-gradient(
      135deg,
      transparent 0 46%,
      var(--dx-text) 46% 54%,
      transparent 54% 71%,
      var(--dx-text) 71% 79%,
      transparent 79%);
}
.dx-trash-panel .dx-trash-resize-se:focus-visible {
  outline: 0;
  box-shadow: inset 0 0 0 2px var(--dx-text);
  background: var(--dx-hover);
}

/* canvas/src/tool-options-room-v1.css */
.dx-canvas-app[data-tool-options-room=true] .dx-tool-options:not([data-panel-moved=true]) {
  max-height: calc(var(--tool-options-room) / var(--canvas-ui-scale));
}

/* canvas/src/select-tool-v1.css */
.dx-select-slot {
  position: relative;
  align-items: center;
}
.dx-tool-pillbar .dx-select-mode-trigger {
  width: 14px;
  height: 28px;
  margin-left: -2px;
  border-radius: 7px;
  color: var(--dx-text-soft);
}
.dx-tool-pillbar .dx-select-mode-trigger[aria-expanded=true] {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
}
.dx-select-mode-menu {
  min-width: 248px;
}
.dx-select-mode-menu [role=menuitemradio] > svg {
  flex: none;
  width: 1.25em;
  height: 1.25em;
}
.dx-select-mode-text {
  flex: 1;
  min-width: 0;
}
.dx-select-mode-menu [role=menuitemradio] > span:last-child {
  font-size: .85em;
  color: var(--dx-text-soft);
  letter-spacing: normal;
}
@media (max-width: 760px) {
  .dx-canvas-controls .dx-tool-pillbar .dx-select-mode-trigger {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 24px;
    height: 24px;
    margin: 0;
    border-radius: 6px;
  }
}
@media (forced-colors: active) {
  .dx-tool-pillbar .dx-select-mode-trigger[aria-expanded=true] {
    outline: 1px solid Highlight;
  }
}

/* canvas/src/click-zoom-v1.css */
.dx-canvas-stage.tool-zoom {
  cursor: zoom-in;
}
.dx-canvas-stage.tool-zoom.is-zoom-out {
  cursor: zoom-out;
}
.dx-canvas-stage.tool-zoom.is-hand {
  cursor: grab;
}
.dx-canvas-stage.tool-zoom.is-hand.is-moving {
  cursor: grabbing;
}
.dx-canvas-stage.tool-zoom :is(.dx-canvas-world, .dx-canvas-world *, .dx-title-layer, .dx-title-layer *, .dx-selection-layer, .dx-selection-layer *, .dx-thread-pins, .dx-thread-pins *) {
  pointer-events: none !important;
}
.dx-zoom-slot {
  position: relative;
  align-items: center;
}
.dx-tool-pillbar .dx-zoom-mode-trigger {
  width: 14px;
  height: 28px;
  margin-left: -2px;
  border-radius: 7px;
  color: var(--dx-text-soft);
}
.dx-tool-pillbar .dx-zoom-mode-trigger[aria-expanded=true] {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
}
.dx-zoom-mode-menu {
  min-width: 230px;
}
.dx-zoom-mode-menu [role=menuitemradio] > svg {
  flex: none;
  width: 1.25em;
  height: 1.25em;
}
.dx-zoom-tip {
  margin: 7px 10px 5px;
  max-width: 230px;
  color: var(--dx-text-soft);
  font-size: .85em;
  line-height: 1.4;
}
@media (max-width: 760px) {
  .dx-canvas-controls .dx-tool-pillbar .dx-zoom-mode-trigger {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 24px;
    height: 24px;
    margin: 0;
    border-radius: 6px;
  }
}
@media (forced-colors: active) {
  .dx-tool-pillbar .dx-zoom-mode-trigger[aria-expanded=true] {
    outline: 1px solid Highlight;
  }
}

/* canvas/src/tool-style-controls-v1.css */
.dx-tool-style {
  margin-bottom: 12px;
  min-width: 0;
}
.dx-tool-style-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 7px;
}
.dx-tool-style-heading span:last-child {
  color: var(--dx-text-soft);
  font-variant-numeric: tabular-nums;
}
.dx-swatch-row,
.dx-swatch-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.dx-swatch-row {
  padding: 3px;
}
.dx-tool-options .dx-swatch {
  position: relative;
  flex: none;
  width: 22px;
  height: 22px;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--swatch,var(--dx-surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dx-text) 24%, transparent);
  cursor: pointer;
}
.dx-tool-options .dx-swatch:hover {
  background: var(--swatch,var(--dx-surface));
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--dx-text) 24%, transparent),
    0 0 0 2px var(--dx-surface),
    0 0 0 3px var(--dx-text-soft);
}
.dx-tool-options .dx-swatch.is-custom[aria-expanded=true] {
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--dx-text) 24%, transparent),
    0 0 0 2px var(--dx-surface),
    0 0 0 3.5px var(--dx-text-soft);
}
.dx-tool-options .dx-swatch[aria-checked=true],
.dx-tool-options .dx-swatch.is-custom.has-color {
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--dx-text) 24%, transparent),
    0 0 0 2px var(--dx-surface),
    0 0 0 3.5px var(--dx-text);
}
.dx-tool-options .dx-swatch:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 5px;
}
.dx-tool-options .dx-swatch.is-none,
.dx-color-compare .is-none {
  background:
    linear-gradient(
      to top right,
      transparent calc(50% - 1px),
      #e5484d calc(50% - 1px),
      #e5484d calc(50% + 1px),
      transparent calc(50% + 1px)),
    #ffffff;
}
.dx-tool-options .dx-swatch.is-auto,
.dx-color-compare .is-auto {
  background:
    linear-gradient(
      135deg,
      #17212b 50%,
      #ffffff 50%);
}
.dx-tool-options .dx-swatch.is-custom {
  background:
    conic-gradient(
      #ff4d4d,
      #ffd84d,
      #5cff4d,
      #4dfff0,
      #4d6bff,
      #e54dff,
      #ff4d4d);
}
.dx-tool-options .dx-swatch.is-custom.has-color::after {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background: var(--swatch);
  box-shadow: 0 0 0 1.5px var(--dx-surface);
}
.dx-color-picker {
  display: grid;
  gap: 10px;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  background: var(--dx-surface-inset);
}
.dx-color-picker-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  gap: 10px;
  height: 148px;
}
.dx-color-sv,
.dx-color-hue {
  position: relative;
  border-radius: 5px;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
.dx-color-sv {
  cursor: crosshair;
  background:
    linear-gradient(
      to top,
      #000,
      transparent),
    linear-gradient(
      to right,
      #fff,
      transparent),
    var(--hue-color,red);
}
.dx-color-hue {
  cursor: ns-resize;
  background:
    linear-gradient(
      to top,
      #f00 0%,
      #ff0 16.667%,
      #0f0 33.333%,
      #0ff 50%,
      #00f 66.667%,
      #f0f 83.333%,
      #f00 100%);
}
.dx-color-sv:focus-visible,
.dx-color-hue:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 2px;
}
.dx-color-sv[aria-disabled=true],
.dx-color-hue[aria-disabled=true] {
  cursor: default;
  opacity: .45;
}
.dx-color-sv-thumb {
  position: absolute;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  box-sizing: border-box;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #0009, inset 0 0 0 1px #0005;
  pointer-events: none;
}
.dx-color-hue-thumb {
  position: absolute;
  left: -3px;
  right: -3px;
  height: 8px;
  margin-top: -4px;
  box-sizing: border-box;
  border: 2px solid #fff;
  border-radius: 4px;
  box-shadow: 0 0 0 1px #0009;
  pointer-events: none;
}
.dx-color-fields {
  display: grid;
  grid-template-columns: 28px minmax(66px, 1.6fr) repeat(3, minmax(38px, 1fr));
  gap: 6px;
  align-items: end;
}
.dx-color-fields label {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale));
}
.dx-tool-options .dx-color-picker .dx-color-fields input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 28px;
  margin: 0;
  padding: 4px 6px;
  font: inherit;
  font-size: calc(12px * var(--canvas-text-scale));
  font-variant-numeric: tabular-nums;
  color: var(--dx-text);
  background: var(--dx-surface);
  border: 1px solid var(--dx-border);
  border-radius: 5px;
}
.dx-tool-options .dx-color-picker .dx-color-fields input[type=number] {
  -moz-appearance: textfield;
}
.dx-color-fields input[type=number]::-webkit-inner-spin-button,
.dx-color-fields input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.dx-tool-options .dx-color-picker .dx-color-fields input:focus-visible {
  outline: none;
  box-shadow: none;
  border-color: var(--dx-text);
}
.dx-color-compare {
  display: flex;
  flex-direction: column;
  height: 28px;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dx-text) 24%, transparent);
}
.dx-color-compare > * {
  flex: 1;
  background: var(--swatch,var(--dx-surface));
}
.dx-tool-options .dx-color-compare button,
.dx-tool-options .dx-color-compare button:hover {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--swatch,var(--dx-surface));
  cursor: pointer;
}
.dx-tool-options .dx-color-compare button.is-none {
  background:
    linear-gradient(
      to top right,
      transparent calc(50% - 1px),
      #e5484d calc(50% - 1px),
      #e5484d calc(50% + 1px),
      transparent calc(50% + 1px)),
    #ffffff;
}
.dx-tool-options .dx-color-compare button.is-auto {
  background:
    linear-gradient(
      135deg,
      #17212b 50%,
      #ffffff 50%);
}
.dx-tool-options .dx-color-compare button:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: -2px;
}
.dx-connector-routes {
  display: flex;
  gap: 4px;
}
.dx-tool-options .dx-connector-routes button {
  width: 52px;
  height: 38px;
  min-height: 0;
  padding: 5px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
}
.dx-tool-options .dx-connector-routes button:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-tool-options .dx-connector-routes button[aria-checked=true] {
  background: var(--dx-surface-inset);
  border-color: var(--dx-text-soft);
  color: var(--dx-text);
}
.dx-tool-options .dx-connector-routes button:focus-visible {
  outline: none;
  border-color: var(--dx-text);
}
.dx-connector-routes svg {
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}
.dx-tool-style .dx-shape-radius-heading span {
  color: var(--dx-text-soft);
}
@media (max-width: 580px) {
  .dx-tool-options .dx-swatch {
    width: 20px;
    height: 20px;
  }
  .dx-swatch-row,
  .dx-swatch-group {
    gap: 5px;
  }
}

/* canvas/src/notice-clearance-v1.css */
.dx-canvas-app > .dx-message[data-notice-measuring=true] {
  transition: none !important;
}
.dx-canvas-app > .dx-message[data-notice-place] {
  top: auto !important;
  right: auto !important;
  left: var(--notice-left) !important;
  bottom: var(--notice-bottom) !important;
  transform: none !important;
  width: max-content !important;
  max-width: var(--notice-max-width) !important;
}
.dx-canvas-app > .dx-message[data-notice-place=under] {
  z-index: 28;
}

/* canvas/src/comment-threads-v1.css */
.dx-thread-pins {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 10000003;
}
.dx-thread-pin {
  position: absolute;
  pointer-events: auto;
  width: 40px;
  height: 40px;
  transform: translate(-50%, -50%);
  padding: 3px;
  border: 2px solid var(--dx-surface);
  border-radius: 50% 50% 50% 5px;
  background: var(--dx-text);
  box-shadow: 0 2px 7px #0003;
  cursor: pointer;
  color: var(--dx-surface);
}
.dx-thread-pin.is-active,
.dx-thread-pin.is-draft {
  outline: 2px solid var(--dx-selection);
  outline-offset: 3px;
}
.dx-thread-avatar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--dx-text);
  color: var(--dx-surface);
  font-size: 13px;
  font-weight: 600;
}
.dx-thread-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dx-thread-pin .dx-thread-avatar {
  width: 30px;
  height: 30px;
  background: var(--dx-surface);
  color: var(--dx-text);
}
.dx-thread-count {
  position: absolute;
  right: -6px;
  bottom: -5px;
  min-width: 17px;
  height: 17px;
  padding: 0 3px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--dx-text);
  color: var(--dx-surface);
  font-size: 10px;
  border: 1px solid var(--dx-surface);
}
.dx-thread-history {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 10000004;
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--dx-text);
  font: var(--dx-type-compact-body);
}
.dx-thread-history > button,
.dx-thread-list {
  background: var(--dx-surface);
  border: 1px solid var(--dx-border);
  border-radius: 12px;
}
.dx-thread-history > button {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 12px;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.dx-thread-history > span {
  font-size: 12px;
  background: var(--dx-surface);
  padding: 7px;
  border-radius: 6px;
}
.dx-thread-list {
  position: absolute;
  top: 46px;
  right: 0;
  width: min(340px, calc(100vw - 36px));
  max-height: 60vh;
  overflow: auto;
  padding: 14px;
  box-sizing: border-box;
  -webkit-user-select: text;
  user-select: text;
}
.dx-thread-list header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}
.dx-thread-list header strong {
  flex: 1;
}
.dx-thread-list button {
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}
.dx-thread-list label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 14px;
}
.dx-thread-summary {
  display: flex;
  width: 100%;
  gap: 10px;
  text-align: left;
  padding: 10px 0;
  border-bottom: 1px solid var(--dx-border) !important;
  font: inherit;
}
.dx-thread-summary > span:last-child {
  min-width: 0;
}
.dx-thread-summary strong,
.dx-thread-summary span span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 250px;
}
.dx-thread-summary small {
  color: var(--dx-text-soft);
}
.dx-comment-portal {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 68;
  color: var(--dx-text);
  font: var(--dx-type-compact-body);
  font-size: calc(14px * var(--canvas-ui-scale,1));
  -webkit-user-select: text;
  user-select: text;
}
.dx-thread-connector {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
}
.dx-thread-connector line {
  stroke: var(--dx-text-soft);
  stroke-width: 1.5;
}
.dx-comment-window {
  position: fixed;
  pointer-events: auto;
  box-sizing: border-box;
  background: var(--dx-surface);
  border-radius: 14px;
  box-shadow: 0 5px 22px #0004;
  overflow: auto;
  padding: calc(18px * var(--canvas-ui-scale,1));
  scrollbar-color: var(--dx-text-soft) var(--dx-surface);
  line-height: 1.45;
}
.dx-comment-window > header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
}
.dx-comment-window > header > strong {
  flex: 1;
}
.dx-comment-window button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background: transparent;
  color: inherit;
  border: 0;
  border-radius: 7px;
  min-width: 30px;
  min-height: 30px;
  padding: 6px;
  cursor: pointer;
  font: inherit;
}
.dx-comment-window button:hover:not(:disabled) {
  background: var(--dx-surface-inset);
}
.dx-comment-window button:disabled {
  opacity: .45;
  cursor: default;
}
.dx-comment-window :focus-visible,
.dx-thread-history :focus-visible,
.dx-thread-pin:focus-visible {
  outline: 2px solid var(--dx-selection);
  outline-offset: 3px;
}
.dx-comment-window ::selection {
  background: var(--dx-text);
  color: var(--dx-surface);
}
.dx-comment-window .dx-thread-avatar {
  width: calc(34px * var(--canvas-ui-scale,1));
  height: calc(34px * var(--canvas-ui-scale,1));
  font-size: calc(13px * var(--canvas-ui-scale,1));
}
.dx-thread-message,
.dx-thread-composer {
  display: flex;
  gap: 12px;
}
.dx-thread-message {
  margin: 18px 0 22px;
}
.dx-thread-message > div,
.dx-thread-composer > div {
  min-width: 0;
  flex: 1;
}
.dx-thread-message strong,
.dx-thread-composer strong {
  display: block;
  font-weight: 600;
}
.dx-thread-message time {
  display: block;
  font-size: .86em;
  color: var(--dx-text-soft);
  font-variant-numeric: tabular-nums;
}
.dx-thread-message p {
  margin: 10px 0 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.dx-thread-composer textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-top: 9px;
  padding: 10px 12px;
  min-height: 86px;
  max-height: 260px;
  resize: vertical;
  background: var(--dx-surface);
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  color: var(--dx-text);
  font: inherit;
  line-height: 1.5;
  caret-color: var(--dx-text);
  touch-action: auto;
}
.dx-thread-composer textarea::placeholder {
  color: var(--dx-text-soft);
  opacity: 1;
}
.dx-thread-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 14px;
}
.dx-thread-actions .dx-thread-submit {
  background: var(--dx-text);
  color: var(--dx-surface);
  border-radius: 20px;
  padding: 8px 18px;
}
.dx-thread-actions .dx-thread-submit:hover:not(:disabled) {
  background: var(--dx-text);
  filter: brightness(.9);
}
.dx-thread-note {
  font-size: .86em;
  color: var(--dx-text-soft);
  margin: 14px 0 0;
  overflow-wrap: anywhere;
}
.dx-thread-error {
  margin-top: 12px;
  color: var(--dx-text);
}
.dx-thread-error p {
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-thread-error button {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dx-thread-delete {
  padding: 12px 0;
}
.dx-thread-delete button {
  margin-right: 10px;
}
.dx-thread-list p {
  overflow-wrap: anywhere;
}
.dx-comment-portal[aria-hidden=true],
.dx-comment-portal[data-aria-hidden=true] {
  visibility: hidden;
}
.dx-thread-pin.is-movable {
  touch-action: none;
}
.dx-thread-pin.is-draft {
  cursor: grab;
}
.dx-thread-pin.is-dragging {
  cursor: grabbing;
  z-index: 1;
  box-shadow: 0 6px 16px #0005;
}
.dx-thread-avatar.is-me {
  font-weight: 500;
}
.dx-thread-pin .dx-thread-avatar.is-me {
  font-size: 10px;
}
.dx-comment-window .dx-thread-avatar.is-me {
  font-size: calc(11px * var(--canvas-ui-scale,1));
}

/* canvas/src/menu-clipboard-v1.css */
.dx-canvas-menu-anchor {
  position: fixed;
  width: 0;
  height: 0;
  pointer-events: none;
}

/* canvas/src/svg-motion-player-v1.css */
.dx-svg-player {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.dx-svg-player > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}
.dx-svg-player > iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: none;
  background: transparent;
  color-scheme: only light;
}
.dx-svg-controls {
  position: absolute;
  inset: auto auto 8px 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--dx-border);
  border-radius: 7px;
  background: var(--dx-surface);
  color: var(--dx-text);
  pointer-events: auto;
  max-width: calc(100% - 8px);
}
.dx-svg-controls button {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: none;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.dx-svg-controls button:hover {
  background: var(--dx-surface-inset);
}
.dx-svg-controls button:focus-visible,
.dx-svg-status button:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-svg-time {
  display: none;
  white-space: nowrap;
  font: 12px/1.3 var(--dx-font-sans);
  font-variant-numeric: tabular-nums;
  padding-inline: 4px;
}
.dx-svg-status {
  position: absolute;
  inset: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  overflow: auto;
  padding: 8px;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: 12px/1.4 var(--dx-font-sans);
  text-align: center;
  overflow-wrap: anywhere;
  pointer-events: auto;
}
.dx-svg-status button {
  font: inherit;
  color: inherit;
  background: var(--dx-surface-inset);
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  min-height: 32px;
  padding: 4px 8px;
}
@container media-controls (min-width:240px) and (min-height:84px) {
  .dx-svg-time {
    display: block;
  }
}
@container media-controls (max-width:105px) {
  .dx-svg-controls {
    gap: 0;
    padding: 2px;
  }
  .dx-svg-controls button {
    width: 32px;
    height: 32px;
  }
}
@media (pointer: coarse) {
  .dx-svg-controls button {
    min-width: 44px;
    min-height: 44px;
  }
}
.dx-svg-status.is-error {
  inset: auto 8px 8px;
  max-height: 45%;
  border: 1px solid var(--dx-border);
  border-radius: 5px;
}

/* canvas/src/media-v1.css */
.dx-document-preview,
.dx-media-player {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  container-type: inline-size;
}
.dx-document-preview > img,
.dx-media-player > video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  pointer-events: none;
}
.dx-media-player {
  background: var(--dx-bg);
}
.dx-media-player.is-audio {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
  padding: 24px 24px 56px;
  color: var(--dx-text-soft);
  background: var(--dx-surface);
}
.dx-media-player strong {
  font: var(--dx-type-body);
  overflow-wrap: anywhere;
  text-align: center;
  color: var(--dx-text);
}
.dx-page-controls {
  position: absolute;
  bottom: 8px;
  left: 8px;
  right: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  background: var(--dx-surface);
  border: 1px solid var(--dx-border);
  border-radius: 7px;
  color: var(--dx-text);
  font: 12px/1.3 var(--dx-font-sans);
  -webkit-user-select: none;
  user-select: none;
}
.dx-page-controls button {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  padding: 0;
  flex: none;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 4px;
}
.dx-page-controls button:hover {
  background: var(--dx-hover);
}
.dx-page-controls {
  left: 50%;
  right: auto;
  width: max-content;
  transform: translateX(-50%);
  gap: 12px;
}
.dx-media-error {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 52px;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: 12px/1.4 var(--dx-font-sans);
  padding: 8px;
  border-radius: 6px;
}
.dx-asset-menu {
  min-width: 210px;
  max-width: min(340px, calc(100vw - 24px));
  z-index: 120;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 7px;
  padding: 4px;
  font: 400 calc(13px * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
  outline: none;
}
.dx-asset-menu [role=menuitem] {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 4px;
  outline: none;
  cursor: default;
}
.dx-asset-menu [role=menuitem][data-highlighted] {
  background: var(--dx-surface-inset);
}
.dx-asset-menu [data-disabled] {
  color: var(--dx-text-soft);
}
.dx-asset-menu [role=separator] {
  height: 1px;
  background: var(--dx-border);
  margin: 4px;
}
.dx-asset-menu [role=group] > span {
  display: block;
  padding: 6px 10px;
  color: var(--dx-text-soft);
  font-size: 12px;
}
.dx-asset-info {
  max-width: min(480px, calc(100vw - 32px));
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
}
.dx-asset-info dl {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 8px 18px;
  font: var(--dx-type-body);
  margin: 12px 0;
}
.dx-asset-info dt {
  color: var(--dx-text-soft);
}
.dx-asset-info dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.dx-asset-info p {
  font: var(--dx-type-compact-body);
  color: var(--dx-text-soft);
}
.dx-audio-waveform {
  width: 100%;
  height: calc(100% - 32px);
  min-height: 32px;
  object-fit: contain;
  pointer-events: none;
}
.dx-model-preview {
  width: 100%;
  height: 100%;
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.dx-model-preview > canvas,
.dx-model-preview > img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: contain;
  inset: 0;
}
.dx-model-preview > span {
  font: 12px/1.4 var(--dx-font-sans);
  color: var(--dx-text-soft);
}
.dx-preview-caption {
  position: absolute;
  bottom: 6px;
  left: 8px;
  right: 8px;
  text-align: center;
  pointer-events: none;
}
.dx-node-media > .dx-preview-caption {
  top: calc(100% + 6px / var(--canvas-media-scale,1));
  bottom: auto;
  left: 0;
  right: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font: calc(11px * var(--canvas-text-scale,1) / var(--canvas-media-scale,1))/1.3 var(--dx-font-sans);
  color: var(--dx-text-soft);
}
.dx-preview-upload {
  max-width: 100%;
  display: grid;
  gap: 8px;
}
.dx-preview-upload button {
  font: inherit;
  color: var(--dx-text);
  background: var(--dx-surface);
  border: 1px solid var(--dx-border);
  padding: 6px 10px;
  border-radius: 6px;
}
.dx-preview-upload button:hover {
  border-color: var(--dx-accent,#c8ff00);
}
.dx-authoring-preview {
  display: grid;
  gap: 10px;
  margin-bottom: 20px;
}
.dx-authoring-preview label {
  display: grid;
  gap: 4px;
  font: var(--dx-type-compact-body);
}
.dx-authoring-preview input {
  background: var(--dx-bg);
  border: 1px solid var(--dx-border);
  color: var(--dx-text);
  padding: 8px;
  border-radius: 5px;
}
.dx-authoring-preview button {
  padding: 8px;
  background: var(--dx-accent,#c8ff00);
  color: #111;
  border: 0;
  border-radius: 5px;
}
.dx-authoring-preview button:disabled {
  opacity: .5;
}
.dx-media-ui {
  position: absolute;
  left: 0;
  top: 0;
  width: calc(100% * var(--canvas-media-scale,1));
  height: calc(100% * var(--canvas-media-scale,1));
  transform: scale(calc(1 / var(--canvas-media-scale,1)));
  transform-origin: top left;
  container: media-controls / size;
  pointer-events: none;
}
.dx-media-player:fullscreen > .dx-media-ui {
  width: 100%;
  height: 100%;
  transform: none;
}
.dx-media-player.is-audio.is-compact .dx-media-ui {
  position: relative;
  height: 64px;
}
.dx-media-player.is-audio.is-compact .dx-media-ui:has(.dx-media-error) {
  height: 152px;
}
.dx-media-player .dx-media-ui .dx-media-transport,
.dx-media-player.is-audio.is-compact .dx-media-ui .dx-media-transport {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  padding: 0;
  border: 0;
  background: none;
  color: var(--dx-text);
  font: 12px/1.3 var(--dx-font-sans);
  -webkit-user-select: none;
  user-select: none;
  pointer-events: none;
}
.dx-media-transport button {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: none;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  pointer-events: auto;
}
.dx-media-transport .dx-media-play {
  width: min(48px, calc(100cqw - 8px), calc(100cqh - 8px));
  height: min(48px, calc(100cqw - 8px), calc(100cqh - 8px));
  min-width: 0;
  min-height: 0;
  border: 1px solid var(--dx-border);
  border-radius: 50%;
  background: var(--dx-surface);
  color: var(--dx-text);
}
.dx-media-play svg {
  width: 55%;
  height: 55%;
  max-width: 24px;
  max-height: 24px;
  flex: none;
}
.dx-media-transport button:hover {
  background: var(--dx-surface-inset);
}
.dx-media-transport button:focus-visible,
.dx-media-transport input:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-media-transport input[type=range] {
  min-width: 40px;
  width: 100%;
  height: 40px;
  margin: 0;
  accent-color: var(--dx-text);
  cursor: pointer;
  pointer-events: auto;
}
.dx-media-transport input:disabled {
  opacity: .45;
  cursor: default;
}
.dx-media-transport .dx-media-time {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.dx-media-transport input.dx-media-volume {
  width: 64px;
  flex: none;
}
.dx-media-transport > .dx-media-seek,
.dx-media-transport > .dx-media-time,
.dx-media-transport > .dx-media-mute,
.dx-media-transport > .dx-media-volume,
.dx-media-transport > .dx-media-fullscreen {
  display: none;
}
.dx-media-ui .dx-media-error {
  top: 8px;
  bottom: auto;
  max-height: calc(100% - 80px);
  margin: 0;
  overflow: auto;
  pointer-events: auto;
}
.dx-media-ui > .dx-preview-caption {
  font: 11px/1.3 var(--dx-font-sans);
  color: var(--dx-text-soft);
}
@container media-controls (min-width:280px) and (min-height:84px) {
  .dx-media-player .dx-media-ui .dx-media-transport {
    inset: auto 8px 8px;
    justify-content: initial;
    padding: 4px 6px;
    border: 1px solid var(--dx-border);
    border-radius: 7px;
    background: var(--dx-surface);
    pointer-events: auto;
  }
  .dx-media-transport .dx-media-play {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 5px;
    background: transparent;
  }
  .dx-media-transport > .dx-media-seek,
  .dx-media-transport > .dx-media-time {
    display: block;
  }
  .dx-media-ui > .dx-preview-caption {
    bottom: 64px;
  }
}
@container media-controls (min-width:480px) and (min-height:84px) {
  .dx-media-transport > .dx-media-mute,
  .dx-media-transport > .dx-media-fullscreen {
    display: grid;
  }
  .dx-media-transport > .dx-media-volume {
    display: block;
  }
}
@media (pointer: coarse) {
  .dx-media-transport button {
    min-width: 44px;
    min-height: 44px;
  }
  .dx-media-transport input[type=range] {
    height: 44px;
  }
}
.dx-preview-warning {
  position: absolute;
  top: 6px;
  left: 6px;
  right: 6px;
  padding: 5px 8px;
  border-radius: 5px;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: 11px/1.35 var(--dx-font-sans);
}
@media (hover: hover) and (pointer: fine) {
  .dx-canvas-node.is-selected .dx-media-player.is-interactive .dx-media-transport {
    opacity: 1;
    translate: 0 0;
    transition: opacity 180ms ease-out, translate 180ms cubic-bezier(.16, 1, .3, 1);
  }
  .dx-canvas-node.is-selected:not(:hover) .dx-media-player.is-interactive:not(:fullscreen):not([data-controls-active=true]):not([data-controls-keyboard=true]) .dx-media-transport {
    opacity: 0;
    translate: 0 6px;
    pointer-events: none;
    transition-duration: 140ms;
  }
  .dx-canvas-node.is-selected:not(:hover) .dx-media-player.is-interactive:not(:fullscreen):not([data-controls-active=true]):not([data-controls-keyboard=true]) .dx-media-transport :is(button, input) {
    pointer-events: none;
  }
}
@media (any-pointer: coarse) {
  .dx-canvas-node.is-selected .dx-media-player.is-interactive .dx-media-transport {
    opacity: 1 !important;
    translate: none !important;
    transition: none !important;
    pointer-events: none !important;
  }
  .dx-canvas-node.is-selected .dx-media-player.is-interactive .dx-media-transport :is(button, input) {
    pointer-events: auto !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .dx-canvas-node.is-selected .dx-media-player.is-interactive .dx-media-transport {
    translate: none !important;
    transition: opacity 60ms linear !important;
  }
}
.dx-document-preview > .dx-preview-actions {
  position: absolute;
  right: 8px;
  top: 8px;
  max-width: calc(100% - 16px);
  display: grid;
  gap: 6px;
  z-index: 2;
}

/* canvas/src/artifact-history-v1.css */
.dx-artifact-history {
  width: min(760px, calc(100vw - 32px));
  max-height: 85vh;
  overflow: auto;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: var(--dx-type-body);
  border: 1px solid var(--dx-border);
}
.dx-artifact-history ol {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.dx-artifact-history li {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  gap: 16px;
  padding: 12px;
  border: 1px solid var(--dx-border);
  border-radius: 10px;
}
.dx-artifact-version-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 128px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--dx-surface-inset);
}
.dx-artifact-version-preview img,
.dx-artifact-version-preview video {
  max-width: 100%;
  max-height: 160px;
  object-fit: contain;
}
.dx-artifact-version-description {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.dx-artifact-version-description time {
  font-size: .85em;
  color: var(--dx-text-soft);
}
.dx-artifact-version-description p {
  margin: 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: 8em;
  overflow: auto;
}
.dx-artifact-version-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 6px;
}
@media (max-width: 500px) {
  .dx-artifact-history li {
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 10px;
  }
  .dx-artifact-version-preview {
    min-height: 80px;
  }
  .dx-artifact-version-actions {
    flex-wrap: wrap;
    gap: 8px;
  }
}

/* canvas/src/export-as-v1.css */
.dx-export-menu {
  min-width: 232px;
}
.dx-export-menu a[role=menuitem] {
  color: inherit;
  text-decoration: none;
}
.dx-export-menu [role=menuitem] .dx-menu-shortcut {
  margin-left: auto;
  padding-left: 16px;
  color: var(--dx-text-soft);
  font-size: .92em;
}
.dx-export-menu .dx-export-redraw {
  align-items: flex-start;
}
.dx-export-menu .dx-export-redraw > svg {
  margin-top: 2px;
  flex: none;
}
.dx-export-redraw-text {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}
.dx-export-redraw-text > span {
  display: flex;
  align-items: center;
}
.dx-export-redraw-text small {
  color: var(--dx-text-soft);
  font-size: .86em;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* canvas/src/connector-bends-v1.css */
.dx-canvas-stage.tool-select .dx-connector-hit.is-bendable.is-v {
  cursor: ew-resize;
}
.dx-canvas-stage.tool-select .dx-connector-hit.is-bendable.is-h {
  cursor: ns-resize;
}
.dx-bend-handle {
  position: absolute;
  width: 16px;
  height: 6px;
  margin: -3px 0 0 -8px;
  box-sizing: border-box;
  border: 1px solid var(--dx-selection);
  border-radius: 3px;
  background: #fff;
  pointer-events: auto;
  touch-action: none;
  z-index: 2;
  cursor: ns-resize;
}
.dx-bend-handle.is-v {
  width: 6px;
  height: 16px;
  margin: -8px 0 0 -3px;
  cursor: ew-resize;
}

/* ../../../Users/jmccarthy/code/canvas-sprint-0002/canvas/node_modules/@diffusion/portal-kit-ui/dist/styles.css */
@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 {
      --tw-translate-x:0;
      --tw-translate-y:0;
      --tw-translate-z:0;
      --tw-space-y-reverse:0;
      --tw-border-style:solid;
      --tw-leading:initial;
      --tw-font-weight:initial;
      --tw-tracking:initial;
      --tw-ordinal:initial;
      --tw-slashed-zero:initial;
      --tw-numeric-figure:initial;
      --tw-numeric-spacing:initial;
      --tw-numeric-fraction:initial;
      --tw-shadow:0 0 #0000;
      --tw-shadow-color:initial;
      --tw-shadow-alpha:100%;
      --tw-inset-shadow:0 0 #0000;
      --tw-inset-shadow-color:initial;
      --tw-inset-shadow-alpha:100%;
      --tw-ring-color:initial;
      --tw-ring-shadow:0 0 #0000;
      --tw-inset-ring-color:initial;
      --tw-inset-ring-shadow:0 0 #0000;
      --tw-ring-inset:initial;
      --tw-ring-offset-width:0px;
      --tw-ring-offset-color:#fff;
      --tw-ring-offset-shadow:0 0 #0000;
      --tw-outline-style:solid;
      --tw-duration:initial;
      --tw-ease:initial;
      --tw-content:"";
      --tw-space-x-reverse:0;
      --tw-animation-delay:0s;
      --tw-animation-direction:normal;
      --tw-animation-duration:initial;
      --tw-animation-fill-mode:none;
      --tw-animation-iteration-count:1;
      --tw-enter-blur:0;
      --tw-enter-opacity:1;
      --tw-enter-rotate:0;
      --tw-enter-scale:1;
      --tw-enter-translate-x:0;
      --tw-enter-translate-y:0;
      --tw-exit-blur:0;
      --tw-exit-opacity:1;
      --tw-exit-rotate:0;
      --tw-exit-scale:1;
      --tw-exit-translate-x:0;
      --tw-exit-translate-y:0;
    }
  }
}
.dx-brand-sting {
  aspect-ratio: 188.3/111.1;
  width: 67.6px;
  height: auto;
  color: inherit;
  flex: none;
  display: block;
  overflow: visible;
}
.dx-sting-line {
  fill: none;
  stroke: currentColor;
  stroke-width: 8px;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.dx-sting-border {
  fill: none;
  stroke: currentColor;
  stroke-width: 9px;
  stroke-linecap: square;
}
.dx-sting-dot {
  fill: currentColor;
  transform-box: fill-box;
  transform-origin: 50%;
}
.dx-brand-sting--animated .dx-sting-border {
  animation:
    40ms linear both dx-sting-border-appear,
    .1s cubic-bezier(.33, 1, .68, 1) both dx-sting-border-grow,
    .45s cubic-bezier(.45, 0, .55, 1) .7s both dx-sting-border-fill,
    .72s cubic-bezier(.65, 0, .35, 1) 50ms both dx-sting-border-lap;
}
@keyframes dx-sting-border-appear {
  0% {
    stroke-opacity: 0;
  }
  to {
    stroke-opacity: 1;
  }
}
@keyframes dx-sting-border-grow {
  0% {
    stroke-dasharray: .001 562.8;
  }
  to {
    stroke-dasharray: 123.82 438.98;
  }
}
@keyframes dx-sting-border-fill {
  0% {
    stroke-dasharray: 123.82 438.98;
  }
  to {
    stroke-dasharray: 564.8 0;
  }
}
@keyframes dx-sting-border-lap {
  0% {
    stroke-dashoffset: 0;
  }
  to {
    stroke-dashoffset: -562.8px;
  }
}
.dx-brand-sting--animated .dx-sting-line1 {
  animation: 20ms linear .85s both dx-sting-line-appear, .5s cubic-bezier(.65, 0, .35, 1) .85s both dx-sting-line1-draw;
}
.dx-brand-sting--animated .dx-sting-line2 {
  animation: 20ms linear .98s both dx-sting-line-appear, .5s cubic-bezier(.65, 0, .35, 1) .98s both dx-sting-line2-draw;
}
.dx-brand-sting--animated .dx-sting-line3 {
  animation: 20ms linear 1.11s both dx-sting-line-appear, .5s cubic-bezier(.65, 0, .35, 1) 1.11s both dx-sting-line3-draw;
}
@keyframes dx-sting-line-appear {
  0% {
    stroke-opacity: 0;
  }
  to {
    stroke-opacity: 1;
  }
}
@keyframes dx-sting-line1-draw {
  0% {
    stroke-dashoffset: 212.04px;
  }
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes dx-sting-line2-draw {
  0% {
    stroke-dashoffset: 160.62px;
  }
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes dx-sting-line3-draw {
  0% {
    stroke-dashoffset: 128.11px;
  }
  to {
    stroke-dashoffset: 0;
  }
}
.dx-brand-sting--animated .dx-sting-dot {
  animation: .42s linear 1.72s both dx-sting-dot-pop;
}
@keyframes dx-sting-dot-pop {
  0% {
    transform: scale(0);
  }
  4% {
    transform: scale(.191, .311);
  }
  8% {
    transform: scale(.374, .529);
  }
  16% {
    transform: scale(.707, .759);
  }
  25% {
    transform: scale(.97, .858);
  }
  37% {
    transform: scale(1.064, .928);
  }
  50% {
    transform: scale(1.017, .983);
  }
  63% {
    transform: scale(.988, 1.012);
  }
  78% {
    transform: scale(.99, 1.01);
  }
  to {
    transform: scale(1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .dx-brand-sting * {
    animation: none !important;
  }
}
.dx-access-state {
  box-sizing: border-box;
  background: var(--dx-bg);
  width: 100%;
  min-height: 100svh;
  color: var(--dx-text);
  align-content: center;
  place-items: center;
  padding: 64px 24px;
  display: grid;
}
.dx-access-state__message {
  text-align: center;
  overflow-wrap: anywhere;
  width: min(100%, 480px);
}
.dx-access-state .dx-brand-sting {
  margin: 0 auto 32px;
}
.dx-access-state h1 {
  font: var(--dx-type-page-title);
  letter-spacing: normal;
  text-wrap: balance;
  margin: 0;
}
.dx-access-state h1:focus {
  box-shadow: none;
  outline: none;
}
.dx-access-state__detail {
  max-width: 38ch;
  color: var(--dx-text-soft);
  font: 400 14px/1.5 var(--dx-font-sans);
  text-wrap: pretty;
  margin: 12px auto 0;
}
.dx-access-state__actions {
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 12px;
  display: flex;
}
.dx-access-state [data-slot=button] {
  background: var(--dx-active-bg);
  color: var(--dx-active-text);
  border: 0;
}
.dx-access-state [data-slot=button]:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 3px;
}
@media (pointer: coarse) {
  .dx-access-state [data-slot=button] {
    min-height: 44px;
  }
}
@media (max-height: 500px) {
  .dx-access-state {
    padding-block: 24px;
  }
  .dx-access-state .dx-brand-sting {
    width: 40px;
    margin-bottom: 20px;
  }
}
@media (forced-colors: active) {
  .dx-access-state [data-slot=button] {
    border: 1px solid buttontext;
  }
}
.family-chrome.workspace-header,
.family-chrome.family-header {
  z-index: 40;
  width: 100%;
  min-width: 0;
  min-height: var(--dx-shell-top-row,52px);
  border-bottom: 1px solid var(--border);
  background: var(--background);
  font-family: var(--dx-font-sans);
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 24px;
  display: grid;
  position: sticky;
  top: 0;
}
.family-chrome .page-kicker {
  color: var(--dx-text-faint);
  font: 700 10px/12px var(--dx-font-sans);
  letter-spacing: .08em;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  overflow: hidden;
}
.family-chrome .family-chrome-actions {
  justify-self: end;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}
.family-chrome :is([data-sidebar=trigger], .family-trigger),
.family-chrome-actions :is(button, .account-trigger) {
  flex-shrink: 0;
  min-width: 36px;
  height: 36px;
}
.family-chrome-actions .account-trigger {
  border-radius: var(--dx-radius-button);
  font: 500 14px/20px var(--dx-font-sans);
  letter-spacing: normal;
  text-transform: none;
  gap: 8px;
  padding-inline: 8px;
}
.family-chrome :is(button, summary) > svg {
  width: var(--dx-icon-size-control);
  height: var(--dx-icon-size-control);
  stroke-width: var(--dx-icon-stroke-width);
  flex-shrink: 0;
}
.family-chrome :is(.dx-theme-glyph, .dx-search-glyph) {
  width: 17px;
  height: 17px;
}
.family-chrome :is(.dx-header-icon-button, .theme-toggle, .dx-theme-button, #header-theme-trigger) {
  border-radius: var(--dx-radius-button);
  box-shadow: none;
  background: 0 0;
  border-color: #0000;
}
.family-chrome :is([data-sidebar=trigger], .dx-header-icon-button, .theme-toggle, .dx-theme-button, #header-theme-trigger):hover {
  background: var(--accent);
}
.family-chrome [data-sidebar=trigger] {
  box-shadow: none;
  border-radius: var(--dx-radius-control);
  background: 0 0;
  border-color: #0000;
}
.family-chrome [data-sidebar=trigger] > svg {
  width: var(--dx-icon-size-nav);
  height: var(--dx-icon-size-nav);
}
.family-chrome [data-sidebar=trigger]:focus:not(:focus-visible) {
  box-shadow: none;
  outline: none;
}
.family-chrome .family-notice {
  grid-column: 1/-1;
}
[data-sidebar=sidebar] .family-brand:is(.brand-home, .kit-brand) {
  min-height: 40px;
  color: var(--sidebar-foreground);
  align-items: center;
  margin: 0 0 4px;
  padding: 4px 8px 12px;
  display: flex;
}
[data-collapsible=icon] .family-brand:is(.brand-home, .kit-brand) {
  padding-inline: 0;
}
[data-sidebar=header] {
  gap: 4px;
}
[data-sidebar=menu-button],
[data-sidebar=menu-sub-button],
.account-panel [role=menuitem] {
  font-family: var(--dx-font-sans);
  letter-spacing: normal;
  text-transform: none;
  font-size: 14px;
  line-height: 21px;
}
[data-sidebar=menu-button][data-size=lg] {
  font-size: 14px;
}
[data-sidebar=menu-button] > svg,
[data-sidebar=menu-sub-button] > svg {
  width: var(--dx-icon-size-nav);
  height: var(--dx-icon-size-nav);
  stroke-width: var(--dx-icon-stroke-width);
  color: var(--dx-icon);
  flex-shrink: 0;
}
[data-sidebar=group-label] {
  color: var(--dx-text-faint);
  font: 700 11.2px/16px var(--dx-font-sans);
  letter-spacing: .08em;
  text-transform: uppercase;
}
@media (max-width: 900px) {
  .family-chrome.workspace-header,
  .family-chrome.family-header {
    gap: 8px;
    padding: 0 16px;
  }
  .family-chrome :is([data-sidebar=trigger], .family-trigger),
  .family-chrome-actions :is(button, .account-trigger) {
    min-width: 44px;
    height: 44px;
  }
}
@media (max-width: 639px) {
  .family-account-label,
  .family-chrome .account-trigger > svg {
    display: none;
  }
}
@media (max-width: 359px) {
  .family-chrome.workspace-header,
  .family-chrome.family-header {
    gap: 4px;
    padding-inline: 12px;
  }
}
@media (min-width: 901px) {
  html:has(.portal-shell.workspace) {
    scrollbar-gutter: auto;
    overflow: hidden;
  }
  .portal-shell.workspace {
    height: 100svh;
    min-height: 0;
    overflow: hidden;
  }
  .portal-shell.workspace > .workspace-main {
    overscroll-behavior: contain;
    min-height: 0;
    position: relative;
    overflow: hidden auto;
  }
}
[data-slot=sidebar-wrapper] {
  --dx-rail-motion:.32s;
  --dx-rail-ease:cubic-bezier(.4, 0, .2, 1);
  --dx-label-delay:80ms;
  --sidebar-width:256px;
  --dx-sidebar-icon-center:33px;
  --dx-shell-top-row:52px;
  --dx-wordmark-mark-center:20.281px;
  --sidebar-width-icon:48px;
}
[data-mobile=true] {
  --dx-sidebar-icon-center:33px;
  --dx-shell-top-row:52px;
  --dx-wordmark-mark-center:20.281px;
}
[data-dx-rail=collapsed] {
  --dx-label-delay:0s;
}
[data-dx-sidebar-gap],
.dx-sidebar-container {
  transition-duration: var(--dx-rail-motion);
  transition-timing-function: var(--dx-rail-ease);
}
.family-chrome.workspace-header {
  padding-inline-start: 4px;
}
.family-chrome [data-sidebar=trigger]:focus-visible {
  outline-offset: -2px;
  box-shadow: none;
  outline: 2px solid;
}
.family-sidebar-account .dx-account-circle {
  border: 1.5px solid var(--dx-border);
  border-radius: 50%;
  width: 36px;
  min-width: 36px;
  height: 36px;
  padding: .5px;
}
.dx-account-avatar {
  border-radius: 50%;
  width: 32px;
  height: 32px;
}
[data-sidebar=header] {
  gap: 4px;
  padding: 0;
}
[data-sidebar=header] > [data-sidebar=menu] {
  padding-inline: calc(var(--dx-sidebar-icon-center) - 16px);
  transition: padding-inline var(--dx-rail-motion) var(--dx-rail-ease);
}
[data-sidebar=sidebar] .family-brand:is(.brand-home, .kit-brand) {
  height: var(--dx-shell-top-row);
  min-height: var(--dx-shell-top-row,52px);
  padding: 0 calc(var(--dx-sidebar-icon-center) - var(--dx-wordmark-mark-center));
  transition: padding-inline var(--dx-rail-motion) var(--dx-rail-ease);
  flex-shrink: 0;
  margin: 0;
  overflow: hidden;
}
.dx-brand {
  flex: 0 0 128.8px;
  width: 128.8px;
  height: 32px;
  position: relative;
}
.dx-brand .df-brand-image {
  object-fit: contain;
  height: auto;
  transition: opacity .2s ease var(--dx-label-delay,0s), visibility 0s linear var(--dx-label-delay,0s);
  position: absolute;
  top: 50%;
  left: 0;
  translate: 0 -50%;
}
.dx-brand .dx-brand-wordmark {
  opacity: 1;
  visibility: visible;
  width: 128.8px;
}
.dx-brand .dx-brand-mark {
  opacity: 0;
  visibility: hidden;
  width: 28px;
  transition-delay: 0s, .2s;
}
.dx-brand[data-compact=true] .dx-brand-wordmark {
  opacity: 0;
  visibility: hidden;
  transition-delay: 0s, .2s;
}
.dx-brand[data-compact=true] .dx-brand-mark {
  opacity: 1;
  visibility: visible;
  transition-delay: .12s, 0s;
}
.dx-brand .df-brand-image[data-loaded=false] {
  opacity: 0;
}
[data-sidebar=content] {
  gap: 0;
  overflow: hidden auto;
}
[data-sidebar=group] {
  transition: padding-inline var(--dx-rail-motion) var(--dx-rail-ease);
  padding-block: 8px;
  padding-inline: 0 12px;
}
[data-sidebar=group] + [data-sidebar=group]:before {
  content: "";
  background: var(--sidebar-foreground);
  top: 0;
  height: 1px;
  position: absolute;
  inset-inline: 2px;
}
@supports (color:color-mix(in lab, red, red)) {
  [data-sidebar=group] + [data-sidebar=group]:before {
    background: color-mix(in srgb, var(--sidebar-foreground) 15%, transparent);
  }
}
[data-sidebar=group] + [data-sidebar=group]:before {
  opacity: 0;
  transition: opacity .14s;
}
[data-sidebar=group-label] {
  white-space: nowrap;
  opacity: 1;
  visibility: visible;
  height: 32px;
  min-height: 0;
  transition:
    height var(--dx-rail-motion) var(--dx-rail-ease),
    opacity .2s ease var(--dx-label-delay),
    padding var(--dx-rail-motion) var(--dx-rail-ease),
    visibility 0s;
  margin: 0;
  padding-inline-start: calc(var(--dx-sidebar-icon-center) - 20px);
  overflow: visible;
}
[data-sidebar=menu-button] {
  width: 100%;
  height: auto;
  min-height: 36px;
  transition: padding var(--dx-rail-motion) var(--dx-rail-ease), background-color .15s ease;
  flex-shrink: 0;
  padding: 7.5px 10px;
}
[data-sidebar=group] [data-sidebar=menu-button] {
  border-radius: 0;
  padding-inline-start: calc(var(--dx-sidebar-icon-center) - var(--dx-icon-size-nav) / 2);
}
[data-sidebar=menu-sub] {
  margin-inline-start: calc(var(--dx-sidebar-icon-center) - 14px);
}
[data-sidebar=menu-sub-button] {
  border-radius: 0;
}
[data-sidebar=menu-button].dx-app-identity {
  min-height: 48px;
  padding: 8px 0;
}
.dx-app-identity > span:first-child {
  border-radius: 8px;
}
.dx-app-identity > [data-dx-app-art=provided] {
  background: 0 0;
}
[data-sidebar=menu-button] > .dx-nav-label {
  white-space: nowrap;
  text-overflow: ellipsis;
  opacity: 1;
  width: 172px;
  max-width: none;
  transition: opacity .2s ease var(--dx-label-delay), translate var(--dx-rail-motion) var(--dx-rail-ease);
  flex: none;
  display: block;
  overflow: hidden;
  translate: 0;
}
[data-sidebar=menu-button].switcher-trigger {
  padding-inline: calc(16px - var(--dx-icon-size-nav) / 2) 12px;
}
[data-sidebar=menu-button].switcher-trigger > .dx-nav-label {
  flex: 1;
  width: auto;
  min-width: 0;
}
[data-sidebar=group] [data-sidebar=menu-button] {
  color: var(--dx-text-soft);
  font-weight: 400;
}
[data-sidebar=menu-button][data-active=true],
[data-sidebar=group] [data-sidebar=menu-button]:hover {
  color: var(--dx-text);
}
[data-sidebar=menu-button][data-active=true]:before {
  content: "";
  background: var(--dx-text);
  width: 2px;
  position: absolute;
  inset-block: 0;
  inset-inline-start: 0;
}
@media (min-width: 901px) {
  [data-collapsible=icon] [data-sidebar=header] > [data-sidebar=menu] {
    padding-inline: 7.5px;
  }
  [data-collapsible=icon] [data-sidebar=sidebar] .family-brand:is(.brand-home, .kit-brand) {
    padding-inline: 9.5px;
  }
  [data-collapsible=icon] [data-sidebar=group] {
    padding-inline: 0 2px;
  }
  [data-collapsible=icon] [data-sidebar=menu-button] {
    padding-inline: calc((48px - 1px - 4px - var(--dx-icon-size-nav)) / 2);
  }
  [data-collapsible=icon] [data-sidebar=group] [data-sidebar=menu-button] {
    padding-inline-start: calc((48px - 1px - var(--dx-icon-size-nav)) / 2);
  }
  [data-collapsible=icon] [data-sidebar=menu-button].dx-app-identity {
    padding-inline: 0;
  }
  [data-collapsible=icon] [data-sidebar=menu-button].switcher-trigger {
    padding-inline: calc(16px - var(--dx-icon-size-nav) / 2) 12px;
  }
  [data-collapsible=icon] .switcher-trigger > svg:last-child {
    visibility: hidden;
  }
  [data-collapsible=icon] [data-sidebar=group-label] {
    opacity: 0;
    visibility: hidden;
    height: 0;
    padding-block: 0;
    transition-delay:
      0s,
      0s,
      0s,
      .2s;
  }
  [data-collapsible=icon] [data-sidebar=menu-button] > .dx-nav-label {
    opacity: 0;
    translate: -8px;
  }
  [data-collapsible=icon] [data-sidebar=group] + [data-sidebar=group]:before {
    opacity: 1;
    transition-delay: .14s;
  }
}
@media (max-width: 900px), (pointer: coarse) {
  .family-sidebar-account .dx-account-circle {
    width: 44px;
    min-width: 44px;
    height: 44px;
  }
  [data-sidebar=menu-button] {
    min-height: 44px;
  }
  .family-chrome [data-sidebar=trigger] {
    width: 44px;
    min-width: 44px;
    height: 44px;
  }
}
@media (forced-colors: active) {
  [data-sidebar=group] + [data-sidebar=group]:before {
    background: canvastext;
  }
  .family-chrome [data-sidebar=trigger]:focus-visible {
    outline-color: highlight;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-mobile=true],
  [data-slot=sheet-overlay],
  [data-slot=sidebar-wrapper] *,
  [data-slot=sidebar-wrapper] :before,
  [data-mobile=true] *,
  [data-mobile=true] :before {
    transition: none !important;
    animation: none !important;
  }
}
[data-slot=select-trigger] {
  gap: 8px;
  padding-inline: 12px;
}
[data-slot=select-icon] {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}
[data-slot=native-select-wrapper] {
  min-width: 0;
  position: relative;
}
[data-slot=native-select] {
  appearance: none;
  border-radius: var(--dx-radius-control);
  width: 100%;
  min-width: 0;
  font-family: var(--dx-font-sans);
  padding-inline: 12px 36px;
}
[data-slot=native-select-icon] {
  pointer-events: none;
  top: 50%;
  left: auto;
  right: auto;
  width: 16px;
  height: 16px;
  position: absolute;
  inset-inline-end: 12px;
  translate: 0 -50%;
}
:is([data-slot=dropdown-menu-content], [data-slot=dropdown-menu-sub-content], [data-slot=select-content]) {
  border: 1px solid var(--dx-border);
  border-radius: var(--dx-radius-panel);
  box-shadow: none;
}
:is([data-slot=dropdown-menu-content], [data-slot=dropdown-menu-sub-content], [data-slot=select-content]):focus-visible {
  box-shadow: none;
  outline: none;
}
@media (forced-colors: active) {
  :is([data-slot=dropdown-menu-content], [data-slot=dropdown-menu-sub-content], [data-slot=select-content]) {
    border-color: canvastext;
  }
}
.portal-shell .lucide {
  stroke-width: var(--dx-icon-stroke-width);
}
[data-sidebar=menu-button]:has(.dx-nav-badge) > .dx-nav-label,
[data-sidebar=menu-sub-button]:has(.dx-nav-badge) > .dx-nav-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  width: auto;
  min-width: 0;
  overflow: hidden;
}
[data-sidebar=menu-button] > .dx-nav-badge,
[data-sidebar=menu-sub-button] > .dx-nav-badge {
  white-space: nowrap;
  text-overflow: clip;
  font-variant-numeric: tabular-nums;
  flex: none;
  width: max-content;
  min-width: 20px;
  margin-inline-start: auto;
  padding-inline: 6px;
  overflow: visible;
}
@media (min-width: 901px) {
  [data-collapsible=icon] .dx-nav-badge {
    opacity: 0;
    visibility: hidden;
  }
}
.dx-page-heading {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: end;
  gap: 16px 24px;
  min-inline-size: 0;
  display: flex;
}
.dx-page-heading__copy {
  min-inline-size: 0;
}
.dx-page-heading__copy > :is(h1, p) {
  margin: 0;
}
.dx-page-heading__copy > p {
  margin-block-start: 4px;
}
.dx-page-heading__actions {
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
  min-inline-size: 0;
  display: flex;
}
button.dx-report-control {
  border-radius: var(--dx-radius-control);
  block-size: 36px;
  inline-size: 36px;
  color: var(--dx-text);
  cursor: pointer;
  box-shadow: none;
  background: 0 0;
  border: 0;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}
button.dx-report-control:hover {
  background: var(--dx-hover);
}
button.dx-report-control > svg {
  inline-size: var(--dx-icon-size-control);
  block-size: var(--dx-icon-size-control);
  stroke-width: var(--dx-icon-stroke-width);
}
button.dx-report-control:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: -2px;
  box-shadow: none;
}
button.dx-report-control:focus:not(:focus-visible) {
  outline: none;
}
@media (pointer: coarse) {
  button.dx-report-control {
    block-size: 44px;
    inline-size: 44px;
  }
}
:is(select.dx-select, select[data-slot=native-select]) {
  color: var(--dx-text);
}
:is(select.dx-select, select[data-slot=native-select]) option {
  color: var(--dx-text);
  background: var(--dx-surface);
}
@supports (appearance:base-select) {
  :is(select.dx-select, select[data-slot=native-select]) {
    appearance: base-select;
  }
  :is(select.dx-select, select[data-slot=native-select])::picker(select) {
    appearance: base-select;
  }
  :is(select.dx-select, select[data-slot=native-select]) {
    align-items: center;
  }
  :is(select.dx-select, select[data-slot=native-select])::picker-icon {
    display: none;
  }
  :is(select.dx-select, select[data-slot=native-select])::picker(select) {
    max-block-size: min(320px, 60dvh);
    color: var(--dx-text);
    background: var(--dx-surface);
    border: 1px solid var(--dx-border);
    border-radius: var(--dx-radius-panel);
    box-shadow: none;
    font: var(--dx-type-body);
    text-transform: none;
    letter-spacing: normal;
    margin-block: 4px;
    padding: 4px;
  }
  :is(select.dx-select, select[data-slot=native-select]) option {
    border-radius: var(--dx-radius-control);
    min-block-size: 32px;
    color: var(--dx-text);
    background: var(--dx-surface);
    outline: none;
    align-items: center;
    gap: 12px;
    padding: 6px 8px;
    display: flex;
  }
  :is(select.dx-select, select[data-slot=native-select]) option:is(:checked, :hover, :focus) {
    color: var(--dx-text);
    background: var(--dx-hover);
  }
  :is(select.dx-select, select[data-slot=native-select]) option:focus-visible {
    outline: 2px solid var(--dx-text);
    outline-offset: -2px;
  }
  :is(select.dx-select, select[data-slot=native-select]) option::checkmark {
    color: var(--dx-text);
    order: 1;
    margin-inline-start: auto;
  }
  @media (pointer: coarse) {
    :is(select.dx-select, select[data-slot=native-select]) option {
      min-block-size: 44px;
    }
  }
  @media (forced-colors: active) {
    :is(select.dx-select, select[data-slot=native-select])::picker(select) {
      color: canvastext;
      background: canvas;
      border-color: canvastext;
    }
    :is(select.dx-select, select[data-slot=native-select]) option:is(:checked, :hover, :focus) {
      color: highlighttext;
      background: highlight;
    }
  }
}
:is([data-slot=dropdown-menu-content], [data-slot=dropdown-menu-sub-content], [data-slot=select-content]) {
  color: var(--dx-text);
  background: var(--dx-surface);
}
:is([data-slot=dropdown-menu-content], [data-slot=dropdown-menu-sub-content], [data-slot=select-content]) [role]:is([data-highlighted], [data-state=checked], [aria-selected=true]) {
  color: var(--dx-text);
  background: var(--dx-hover);
}
@media (forced-colors: active) {
  [data-sidebar=menu-button] > svg,
  [data-sidebar=menu-sub-button] > svg {
    color: canvastext;
  }
}
.family-sidebar-account[data-sidebar=footer] {
  --dx-account-hit:36px;
  --dx-account-inset:calc(var(--dx-sidebar-icon-center) - var(--dx-account-hit) / 2);
  padding: 8px var(--dx-account-inset) max(var(--dx-account-inset), env(safe-area-inset-bottom));
  transition: padding var(--dx-rail-motion) var(--dx-rail-ease);
  flex: none;
  align-items: flex-start;
}
@media (min-width: 901px) {
  [data-collapsible=icon] .family-sidebar-account[data-sidebar=footer] {
    --dx-account-inset:max(0px, calc((var(--sidebar-width-icon) - 1px - var(--dx-account-hit)) / 2));
  }
}
@media (max-width: 900px), (pointer: coarse) {
  .family-sidebar-account[data-sidebar=footer] {
    --dx-account-hit:44px;
  }
}
.account-panel [role=menuitem] {
  border-radius: var(--dx-radius-control);
  min-height: 36px;
  color: var(--dx-text);
  gap: 12px;
  padding: 6px 8px;
  font-weight: 400;
}
.dx-account-item-icon {
  color: var(--dx-icon);
  flex: none;
  display: inline-flex;
}
.dx-account-item-icon > svg {
  width: var(--dx-icon-size-nav);
  height: var(--dx-icon-size-nav);
  stroke-width: var(--dx-icon-stroke-width);
}
.account-panel [role=menuitem]:focus {
  box-shadow: none;
  outline: none;
}
.account-panel [role=menuitem]:focus-visible .dx-account-item-label {
  text-underline-offset: 3px;
  text-decoration: underline;
  text-decoration-thickness: 1px;
}
@media (max-width: 900px), (pointer: coarse) {
  .account-panel [role=menuitem] {
    min-height: 44px;
  }
}
@media (forced-colors: active) {
  .dx-account-item-icon {
    color: canvastext;
  }
  .account-panel [role=menuitem]:focus-visible {
    color: highlighttext;
    background: highlight;
  }
  .account-panel [role=menuitem]:focus-visible .dx-account-item-icon {
    color: highlighttext;
  }
}
.dx-account-initials {
  background: var(--dx-ink);
  color: var(--dx-white);
}
.dark .dx-account-initials {
  background: var(--dx-ink-3);
}
@layer theme {
  :root,
  :host {
    --font-sans:var(--font-sans);
    --font-mono:var(--font-mono);
    --color-black:#000;
    --spacing:.25rem;
    --container-sm:24rem;
    --container-lg:32rem;
    --text-xs:.75rem;
    --text-xs--line-height:calc(1 / .75);
    --text-sm:.875rem;
    --text-sm--line-height:calc(1.25 / .875);
    --text-base:1rem;
    --text-base--line-height:calc(1.5 / 1);
    --text-lg:1.125rem;
    --text-lg--line-height:calc(1.75 / 1.125);
    --font-weight-normal:400;
    --font-weight-medium:500;
    --font-weight-semibold:600;
    --font-weight-bold:700;
    --tracking-tight:-.025em;
    --tracking-normal:0em;
    --tracking-widest:.1em;
    --leading-tight:1.25;
    --leading-snug:1.375;
    --leading-normal:1.5;
    --leading-relaxed:1.625;
    --radius-xs:.125rem;
    --ease-in-out:cubic-bezier(.4, 0, .2, 1);
    --animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --default-transition-duration:.15s;
    --default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);
    --default-font-family:var(--font-sans);
    --default-mono-font-family:var(--font-mono);
  }
}
@layer base {
  *,
  :after,
  :before,
  ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }
  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }
  html,
  :host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings,normal);
    font-variation-settings: var(--default-font-variation-settings,normal);
    -webkit-tap-highlight-color: transparent;
  }
  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-size: inherit;
    font-weight: inherit;
  }
  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }
  b,
  strong {
    font-weight: bolder;
  }
  code,
  kbd,
  samp,
  pre {
    font-family: var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings,normal);
    font-variation-settings: var(--default-mono-font-variation-settings,normal);
    font-size: 1em;
  }
  small {
    font-size: 80%;
  }
  sub,
  sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative;
  }
  sub {
    bottom: -.25em;
  }
  sup {
    top: -.5em;
  }
  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }
  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }
  progress {
    vertical-align: baseline;
  }
  summary {
    display: list-item;
  }
  ol,
  ul,
  menu {
    list-style: none;
  }
  img,
  svg,
  video,
  canvas,
  audio,
  iframe,
  embed,
  object {
    vertical-align: middle;
    display: block;
  }
  img,
  video {
    max-width: 100%;
    height: auto;
  }
  button,
  input,
  select,
  optgroup,
  textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }
  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }
  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }
  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }
  ::file-selector-button {
    margin-inline-end: 4px;
  }
  ::placeholder {
    opacity: 1;
  }
  @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
    ::placeholder {
      color: currentColor;
    }
    @supports (color:color-mix(in lab, red, red)) {
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }
  ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button,
  input:where([type=button], [type=reset], [type=submit]) {
    appearance: button;
  }
  ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button {
    height: auto;
  }
  ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden=until-found])) {
    display: none !important;
  }
  *,
  :after,
  :before,
  ::backdrop {
    border-color: var(--border,currentColor);
  }
  ::file-selector-button {
    border-color: var(--border,currentColor);
  }
  * {
    border-color: var(--border);
    scrollbar-width: thin;
    scrollbar-color: var(--dx-text) transparent;
  }
  @supports (color:color-mix(in lab, red, red)) {
    * {
      scrollbar-color: color-mix(in srgb, var(--dx-text) 30%, transparent) transparent;
    }
  }
  html {
    font-family: var(--font-sans);
    scrollbar-gutter: stable;
    overflow-x: clip;
  }
  body {
    background-color: var(--background);
    font-family: var(--font-sans);
    color: var(--foreground);
    text-rendering: optimizelegibility;
    -webkit-font-smoothing: antialiased;
    min-width: 320px;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
  }
  body:has([data-layout=fixed]) {
    overflow: hidden;
  }
  button:not(:disabled),
  [role=button]:not(:disabled) {
    cursor: pointer;
  }
  :is(h1, h2, h3, p, main)[tabindex="-1"]:focus-visible {
    outline: none;
  }
  :focus-visible {
    outline: var(--dx-focus-width) solid var(--dx-focus);
    outline-offset: 2px;
    box-shadow: none;
  }
  ::selection {
    background: var(--dx-charge);
    color: var(--dx-midnight);
  }
  .CollapsibleContent {
    overflow: hidden;
  }
  .CollapsibleContent[data-state=open] {
    animation: .3s ease-out slideDown;
  }
  .CollapsibleContent[data-state=closed] {
    animation: .3s ease-out slideUp;
  }
  @keyframes slideDown {
    0% {
      height: 0;
    }
    to {
      height: var(--radix-collapsible-content-height);
    }
  }
  @keyframes slideUp {
    0% {
      height: var(--radix-collapsible-content-height);
    }
    to {
      height: 0;
    }
  }
}
@layer components;
@layer utilities {
  .\@container\/field-group {
    container: field-group/inline-size;
  }
  .pointer-events-none {
    pointer-events: none;
  }
  .visible {
    visibility: visible;
  }
  .sr-only {
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .static {
    position: static;
  }
  .sticky {
    position: sticky;
  }
  .inset-0 {
    inset: 0;
  }
  .inset-x-0 {
    inset-inline: 0;
  }
  .inset-y-0 {
    inset-block: 0;
  }
  .top-0 {
    top: 0;
  }
  .top-1 {
    top: var(--spacing);
  }
  .top-1\.5 {
    top: calc(var(--spacing) * 1.5);
  }
  .top-1\/2 {
    top: 50%;
  }
  .top-3\.5 {
    top: calc(var(--spacing) * 3.5);
  }
  .top-4 {
    top: calc(var(--spacing) * 4);
  }
  .top-\[50\%\] {
    top: 50%;
  }
  .right-0 {
    right: 0;
  }
  .right-1 {
    right: var(--spacing);
  }
  .right-2 {
    right: calc(var(--spacing) * 2);
  }
  .right-3 {
    right: calc(var(--spacing) * 3);
  }
  .right-4 {
    right: calc(var(--spacing) * 4);
  }
  .bottom-0 {
    bottom: 0;
  }
  .left-0 {
    left: 0;
  }
  .left-2 {
    left: calc(var(--spacing) * 2);
  }
  .left-\[50\%\] {
    left: 50%;
  }
  .z-10 {
    z-index: 10;
  }
  .z-20 {
    z-index: 20;
  }
  .z-40 {
    z-index: 40;
  }
  .z-50 {
    z-index: 50;
  }
  .z-70 {
    z-index: 70;
  }
  .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;
    }
  }
  .-mx-1 {
    margin-inline: calc(var(--spacing) * -1);
  }
  .mx-2 {
    margin-inline: calc(var(--spacing) * 2);
  }
  .mx-3\.5 {
    margin-inline: calc(var(--spacing) * 3.5);
  }
  .mx-auto {
    margin-inline: auto;
  }
  .-my-2 {
    margin-block: calc(var(--spacing) * -2);
  }
  .my-1 {
    margin-block: var(--spacing);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }
  .mr-2 {
    margin-right: calc(var(--spacing) * 2);
  }
  .mb-1 {
    margin-bottom: var(--spacing);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .ml-4 {
    margin-left: calc(var(--spacing) * 4);
  }
  .ml-auto {
    margin-left: auto;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline-flex {
    display: inline-flex;
  }
  .aspect-square {
    aspect-ratio: 1;
  }
  .size-3 {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }
  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .size-7 {
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
  }
  .size-8 {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }
  .size-9 {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }
  .size-10 {
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
  }
  .size-11 {
    width: calc(var(--spacing) * 11);
    height: calc(var(--spacing) * 11);
  }
  .h-2 {
    height: calc(var(--spacing) * 2);
  }
  .h-3\.5 {
    height: calc(var(--spacing) * 3.5);
  }
  .h-4 {
    height: calc(var(--spacing) * 4);
  }
  .h-5 {
    height: calc(var(--spacing) * 5);
  }
  .h-7 {
    height: calc(var(--spacing) * 7);
  }
  .h-8 {
    height: calc(var(--spacing) * 8);
  }
  .h-9 {
    height: calc(var(--spacing) * 9);
  }
  .h-10 {
    height: calc(var(--spacing) * 10);
  }
  .h-12 {
    height: calc(var(--spacing) * 12);
  }
  .h-\[1px\] {
    height: 1px;
  }
  .h-\[var\(--radix-select-trigger-height\)\] {
    height: var(--radix-select-trigger-height);
  }
  .h-auto {
    height: auto;
  }
  .h-full {
    height: 100%;
  }
  .h-px {
    height: 1px;
  }
  .h-svh {
    height: 100svh;
  }
  .max-h-72 {
    max-height: calc(var(--spacing) * 72);
  }
  .max-h-96 {
    max-height: calc(var(--spacing) * 96);
  }
  .max-h-\[90dvh\] {
    max-height: 90dvh;
  }
  .max-h-\[300px\] {
    max-height: 300px;
  }
  .min-h-0 {
    min-height: 0;
  }
  .min-h-12 {
    min-height: calc(var(--spacing) * 12);
  }
  .min-h-\[22px\] {
    min-height: 22px;
  }
  .min-h-\[60px\] {
    min-height: 60px;
  }
  .min-h-svh {
    min-height: 100svh;
  }
  .w-\(--sidebar-width\) {
    width: var(--sidebar-width);
  }
  .w-2 {
    width: calc(var(--spacing) * 2);
  }
  .w-3\.5 {
    width: calc(var(--spacing) * 3.5);
  }
  .w-3\/4 {
    width: 75%;
  }
  .w-4 {
    width: calc(var(--spacing) * 4);
  }
  .w-5 {
    width: calc(var(--spacing) * 5);
  }
  .w-7 {
    width: calc(var(--spacing) * 7);
  }
  .w-9 {
    width: calc(var(--spacing) * 9);
  }
  .w-10 {
    width: calc(var(--spacing) * 10);
  }
  .w-\[1px\] {
    width: 1px;
  }
  .w-auto {
    width: auto;
  }
  .w-fit {
    width: fit-content;
  }
  .w-full {
    width: 100%;
  }
  .max-w-\(--skeleton-width\) {
    max-width: var(--skeleton-width);
  }
  .max-w-\[calc\(100\%-2rem\)\] {
    max-width: calc(100% - 2rem);
  }
  .max-w-full {
    max-width: 100%;
  }
  .max-w-lg {
    max-width: var(--container-lg);
  }
  .max-w-prose {
    max-width: 65ch;
  }
  .min-w-0 {
    min-width: 0;
  }
  .min-w-5 {
    min-width: calc(var(--spacing) * 5);
  }
  .min-w-56 {
    min-width: calc(var(--spacing) * 56);
  }
  .min-w-\[8rem\] {
    min-width: 8rem;
  }
  .min-w-\[var\(--radix-select-trigger-width\)\] {
    min-width: var(--radix-select-trigger-width);
  }
  .flex-1 {
    flex: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .caption-bottom {
    caption-side: bottom;
  }
  .-translate-x-1\/2 {
    --tw-translate-x:calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .-translate-x-px {
    --tw-translate-x:-1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-\[-50\%\] {
    --tw-translate-x:-50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-x-px {
    --tw-translate-x:1px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .translate-y-\[-50\%\] {
    --tw-translate-y:-50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .animate-in {
    animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
  }
  .animate-none {
    animation: none;
  }
  .animate-pulse {
    animation: var(--animate-pulse);
  }
  .cursor-default {
    cursor: default;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .list-disc {
    list-style-type: disc;
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid-cols-\[auto_minmax\(0\,1fr\)\] {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-col-reverse {
    flex-direction: column-reverse;
  }
  .flex-row {
    flex-direction: row;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-center {
    align-items: center;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .gap-1 {
    gap: var(--spacing);
  }
  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }
  .gap-7 {
    gap: calc(var(--spacing) * 7);
  }
  :where(.space-y-2 > :not(:last-child)) {
    --tw-space-y-reverse:0;
    margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
  }
  .truncate {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .overflow-auto {
    overflow: auto;
  }
  .overflow-hidden {
    overflow: hidden;
  }
  .overflow-x-hidden {
    overflow-x: hidden;
  }
  .overflow-y-auto {
    overflow-y: auto;
  }
  .rounded-\(--dx-radius-tag\) {
    border-radius: var(--dx-radius-tag);
  }
  .rounded-full {
    border-radius: 3.40282e38px;
  }
  .rounded-lg {
    border-radius: var(--radius);
  }
  .rounded-md,
  .rounded-sm {
    border-radius: var(--dx-radius-control);
  }
  .rounded-xs {
    border-radius: var(--radius-xs);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0;
  }
  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-r {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-l {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
  }
  .border-border {
    border-color: var(--border);
  }
  .border-border-soft {
    border-color: var(--dx-border-soft);
  }
  .border-destructive\/50 {
    border-color: var(--destructive);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .border-destructive\/50 {
      border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
    }
  }
  .border-foreground {
    border-color: var(--foreground);
  }
  .border-input {
    border-color: var(--input);
  }
  .border-sidebar-border {
    border-color: var(--sidebar-border);
  }
  .border-transparent {
    border-color: #0000;
  }
  .bg-background {
    background-color: var(--background);
  }
  .bg-black\/80 {
    background-color: #000c;
  }
  @supports (color:color-mix(in lab, red, red)) {
    .bg-black\/80 {
      background-color: color-mix(in oklab, var(--color-black) 80%, transparent);
    }
  }
  .bg-border {
    background-color: var(--border);
  }
  .bg-card {
    background-color: var(--card);
  }
  .bg-destructive {
    background-color: var(--destructive);
  }
  .bg-muted,
  .bg-muted\/50 {
    background-color: var(--muted);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .bg-muted\/50 {
      background-color: color-mix(in oklab, var(--muted) 50%, transparent);
    }
  }
  .bg-popover {
    background-color: var(--popover);
  }
  .bg-primary,
  .bg-primary\/10 {
    background-color: var(--primary);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .bg-primary\/10 {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .bg-secondary {
    background-color: var(--secondary);
  }
  .bg-sidebar {
    background-color: var(--sidebar);
  }
  .bg-sidebar-border {
    background-color: var(--sidebar-border);
  }
  .bg-sidebar-primary {
    background-color: var(--sidebar-primary);
  }
  .bg-transparent {
    background-color: #0000;
  }
  .fill-current {
    fill: currentColor;
  }
  .object-cover {
    object-fit: cover;
  }
  .p-0 {
    padding: 0;
  }
  .p-1 {
    padding: var(--spacing);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .p-6 {
    padding: calc(var(--spacing) * 6);
  }
  .px-1 {
    padding-inline: var(--spacing);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }
  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }
  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }
  .px-\[7px\] {
    padding-inline: 7px;
  }
  .py-0 {
    padding-block: 0;
  }
  .py-0\.5 {
    padding-block: calc(var(--spacing) * .5);
  }
  .py-1 {
    padding-block: var(--spacing);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }
  .py-\[3px\] {
    padding-block: 3px;
  }
  .pr-1 {
    padding-right: var(--spacing);
  }
  .pr-2 {
    padding-right: calc(var(--spacing) * 2);
  }
  .pr-8 {
    padding-right: calc(var(--spacing) * 8);
  }
  .pl-2 {
    padding-left: calc(var(--spacing) * 2);
  }
  .pl-8 {
    padding-left: calc(var(--spacing) * 8);
  }
  .text-center {
    text-align: center;
  }
  .text-left {
    text-align: left;
  }
  .align-middle {
    vertical-align: middle;
  }
  .font-display {
    font-family: var(--dx-font-sans);
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading,var(--text-base--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading,var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading,var(--text-sm--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading,var(--text-xs--line-height));
  }
  .text-\[10px\] {
    font-size: 10px;
  }
  .leading-5 {
    --tw-leading:calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
  }
  .leading-\[1\.2\] {
    --tw-leading:1.2;
    line-height: 1.2;
  }
  .leading-none {
    --tw-leading:1;
    line-height: 1;
  }
  .leading-normal {
    --tw-leading:var(--leading-normal);
    line-height: var(--leading-normal);
  }
  .leading-snug {
    --tw-leading:var(--leading-snug);
    line-height: var(--leading-snug);
  }
  .leading-tight {
    --tw-leading:var(--leading-tight);
    line-height: var(--leading-tight);
  }
  .font-bold {
    --tw-font-weight:var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .font-medium {
    --tw-font-weight:var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-normal {
    --tw-font-weight:var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .font-semibold {
    --tw-font-weight:var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-\[0\.06em\] {
    --tw-tracking:.06em;
    letter-spacing: .06em;
  }
  .tracking-\[0\.08em\] {
    --tw-tracking:.08em;
    letter-spacing: .08em;
  }
  .tracking-normal {
    --tw-tracking:var(--tracking-normal);
    letter-spacing: var(--tracking-normal);
  }
  .tracking-tight {
    --tw-tracking:var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }
  .tracking-widest {
    --tw-tracking:var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
  }
  .break-all {
    word-break: break-all;
  }
  .whitespace-nowrap {
    white-space: nowrap;
  }
  .text-card-foreground {
    color: var(--card-foreground);
  }
  .text-current {
    color: currentColor;
  }
  .text-destructive {
    color: var(--destructive);
  }
  .text-destructive-foreground {
    color: var(--destructive-foreground);
  }
  .text-foreground {
    color: var(--foreground);
  }
  .text-foreground-faint {
    color: var(--dx-text-faint);
  }
  .text-muted-foreground,
  .text-muted-foreground\/80 {
    color: var(--muted-foreground);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .text-muted-foreground\/80 {
      color: color-mix(in oklab, var(--muted-foreground) 80%, transparent);
    }
  }
  .text-popover-foreground {
    color: var(--popover-foreground);
  }
  .text-primary {
    color: var(--primary);
  }
  .text-primary-foreground {
    color: var(--primary-foreground);
  }
  .text-secondary-foreground {
    color: var(--secondary-foreground);
  }
  .text-sidebar-foreground,
  .text-sidebar-foreground\/70 {
    color: var(--sidebar-foreground);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .text-sidebar-foreground\/70 {
      color: color-mix(in oklab, var(--sidebar-foreground) 70%, transparent);
    }
  }
  .text-sidebar-primary-foreground {
    color: var(--sidebar-primary-foreground);
  }
  .normal-case {
    text-transform: none;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .tabular-nums {
    --tw-numeric-spacing:tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .underline-offset-4 {
    text-underline-offset: 4px;
  }
  .opacity-50 {
    opacity: .5;
  }
  .opacity-60 {
    opacity: .6;
  }
  .opacity-70 {
    opacity: .7;
  }
  .shadow-\[0_0_0_1px_hsl\(var\(--sidebar-border\)\)\] {
    --tw-shadow:0 0 0 1px var(--tw-shadow-color,hsl(var(--sidebar-border)));
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .shadow-none {
    --tw-shadow:0 0 #0000;
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .ring-0 {
    --tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .ring-sidebar-ring {
    --tw-ring-color:var(--sidebar-ring);
  }
  .outline-hidden {
    --tw-outline-style:none;
    outline-style: none;
  }
  @media (forced-colors: active) {
    .outline-hidden {
      outline-offset: 2px;
      outline: 2px solid #0000;
    }
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .transition {
    transition-property:
      color,
      background-color,
      border-color,
      outline-color,
      text-decoration-color,
      fill,
      stroke,
      --tw-gradient-from,
      --tw-gradient-via,
      --tw-gradient-to,
      opacity,
      box-shadow,
      transform,
      translate,
      scale,
      rotate,
      filter,
      -webkit-backdrop-filter,
      backdrop-filter,
      display,
      content-visibility,
      overlay,
      pointer-events;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-\[color\,background-color\,border-color\,outline-color\,transform\] {
    transition-property:
      color,
      background-color,
      border-color,
      outline-color,
      transform;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-\[left\,right\,width\] {
    transition-property:
      left,
      right,
      width;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-\[margin\,opa\] {
    transition-property: margin, opa;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-\[width\,height\,padding\] {
    transition-property:
      width,
      height,
      padding;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-\[width\] {
    transition-property: width;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-colors {
    transition-property:
      color,
      background-color,
      border-color,
      outline-color,
      text-decoration-color,
      fill,
      stroke,
      --tw-gradient-from,
      --tw-gradient-via,
      --tw-gradient-to;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .transition-transform {
    transition-property:
      transform,
      translate,
      scale,
      rotate;
    transition-timing-function: var(--tw-ease,var(--default-transition-timing-function));
    transition-duration: var(--tw-duration,var(--default-transition-duration));
  }
  .duration-\(--dx-motion-standard\) {
    --tw-duration:var(--dx-motion-standard);
    transition-duration: var(--dx-motion-standard);
  }
  .duration-0 {
    --tw-duration:0s;
    transition-duration: 0s;
  }
  .duration-200 {
    --tw-duration:.2s;
    transition-duration: .2s;
  }
  .ease-in-out {
    --tw-ease:var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }
  .ease-linear {
    --tw-ease:linear;
    transition-timing-function: linear;
  }
  .fade-in-0 {
    --tw-enter-opacity:0;
  }
  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }
  .zoom-in-95 {
    --tw-enter-scale:.95;
  }
  :is(.\*\:w-full > *) {
    width: 100%;
  }
  .group-focus-within\/menu-item\:opacity-100:is(:where(.group\/menu-item):focus-within *) {
    opacity: 1;
  }
  @media (hover: hover) {
    .group-hover\/menu-item\:opacity-100:is(:where(.group\/menu-item):hover *) {
      opacity: 1;
    }
  }
  .group-has-data-\[sidebar\=menu-action\]\/menu-item\:pr-8:is(:where(.group\/menu-item):has([data-sidebar=menu-action]) *) {
    padding-right: calc(var(--spacing) * 8);
  }
  .group-has-data-horizontal\/field\:text-balance:is(:where(.group\/field):has(:where([data-orientation=horizontal])) *) {
    text-wrap: balance;
  }
  .group-data-\[collapsible\=icon\]\:hidden:is(:where(.group)[data-collapsible=icon] *) {
    display: none;
  }
  .group-data-\[collapsible\=icon\]\:w-\(--sidebar-width-icon\):is(:where(.group)[data-collapsible=icon] *) {
    width: var(--sidebar-width-icon);
  }
  .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\)\]:is(:where(.group)[data-collapsible=icon] *) {
    width: calc(var(--sidebar-width-icon) + (calc(var(--spacing) * 4)));
  }
  .group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)\+\(--spacing\(4\)\)\+2px\)\]:is(:where(.group)[data-collapsible=icon] *) {
    width: calc(var(--sidebar-width-icon) + (calc(var(--spacing) * 4)) + 2px);
  }
  .group-data-\[collapsible\=icon\]\:overflow-hidden:is(:where(.group)[data-collapsible=icon] *) {
    overflow: hidden;
  }
  .group-data-\[collapsible\=offcanvas\]\:right-\[calc\(var\(--sidebar-width\)\*-1\)\]:is(:where(.group)[data-collapsible=offcanvas] *) {
    right: calc(var(--sidebar-width) * -1);
  }
  .group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\]:is(:where(.group)[data-collapsible=offcanvas] *) {
    left: calc(var(--sidebar-width) * -1);
  }
  .group-data-\[collapsible\=offcanvas\]\:w-0:is(:where(.group)[data-collapsible=offcanvas] *) {
    width: 0;
  }
  .group-data-\[collapsible\=offcanvas\]\:translate-x-0:is(:where(.group)[data-collapsible=offcanvas] *) {
    --tw-translate-x:0px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .group-data-\[disabled\=true\]\/field\:opacity-50:is(:where(.group\/field)[data-disabled=true] *) {
    opacity: .5;
  }
  .group-data-\[side\=left\]\:-right-4:is(:where(.group)[data-side=left] *) {
    right: calc(var(--spacing) * -4);
  }
  .group-data-\[side\=left\]\:border-r:is(:where(.group)[data-side=left] *) {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }
  .group-data-\[side\=right\]\:left-0:is(:where(.group)[data-side=right] *) {
    left: 0;
  }
  .group-data-\[side\=right\]\:rotate-180:is(:where(.group)[data-side=right] *) {
    rotate: 180deg;
  }
  .group-data-\[side\=right\]\:border-l:is(:where(.group)[data-side=right] *) {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
  }
  .group-data-\[state\=open\]\/collapsible\:rotate-90:is(:where(.group\/collapsible)[data-state=open] *) {
    rotate: 90deg;
  }
  .group-data-\[variant\=floating\]\:rounded-lg:is(:where(.group)[data-variant=floating] *) {
    border-radius: var(--radius);
  }
  .group-data-\[variant\=floating\]\:border:is(:where(.group)[data-variant=floating] *) {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .group-data-\[variant\=floating\]\:border-sidebar-border:is(:where(.group)[data-variant=floating] *) {
    border-color: var(--sidebar-border);
  }
  .group-data-\[variant\=outline\]\/field-group\:-mb-2:is(:where(.group\/field-group)[data-variant=outline] *) {
    margin-bottom: calc(var(--spacing) * -2);
  }
  @media (hover: hover) {
    .peer-hover\/menu-button\:text-sidebar-accent-foreground:is(:where(.peer\/menu-button):hover ~ *) {
      color: var(--sidebar-accent-foreground);
    }
  }
  .peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled ~ *) {
    cursor: not-allowed;
  }
  .peer-disabled\:opacity-70:is(:where(.peer):disabled ~ *) {
    opacity: .7;
  }
  .peer-data-\[active\=true\]\/menu-button\:text-sidebar-accent-foreground:is(:where(.peer\/menu-button)[data-active=true] ~ *) {
    color: var(--sidebar-accent-foreground);
  }
  .peer-data-\[size\=default\]\/menu-button\:top-1\.5:is(:where(.peer\/menu-button)[data-size=default] ~ *) {
    top: calc(var(--spacing) * 1.5);
  }
  .peer-data-\[size\=lg\]\/menu-button\:top-2\.5:is(:where(.peer\/menu-button)[data-size=lg] ~ *) {
    top: calc(var(--spacing) * 2.5);
  }
  .peer-data-\[size\=sm\]\/menu-button\:top-1:is(:where(.peer\/menu-button)[data-size=sm] ~ *) {
    top: var(--spacing);
  }
  .peer-data-\[variant\=inset\]\:min-h-\[calc\(100svh-\(--spacing\(4\)\)\)\]:is(:where(.peer)[data-variant=inset] ~ *) {
    min-height: calc(100svh - (calc(var(--spacing) * 4)));
  }
  .file\:border-0::file-selector-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }
  .file\:bg-transparent::file-selector-button {
    background-color: #0000;
  }
  .file\:text-sm::file-selector-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading,var(--text-sm--line-height));
  }
  .file\:font-medium::file-selector-button {
    --tw-font-weight:var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .file\:text-foreground::file-selector-button {
    color: var(--foreground);
  }
  .placeholder\:text-foreground-faint::placeholder {
    color: var(--dx-text-faint);
  }
  .placeholder\:text-muted-foreground::placeholder {
    color: var(--muted-foreground);
  }
  .after\:absolute:after {
    content: var(--tw-content);
    position: absolute;
  }
  .after\:-inset-2:after {
    content: var(--tw-content);
    inset: calc(var(--spacing) * -2);
  }
  .after\:inset-y-0:after {
    content: var(--tw-content);
    inset-block: 0;
  }
  .after\:left-1\/2:after {
    content: var(--tw-content);
    left: 50%;
  }
  .after\:w-\[2px\]:after {
    content: var(--tw-content);
    width: 2px;
  }
  .group-data-\[collapsible\=offcanvas\]\:after\:left-full:is(:where(.group)[data-collapsible=offcanvas] *):after {
    content: var(--tw-content);
    left: 100%;
  }
  .last\:mt-0:last-child {
    margin-top: 0;
  }
  @media (hover: hover) {
    .hover\:border-foreground:hover {
      border-color: var(--foreground);
    }
    .hover\:border-foreground-faint:hover {
      border-color: var(--dx-text-faint);
    }
    .hover\:bg-accent:hover {
      background-color: var(--accent);
    }
    .hover\:bg-destructive\/80:hover {
      background-color: var(--destructive);
    }
    @supports (color:color-mix(in lab, red, red)) {
      .hover\:bg-destructive\/80:hover {
        background-color: color-mix(in oklab, var(--destructive) 80%, transparent);
      }
    }
    .hover\:bg-destructive\/90:hover {
      background-color: var(--destructive);
    }
    @supports (color:color-mix(in lab, red, red)) {
      .hover\:bg-destructive\/90:hover {
        background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
      }
    }
    .hover\:bg-primary\/80:hover {
      background-color: var(--primary);
    }
    @supports (color:color-mix(in lab, red, red)) {
      .hover\:bg-primary\/80:hover {
        background-color: color-mix(in oklab, var(--primary) 80%, transparent);
      }
    }
    .hover\:bg-primary\/90:hover {
      background-color: var(--primary);
    }
    @supports (color:color-mix(in lab, red, red)) {
      .hover\:bg-primary\/90:hover {
        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
      }
    }
    .hover\:bg-secondary\/80:hover {
      background-color: var(--secondary);
    }
    @supports (color:color-mix(in lab, red, red)) {
      .hover\:bg-secondary\/80:hover {
        background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
      }
    }
    .hover\:bg-sidebar-accent:hover {
      background-color: var(--sidebar-accent);
    }
    .hover\:text-accent-foreground:hover {
      color: var(--accent-foreground);
    }
    .hover\:text-sidebar-accent-foreground:hover {
      color: var(--sidebar-accent-foreground);
    }
    .hover\:underline:hover {
      text-decoration-line: underline;
    }
    .hover\:opacity-100:hover {
      opacity: 1;
    }
    .hover\:shadow-\[0_0_0_1px_hsl\(var\(--sidebar-accent\)\)\]:hover {
      --tw-shadow:0 0 0 1px var(--tw-shadow-color,hsl(var(--sidebar-accent)));
      box-shadow:
        var(--tw-inset-shadow),
        var(--tw-inset-ring-shadow),
        var(--tw-ring-offset-shadow),
        var(--tw-ring-shadow),
        var(--tw-shadow);
    }
    .hover\:group-data-\[collapsible\=offcanvas\]\:bg-sidebar:hover:is(:where(.group)[data-collapsible=offcanvas] *) {
      background-color: var(--sidebar);
    }
    .hover\:after\:bg-sidebar-border:hover:after {
      content: var(--tw-content);
      background-color: var(--sidebar-border);
    }
  }
  .focus\:bg-accent:focus {
    background-color: var(--accent);
  }
  .focus\:text-accent-foreground:focus {
    color: var(--accent-foreground);
  }
  .focus-visible\:ring-2:focus-visible {
    --tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .focus-visible\:outline-2:focus-visible {
    outline-style: var(--tw-outline-style);
    outline-width: 2px;
  }
  .focus-visible\:outline-offset-2:focus-visible {
    outline-offset: 2px;
  }
  .focus-visible\:outline-\(--dx-focus\):focus-visible {
    outline-color: var(--dx-focus);
  }
  .active\:scale-\[0\.97\]:active {
    scale: .97;
  }
  .active\:bg-sidebar-accent:active {
    background-color: var(--sidebar-accent);
  }
  .active\:text-sidebar-accent-foreground:active {
    color: var(--sidebar-accent-foreground);
  }
  .disabled\:pointer-events-none:disabled {
    pointer-events: none;
  }
  .disabled\:cursor-not-allowed:disabled {
    cursor: not-allowed;
  }
  .disabled\:opacity-50:disabled {
    opacity: .5;
  }
  :where([data-side=left]) .in-data-\[side\=left\]\:cursor-w-resize {
    cursor: w-resize;
  }
  :where([data-side=right]) .in-data-\[side\=right\]\:cursor-e-resize {
    cursor: e-resize;
  }
  .has-data-\[variant\=inset\]\:bg-sidebar:has([data-variant=inset]) {
    background-color: var(--sidebar);
  }
  .has-data-checked\:border-primary\/30:has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
    border-color: var(--primary);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .has-data-checked\:border-primary\/30:has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
      border-color: color-mix(in oklab, var(--primary) 30%, transparent);
    }
  }
  .has-data-checked\:bg-primary\/5:has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
    background-color: var(--primary);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .has-data-checked\:bg-primary\/5:has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
      background-color: color-mix(in oklab, var(--primary) 5%, transparent);
    }
  }
  .has-\[div\[data-layout\=fixed\]\]\:h-svh:has(:is(div[data-layout=fixed])) {
    height: 100svh;
  }
  .has-\[\>\[data-slot\=checkbox-group\]\]\:gap-3:has(> [data-slot=checkbox-group]) {
    gap: calc(var(--spacing) * 3);
  }
  .has-\[\>\[data-slot\=field-content\]\]\:items-start:has(> [data-slot=field-content]) {
    align-items: flex-start;
  }
  .has-\[\>\[data-slot\=field\]\]\:w-full:has(> [data-slot=field]) {
    width: 100%;
  }
  .has-\[\>\[data-slot\=field\]\]\:flex-col:has(> [data-slot=field]) {
    flex-direction: column;
  }
  .has-\[\>\[data-slot\=field\]\]\:rounded-md:has(> [data-slot=field]) {
    border-radius: var(--dx-radius-control);
  }
  .has-\[\>\[data-slot\=field\]\]\:border:has(> [data-slot=field]) {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .has-\[\>\[data-slot\=radio-group\]\]\:gap-3:has(> [data-slot=radio-group]) {
    gap: calc(var(--spacing) * 3);
  }
  .aria-disabled\:pointer-events-none[aria-disabled=true] {
    pointer-events: none;
  }
  .aria-disabled\:opacity-50[aria-disabled=true] {
    opacity: .5;
  }
  .data-\[active\=true\]\:bg-sidebar-accent[data-active=true] {
    background-color: var(--sidebar-accent);
  }
  .data-\[active\=true\]\:font-medium[data-active=true] {
    --tw-font-weight:var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .data-\[active\=true\]\:text-sidebar-accent-foreground[data-active=true] {
    color: var(--sidebar-accent-foreground);
  }
  .data-\[disabled\=true\]\:pointer-events-none[data-disabled=true] {
    pointer-events: none;
  }
  .data-\[disabled\=true\]\:opacity-50[data-disabled=true] {
    opacity: .5;
  }
  .data-\[invalid\=true\]\:text-destructive[data-invalid=true] {
    color: var(--destructive);
  }
  .data-\[selected\=true\]\:bg-accent[data-selected=true] {
    background-color: var(--accent);
  }
  .data-\[selected\=true\]\:text-accent-foreground[data-selected=true] {
    color: var(--accent-foreground);
  }
  .data-\[side\=bottom\]\:translate-y-1[data-side=bottom] {
    --tw-translate-y:var(--spacing);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom] {
    --tw-enter-translate-y:calc(2*var(--spacing)*-1);
  }
  .data-\[side\=left\]\:-translate-x-1[data-side=left] {
    --tw-translate-x:calc(var(--spacing) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-\[side\=left\]\:slide-in-from-right-2[data-side=left] {
    --tw-enter-translate-x:calc(2*var(--spacing));
  }
  .data-\[side\=right\]\:translate-x-1[data-side=right] {
    --tw-translate-x:var(--spacing);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-\[side\=right\]\:slide-in-from-left-2[data-side=right] {
    --tw-enter-translate-x:calc(2*var(--spacing)*-1);
  }
  .data-\[side\=top\]\:-translate-y-1[data-side=top] {
    --tw-translate-y:calc(var(--spacing) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top] {
    --tw-enter-translate-y:calc(2*var(--spacing));
  }
  .data-\[slot\=checkbox-group\]\:gap-3[data-slot=checkbox-group] {
    gap: calc(var(--spacing) * 3);
  }
  :is(.\*\:data-\[slot\=field\]\:p-3 > *)[data-slot=field] {
    padding: calc(var(--spacing) * 3);
  }
  :is(.\*\:data-\[slot\=field-group\]\:gap-4 > *)[data-slot=field-group] {
    gap: calc(var(--spacing) * 4);
  }
  :is(.\*\:data-\[slot\=field-label\]\:flex-auto > *)[data-slot=field-label] {
    flex: auto;
  }
  .data-\[state\=checked\]\:translate-x-4[data-state=checked] {
    --tw-translate-x:calc(var(--spacing) * 4);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-\[state\=checked\]\:bg-foreground[data-state=checked] {
    background-color: var(--foreground);
  }
  .data-\[state\=checked\]\:text-background[data-state=checked] {
    color: var(--background);
  }
  .data-\[state\=closed\]\:animate-none[data-state=closed] {
    animation: none;
  }
  .data-\[state\=closed\]\:animate-out[data-state=closed] {
    animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
  }
  .data-\[state\=closed\]\:duration-300[data-state=closed] {
    --tw-duration:.3s;
    transition-duration: .3s;
  }
  .data-\[state\=closed\]\:fade-out-0[data-state=closed] {
    --tw-exit-opacity:0;
  }
  .data-\[state\=closed\]\:zoom-out-95[data-state=closed] {
    --tw-exit-scale:.95;
  }
  .data-\[state\=closed\]\:slide-out-to-bottom[data-state=closed] {
    --tw-exit-translate-y:100%;
  }
  .data-\[state\=closed\]\:slide-out-to-left[data-state=closed] {
    --tw-exit-translate-x:-100%;
  }
  .data-\[state\=closed\]\:slide-out-to-left-1\/2[data-state=closed] {
    --tw-exit-translate-x:calc(1 / 2*-100%);
  }
  .data-\[state\=closed\]\:slide-out-to-right[data-state=closed] {
    --tw-exit-translate-x:100%;
  }
  .data-\[state\=closed\]\:slide-out-to-top[data-state=closed] {
    --tw-exit-translate-y:-100%;
  }
  .data-\[state\=closed\]\:slide-out-to-top-\[48\%\][data-state=closed] {
    --tw-exit-translate-y:calc(48%*-1);
  }
  .data-\[state\=open\]\:animate-in[data-state=open] {
    animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
  }
  .data-\[state\=open\]\:animate-none[data-state=open] {
    animation: none;
  }
  .data-\[state\=open\]\:bg-accent[data-state=open] {
    background-color: var(--accent);
  }
  .data-\[state\=open\]\:bg-secondary[data-state=open] {
    background-color: var(--secondary);
  }
  .data-\[state\=open\]\:bg-sidebar-accent[data-state=open] {
    background-color: var(--sidebar-accent);
  }
  .data-\[state\=open\]\:text-muted-foreground[data-state=open] {
    color: var(--muted-foreground);
  }
  .data-\[state\=open\]\:text-sidebar-accent-foreground[data-state=open] {
    color: var(--sidebar-accent-foreground);
  }
  .data-\[state\=open\]\:opacity-100[data-state=open] {
    opacity: 1;
  }
  .data-\[state\=open\]\:duration-500[data-state=open] {
    --tw-duration:.5s;
    transition-duration: .5s;
  }
  .data-\[state\=open\]\:fade-in-0[data-state=open] {
    --tw-enter-opacity:0;
  }
  .data-\[state\=open\]\:zoom-in-95[data-state=open] {
    --tw-enter-scale:.95;
  }
  .data-\[state\=open\]\:slide-in-from-bottom[data-state=open] {
    --tw-enter-translate-y:100%;
  }
  .data-\[state\=open\]\:slide-in-from-left[data-state=open] {
    --tw-enter-translate-x:-100%;
  }
  .data-\[state\=open\]\:slide-in-from-left-1\/2[data-state=open] {
    --tw-enter-translate-x:calc(1 / 2*-100%);
  }
  .data-\[state\=open\]\:slide-in-from-right[data-state=open] {
    --tw-enter-translate-x:100%;
  }
  .data-\[state\=open\]\:slide-in-from-top[data-state=open] {
    --tw-enter-translate-y:-100%;
  }
  .data-\[state\=open\]\:slide-in-from-top-\[48\%\][data-state=open] {
    --tw-enter-translate-y:calc(48%*-1);
  }
  @media (hover: hover) {
    .data-\[state\=open\]\:hover\:bg-sidebar-accent[data-state=open]:hover {
      background-color: var(--sidebar-accent);
    }
    .data-\[state\=open\]\:hover\:text-sidebar-accent-foreground[data-state=open]:hover {
      color: var(--sidebar-accent-foreground);
    }
  }
  .data-\[state\=selected\]\:bg-accent[data-state=selected] {
    background-color: var(--accent);
  }
  .data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked] {
    --tw-translate-x:0px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .data-\[state\=unchecked\]\:bg-input[data-state=unchecked] {
    background-color: var(--input);
  }
  .data-\[variant\=destructive\]\:text-destructive[data-variant=destructive] {
    color: var(--destructive);
  }
  .data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus {
    background-color: var(--destructive);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus {
      background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    }
  }
  .data-\[variant\=destructive\]\:focus\:text-destructive[data-variant=destructive]:focus {
    color: var(--destructive);
  }
  .data-\[variant\=label\]\:text-\[10px\][data-variant=label] {
    font-size: 10px;
  }
  .data-\[variant\=label\]\:leading-\[1\.2\][data-variant=label] {
    --tw-leading:1.2;
    line-height: 1.2;
  }
  .data-\[variant\=label\]\:font-bold[data-variant=label] {
    --tw-font-weight:var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }
  .data-\[variant\=label\]\:tracking-\[0\.08em\][data-variant=label] {
    --tw-tracking:.08em;
    letter-spacing: .08em;
  }
  .data-\[variant\=label\]\:text-foreground-faint[data-variant=label] {
    color: var(--dx-text-faint);
  }
  .data-\[variant\=label\]\:uppercase[data-variant=label] {
    text-transform: uppercase;
  }
  .data-\[variant\=legend\]\:text-base[data-variant=legend] {
    font-size: var(--text-base);
    line-height: var(--tw-leading,var(--text-base--line-height));
  }
  .data-\[variant\=legend\]\:font-medium[data-variant=legend] {
    --tw-font-weight:var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .nth-last-2\:-mt-1:nth-last-child(2) {
    margin-top: calc(var(--spacing) * -1);
  }
  @media (min-width: 40rem) {
    .sm\:mt-0 {
      margin-top: 0;
    }
    .sm\:flex {
      display: flex;
    }
    .sm\:max-w-lg {
      max-width: var(--container-lg);
    }
    .sm\:max-w-sm {
      max-width: var(--container-sm);
    }
    .sm\:flex-row {
      flex-direction: row;
    }
    .sm\:justify-end {
      justify-content: flex-end;
    }
    .sm\:gap-3 {
      gap: calc(var(--spacing) * 3);
    }
    :where(.sm\:space-x-2 > :not(:last-child)) {
      --tw-space-x-reverse:0;
      margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
      margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
    }
    .sm\:rounded-lg {
      border-radius: var(--radius);
    }
    .sm\:p-6 {
      padding: calc(var(--spacing) * 6);
    }
    .sm\:px-6 {
      padding-inline: calc(var(--spacing) * 6);
    }
    .sm\:text-left {
      text-align: left;
    }
  }
  @media (min-width: 48rem) {
    .md\:block {
      display: block;
    }
    .md\:flex {
      display: flex;
    }
    .md\:text-sm {
      font-size: var(--text-sm);
      line-height: var(--tw-leading,var(--text-sm--line-height));
    }
    .md\:opacity-0 {
      opacity: 0;
    }
    .md\:peer-data-\[variant\=inset\]\:m-2:is(:where(.peer)[data-variant=inset] ~ *) {
      margin: calc(var(--spacing) * 2);
    }
    .md\:peer-data-\[variant\=inset\]\:ml-0:is(:where(.peer)[data-variant=inset] ~ *) {
      margin-left: 0;
    }
    .md\:peer-data-\[variant\=inset\]\:rounded-xl:is(:where(.peer)[data-variant=inset] ~ *) {
      border-radius: var(--dx-radius-panel);
    }
    .md\:peer-data-\[variant\=inset\]\:peer-data-\[state\=collapsed\]\:ml-2:is(:where(.peer)[data-variant=inset] ~ *):is(:where(.peer)[data-state=collapsed] ~ *) {
      margin-left: calc(var(--spacing) * 2);
    }
    .md\:after\:hidden:after {
      content: var(--tw-content);
      display: none;
    }
  }
  @container field-group (min-width:28rem) {
    .\@md\/field-group\:flex-row {
      flex-direction: row;
    }
    .\@md\/field-group\:items-center {
      align-items: center;
    }
    :is(.\@md\/field-group\:\*\:w-auto > *) {
      width: auto;
    }
    .\@md\/field-group\:has-\[\>\[data-slot\=field-content\]\]\:items-start:has(> [data-slot=field-content]) {
      align-items: flex-start;
    }
    :is(.\@md\/field-group\:\*\:data-\[slot\=field-label\]\:flex-auto > *)[data-slot=field-label] {
      flex: auto;
    }
  }
  .dark\:border-destructive:is(.dark *) {
    border-color: var(--destructive);
  }
  .dark\:has-data-checked\:border-primary\/20:is(.dark *):has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
    border-color: var(--primary);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .dark\:has-data-checked\:border-primary\/20:is(.dark *):has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
      border-color: color-mix(in oklab, var(--primary) 20%, transparent);
    }
  }
  .dark\:has-data-checked\:bg-primary\/10:is(.dark *):has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
    background-color: var(--primary);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .dark\:has-data-checked\:bg-primary\/10:is(.dark *):has(:where([data-state=checked]), :where([data-checked]:not([data-checked=false]))) {
      background-color: color-mix(in oklab, var(--primary) 10%, transparent);
    }
  }
  .dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20:is(.dark *)[data-variant=destructive]:focus {
    background-color: var(--destructive);
  }
  @supports (color:color-mix(in lab, red, red)) {
    .dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20:is(.dark *)[data-variant=destructive]:focus {
      background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
    }
  }
  .data-disabled\:pointer-events-none:where([data-disabled=true]),
  .data-disabled\:pointer-events-none:where([data-disabled]:not([data-disabled=false])) {
    pointer-events: none;
  }
  .data-disabled\:opacity-50:where([data-disabled=true]),
  .data-disabled\:opacity-50:where([data-disabled]:not([data-disabled=false])) {
    opacity: .5;
  }
  .\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading] {
    padding-inline: calc(var(--spacing) * 2);
  }
  .\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading] {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
    font-size: var(--text-xs);
    line-height: var(--tw-leading,var(--text-xs--line-height));
  }
  .\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading] {
    --tw-font-weight:var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading] {
    color: var(--muted-foreground);
  }
  .\[\&_\[cmdk-group\]\]\:px-2 [cmdk-group] {
    padding-inline: calc(var(--spacing) * 2);
  }
  .\[\&_\[cmdk-group\]\:not\(\[hidden\]\)_\~\[cmdk-group\]\]\:pt-0 [cmdk-group]:not([hidden]) ~ [cmdk-group] {
    padding-top: 0;
  }
  .\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg {
    height: calc(var(--spacing) * 5);
  }
  .\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg {
    width: calc(var(--spacing) * 5);
  }
  .\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input] {
    height: calc(var(--spacing) * 12);
  }
  .\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item] {
    padding-inline: calc(var(--spacing) * 2);
  }
  .\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item] {
    padding-block: calc(var(--spacing) * 3);
  }
  .\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg {
    height: calc(var(--spacing) * 5);
  }
  .\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg {
    width: calc(var(--spacing) * 5);
  }
  .\[\&_p\]\:leading-relaxed p {
    --tw-leading:var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }
  .\[\&_svg\]\:pointer-events-none svg {
    pointer-events: none;
  }
  .\[\&_svg\]\:size-3 svg {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }
  .\[\&_svg\]\:size-4 svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .\[\&_svg\]\:shrink-0 svg {
    flex-shrink: 0;
  }
  .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .\[\&_tr\]\:border-b tr {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .\[\&_tr\]\:border-border tr {
    border-color: var(--border);
  }
  .\[\&_tr\:last-child\]\:border-0 tr:last-child {
    border-style: var(--tw-border-style);
    border-width: 0;
  }
  .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
    padding-right: 0;
  }
  :is(.data-\[variant\=destructive\]\:\*\:\[svg\]\:\!text-destructive[data-variant=destructive] > *):is(svg) {
    color: var(--destructive) !important;
  }
  .\[\&\>\.sr-only\]\:w-auto > .sr-only {
    width: auto;
  }
  .\[\&\>\:not\(span\)\]\:text-sm > :not(span) {
    font-size: var(--text-sm);
    line-height: var(--tw-leading,var(--text-sm--line-height));
  }
  .\[\&\>\:not\(span\)\]\:leading-normal > :not(span) {
    --tw-leading:var(--leading-normal);
    line-height: var(--leading-normal);
  }
  .\[\&\>\:not\(span\)\]\:font-normal > :not(span) {
    --tw-font-weight:var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }
  .\[\&\>\:not\(span\)\]\:tracking-normal > :not(span) {
    --tw-tracking:var(--tracking-normal);
    letter-spacing: var(--tracking-normal);
  }
  .\[\&\>\:not\(span\)\]\:text-foreground > :not(span) {
    color: var(--foreground);
  }
  .\[\&\>\:not\(span\)\]\:normal-case > :not(span) {
    text-transform: none;
  }
  .\[\&\>\[role\=checkbox\]\]\:translate-y-\[2px\] > [role=checkbox] {
    --tw-translate-y:2px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(> [data-slot=field-content]) > [role=checkbox],
  .has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(> [data-slot=field-content]) [role=radio] {
    margin-top: 1px;
  }
  @container field-group (min-width:28rem) {
    .\@md\/field-group\:has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(> [data-slot=field-content]) > [role=checkbox],
    .\@md\/field-group\:has-\[\>\[data-slot\=field-content\]\]\:\[\&\>\[role\=checkbox\]\,\[role\=radio\]\]\:mt-px:has(> [data-slot=field-content]) [role=radio] {
      margin-top: 1px;
    }
  }
  .\[\&\>a\]\:underline > a {
    text-decoration-line: underline;
  }
  .\[\&\>a\]\:underline-offset-4 > a {
    text-underline-offset: 4px;
  }
  .\[\&\>a\:hover\]\:text-primary > a:hover {
    color: var(--primary);
  }
  .\[\&\>button\]\:text-sidebar-foreground > button {
    color: var(--sidebar-foreground);
  }
  .\[\&\>span\]\:min-w-0 > span {
    min-width: 0;
  }
  .\[\&\>span\]\:truncate > span,
  .\[\&\>span\:last-child\]\:truncate > span:last-child {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .\[\&\>svg\]\:absolute > svg {
    position: absolute;
  }
  .\[\&\>svg\]\:top-4 > svg {
    top: calc(var(--spacing) * 4);
  }
  .\[\&\>svg\]\:left-4 > svg {
    left: calc(var(--spacing) * 4);
  }
  .\[\&\>svg\]\:size-4 > svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }
  .\[\&\>svg\]\:shrink-0 > svg {
    flex-shrink: 0;
  }
  .\[\&\>svg\]\:text-destructive > svg {
    color: var(--destructive);
  }
  .\[\&\>svg\]\:text-foreground > svg {
    color: var(--foreground);
  }
  .\[\&\>svg\]\:text-sidebar-accent-foreground > svg {
    color: var(--sidebar-accent-foreground);
  }
  .\[\&\>svg\+div\]\:translate-y-\[-3px\] > svg + div {
    --tw-translate-y:-3px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .\[\&\>svg\~\*\]\:pl-7 > svg ~ * {
    padding-left: calc(var(--spacing) * 7);
  }
  .last\:\[\&\>tr\]\:border-b-0:last-child > tr {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 0;
  }
  [data-side=left][data-collapsible=offcanvas] .\[\[data-side\=left\]\[data-collapsible\=offcanvas\]_\&\]\:-right-2 {
    right: calc(var(--spacing) * -2);
  }
  [data-side=left][data-state=collapsed] .\[\[data-side\=left\]\[data-state\=collapsed\]_\&\]\:cursor-e-resize {
    cursor: e-resize;
  }
  [data-side=right][data-collapsible=offcanvas] .\[\[data-side\=right\]\[data-collapsible\=offcanvas\]_\&\]\:-left-2 {
    left: calc(var(--spacing) * -2);
  }
  [data-side=right][data-state=collapsed] .\[\[data-side\=right\]\[data-state\=collapsed\]_\&\]\:cursor-w-resize {
    cursor: w-resize;
  }
  [data-variant=legend] + .\[\[data-variant\=legend\]\+\&\]\:-mt-1\.5 {
    margin-top: calc(var(--spacing) * -1.5);
  }
}
@property --tw-animation-delay { syntax:"*";inherits:false;initial-value:0s }
@property --tw-animation-direction { syntax:"*";inherits:false;initial-value:normal }
@property --tw-animation-duration { syntax:"*";inherits:false }
@property --tw-animation-fill-mode { syntax:"*";inherits:false;initial-value:none }
@property --tw-animation-iteration-count { syntax:"*";inherits:false;initial-value:1 }
@property --tw-enter-blur { syntax:"*";inherits:false;initial-value:0 }
@property --tw-enter-opacity { syntax:"*";inherits:false;initial-value:1 }
@property --tw-enter-rotate { syntax:"*";inherits:false;initial-value:0 }
@property --tw-enter-scale { syntax:"*";inherits:false;initial-value:1 }
@property --tw-enter-translate-x { syntax:"*";inherits:false;initial-value:0 }
@property --tw-enter-translate-y { syntax:"*";inherits:false;initial-value:0 }
@property --tw-exit-blur { syntax:"*";inherits:false;initial-value:0 }
@property --tw-exit-opacity { syntax:"*";inherits:false;initial-value:1 }
@property --tw-exit-rotate { syntax:"*";inherits:false;initial-value:0 }
@property --tw-exit-scale { syntax:"*";inherits:false;initial-value:1 }
@property --tw-exit-translate-x { syntax:"*";inherits:false;initial-value:0 }
@property --tw-exit-translate-y { syntax:"*";inherits:false;initial-value:0 }
:root {
  --dx-icon-stroke-width:2;
  --dx-icon-size-nav:18px;
  --dx-icon-size-control:16px;
  color-scheme: light;
  --dx-white:#fff;
  --dx-snow:#f4f5f6;
  --dx-midnight:#000;
  --dx-ink:#0e0f0f;
  --dx-ink-2:#1a1b1b;
  --dx-ink-3:#2a2b2b;
  --dx-gray:#9a9d9d;
  --dx-charge:#c8ff00;
  --dx-resolve:#00e5a0;
  --dx-coherence:#59acff;
  --dx-ignition:#ff6835;
  --dx-corona:#ffef5b;
  --dx-verve:#c482ff;
  --dx-radiant:#ff5b7c;
  --dx-liftoff:var(--dx-radiant);
  --dx-active:var(--dx-charge);
  --dx-success:var(--dx-resolve);
  --dx-info:var(--dx-coherence);
  --dx-warning:var(--dx-ignition);
  --dx-error:var(--dx-radiant);
  --dx-focus:var(--dx-midnight);
  --dx-icon:var(--dx-midnight);
  --dx-font-display:"Instrument Serif",
    Georgia,
    "Times New Roman",
    serif;
  --dx-font-sans:"Roboto",
    ui-sans-serif,
    system-ui,
    -apple-system,
    "Segoe UI",
    sans-serif;
  --dx-space-1:4px;
  --dx-space-2:8px;
  --dx-space-3:12px;
  --dx-space-4:24px;
  --dx-space-5:32px;
  --dx-space-6:48px;
  --dx-space-7:120px;
  --dx-radius-panel:10px;
  --dx-radius-control:7px;
  --dx-radius-button:999px;
  --dx-radius-tag:2px;
  --dx-control-height-compact:28px;
  --dx-control-height-default:36px;
  --dx-control-padding-inline:10px;
  --dx-focus-width:2px;
  --dx-button-border-width:1.5px;
  --dx-button-border-width-hover:2.5px;
  --dx-field-focus-width:2.5px;
  --dx-motion-fast:.15s;
  --dx-motion-standard:.2s;
  --dx-motion-maximum:.3s;
  --dx-motion-theme-wipe:.75s;
  --dx-ease-out:cubic-bezier(.16, 1, .3, 1);
  --dx-ease-theme-wipe:cubic-bezier(.65, 0, .35, 1);
  --dx-max-width:1200px;
  --dx-gutter:48px;
  --dx-grid-gap:24px;
  --dx-bg:var(--dx-snow);
  --dx-surface:var(--dx-white);
  --dx-surface-raised:var(--dx-white);
  --dx-surface-inset:#e9ebed;
  --dx-text:var(--dx-ink);
  --dx-text-soft:#555b60;
  --dx-text-faint:#6b7176;
  --dx-border:#00000024;
  --dx-border-soft:#00000014;
  --dx-active-bg:var(--dx-ink);
  --dx-active-text:var(--dx-white);
  --dx-hover:#0000000a;
  --dx-success-ink:#047857;
  --dx-warning-ink:#a83b0b;
  --dx-error-ink:#c81e3c;
  --dx-info-ink:#1d4ed8;
  --font-sans:var(--dx-font-sans);
  --font-display:var(--dx-font-sans);
  --font-mono:ui-monospace,
    "SFMono-Regular",
    Menlo,
    Consolas,
    monospace;
  --background:var(--dx-bg);
  --foreground:var(--dx-text);
  --card:var(--dx-surface);
  --card-foreground:var(--dx-text);
  --popover:var(--dx-surface-raised);
  --popover-foreground:var(--dx-text);
  --primary:var(--dx-active-bg);
  --primary-foreground:var(--dx-active-text);
  --secondary:var(--dx-surface-inset);
  --secondary-foreground:var(--dx-text);
  --muted:var(--dx-surface-inset);
  --muted-foreground:var(--dx-text-soft);
  --accent:var(--dx-hover);
  --accent-foreground:var(--dx-text);
  --destructive:var(--dx-error-ink);
  --destructive-foreground:var(--dx-white);
  --border:var(--dx-border);
  --input:var(--dx-border);
  --ring:var(--dx-text);
  --radius:var(--dx-radius-panel);
  --sidebar:var(--dx-surface);
  --sidebar-background:var(--dx-surface);
  --sidebar-foreground:var(--dx-text);
  --sidebar-primary:var(--dx-charge);
  --sidebar-primary-foreground:var(--dx-midnight);
  --sidebar-accent:var(--dx-hover);
  --sidebar-accent-foreground:var(--dx-text);
  --sidebar-border:var(--dx-border);
  --sidebar-ring:var(--dx-focus);
  --success:var(--dx-success-ink);
  --warning:var(--dx-warning-ink);
  --info:var(--dx-info-ink);
  --sidebar-width:16rem;
  --sidebar-width-icon:3rem;
  --dx-font-mono:var(--dx-font-sans);
  --dx-type-caption:400 .6875rem/1.45 var(--dx-font-sans);
  --dx-type-compact-label:700 .625rem/1.2 var(--dx-font-sans);
  --dx-type-interface-label:700 .6875rem/1.2 var(--dx-font-sans);
  --dx-type-compact-body:400 .8125rem/1.45 var(--dx-font-sans);
  --dx-type-body:400 .875rem/1.5 var(--dx-font-sans);
  --dx-type-body-large:400 1rem/1.6 var(--dx-font-sans);
  --dx-type-data-value:500 .875rem/1.4 var(--dx-font-sans);
  --dx-type-metric-value:700 1.75rem/1.1 var(--dx-font-sans);
  --dx-type-table-value:400 .8125rem/1.4 var(--dx-font-sans);
  --dx-type-section-title:700 1rem/1.25 var(--dx-font-sans);
  --dx-type-page-title:700 1.375rem/1.2 var(--dx-font-sans);
  --dx-type-display-title:400 clamp(2.25rem, 5vw, 3.5rem) / 1.02 var(--dx-font-display);
  --dx-hit-pointer-compact:28px;
  --dx-hit-pointer-default:36px;
  --dx-hit-touch:44px;
  --dx-touch-gap:8px;
  --dx-chart-selection:var(--dx-active);
  --dx-adaptive-contrast-border-width:2px;
  --dx-adaptive-text-scale:2;
  --dx-forced-color-canvas:Canvas;
  --dx-forced-color-canvas-text:CanvasText;
  --dx-forced-color-highlight:Highlight;
  --dx-forced-color-highlight-text:HighlightText;
  --dx-reduced-transparency-surface-light:#fff;
  --dx-reduced-transparency-surface-dark:#0e0f0f;
  --dx-reduced-transparency-border-light:#9a9d9d;
  --dx-reduced-transparency-border-dark:#fff;
  --dx-root-scrollbar-gutter:0px;
  --dx-focus-companion:var(--dx-ink);
  --dx-chart-plot-background:var(--dx-surface);
  --dx-chart-mark-primary:var(--dx-ink);
  --dx-chart-mark-comparison:#555b60;
  --dx-chart-mark-muted:var(--dx-gray);
  --dx-chart-axis-label:#6b7176;
  --dx-chart-grid-major:#00000024;
  --dx-chart-grid-minor:#00000014;
  --dx-chart-reference-line:#555b60;
  --dx-chart-threshold-line:var(--dx-ink);
  --dx-chart-hover:#0000000a;
  --dx-chart-annotation-text:#555b60;
  --dx-chart-annotation-connector:#00000047;
  --dx-chart-missing-data:var(--dx-ink);
  --dx-chart-estimated-data:#555b60;
  --dx-chart-uncertainty-range:#0000001a;
  --dx-chart-change-positive:var(--dx-success-ink);
  --dx-chart-change-neutral:#6b7176;
  --dx-chart-change-negative:var(--dx-error-ink);
}
.dark {
  color-scheme: dark;
  --dx-bg:var(--dx-midnight);
  --dx-surface:var(--dx-ink);
  --dx-surface-raised:var(--dx-ink-2);
  --dx-surface-inset:var(--dx-ink-3);
  --dx-text:var(--dx-white);
  --dx-text-soft:#ffffffad;
  --dx-text-faint:#ffffff8f;
  --dx-border:#ffffff24;
  --dx-border-soft:#ffffff14;
  --dx-active-bg:var(--dx-white);
  --dx-active-text:var(--dx-midnight);
  --dx-hover:#ffffff0f;
  --dx-success-ink:var(--dx-resolve);
  --dx-warning-ink:var(--dx-ignition);
  --dx-error-ink:var(--dx-liftoff);
  --destructive-foreground:var(--dx-midnight);
  --dx-info-ink:var(--dx-coherence);
  --sidebar-accent:var(--dx-hover);
  --sidebar-border:var(--dx-border);
  --dx-focus-companion:var(--dx-white);
  --dx-focus:var(--dx-white);
  --dx-icon:var(--dx-white);
  --dx-chart-plot-background:var(--dx-surface);
  --dx-chart-mark-primary:var(--dx-white);
  --dx-chart-mark-comparison:#ffffffad;
  --dx-chart-mark-muted:#ffffff5c;
  --dx-chart-axis-label:#ffffff8f;
  --dx-chart-grid-major:#ffffff24;
  --dx-chart-grid-minor:#ffffff14;
  --dx-chart-reference-line:#ffffffad;
  --dx-chart-threshold-line:var(--dx-white);
  --dx-chart-hover:#ffffff0f;
  --dx-chart-annotation-text:#ffffffad;
  --dx-chart-annotation-connector:#ffffff47;
  --dx-chart-missing-data:var(--dx-white);
  --dx-chart-estimated-data:#ffffffad;
  --dx-chart-uncertainty-range:#ffffff1f;
  --dx-chart-change-positive:var(--dx-success-ink);
  --dx-chart-change-neutral:#ffffff8f;
  --dx-chart-change-negative:var(--dx-error-ink);
}
.dx-app-title,
.dx-app-section-title {
  font: var(--dx-type-section-title);
}
.dx-app-title {
  font: var(--dx-type-page-title);
}
.dx-app-section-title {
  font: var(--dx-type-section-title);
}
.dx-label {
  color: var(--dx-text-faint);
  font-family: var(--dx-font-sans);
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
}
:is(input:not([type=checkbox], [type=radio], [type=file], [type=range], [type=color], [type=button], [type=submit], [type=reset], [cmdk-input]), select, textarea, [data-slot=select-trigger]):focus-visible {
  border-color: var(--dx-text);
  outline: var(--dx-field-focus-width) solid var(--dx-text);
  outline: var(--dx-focus-width) solid var(--dx-focus);
  outline-offset: 2px;
  box-shadow: none;
}
.skip-link {
  z-index: 100;
  border: 1px solid var(--dx-text);
  border-radius: var(--dx-radius-button);
  background: var(--dx-surface-raised);
  color: var(--dx-text);
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 8px 12px;
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
  position: absolute;
  top: -100%;
  left: 12px;
}
.skip-link:focus {
  top: 12px;
}
[data-tone=charge] {
  --tone:var(--dx-charge);
  --tone-ink:var(--dx-ink);
}
[data-tone=resolve] {
  --tone:var(--dx-resolve);
  --tone-ink:var(--dx-success-ink);
}
[data-tone=coherence] {
  --tone:var(--dx-coherence);
  --tone-ink:var(--dx-info-ink);
}
[data-tone=ignition] {
  --tone:var(--dx-ignition);
  --tone-ink:var(--dx-warning-ink);
}
[data-tone=corona] {
  --tone:var(--dx-corona);
  --tone-ink:var(--dx-ink);
}
[data-tone=verve] {
  --tone:var(--dx-verve);
  --tone-ink:var(--dx-ink);
}
[data-tone=radiant],
[data-tone=liftoff] {
  --tone:var(--dx-radiant);
  --tone-ink:var(--dx-error-ink);
}
[data-tone=neutral] {
  --tone:var(--dx-border);
  --tone-ink:var(--dx-text-soft);
}
.dark [data-tone=charge],
.dark [data-tone=corona],
.dark [data-tone=verve] {
  --tone-ink:var(--tone);
}
.df-status {
  border-color: var(--tone);
  color: var(--dx-text);
  background: 0 0;
}
.df-status:before {
  background: var(--tone);
  content: "";
  border-radius: 50%;
  flex: none;
  width: 6px;
  height: 6px;
  translate: 0 -1px;
}
.df-status[data-tone=neutral]:before {
  background: var(--dx-text-soft);
}
.df-alert {
  border-color: var(--tone);
  border-left-width: 4px;
}
@keyframes portal-loading-pulse {
  0%, to {
    opacity: .2;
  }
  50% {
    opacity: 1;
  }
}
.loading-dot {
  animation: 1.2s ease-in-out infinite portal-loading-pulse;
}
@media (prefers-reduced-motion: reduce) {
  .loading-dot {
    animation: none;
  }
}
@media (max-width: 640px), (pointer: coarse) {
  [data-slot=button]:not([data-sidebar]),
  [data-slot=input],
  [data-slot=native-select],
  [data-slot=select-trigger],
  [data-slot=alert-dialog-action],
  [data-slot=alert-dialog-cancel] {
    height: auto;
    min-height: 44px;
  }
  [data-slot=input],
  [data-slot=native-select],
  [data-slot=select-trigger],
  [data-slot=textarea] {
    font-size: 16px;
  }
}
@media (max-width: 767px), (pointer: coarse) {
  [data-sidebar=menu-button],
  [data-sidebar=menu-sub-button],
  [data-slot=dropdown-menu-item] {
    min-height: 44px;
  }
}
[data-sidebar=sidebar] .df-brand-image {
  filter: none;
}
.dark [data-sidebar=sidebar] .df-brand-image {
  filter: invert();
}
[data-mobile=true][data-sidebar=sidebar] {
  --sidebar-width:18rem;
}
@media (prefers-reduced-motion: reduce) {
  .CollapsibleContent,
  [data-slot=dialog-content],
  [data-slot=dialog-overlay] {
    transition: none !important;
    animation: none !important;
  }
}
@font-face {
  font-family: Instrument Serif;
  src: url("./assets/instrument-serif-400-5BZOH4SR.woff2")format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Roboto;
  src: url("./assets/roboto-400-LOX3CHMS.woff2")format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Roboto;
  src: url("./assets/roboto-500-D6YDQ3CR.woff2")format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Roboto;
  src: url("./assets/roboto-700-RWHNXSGO.woff2")format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
:root {
  --font-instrument-serif:"Instrument Serif";
  --font-roboto:"Roboto";
}
.dx-app-card {
  border: 1px solid var(--dx-border);
  border-radius: var(--dx-radius-panel);
  background: var(--dx-surface);
  min-inline-size: 0;
  color: var(--dx-text);
  align-items: center;
  gap: 24px;
  padding: 16px 24px;
  display: flex;
  position: relative;
}
.dx-app-card__art {
  object-fit: contain;
  flex: 0 0 104px;
  block-size: 104px;
  inline-size: 104px;
  display: block;
}
.dx-app-card__copy {
  justify-items: start;
  gap: 10.68px;
  min-inline-size: 0;
  display: grid;
}
.dx-app-card h2 {
  font: var(--dx-type-section-title);
  margin: 0;
  font-size: 1.288rem;
  line-height: 1.25;
}
.dx-app-card__title {
  appearance: none;
  min-block-size: 28px;
  max-inline-size: 100%;
  color: inherit;
  font: inherit;
  text-align: start;
  text-transform: none;
  letter-spacing: normal;
  overflow-wrap: anywhere;
  cursor: help;
  background: 0 0;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
  display: inline-block;
}
.dx-app-card__title:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 4px;
}
.dx-app-card__tooltip {
  border: 1px solid var(--dx-border);
  border-radius: var(--dx-radius-panel);
  background: var(--dx-surface);
  color: var(--dx-text);
  font: var(--dx-type-compact-body);
  text-transform: none;
  letter-spacing: normal;
  overflow-wrap: anywhere;
  z-index: 60;
  max-inline-size: min(24rem, 100vw - 32px);
  margin: 0;
  padding: 10px 12px;
}
@media (max-width: 700px) {
  .dx-app-card__art {
    flex-basis: 88px;
    block-size: 88px;
    inline-size: 88px;
  }
}
@media (pointer: coarse) {
  .dx-app-card__title {
    min-block-size: 44px;
  }
}
@media (forced-colors: active) {
  .dx-app-card,
  .dx-app-card__tooltip {
    color: canvastext;
    background: canvas;
    border-color: canvastext;
  }
}
.dx-app-card__art > :where(img, svg) {
  object-fit: contain;
  block-size: 100%;
  inline-size: 100%;
  display: block;
}
@media (prefers-reduced-motion: reduce) {
  .dx-app-card__tooltip {
    transition: none;
    animation: none;
  }
}
@property --tw-translate-x { syntax:"*";inherits:false;initial-value:0 }
@property --tw-translate-y { syntax:"*";inherits:false;initial-value:0 }
@property --tw-translate-z { syntax:"*";inherits:false;initial-value:0 }
@property --tw-space-y-reverse { syntax:"*";inherits:false;initial-value:0 }
@property --tw-border-style { syntax:"*";inherits:false;initial-value:solid }
@property --tw-leading { syntax:"*";inherits:false }
@property --tw-font-weight { syntax:"*";inherits:false }
@property --tw-tracking { syntax:"*";inherits:false }
@property --tw-ordinal { syntax:"*";inherits:false }
@property --tw-slashed-zero { syntax:"*";inherits:false }
@property --tw-numeric-figure { syntax:"*";inherits:false }
@property --tw-numeric-spacing { syntax:"*";inherits:false }
@property --tw-numeric-fraction { syntax:"*";inherits:false }
@property --tw-shadow { syntax:"*";inherits:false;initial-value:0 0 #0000 }
@property --tw-shadow-color { syntax:"*";inherits:false }
@property --tw-shadow-alpha { syntax:"<percentage>";inherits:false;initial-value:100% }
@property --tw-inset-shadow { syntax:"*";inherits:false;initial-value:0 0 #0000 }
@property --tw-inset-shadow-color { syntax:"*";inherits:false }
@property --tw-inset-shadow-alpha { syntax:"<percentage>";inherits:false;initial-value:100% }
@property --tw-ring-color { syntax:"*";inherits:false }
@property --tw-ring-shadow { syntax:"*";inherits:false;initial-value:0 0 #0000 }
@property --tw-inset-ring-color { syntax:"*";inherits:false }
@property --tw-inset-ring-shadow { syntax:"*";inherits:false;initial-value:0 0 #0000 }
@property --tw-ring-inset { syntax:"*";inherits:false }
@property --tw-ring-offset-width { syntax:"<length>";inherits:false;initial-value:0 }
@property --tw-ring-offset-color { syntax:"*";inherits:false;initial-value:#fff }
@property --tw-ring-offset-shadow { syntax:"*";inherits:false;initial-value:0 0 #0000 }
@property --tw-outline-style { syntax:"*";inherits:false;initial-value:solid }
@property --tw-duration { syntax:"*";inherits:false }
@property --tw-ease { syntax:"*";inherits:false }
@property --tw-content { syntax:"*";inherits:false;initial-value:"" }
@property --tw-space-x-reverse { syntax:"*";inherits:false;initial-value:0 }
@keyframes pulse {
  50% {
    opacity: .5;
  }
}
@keyframes enter {
  0% {
    opacity: var(--tw-enter-opacity,1);
    transform: translate3d(var(--tw-enter-translate-x,0), var(--tw-enter-translate-y,0), 0)scale3d(var(--tw-enter-scale,1), var(--tw-enter-scale,1), var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0));
    filter: blur(var(--tw-enter-blur,0));
  }
}
@keyframes exit {
  to {
    opacity: var(--tw-exit-opacity,1);
    transform: translate3d(var(--tw-exit-translate-x,0), var(--tw-exit-translate-y,0), 0)scale3d(var(--tw-exit-scale,1), var(--tw-exit-scale,1), var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0));
    filter: blur(var(--tw-exit-blur,0));
  }
}

/* canvas/src/canvas.css */
html,
body,
#root {
  height: 100%;
  overflow: hidden;
}
body {
  margin: 0;
}
button,
input,
textarea,
select {
  font: inherit;
}
button,
a,
input,
textarea,
select {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
}
:root {
  --canvas-selection-bg:#000;
  --canvas-selection-ink:#fff;
}
:root.dark {
  --canvas-selection-bg:#fff;
  --canvas-selection-ink:#000;
}
::selection {
  background: var(--canvas-selection-bg);
  color: var(--canvas-selection-ink);
}
input,
textarea {
  caret-color: var(--dx-text);
}
* {
  scrollbar-width: thin;
  scrollbar-color: var(--dx-border) transparent;
}
[data-private-portal-shell] {
  height: 100%;
  min-height: 0;
}
[data-private-portal-shell] > div {
  height: 100%;
  min-height: 0;
}
.portal-shell {
  min-height: 0;
}
.portal-shell .workspace-main {
  padding: 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
  min-height: 0;
}
.dx-canvas-app {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--dx-bg);
  color: var(--dx-text);
  font: var(--dx-type-body);
}
.dx-project-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px;
  border-bottom: 1px solid var(--dx-border);
  background: var(--dx-surface);
}
.dx-project-heading {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 16px;
}
.dx-project-heading h1 {
  font: var(--dx-type-page-title);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dx-save-status {
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
  white-space: nowrap;
}
.dx-project-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.dx-workspace-body {
  display: flex;
  flex: 1;
  min-height: 0;
  position: relative;
}
.dx-canvas-center {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
}
.dx-canvas-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--dx-border);
  background: var(--dx-surface);
  overflow-x: auto;
  flex-shrink: 0;
}
.dx-canvas-toolbar > div {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.dx-canvas-toolbar i {
  height: 16px;
  border-left: 1px solid var(--dx-border);
  margin: 0 4px;
}
.dx-canvas-icon {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 7px !important;
  padding: 0 !important;
  color: var(--dx-text) !important;
}
.dx-canvas-icon.is-active {
  background: var(--dx-surface-inset) !important;
  box-shadow: inset 0 0 0 1px var(--dx-border);
}
.dx-zoom-value {
  font: var(--dx-type-compact-body);
  font-variant-numeric: tabular-nums;
  min-width: 48px;
  height: 28px;
}
.dx-stage-wrap {
  display: flex;
  flex: 1;
  min-height: 180px;
  position: relative;
  overflow: hidden;
}
.dx-canvas-stage {
  flex: 1;
  position: relative;
  overflow: hidden;
  touch-action: none;
  outline-offset: -3px;
  background-color: var(--dx-bg);
  background-image: radial-gradient(var(--dx-border) 1px, transparent 1px);
  -webkit-user-select: none;
  user-select: none;
  cursor: grab;
  min-width: 0;
}
.dx-canvas-stage.is-hand,
.dx-canvas-stage.is-moving {
  cursor: grabbing;
}
.dx-canvas-world {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: 0 0;
}
.dx-canvas-node {
  position: absolute;
  cursor: default;
}
.dx-node-label {
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font: var(--dx-type-compact-body);
  padding: 6px 0;
  background: var(--dx-bg);
  color: var(--dx-text-soft);
  white-space: nowrap;
}
.dx-node-label > span {
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}
.dx-node-label small {
  font: var(--dx-type-caption);
}
.dx-node-media {
  height: 100%;
  width: 100%;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid var(--dx-border);
  background-color: var(--dx-surface);
}
.dx-node-media > img,
.dx-node-media > video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}
.dx-node-media > iframe {
  width: 100%;
  height: 100%;
  border: 0;
}
.dx-canvas-node.is-selected .dx-node-media {
  outline: 2px solid var(--dx-text);
  outline-offset: 3px;
}
.dx-node-label.is-selected {
  color: var(--dx-text);
}
.dx-resize-handle {
  position: absolute;
  bottom: -8px;
  right: -8px;
  background: var(--dx-surface);
  border: 1px solid var(--dx-text);
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  cursor: nwse-resize;
  border-radius: 3px;
}
.dx-transparency {
  background-image:
    conic-gradient(
      var(--dx-surface-inset) 25%,
      transparent 0 50%,
      var(--dx-surface-inset) 0 75%,
      transparent 0);
  background-size: 16px 16px;
  background-color: var(--dx-surface);
}
.dx-canvas-empty,
.dx-start {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 16px;
}
.dx-canvas-empty {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: var(--dx-bg);
  padding: 24px;
}
.dx-canvas-empty svg,
.dx-start > svg {
  color: var(--dx-text-soft);
}
.dx-canvas-empty h2 {
  font: var(--dx-type-section-title);
  margin: 0;
}
.dx-canvas-empty p {
  font: var(--dx-type-body);
  color: var(--dx-text-soft);
  line-height: 1.6;
  margin: 0;
}
.dx-canvas-empty > span {
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
}
.dx-start {
  flex: 1;
  padding: 32px;
  max-width: 700px;
  margin: auto;
}
.dx-start h2 {
  font: var(--dx-type-page-title);
}
.dx-start p {
  color: var(--dx-text-soft);
  line-height: 1.6;
  margin-bottom: 8px;
}
.dx-canvas-help {
  position: absolute;
  bottom: 10px;
  left: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
  pointer-events: none;
  background: var(--dx-bg);
  padding: 4px 8px;
  border-radius: 7px;
}
.dx-drop-target {
  position: absolute;
  inset: 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  background: var(--dx-surface);
  border: 2px dashed var(--dx-text);
  border-radius: 10px;
  z-index: 100;
  pointer-events: none;
}
.dx-drop-target span {
  color: var(--dx-text-soft);
  font: var(--dx-type-compact-body);
}
.dx-create-panel {
  background: var(--dx-surface);
  border-top: 1px solid var(--dx-border);
  padding: 12px 24px 10px;
  flex-shrink: 0;
}
.dx-reference-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-bottom: 8px;
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
}
.dx-reference-row > span,
.dx-reference-row label,
.dx-reference-row button {
  display: flex;
  align-items: center;
  gap: 6px;
}
.dx-reference-row button {
  margin-left: auto;
  white-space: nowrap;
}
.dx-reference-row input {
  accent-color: var(--dx-text);
}
.dx-composer {
  display: flex;
  align-items: flex-end;
  gap: 12px;
}
.dx-composer textarea {
  min-width: 0;
  flex: 1;
  width: 0;
  min-height: 58px;
  max-height: 150px;
  resize: vertical;
  font: var(--dx-type-body);
  border-color: var(--dx-border);
  background: var(--dx-bg);
}
.dx-generate {
  height: 38px !important;
  flex-shrink: 0;
  margin-bottom: 2px;
}
.dx-composer-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
}
.dx-composer-options > span {
  margin-right: auto;
}
.dx-composer-options label {
  display: flex;
  align-items: center;
  gap: 6px;
}
.dx-composer-options select {
  border: 0;
  background: var(--dx-surface);
  color: var(--dx-text);
  height: 28px;
}
.dx-inline-help {
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
  margin: 8px 0 0;
}
.dx-inspector {
  width: 300px;
  flex-shrink: 0;
  border-left: 1px solid var(--dx-border);
  background: var(--dx-surface);
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.dx-inspector > header,
.dx-library > header {
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  border-bottom: 1px solid var(--dx-border);
  flex-shrink: 0;
}
.dx-inspector h2,
.dx-library h2 {
  font: var(--dx-type-compact-body);
  font-weight: 700;
  margin: 0;
}
.dx-inspector-scroll {
  overflow: auto;
  flex: 1;
}
.dx-source-detail {
  padding: 16px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-inspector-preview {
  height: 170px;
  display: flex;
  justify-content: center;
  border: 1px solid var(--dx-border);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 12px;
}
.dx-inspector-preview img,
.dx-inspector-preview video {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dx-source-detail h3 {
  font: var(--dx-type-compact-body);
  font-weight: 700;
  overflow-wrap: anywhere;
  margin: 0 0 4px;
}
.dx-source-detail > p {
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
  margin-bottom: 12px;
}
.dx-source-state {
  display: flex;
  align-items: center;
  gap: 6px;
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
}
.dx-inspector-actions {
  display: flex;
  gap: 8px;
  margin-top: 16px;
}
.dx-decision {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.dx-branch-prompt,
.dx-lineage {
  margin-top: 16px;
}
.dx-branch-prompt h4,
.dx-lineage h4 {
  font: var(--dx-type-interface-label);
  margin: 0 0 8px;
  text-transform: uppercase;
}
.dx-branch-prompt p {
  font: var(--dx-type-compact-body);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.dx-lineage button {
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
  font: var(--dx-type-caption);
  width: 100%;
  padding: 6px 0;
}
.dx-lineage span {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-provenance {
  margin-top: 16px;
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
}
.dx-provenance summary {
  cursor: pointer;
}
.dx-provenance p {
  margin-top: 8px;
}
.dx-provenance code,
.dx-provenance pre {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-project-context {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
}
.dx-project-context label {
  font: var(--dx-type-interface-label);
  text-transform: uppercase;
  margin-top: 8px;
}
.dx-project-context textarea {
  min-height: 100px;
  resize: vertical;
  font: var(--dx-type-compact-body);
}
.dx-project-context p {
  font: var(--dx-type-caption);
  line-height: 1.6;
  color: var(--dx-text-soft);
  margin-top: 4px;
}
.dx-project-context input {
  font: var(--dx-type-compact-body);
}
.dx-library {
  width: 248px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  background: var(--dx-surface);
  border-right: 1px solid var(--dx-border);
  z-index: 5;
}
.dx-library h2 span {
  color: var(--dx-text-soft);
  margin-left: 6px;
  font-weight: 400;
}
.dx-library-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 12px;
}
.dx-library-search input {
  min-width: 0;
  font: var(--dx-type-compact-body);
  height: 28px;
}
.dx-library-items {
  overflow: auto;
}
.dx-library-row {
  display: flex;
  align-items: center;
  padding: 4px 8px;
  gap: 2px;
}
.dx-library-row.is-selected {
  background: var(--dx-surface-inset);
}
.dx-library-row > button:first-child {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  text-align: left;
  min-width: 0;
}
.dx-library-row > button:first-child > span:last-child {
  font: var(--dx-type-caption);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-library-row small {
  display: block;
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
}
.dx-library-thumb {
  width: 32px;
  height: 32px;
  background: var(--dx-bg);
  display: grid;
  place-items: center;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 4px;
}
.dx-library-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dx-library .dx-canvas-icon {
  width: 22px !important;
  min-width: 22px !important;
}
.dx-library .dx-canvas-icon svg {
  width: 13px;
}
.dx-file-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  width: 100%;
  padding: 24px;
  background: var(--dx-surface);
  text-align: center;
}
.dx-file-preview strong {
  font: var(--dx-type-body);
  overflow-wrap: anywhere;
}
.dx-file-preview span {
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
}
.dx-file-preview audio {
  max-width: 100%;
  height: 36px;
}
.dx-text-preview {
  white-space: pre-wrap;
  overflow: auto;
  padding: 16px;
  font: var(--dx-type-compact-body);
  height: 100%;
  -webkit-user-select: text;
  user-select: text;
  background: var(--dx-surface);
}
.dx-message {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--dx-surface);
  padding: 6px 16px;
  border-bottom: 1px solid var(--dx-border);
  font: var(--dx-type-compact-body);
}
.dx-message > span {
  flex: 1;
}
.dx-message.is-error {
  color: var(--dx-text);
}
.dx-job-list {
  margin-bottom: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 120px;
  overflow: auto;
}
.dx-job {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font: var(--dx-type-caption);
  border-bottom: 1px solid var(--dx-border);
  padding: 4px 0;
}
.dx-job > span {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.dx-job strong {
  white-space: nowrap;
}
.dx-job > span > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--dx-text-soft);
}
.dx-spin {
  animation: dx-spin 1s linear infinite;
}
@keyframes dx-spin {
  to {
    transform: rotate(360deg);
  }
}
.dx-dialog-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.dx-dialog-form label {
  font: var(--dx-type-interface-label);
  text-transform: uppercase;
}
.dx-dialog-form > button {
  align-self: flex-end;
}
.dx-settings {
  font: var(--dx-type-compact-body);
  line-height: 1.6;
}
.dx-settings h3 {
  font: var(--dx-type-section-title);
  margin: 20px 0 8px;
}
.dx-settings p {
  margin: 8px 0;
}
.dx-comparison-dialog {
  width: calc(100vw - 48px) !important;
  max-width: 1400px !important;
  height: calc(100vh - 64px);
  display: flex !important;
  flex-direction: column;
  gap: 12px !important;
}
.dx-compare-controls {
  display: flex;
  gap: 8px;
}
.dx-compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  flex: 1;
  min-height: 0;
}
.dx-compare-grid[data-count="1"] {
  grid-template-columns: 1fr;
}
.dx-compare-grid > section {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  gap: 8px;
}
.dx-compare-grid h3 {
  font: var(--dx-type-compact-body);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-compare-grid p {
  font: var(--dx-type-caption);
  color: var(--dx-text-soft);
  margin: 0;
}
.dx-compare-scroll {
  flex: 1;
  overflow: auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--dx-border);
  border-radius: 10px;
}
.dx-compare-scroll > img,
.dx-compare-scroll > video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  max-width: none;
}
.dx-compare-scroll > iframe {
  width: 100%;
  height: 100%;
  border: 0;
}
.dx-compare-scroll.is-actual {
  display: block;
}
.dx-compare-scroll.is-actual > img {
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
}
@media (max-width: 1250px) {
  .dx-inspector {
    width: 280px;
  }
  .dx-save-status {
    display: none;
  }
}
@media (max-width: 800px) {
  .dx-project-bar {
    padding: 12px 16px;
  }
  .dx-project-heading h1 {
    font: var(--dx-type-section-title);
  }
  .dx-project-actions > button:last-child span {
    display: none;
  }
  .dx-create-panel {
    padding: 10px 12px;
  }
  .dx-reference-row {
    flex-wrap: wrap;
    gap: 8px;
  }
  .dx-reference-row > button {
    display: none;
  }
  .dx-composer-options {
    flex-wrap: wrap;
    gap: 4px 12px;
  }
  .dx-composer-options > span {
    flex-basis: 100%;
  }
  .dx-canvas-toolbar {
    padding: 6px 8px;
  }
  .dx-library {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 10;
    width: 240px;
  }
  .dx-canvas-help {
    display: none;
  }
  .dx-generate span {
    display: none;
  }
  .dx-generate {
    width: 36px;
    padding: 0 !important;
  }
  .dx-inspector {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 20;
    width: min(320px, 100%);
  }
  .dx-compare-grid {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
  }
  .dx-compare-grid[data-count="1"] {
    grid-template-rows: 1fr;
  }
  .dx-comparison-dialog {
    width: calc(100vw - 24px) !important;
  }
  .dx-start {
    padding: 24px;
  }
  .dx-start h2 {
    font: var(--dx-type-section-title);
  }
}
@media (prefers-reduced-motion: reduce) {
  .dx-spin {
    animation: none;
  }
}
:is(.dx-canvas-app, .dx-scaled-dialog) :is(input:not([type=checkbox], [type=radio], [type=file], [type=range], [type=color], [type=button], [type=submit], [type=reset]), textarea:not(.dx-object-editor), select, [data-slot=select-trigger]):is(:focus, :focus-visible) {
  outline: none;
  box-shadow: none;
}
.dx-prompt-bar > textarea:focus,
.dx-prompt-bar > textarea:focus-visible {
  outline: none;
  border: 0;
  box-shadow: none;
}
.dx-canvas-app .dx-canvas-node.is-selected .dx-node-media {
  outline: none;
}
.dx-title-layer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  contain: strict;
  isolation: isolate;
  pointer-events: none;
  z-index: 8;
}
.dx-node-title {
  position: absolute;
  height: 0;
  pointer-events: none;
}
.dx-node-title > .dx-node-label {
  pointer-events: auto;
}
.dx-selection-layer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  contain: strict;
  isolation: isolate;
  pointer-events: none;
  z-index: 9;
}
.dx-selection-outline {
  position: absolute;
  box-sizing: border-box;
  border: 0;
  color: var(--dx-selection);
  pointer-events: none;
}
.dx-selection-stroke {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  border: 1px solid currentColor;
  pointer-events: none;
}
.dx-selection-handle {
  position: absolute;
  width: 8px;
  height: 8px;
  box-sizing: border-box;
  border: 1px solid var(--dx-selection);
  background: #fff;
  pointer-events: auto;
  z-index: 2;
}
.dx-selection-layer .dx-selection-marquee {
  box-sizing: border-box;
}
.dx-auto-review {
  min-width: 0;
}
.dx-auto-review p {
  overflow-wrap: anywhere;
}
.dx-auto-review label {
  display: grid;
  gap: 6px;
}
.dx-auto-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}
.dx-auto-review ul {
  padding-left: 18px;
}

/* canvas/src/settings-buttons-v1.css */
.dx-app-settings {
  --dx-button-border-width: 1.5px;
  --dx-button-border-width-hover: 2.5px;
}
.dx-app-settings [data-slot=button] {
  --settings-action-height: 36px;
  --settings-action-padding-block: 8px;
  --settings-action-padding-inline: 16px;
  min-width: 0;
  max-width: 100%;
  height: auto;
  min-height: calc(var(--settings-action-height) * var(--canvas-text-scale, 1));
  padding: calc(var(--settings-action-padding-block) * var(--canvas-text-scale, 1)) calc(var(--settings-action-padding-inline) * var(--canvas-text-scale, 1));
  gap: calc(8px * var(--canvas-text-scale, 1));
  border-radius: var(--dx-radius-button, 999px);
  font: 700 calc(10px * var(--canvas-text-scale, 1))/1.2 var(--dx-font-sans);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
}
.dx-app-settings [data-slot=button].h-7,
.dx-app-settings [data-slot=button].size-7 {
  --settings-action-height: 28px;
  --settings-action-padding-block: 4px;
  --settings-action-padding-inline: 12px;
}
.dx-app-settings [data-slot=button].h-10,
.dx-app-settings [data-slot=button].size-10 {
  --settings-action-height: 40px;
  --settings-action-padding-inline: 32px;
}
.dx-app-settings [data-slot=button]:is(.size-7, .size-9, .size-10) {
  width: calc(var(--settings-action-height) * var(--canvas-text-scale, 1));
  padding: 0;
  flex-shrink: 0;
}
.dx-app-settings [data-slot=button] svg {
  width: calc(12px * var(--canvas-text-scale, 1));
  height: calc(12px * var(--canvas-text-scale, 1));
  flex-shrink: 0;
}
.dx-app-settings [data-slot=button].border {
  border-width: var(--dx-button-border-width);
  border-color: var(--dx-text);
}
.dx-app-settings [data-slot=button]:where(.border:hover:not(:disabled)) {
  outline: calc(var(--dx-button-border-width-hover) - var(--dx-button-border-width)) solid var(--dx-text);
  outline-offset: calc(-1 * var(--dx-button-border-width-hover));
}
.dx-app-settings [data-slot=button]:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 2px;
}
.dx-app-settings > header > [data-slot=button] {
  padding-inline: 0;
  justify-content: flex-start;
}

/* canvas/src/workspace-layout-v1.css */
.dark {
  --dx-bg:#0a0b0b;
  --dx-surface:#111419;
  --dx-surface-raised:#181c22;
  --dx-surface-inset:#20242b;
  --dx-text:#f4f5f6;
  --dx-text-soft:#a1a6ae;
  --dx-text-faint:#9299a3;
  --dx-border:rgba(255,255,255,.14);
  --dx-border-soft:rgba(255,255,255,.08);
}
.dx-canvas-app {
  --canvas-highlight:var(--dx-charge);
  position: relative;
  display: block;
  isolation: isolate;
  background: var(--dx-bg);
}
.dx-canvas-stage {
  position: absolute;
  inset: 0;
  z-index: 0;
  isolation: isolate;
  background-size: 40px 40px;
  background-image: radial-gradient(rgba(110, 125, 145, .22) 1px, transparent 1.4px);
}
.dx-canvas-stage:focus,
.dx-canvas-stage:focus-visible {
  outline: none;
  box-shadow: none;
}
.dark .dx-canvas-stage {
  background-image: radial-gradient(rgba(150, 170, 200, .16) 1px, transparent 1.4px);
}
.dx-canvas-world {
  z-index: 0;
}
.dx-node-media {
  border: 0;
  border-radius: 0;
  background: transparent;
}
.dx-node-media.dx-transparency {
  background: none;
}
.dx-canvas-node.is-selected .dx-node-media {
  outline: 1.5px solid var(--canvas-highlight);
  outline-offset: 4px;
}
.dx-node-label {
  background: transparent;
  padding: 0 0 6px;
  gap: 8px;
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 18px;
  font-weight: 400;
  letter-spacing: .02em;
}
.dx-node-label small {
  font-size: calc(11px * var(--canvas-text-scale,1));
  color: var(--dx-text-faint);
}
.dx-canvas-help {
  display: none;
}
.dx-canvas-empty {
  background: transparent;
  gap: 12px;
}
.dx-canvas-empty h2,
.dx-start h2 {
  font: 500 calc(18px * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
}
.dx-canvas-empty p,
.dx-start p {
  font-size: calc(13px * var(--canvas-text-scale,1));
  line-height: 1.6;
  color: var(--dx-text-soft);
}
.dx-start {
  position: absolute;
  inset: 0;
  width: 100%;
  gap: 12px;
  max-width: none;
  background: radial-gradient(var(--dx-border-soft) 1px, transparent 1.4px) 0 0/40px 40px;
}
.dx-canvas-app button:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 2px;
}
.dx-workspace-sidebar {
  position: absolute;
  z-index: 30;
  top: 12px;
  left: 12px;
  width: 298px;
  height: 500px;
  min-width: 236px;
  min-height: 240px;
  max-width: min(560px, calc(100% - 24px));
  max-height: calc(100% - 24px);
  resize: both;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: 400 calc(12px * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
}
.dx-workspace-sidebar:has([data-sidebar-detail]) {
  height: calc(100% - 24px);
}
.dx-workspace-sidebar:has([data-sidebar-detail]) .dx-sidebar-layers {
  flex: none;
}
.dx-sidebar-header {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 48px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--dx-border);
  flex: none;
}
.dx-sidebar-brand {
  display: flex;
  align-items: center;
  gap: 9px;
  flex: 0 1 auto;
  min-width: 0;
  padding: 4px 2px;
  text-align: left;
}
.dx-sidebar-brand > svg {
  flex-shrink: 0;
}
.dx-sidebar-header-space {
  flex: 1 0 24px;
  align-self: stretch;
}
.dx-sidebar-brand strong {
  font-size: calc(14px * var(--canvas-text-scale,1));
  font-weight: 600;
}
.dx-sidebar-brand > svg:last-child {
  color: var(--dx-text-soft);
}
.dx-sidebar-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
}
.dx-sidebar-icon:hover {
  color: var(--dx-text);
  background: var(--dx-hover);
}
.dx-sidebar-brand:hover {
  color: var(--dx-text);
  background: transparent;
}
.dx-sidebar-icon:disabled {
  opacity: .4;
}
.dx-workspace-sidebar.is-collapsed {
  width: 48px !important;
  height: 48px !important;
  min-width: 0;
  min-height: 0;
  resize: none;
}
.dx-workspace-sidebar.is-collapsed .dx-sidebar-header {
  padding: 0;
  justify-content: center;
  border: 0;
}
.dx-sidebar-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 10px 4px;
  padding: 6px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: var(--dx-surface-inset);
  color: var(--dx-text-soft);
}
.dx-sidebar-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  background: transparent;
  outline: none;
  color: var(--dx-text);
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-sidebar-search:focus-within {
  border-color: var(--dx-text);
  outline: none;
  box-shadow: none;
}
.dx-sidebar-scroll {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}
.dx-sidebar-workspaces {
  flex: none;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-sidebar-workspaces nav {
  max-height: 180px;
  overflow: auto;
}
.dx-sidebar-section-heading {
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 4px 10px 3px;
  min-height: 33px;
  color: var(--dx-text-soft);
}
.dx-sidebar-section-heading > button:first-child {
  display: flex;
  align-items: center;
  gap: 7px;
  flex: 1;
  min-width: 0;
  text-align: left;
  font: 400 calc(10px * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.dx-sidebar-section-heading > .dx-sidebar-icon {
  width: 22px;
  height: 22px;
}
.dx-workspace-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 5px 12px;
  min-height: 27px;
  text-align: left;
  color: var(--dx-text-soft);
  font-size: calc(11.5px * var(--canvas-text-scale,1));
}
.dx-workspace-row:hover {
  background: var(--dx-hover);
}
.dx-workspace-row.is-current {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
}
.dx-workspace-row > span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-current-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--dx-resolve);
  margin-right: 17px;
  flex: none;
}
.dx-sidebar-layers {
  flex: 1;
  min-height: 100px;
  padding-bottom: 8px;
}
.dx-layer-list {
  padding: 2px 0;
}
.dx-layer-row {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 4px 8px;
  min-height: 46px;
}
.dx-layer-row:hover {
  background: var(--dx-hover);
}
.dx-layer-row.is-selected {
  background: var(--dx-surface-inset);
}
.dx-layer-row > .dx-sidebar-icon {
  width: 27px;
  height: 30px;
}
.dx-layer-lock {
  color: var(--dx-text-faint);
}
.dx-layer-name {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  flex: 1;
  min-height: 38px;
  text-align: left;
  color: var(--dx-text);
  font-size: calc(11.5px * var(--canvas-text-scale,1));
}
.dx-layer-name > svg {
  color: var(--canvas-highlight);
  opacity: .75;
  flex: none;
}
.dx-layer-thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 5px;
  overflow: hidden;
  background: var(--dx-surface-inset);
  color: var(--dx-text-soft);
}
.dx-layer-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dx-layer-label {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
  gap: 2px;
}
.dx-layer-label > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-layer-label small {
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.4;
  color: var(--dx-text-soft);
}
.dx-layer-row.is-hidden .dx-layer-label > span {
  text-decoration: line-through;
  color: var(--dx-text-soft);
}
.dx-sidebar-empty {
  padding: 8px 14px;
  color: var(--dx-text-soft);
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-sidebar-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 37px;
  flex: none;
  padding: 4px 16px 4px 10px;
  border-top: 1px solid var(--dx-border);
  color: var(--dx-text-soft);
  font-size: calc(10.5px * var(--canvas-text-scale,1));
}
.dx-sidebar-footer > div {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-left: auto;
}
.dx-sidebar-detail {
  border-top: 1px solid var(--dx-border);
  flex: none;
  min-width: 0;
  scroll-margin-top: 0;
}
.dx-sidebar-detail-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
}
.dx-sidebar-detail-header strong {
  font: 500 calc(13px * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
}
.dx-detail-nav {
  display: flex;
  gap: 2px;
  padding: 0 8px 8px;
  border-bottom: 1px solid var(--dx-border-soft);
}
.dx-detail-nav button {
  flex: 1;
  font-size: calc(10.5px * var(--canvas-text-scale,1));
  color: var(--dx-text-soft);
  padding: 5px 2px;
  border-radius: 4px;
}
.dx-detail-nav button[aria-pressed=true] {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
}
.dx-sidebar-detail .dx-inspector,
.dx-sidebar-detail .dx-library {
  position: static;
  width: auto;
  border: 0;
  min-height: 0;
  display: block;
  background: transparent;
}
.dx-sidebar-detail .dx-inspector > header,
.dx-sidebar-detail .dx-library > header {
  display: none;
}
.dx-sidebar-detail .dx-inspector-scroll,
.dx-sidebar-detail .dx-library-items {
  overflow: visible;
}
.dx-sidebar-detail .dx-project-context,
.dx-sidebar-detail .dx-source-detail {
  padding: 12px;
}
.dx-sidebar-detail .dx-project-context textarea {
  min-height: 82px;
}
.dx-sidebar-detail .dx-project-context label,
.dx-sidebar-detail .dx-lineage h4,
.dx-sidebar-detail .dx-branch-prompt h4 {
  font-size: calc(10px * var(--canvas-text-scale,1));
  line-height: 1.5;
}
.dx-sidebar-detail .dx-project-context p,
.dx-sidebar-detail .dx-source-detail p {
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-sidebar-detail .dx-inspector-preview {
  height: 150px;
}
.dx-sidebar-detail .dx-library-search {
  margin: 10px 12px;
}
.dx-sidebar-detail .dx-library-row {
  padding: 4px 8px;
}
.dx-sidebar-detail .dx-library-row button {
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-sidebar-detail .dx-canvas-toolbar {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 10px 8px;
  gap: 8px;
  border: 0;
  background: none;
  overflow: visible;
}
.dx-sidebar-detail .dx-canvas-toolbar > div {
  flex-wrap: wrap;
  white-space: normal;
  gap: 2px;
}
.dx-sidebar-detail .dx-canvas-toolbar i {
  margin: 0 2px;
}
.dx-sidebar-detail .dx-canvas-icon {
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
}
.dx-sidebar-detail .dx-canvas-icon svg {
  width: 15px;
  height: 15px;
}
.dx-sidebar-tool-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 4px 12px;
}
.dx-sidebar-tool-actions [data-slot=button] {
  font-size: calc(11px * var(--canvas-text-scale,1));
  letter-spacing: normal;
  text-transform: none;
}
.dx-sidebar-hint {
  padding: 12px;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.6;
}
.dx-sidebar-detail .dx-create-panel {
  border: 0;
  padding: 12px;
  background: transparent;
}
.dx-sidebar-detail .dx-reference-row {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-sidebar-detail .dx-reference-row > button {
  display: flex;
  margin: 0;
}
.dx-sidebar-detail .dx-composer {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}
.dx-sidebar-detail .dx-composer textarea {
  width: 100%;
  min-height: 110px;
  font-size: calc(13px * var(--canvas-text-scale,1));
  flex: none;
}
.dx-sidebar-detail .dx-generate {
  width: auto;
  min-height: 32px;
  height: 32px !important;
  align-self: flex-end;
  padding: 0 10px !important;
}
.dx-sidebar-detail .dx-generate span {
  display: inline;
}
.dx-sidebar-detail .dx-composer-options {
  font-size: calc(11px * var(--canvas-text-scale,1));
  gap: 8px;
}
.dx-sidebar-detail .dx-composer-options > span {
  flex-basis: 100%;
}
.dx-sidebar-detail .dx-inline-help {
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.5;
}
.dx-sidebar-detail .dx-settings {
  padding: 0 12px 12px;
  font-size: calc(12px * var(--canvas-text-scale,1));
}
.dx-sidebar-detail .dx-settings h3 {
  font-size: calc(13px * var(--canvas-text-scale,1));
  font-weight: 500;
  margin-top: 16px;
}
.dx-appearance-setting {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.dx-appearance-setting select {
  background: var(--dx-surface-inset);
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  padding: 4px 8px;
}
.dx-prompt-dock {
  position: absolute;
  z-index: 50;
  right: 18px;
  bottom: 18px;
  width: min(307px, calc(100% - 36px));
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}
.dx-prompt-bar {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 23px;
  background: var(--dx-surface);
}
.dx-prompt-bar > textarea {
  flex: 1;
  min-width: 0;
  min-height: 1.6em;
  max-height: 8em;
  resize: none;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-wrap: anywhere;
  field-sizing: content;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--dx-text);
  font-family: inherit;
  font-size: calc(13px * var(--canvas-text-scale,1));
  line-height: 1.6;
  outline: none;
  -webkit-user-select: text;
  user-select: text;
  cursor: text;
}
.dx-prompt-bar > textarea:placeholder-shown {
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-prompt-bar > textarea::placeholder {
  white-space: nowrap;
  color: var(--dx-text-soft);
  opacity: 1;
}
.dx-prompt-bar:focus-within {
  border-color: var(--dx-border);
  outline: none;
  box-shadow: none;
}
.dx-prompt-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--dx-border);
  border-radius: 50%;
  background: var(--dx-surface-inset);
  color: var(--dx-text-soft);
}
.dx-prompt-circle:hover {
  color: var(--dx-text);
}
.dx-prompt-circle:disabled {
  opacity: .4;
}
.dx-job-indicator,
.dx-prompt-references {
  display: flex;
  align-items: center;
  gap: 6px;
  align-self: flex-end;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: var(--dx-surface);
  padding: 6px 9px;
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-selection-tools {
  position: absolute;
  z-index: 20;
  bottom: 18px;
  left: calc(50% - 170px);
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 6px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  background: var(--dx-surface);
}
.dx-selection-tools > span {
  font-size: calc(11px * var(--canvas-text-scale,1));
  color: var(--dx-text-soft);
  margin-right: 6px;
  white-space: nowrap;
}
.dx-selection-tools .dx-canvas-icon {
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
}
.dx-selection-tools .dx-canvas-icon svg {
  width: 15px;
  height: 15px;
}
.dx-message {
  position: absolute;
  z-index: 35;
  top: 12px;
  left: 326px;
  right: 18px;
  width: fit-content;
  max-width: calc(100% - 344px);
  padding: 10px 12px;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  background: var(--dx-surface);
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
}
.dx-message [data-slot=button] {
  flex: none;
}
@media (max-width: 1100px) {
  .dx-selection-tools {
    left: auto;
    right: 18px;
    bottom: 104px;
  }
}
@media (max-width: 600px) {
  .dx-workspace-sidebar {
    width: 270px;
    max-height: calc(100% - 92px);
  }
  .dx-workspace-sidebar:has([data-sidebar-detail]) {
    height: calc(100% - 92px);
  }
  .dx-message {
    left: 12px;
    right: 12px;
    top: auto;
    bottom: 84px;
    max-width: calc(100% - 24px);
  }
  .dx-selection-tools {
    max-width: calc(100% - 24px);
    flex-wrap: wrap;
  }
}
:root {
  --canvas-ui-scale:1;
  --canvas-text-scale:1;
}
.dx-workspace-sidebar,
.dx-prompt-dock,
.dx-scaled-dialog {
  zoom: var(--canvas-ui-scale);
}
.dx-workspace-sidebar {
  top: calc(12px / var(--canvas-ui-scale));
  left: calc(12px / var(--canvas-ui-scale));
  max-width: min(560px, calc((100vw - 24px) / var(--canvas-ui-scale)));
  max-height: calc((100vh - 24px) / var(--canvas-ui-scale));
}
.dx-workspace-sidebar:has([data-sidebar-detail]) {
  height: calc((100vh - 24px) / var(--canvas-ui-scale));
}
.dx-prompt-dock {
  right: calc(18px / var(--canvas-ui-scale));
  bottom: calc(18px / var(--canvas-ui-scale));
  width: min(307px, calc((100vw - 36px) / var(--canvas-ui-scale)));
}
.dx-prompt-bar > textarea {
  line-height: 1.6;
}
.dx-workspace-sidebar [data-slot=button] {
  font-size: calc(11px * var(--canvas-text-scale));
  min-height: 2.2em;
  height: auto;
  white-space: normal;
}
.dx-workspace-sidebar .dx-canvas-icon {
  height: 25px !important;
  min-height: 25px;
}
.dx-settings select {
  max-width: 65%;
}
.dx-scale-settings {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  margin-top: 16px;
}
.dx-scale-setting > label {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.dx-scale-setting output {
  font-variant-numeric: tabular-nums;
  color: var(--dx-text-soft);
}
.dx-scale-setting input {
  display: block;
  width: 100%;
  accent-color: var(--dx-text);
  margin: 8px 0;
}
.dx-scale-setting p {
  font-size: calc(11px * var(--canvas-text-scale));
  line-height: 1.5;
  color: var(--dx-text-soft);
  margin: 0;
}
.dx-scale-settings > button,
.dx-scale-settings > .dx-disabled-hint {
  align-self: flex-start;
}
.dx-snap-setting {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  line-height: 1.5;
}
.dx-snap-setting input {
  accent-color: var(--dx-text);
  margin-top: .25em;
  flex: none;
}
.dx-hint {
  max-width: min(300px, calc(100vw - 24px));
  padding: 8px 10px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: var(--dx-surface-raised) !important;
  color: var(--dx-text) !important;
  font: 400 calc(12px * var(--canvas-text-scale) * var(--canvas-ui-scale))/1.45 var(--dx-font-sans);
  z-index: 100;
  white-space: normal;
  overflow-wrap: anywhere;
  animation: none !important;
}
.dx-hint-unavailable {
  display: block;
  color: var(--dx-text-soft);
  margin-top: 3px;
}
.dx-disabled-hint {
  display: inline-flex;
  vertical-align: middle;
  border-radius: 5px;
}
.dx-disabled-hint:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 2px;
}
.dx-disabled-hint > button:disabled {
  pointer-events: none;
}
.dx-disabled-hint > input {
  width: 100%;
}
.dx-scaled-dialog {
  max-width: min(512px, calc((100vw - 32px) / var(--canvas-ui-scale)));
  max-height: calc((100vh - 32px) / var(--canvas-ui-scale));
  overflow: auto;
}
@media (max-width: 600px) {
  .dx-workspace-sidebar,
  .dx-workspace-sidebar:has([data-sidebar-detail]) {
    max-height: calc((100vh - 104px) / var(--canvas-ui-scale));
  }
}
:root {
  --dx-type-caption:400 calc(.6875rem * var(--canvas-text-scale,1))/1.45 var(--dx-font-sans);
  --dx-type-compact-label:700 calc(.625rem * var(--canvas-text-scale,1))/1.2 var(--dx-font-sans);
  --dx-type-interface-label:700 calc(.6875rem * var(--canvas-text-scale,1))/1.2 var(--dx-font-sans);
  --dx-type-compact-body:400 calc(.8125rem * var(--canvas-text-scale,1))/1.45 var(--dx-font-sans);
  --dx-type-body:400 calc(.875rem * var(--canvas-text-scale,1))/1.5 var(--dx-font-sans);
  --dx-type-body-large:400 calc(1rem * var(--canvas-text-scale,1))/1.6 var(--dx-font-sans);
  --dx-type-data-value:500 calc(.875rem * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
  --dx-type-metric-value:700 calc(1.75rem * var(--canvas-text-scale,1))/1.1 var(--dx-font-sans);
  --dx-type-table-value:400 calc(.8125rem * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
  --dx-type-section-title:700 calc(1rem * var(--canvas-text-scale,1))/1.25 var(--dx-font-sans);
  --dx-type-page-title:700 calc(1.375rem * var(--canvas-text-scale,1))/1.2 var(--dx-font-sans);
}
[data-slot=dialog-title] {
  font-size: calc(18px * var(--canvas-text-scale));
}
[data-slot=dialog-description] {
  font-size: calc(13px * var(--canvas-text-scale));
}
.dx-scaled-dialog [data-slot=button],
.dx-compare-controls [data-slot=button] {
  font-size: calc(12px * var(--canvas-text-scale));
}
.dx-snap-guides {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 10;
}
.dx-align-guide {
  stroke: var(--canvas-highlight);
  stroke-width: 1;
  stroke-dasharray: 4 3;
}
.dx-gap-guide {
  fill: none;
  stroke: #bd72ed;
  stroke-width: 1;
}
.dx-gap-guide text {
  fill: #bd72ed;
  stroke: var(--dx-bg);
  stroke-width: 4;
  paint-order: stroke;
  stroke-linejoin: round;
  font: 500 calc(12px * var(--canvas-text-scale))/1 var(--dx-font-sans);
  font-variant-numeric: tabular-nums;
}
:root:not(.dark) .dx-gap-guide {
  stroke: #7839a3;
}
:root:not(.dark) .dx-gap-guide text {
  fill: #7839a3;
}
.dx-canvas-app {
  --canvas-nav-width:48px;
}
.dx-canvas-app.is-nav-expanded {
  --canvas-nav-width:256px;
}
.dx-canvas-surface {
  position: absolute;
  inset: 0 0 0 calc(var(--canvas-nav-width) * var(--canvas-ui-scale));
  overflow: hidden;
}
.dx-navigation-rail {
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 45;
  zoom: var(--canvas-ui-scale);
  width: var(--canvas-nav-width);
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  border-right: 1px solid var(--dx-border);
  background: var(--dx-surface);
  color: var(--dx-text);
  overflow: hidden;
}
.dx-rail-brand {
  display: flex;
  align-items: center;
  flex: none;
  height: 52px;
  width: 100%;
  padding: 0 10px;
  text-align: left;
  overflow: hidden;
}
.dx-rail-brand .diffusion-brand {
  width: 100%;
  justify-content: flex-start;
}
.dx-rail-brand svg,
.dx-rail-brand img {
  flex: none;
}
.dx-rail-expand {
  height: 36px;
  margin: 0 6px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 9px;
  flex: none;
  border-radius: 5px;
  color: var(--dx-text-soft);
}
.dx-rail-expand span,
.dx-rail-app strong,
.dx-rail-action > span,
.dx-profile-trigger > span:last-child {
  display: none;
}
.dx-navigation-rail.is-expanded .dx-rail-expand span,
.dx-navigation-rail.is-expanded .dx-rail-app strong,
.dx-navigation-rail.is-expanded .dx-rail-action > span,
.dx-navigation-rail.is-expanded .dx-profile-trigger > span:last-child {
  display: block;
}
.dx-rail-app {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 14px 10px;
  flex: none;
  white-space: nowrap;
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--dx-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.dx-rail-app:hover {
  background: var(--dx-hover);
}
.dx-rail-app:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: -3px;
}
.dx-rail-app strong {
  font-size: calc(15px * var(--canvas-text-scale));
  font-weight: 500;
}
.dx-navigation-rail nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 4px 6px;
  overflow: auto;
  min-height: 0;
}
.dx-rail-action {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 36px;
  width: 100%;
  padding: 8px;
  border-radius: 5px;
  text-align: left;
  font-size: calc(13px * var(--canvas-text-scale));
  line-height: 1.4;
  color: var(--dx-text-soft);
}
.dx-rail-action svg,
.dx-rail-expand svg,
.dx-rail-app svg {
  flex: none;
}
.dx-rail-action:hover,
.dx-rail-expand:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-rail-action[aria-pressed=true] {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
}
.dx-rail-account {
  margin-top: auto;
  flex: none;
  padding: 12px 8px;
}
.dx-profile-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 32px;
  text-align: left;
  font-size: calc(13px * var(--canvas-text-scale));
}
.dx-profile-avatar {
  width: 32px !important;
  height: 32px !important;
  flex: none;
  border: 0;
  border-radius: 50%;
  background: #b6a0f5;
  color: #17191d;
  outline: none;
  box-shadow: none;
  font: 500 calc(10px * var(--canvas-text-scale))/1 var(--dx-font-sans);
}
.dx-profile-avatar > span {
  background: transparent;
}
.dx-profile-menu {
  min-width: 224px;
  max-width: calc(100vw - 24px);
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  font-size: calc(13px * var(--canvas-text-scale) * var(--canvas-ui-scale));
  z-index: 90;
}
.dx-profile-menu [role=menuitem],
.dx-profile-menu [role=menuitemradio] {
  font-size: inherit;
  gap: 10px;
  min-height: 2.5em;
}
.dx-profile-menu strong {
  display: block;
  font-weight: 500;
}
.dx-profile-menu small {
  display: block;
  font-size: .85em;
  color: var(--dx-text-soft);
  margin-top: 3px;
}
.dx-profile-menu [data-highlighted] {
  background: var(--dx-surface-inset) !important;
  color: var(--dx-text) !important;
}
.dx-workspace-sidebar {
  max-width: min(560px, calc((100vw - var(--canvas-nav-width) * var(--canvas-ui-scale) - 24px) / var(--canvas-ui-scale)));
}
.dx-prompt-dock {
  width: min(307px, calc((100vw - var(--canvas-nav-width) * var(--canvas-ui-scale) - 36px) / var(--canvas-ui-scale)));
}
.dx-floating-host[hidden] {
  display: none;
}
.dx-app-settings {
  position: absolute;
  inset: 0 0 0 calc(var(--canvas-nav-width) * var(--canvas-ui-scale));
  overflow: auto;
  background: var(--dx-bg);
  color: var(--dx-text);
  z-index: 40;
  padding: 24px;
}
.dx-app-settings > header,
.dx-app-settings > .dx-settings {
  max-width: 620px;
  margin: 0 auto;
  zoom: var(--canvas-ui-scale);
}
.dx-app-settings > header {
  padding-bottom: 4px;
}
.dx-app-settings h1 {
  font: 500 calc(24px * var(--canvas-text-scale))/1.3 var(--dx-font-sans);
  margin: 24px 0 12px;
}
.dx-app-settings h3 {
  font: 500 calc(15px * var(--canvas-text-scale))/1.4 var(--dx-font-sans);
}
.dx-app-settings .dx-settings {
  font-size: calc(13px * var(--canvas-text-scale));
  padding-bottom: 32px;
  line-height: 1.6;
}
.dx-app-settings .dx-scale-settings {
  max-width: 440px;
}
@media (max-width: 600px) {
  .dx-canvas-app.is-nav-expanded {
    --canvas-nav-width:200px;
  }
  .dx-app-settings {
    padding: 16px;
  }
  .dx-profile-menu {
    min-width: 180px;
  }
}
.dx-message {
  z-index: 70;
}
.dx-app-settings h1:focus {
  outline: none;
}
.dx-rail-brand .dx-brand {
  width: 100%;
  height: 32px;
  justify-content: flex-start;
}
.dx-rail-brand .dx-brand[data-compact=true] {
  width: 28px;
  height: 28px;
}
.dx-rail-brand .dx-brand-mark {
  width: 28px !important;
}
.dx-rail-brand .dx-brand-wordmark {
  width: 128.8px !important;
}
.dx-rail-brand .dx-brand {
  min-width: 0 !important;
}
.dx-rail-brand .dx-brand[data-compact=true] {
  width: 28px !important;
  flex: none;
}
.dark .dx-rail-brand .df-brand-image {
  filter: brightness(0) invert(1);
}
.dx-submit-circle {
  background: var(--dx-text);
  color: var(--dx-bg);
  border: 0;
  width: 30px;
  height: 30px;
}
.dx-submit-circle:hover {
  color: var(--dx-bg);
}
.dx-submit-circle:disabled {
  opacity: .35;
}
.dx-node-label::before {
  display: none;
}
.dx-node-marker {
  color: var(--canvas-highlight);
  flex: none;
  opacity: .75;
}
.dx-conversation {
  display: flex;
  flex-direction: column;
  min-height: 180px;
  height: 440px;
  max-height: calc((100vh - 166px) / var(--canvas-ui-scale,1));
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  background: var(--dx-surface);
  overflow: hidden;
}
.dx-conversation > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--dx-border);
  flex: none;
}
.dx-conversation h2 {
  margin: 0;
  font-size: calc(11px * var(--canvas-text-scale,1));
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.dx-conversation button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 0;
  background: transparent;
  color: var(--dx-text-soft);
  padding: 4px;
  flex: none;
}
.dx-conversation button:hover {
  color: var(--dx-text);
}
.dx-conversation-model {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--dx-border);
  flex: none;
}
.dx-model-picker {
  min-width: 0;
  max-width: 100%;
  width: 100%;
  padding: 7px 22px 7px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  font-size: calc(11px * var(--canvas-text-scale,1));
  text-overflow: ellipsis;
}
.dx-conversation-body {
  position: relative;
  display: flex;
  flex: 1;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
}
.dx-conversation-history {
  flex: 1;
  min-height: 0;
  min-width: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 14px 14px var(--dx-reference-space,14px);
}
.dx-conversation-reference-overlay {
  position: absolute;
  right: 12px;
  bottom: 12px;
  left: 12px;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
  z-index: 2;
}
.dx-conversation .dx-prompt-references {
  pointer-events: auto;
  max-width: 100%;
  min-height: 28px;
  padding: 5px 8px;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  background: var(--dx-surface-raised,var(--dx-surface));
  font: 400 calc(11px * var(--canvas-text-scale,1))/1.4 var(--dx-font-sans);
  text-align: left;
  white-space: normal;
}
.dx-conversation .dx-prompt-references > svg {
  flex: none;
}
.dx-conversation .dx-prompt-references > span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.dx-conversation .dx-prompt-references:focus-visible {
  outline: 2px solid var(--dx-text);
  outline-offset: 2px;
}
.dx-conversation-empty {
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.6;
  color: var(--dx-text-soft);
  margin: 0;
}
.dx-conversation-turn {
  font-size: calc(12px * var(--canvas-text-scale,1));
  line-height: 1.5;
  margin-bottom: 22px;
  overflow-wrap: anywhere;
}
.dx-conversation-turn p {
  white-space: pre-wrap;
  margin: 3px 0 14px;
}
.dx-conversation-label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--dx-text-soft);
  font-size: calc(9px * var(--canvas-text-scale,1));
  text-transform: uppercase;
  letter-spacing: .04em;
}
.dx-conversation-label > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-left: auto;
  max-width: 70%;
  text-transform: none;
  letter-spacing: 0;
}
.dx-conversation-label button {
  margin-left: auto;
}
.dx-conversation-result {
  color: var(--dx-text);
}
.dx-conversation-asset {
  flex-direction: column;
  align-items: flex-start !important;
  font-size: calc(11px * var(--canvas-text-scale,1));
  border-radius: 6px;
  padding: 0 !important;
  max-width: 100%;
}
.dx-conversation-thumbnail {
  display: block;
  flex: none;
  width: 128px;
  height: 128px;
  max-width: 100%;
  object-fit: contain;
  border-radius: 6px;
  background: var(--dx-surface-inset);
}
.dx-conversation-asset > span {
  display: flex;
  align-items: center;
  gap: 6px;
  padding-top: 2px;
}
.dx-prompt-circle.is-listening {
  border-color: var(--dx-text);
  color: var(--dx-text);
  background: var(--dx-surface-inset);
}
.dx-voice-message {
  margin: 0;
  padding: 9px 11px;
  border: 1px solid var(--dx-border);
  border-radius: 7px;
  background: var(--dx-surface);
  font-size: calc(11px * var(--canvas-text-scale,1));
  line-height: 1.5;
}
.dx-provider-settings {
  margin-top: 20px;
}
.dx-provider-settings > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
.dx-provider-settings h3 {
  margin: 0;
}
.dx-provider-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--dx-border);
}
.dx-provider-row > div {
  flex: 1;
  min-width: 0;
}
.dx-provider-row strong,
.dx-provider-row small {
  display: block;
  overflow-wrap: anywhere;
}
.dx-provider-row small {
  color: var(--dx-text-soft);
  margin-top: 3px;
}
.dx-provider-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--dx-border);
}
.dx-provider-form h4 {
  font-size: calc(14px * var(--canvas-text-scale,1));
  margin: 0 0 8px;
}
.dx-provider-form > label {
  margin-top: 6px;
}
.dx-provider-check {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-provider-check input {
  flex: none;
}
.dx-provider-help {
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale,1));
}
.dx-provider-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.dx-message {
  top: auto;
  bottom: calc(80px * var(--canvas-ui-scale,1));
  left: calc(50% + var(--canvas-nav-width) * var(--canvas-ui-scale,1) / 2);
  right: auto;
  transform: translateX(-50%);
  max-width: min(560px, calc(100vw - var(--canvas-nav-width) * var(--canvas-ui-scale,1) - 36px));
  width: max-content;
  box-sizing: border-box;
}
.dx-conversation-expand[aria-expanded=true] {
  border-color: var(--canvas-highlight);
  color: var(--dx-text);
}
.dx-navigation-rail {
  transition: width 240ms cubic-bezier(.22, 1, .36, 1);
}
.dx-canvas-surface,
.dx-app-settings {
  transition: left 240ms cubic-bezier(.22, 1, .36, 1);
}
.dx-message {
  transition: left 240ms cubic-bezier(.22, 1, .36, 1);
}
.dx-rail-expand span,
.dx-rail-app strong,
.dx-rail-action > span,
.dx-profile-trigger > span:last-child {
  display: block;
  opacity: 0;
  visibility: hidden;
  white-space: nowrap;
  transform: translateX(-5px);
  transition:
    opacity 100ms ease,
    transform 180ms cubic-bezier(.22, 1, .36, 1),
    visibility 100ms;
}
.dx-navigation-rail.is-expanded .dx-rail-expand span,
.dx-navigation-rail.is-expanded .dx-rail-app strong,
.dx-navigation-rail.is-expanded .dx-rail-action > span,
.dx-navigation-rail.is-expanded .dx-profile-trigger > span:last-child {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transition:
    opacity 160ms ease 50ms,
    transform 220ms cubic-bezier(.22, 1, .36, 1) 30ms,
    visibility 0ms;
}
.dx-rail-action,
.dx-rail-expand,
.dx-rail-brand,
.dx-profile-trigger {
  overflow: hidden;
}
.dx-rail-action {
  min-width: 36px;
  flex-shrink: 0;
}
@media (prefers-reduced-motion: reduce) {
  .dx-navigation-rail,
  .dx-canvas-surface,
  .dx-app-settings,
  .dx-message,
  .dx-rail-expand span,
  .dx-rail-app strong,
  .dx-rail-action > span,
  .dx-profile-trigger > span:last-child {
    transition: none !important;
    transform: none;
  }
}
.dx-sidebar-header {
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.dx-sidebar-header button {
  cursor: pointer;
}
.dx-workspace-sidebar.is-dragging .dx-sidebar-header {
  cursor: grabbing;
}
.dx-workspace-sidebar.is-dragging {
  box-shadow: 0 12px 30px #0003;
}
.dx-profile-avatar::after {
  border: 0;
  outline: none;
  box-shadow: none;
}
.dx-canvas-app button,
[data-slot=dialog-content] button {
  text-transform: none;
  letter-spacing: normal;
}
.dx-app-settings > header > button {
  padding-inline: 0;
  justify-content: flex-start;
}
.dx-connection-setup {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin: 16px 0 24px;
}
.dx-connection-setup form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.dx-connection-setup input {
  width: 100%;
}
.dx-connection-setup label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
}
.dx-connection-setup p {
  color: var(--dx-text-soft);
  margin: 0 0 4px;
}
.dx-connection-setup > div > p {
  margin: 8px 0;
}
.dx-connection-setup > div > form {
  margin-top: 16px;
}
.dx-connection-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.dx-connected-source {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 12px 0;
  border-top: 1px solid var(--dx-border);
}
.dx-source-open {
  flex: 1;
  min-width: 0;
  text-align: left;
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
}
.dx-connected-source strong,
.dx-connected-source small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dx-connected-source small {
  color: var(--dx-text-soft);
}
.dx-source-browser {
  margin: 16px 0;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  overflow: hidden;
}
.dx-source-browser > header {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-source-browser > header > strong {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dx-source-files {
  max-height: 360px;
  overflow: auto;
}
.dx-source-files > div {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
}
.dx-source-files > div:hover {
  background: var(--dx-hover);
}
.dx-source-files > div > span {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
.dx-source-files small {
  display: block;
  color: var(--dx-text-soft);
}
.dx-source-files button:not([data-slot=button]) {
  padding: 0;
  background: none;
  border: 0;
  color: inherit;
  text-align: left;
}
.dx-source-files > p,
.dx-source-browser > p {
  padding: 0 12px;
}
.dx-connection-progress {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-project-connections [role=alert] {
  color: var(--dx-text);
  padding: 8px 0;
}
.dx-theme-control {
  position: absolute;
  right: 17px;
  top: 6px;
  z-index: 65;
}
.dx-theme-control > button {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  background: var(--dx-bg);
  border: 0;
  border-radius: 6px;
  color: var(--dx-text-soft);
}
.dx-theme-control > button:hover {
  color: var(--dx-text);
  background: var(--dx-hover);
}
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}
::view-transition-old(root) {
  z-index: 1;
}
::view-transition-new(root) {
  z-index: 2;
}
html.canvas-theme-wipe::view-transition-new(root) {
  animation: canvas-theme-reveal .75s cubic-bezier(.65, 0, .35, 1) both;
}
@keyframes canvas-theme-reveal {
  from {
    clip-path: circle(0px at var(--theme-wipe-x) var(--theme-wipe-y));
  }
  to {
    clip-path: circle(var(--theme-wipe-r) at var(--theme-wipe-x) var(--theme-wipe-y));
  }
}
html.canvas-theme-wipe body {
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  html.canvas-theme-wipe::view-transition-new(root) {
    animation: none;
  }
}
.dx-workspace-detail-panel {
  position: absolute;
  z-index: 31;
  zoom: var(--canvas-ui-scale);
  top: 12px;
  width: min(340px, calc(100% - 24px));
  max-height: calc(100% - 24px);
  overflow: auto;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  background: var(--dx-surface);
  pointer-events: auto;
  color: var(--dx-text);
}
.dx-workspace-detail-panel > .dx-sidebar-detail {
  border-top: 0;
}
.dx-conversation-output {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--dx-border);
  font-size: calc(11px * var(--canvas-text-scale,1));
  flex: none;
}
.dx-conversation-output select {
  min-width: 0;
  flex: 1;
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  border-radius: 4px;
  padding: 3px 5px;
}
.dx-conversation-output > span {
  flex-basis: 100%;
  color: var(--dx-text-soft);
}
.dx-conversation-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 12px;
}
.dx-conversation-results:has(> button:nth-child(3)) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.dx-conversation-results .dx-conversation-asset {
  width: 100%;
  min-width: 0;
  max-width: 128px;
  text-align: left;
}
.dx-conversation-results .dx-conversation-thumbnail {
  width: 100%;
  height: auto;
  aspect-ratio: 1;
}
.dx-conversation-asset > span {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
}
.dx-conversation-asset > span > svg {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}
.dx-conversation-asset > small {
  color: var(--dx-text-soft);
  font-size: calc(10px * var(--canvas-text-scale,1));
}
.dx-error-copy {
  min-width: 0;
  flex: 1;
}
.dx-error-copy strong {
  font-weight: 500;
}
.dx-error-copy p {
  margin: 4px 0 0;
  overflow-wrap: anywhere;
}
.dx-error-copy details {
  margin-top: 6px;
  color: var(--dx-text-soft);
}
.dx-error-copy summary {
  cursor: pointer;
}
.dx-message.is-error {
  align-items: flex-start;
  gap: 12px;
}
.dx-message.is-error > .dx-canvas-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
}
.dx-canvas-zoom {
  position: absolute;
  z-index: 40;
  left: calc(18px / var(--canvas-ui-scale));
  bottom: calc(var(--canvas-zoom-bottom,18px) / var(--canvas-ui-scale));
  zoom: var(--canvas-ui-scale);
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px;
  border: 1px solid var(--dx-border);
  border-radius: 999px;
  background: var(--dx-surface);
  color: var(--dx-text);
}
.dx-canvas-zoom button:where(:not(.dx-checkerboard-toggle)) {
  border-radius: 999px !important;
}
.dx-canvas-zoom .dx-zoom-value:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-canvas-zoom button:where(:not(.dx-checkerboard-toggle)):focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 1px;
}
.dx-conversation-history {
  -webkit-user-select: text;
  user-select: text;
  cursor: text;
}

/* canvas/src/tools-v1.css */
.dx-tool-dock {
  position: absolute;
  z-index: 60;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  max-width: calc(100% - 32px);
}
.dx-tool-pillbar {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 6px;
  border: 1px solid var(--dx-border);
  border-radius: 999px;
  background: var(--dx-surface);
  color: var(--dx-text);
  zoom: var(--canvas-ui-scale);
}
.dx-tool-pillbar button,
.dx-checkerboard-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--dx-text-soft);
}
.dx-tool-pillbar button:hover,
.dx-checkerboard-toggle:where(:enabled):hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-tool-pillbar button[aria-pressed=true],
.dx-checkerboard-toggle[aria-pressed=true] {
  background: var(--dx-surface-inset);
  color: var(--dx-text);
}
.has-tool-pillbar > .dx-message {
  left: 50%;
  bottom: calc(18px + var(--tool-dock-height,50px) + 12px);
  transform: translateX(-50%);
}
.is-tool-prompt-stacked .dx-prompt-dock {
  left: calc(var(--tool-center-x,50vw) / var(--canvas-ui-scale));
  right: auto;
  transform: translateX(-50%);
  bottom: calc((30px + var(--tool-dock-height,50px)) / var(--canvas-ui-scale));
}
.is-tool-prompt-stacked > .dx-message {
  bottom: calc(42px + var(--tool-dock-height,50px) + 64px * var(--canvas-ui-scale));
}
.is-tool-prompt-stacked .dx-conversation {
  max-height: calc((100vh - 230px - var(--tool-dock-height,50px)) / var(--canvas-ui-scale));
}
.dx-tool-slot {
  display: flex;
}
.dx-tool-slot.starts-group {
  margin-left: 5px;
  padding-left: 8px;
  border-left: 1px solid var(--dx-border);
}
.dx-tool-options {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: 344px;
  max-width: calc((100vw - 32px) / var(--canvas-ui-scale));
  max-height: calc((100vh - 230px) / var(--canvas-ui-scale));
  overflow: auto;
  overscroll-behavior: contain;
  padding: 12px;
  border: 1px solid var(--dx-border);
  border-radius: 12px;
  background: var(--dx-surface);
  color: var(--dx-text);
  font: 400 calc(12px * var(--canvas-text-scale))/1.5 var(--dx-font-sans);
  zoom: var(--canvas-ui-scale);
  box-sizing: border-box;
}
.dx-tool-options header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.dx-tool-options header strong {
  font-weight: 500;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-tool-options header span {
  color: var(--dx-text-soft);
}
.dx-tool-options button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 28px;
  border: 0;
  border-radius: 5px;
  background: var(--dx-surface-inset);
  color: var(--dx-text);
  padding: 4px 8px;
  font: inherit;
}
.dx-tool-options header button {
  background: transparent;
  padding: 4px;
}
.dx-tool-options button:hover {
  background: var(--dx-hover);
}
.dx-tool-options button:disabled {
  opacity: .45;
}
.dx-tool-options fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
}
.dx-tool-options fieldset:disabled {
  opacity: .65;
}
.dx-tool-fields {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.dx-tool-fields label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.dx-tool-options select,
.dx-tool-options textarea {
  font: inherit;
  color: var(--dx-text);
  background: var(--dx-surface-inset);
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  padding: 5px 7px;
  max-width: 100%;
}
.dx-tool-options select:focus-visible,
.dx-tool-options textarea:focus-visible,
.dx-tool-options input:focus-visible {
  outline: 2px solid var(--dx-focus);
  outline-offset: 2px;
}
.dx-tool-options textarea {
  width: 100%;
  box-sizing: border-box;
  resize: vertical;
  min-height: 50px;
  max-height: 160px;
  caret-color: var(--dx-text);
}
.dx-tool-color {
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-tool-color input {
  width: 32px;
  height: 29px;
  padding: 2px;
  border: 1px solid var(--dx-border);
  border-radius: 5px;
  background: var(--dx-surface-inset);
  cursor: pointer;
}
.dx-tool-fields .dx-tool-check {
  flex-direction: row;
  align-items: center;
  min-height: 30px;
  gap: 5px;
}
.dx-tool-check input {
  accent-color: var(--dx-text);
}
.dx-tool-text-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.dx-tool-instruction {
  margin: 8px 0 0;
  color: var(--dx-text-soft);
  font-size: calc(12px * var(--canvas-text-scale));
}
.dx-stamp-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}
.dx-stamp-options button {
  width: 44px;
  height: 40px;
}
.dx-stamp-options button[aria-pressed=true] {
  outline: 1px solid var(--dx-text);
}
.dx-comment-messages {
  max-height: 160px;
  overflow: auto;
  overflow-wrap: anywhere;
}
.dx-comment-messages article {
  padding-bottom: 12px;
}
.dx-comment-messages small {
  color: var(--dx-text-soft);
  font-size: calc(11px * var(--canvas-text-scale));
}
.dx-comment-messages p {
  white-space: pre-wrap;
  margin: 4px 0;
}
.dx-comment-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.dx-comment-actions button:last-child {
  margin-left: auto;
}
.has-tool-pillbar > .dx-message {
  bottom: calc(30px + var(--tool-stack-height,50px));
}
.is-tool-prompt-stacked .dx-prompt-dock {
  bottom: calc((30px + var(--tool-stack-height,50px)) / var(--canvas-ui-scale));
}
.is-tool-prompt-stacked > .dx-message {
  bottom: calc(42px + var(--tool-stack-height,50px) + 64px * var(--canvas-ui-scale));
}
.is-tool-prompt-stacked .dx-conversation {
  min-height: 80px;
  max-height: calc((100vh - 230px - var(--tool-stack-height,50px)) / var(--canvas-ui-scale));
}
.dx-canvas-stage.tool-select {
  cursor: default;
}
.dx-canvas-stage.tool-hand,
.dx-canvas-stage.is-hand {
  cursor: grab;
}
.dx-canvas-stage.is-moving.is-hand {
  cursor: grabbing;
}
.dx-canvas-stage.tool-draw,
.dx-canvas-stage.tool-shape,
.dx-canvas-stage.tool-connector,
.dx-canvas-stage.tool-stamp,
.dx-canvas-stage.tool-comment {
  cursor: crosshair;
}
.dx-canvas-stage.tool-text {
  cursor: text;
}
.dx-canvas-stage:not(.tool-select) .dx-canvas-node {
  cursor: inherit;
}
.dx-native-node {
  color: var(--dx-text);
}
.dx-native-svg {
  display: block;
  overflow: visible;
}
.dx-native-node.is-connector {
  pointer-events: none;
}
.dx-connector-hit {
  pointer-events: stroke;
  cursor: default;
}
.dx-native-node.is-connector .dx-selection-handle {
  pointer-events: auto;
}
.dx-native-node.is-connector .dx-selection-outline {
  border-color: transparent;
}
.dx-native-text,
.dx-shape-text {
  font-family: var(--dx-font-sans);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.35;
  box-sizing: border-box;
}
.dx-native-text {
  width: 100%;
  height: 100%;
  padding: 4px;
  overflow: hidden;
}
.dx-shape-text {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  padding: 16px;
  pointer-events: none;
  overflow: hidden;
}
.dx-shape-text[style*=center] {
  justify-content: center;
}
.dx-shape-text[style*=right] {
  justify-content: flex-end;
}
.dx-object-editor {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 4px;
  box-sizing: border-box;
  resize: none;
  border: 0;
  outline: 1px solid var(--dx-selection);
  background: var(--dx-surface);
  font-family: var(--dx-font-sans);
  line-height: 1.35;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  -webkit-user-select: text;
  user-select: text;
  caret-color: var(--dx-text);
}
.dx-object-editor.is-shape {
  padding: 16px;
  background: transparent;
}
.dx-connector-label {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: var(--dx-bg);
  padding: 3px 6px;
  font: 400 14px/1.4 var(--dx-font-sans);
  max-width: 240px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  pointer-events: auto;
}
.dx-comment-pin {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--dx-surface);
  color: var(--dx-selection);
  border: 1px solid var(--dx-selection);
}
.dx-comment-pin.is-resolved {
  color: var(--dx-text-soft);
  border-color: var(--dx-border);
}
.dx-comment-pin > svg + svg {
  position: absolute;
  right: -2px;
  bottom: -2px;
  background: var(--dx-surface);
  border-radius: 50%;
}
.dx-selection-marquee {
  position: absolute;
  border: 1px solid var(--dx-selection);
  background: color-mix(in srgb, var(--dx-selection) 9.4%, transparent);
  pointer-events: none;
  z-index: 10000000;
}
.is-tool-draft {
  pointer-events: none;
  opacity: .8;
}
.is-tool-draft[data-kind=shape] {
  opacity: 1;
}
@media (max-width: 580px) {
  .dx-tool-dock {
    max-width: calc(100% - 24px);
    width: max-content;
  }
  .dx-tool-pillbar {
    max-width: calc((100vw - 24px) / var(--canvas-ui-scale));
    overflow-x: auto;
    scrollbar-width: thin;
  }
  .dx-tool-slot.starts-group {
    margin-left: 2px;
    padding-left: 4px;
  }
  .dx-tool-options {
    width: 320px;
  }
}
.dx-canvas-app {
  --dx-selection:var(--canvas-highlight);
}
.is-tool-prompt-stacked > .dx-message {
  bottom: calc(42px + var(--tool-stack-height,50px) + var(--tool-prompt-height,64px));
  max-height: 96px;
  overflow: auto;
}
.is-tool-prompt-stacked .dx-conversation {
  min-height: 40px;
  max-height: max(40px, calc((100vh - 240px - var(--tool-stack-height,50px) - var(--tool-message-height,0px)) / var(--canvas-ui-scale)));
}
.has-tool-message .dx-tool-options {
  max-height: calc((100vh - 380px) / var(--canvas-ui-scale));
}
.dx-tool-color button {
  font-size: inherit;
  min-height: 25px;
  padding: 2px 5px;
}
.dx-shape-controls {
  margin-bottom: 12px;
}
.dx-shape-heading,
.dx-shape-radius-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.dx-shape-heading span:last-child,
.dx-shape-radius-heading span {
  color: var(--dx-text-soft);
}
.dx-shape-picker {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 12px;
}
.dx-tool-options .dx-shape-picker button {
  height: 38px;
  min-width: 0;
  padding: 6px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: var(--dx-text-soft);
}
.dx-tool-options .dx-shape-picker button:hover {
  background: var(--dx-hover);
  color: var(--dx-text);
}
.dx-tool-options .dx-shape-picker button[aria-checked=true] {
  background: var(--dx-surface-inset);
  border-color: var(--dx-text-soft);
  color: var(--dx-text);
}
.dx-tool-options .dx-shape-picker button:focus-visible {
  outline: none;
  border-color: var(--dx-text);
}
.dx-shape-picker svg {
  width: 28px;
  height: 28px;
  max-width: 100%;
  flex-shrink: 0;
}
.dx-shape-radius {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dx-shape-radius input[type=range] {
  width: 0;
  min-width: 0;
  flex: 1;
  accent-color: var(--dx-text);
  cursor: pointer;
}
.dx-shape-radius input[type=number] {
  box-sizing: border-box;
  width: 72px;
  min-height: 30px;
  padding: 5px 7px;
  font: inherit;
  font-variant-numeric: tabular-nums;
  color: var(--dx-text);
  background: var(--dx-surface-inset);
  border: 1px solid var(--dx-border);
  border-radius: 5px;
}
.dx-tool-options .dx-shape-radius input:focus-visible {
  outline: none;
  box-shadow: none;
  border-color: var(--dx-text);
}
.dx-tool-options .dx-shape-radius input[type=range]:focus-visible {
  outline: 1px solid var(--dx-text);
  outline-offset: 3px;
  border-radius: 5px;
}
.dx-shape-radius input:disabled {
  cursor: default;
  opacity: .45;
}
@media (min-width: 761px) {
  .is-tool-prompt-stacked .dx-tool-options:has(.dx-shape-controls) {
    max-height: max(140px, calc((100dvh - 80px - var(--tool-dock-height,50px) - var(--tool-prompt-height,100px) - var(--tool-message-height,0px)) / var(--canvas-ui-scale)));
  }
}
.dx-shape-placement {
  z-index: 120;
  background: var(--dx-surface);
  color: var(--dx-text);
  border: 1px solid var(--dx-border);
  max-width: min(420px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
}
.dx-shape-dimensions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0;
}
.dx-shape-dimensions label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
}
.dx-shape-dimensions input {
  width: 100%;
  min-width: 0;
  font-variant-numeric: tabular-nums;
}
.dx-shape-placement-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 20px;
}
.dx-connector-ports {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 10000002;
  overflow: visible;
}
.dx-connector-port {
  fill: var(--dx-surface);
  stroke: var(--dx-selection);
  stroke-width: 1.5;
}
.dx-connector-port.is-snap {
  fill: var(--dx-selection);
}
.dx-font-picker {
  display: grid;
  gap: 6px;
  margin: 0 0 14px;
  min-width: 0;
}
.dx-font-picker > label {
  font-size: var(--text-sm,14px);
}
.dx-tool-options .dx-font-trigger {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  background: var(--dx-surface-2,var(--dx-surface));
  color: var(--dx-text);
  text-align: left;
}
.dx-font-trigger span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dx-font-trigger svg {
  flex-shrink: 0;
}
.dx-font-browser {
  min-width: 0;
  border: 1px solid var(--dx-border);
  border-radius: 8px;
  overflow: hidden;
  background: var(--dx-surface);
}
.dx-font-search {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border-bottom: 1px solid var(--dx-border);
}
.dx-font-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--dx-text);
  font: inherit;
  padding: 5px;
}
.dx-font-count,
.dx-font-status {
  font-size: 12px;
  color: var(--dx-muted);
  padding: 5px 8px;
}
.dx-font-list {
  max-height: 180px;
  overflow: auto;
  overscroll-behavior: contain;
}
.dx-tool-options .dx-font-list > button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 34px;
  border: 0;
  padding: 7px 10px;
  color: var(--dx-text);
  background: transparent;
  text-align: left;
  font: inherit;
}
.dx-font-list > button > span {
  flex: 1;
  min-width: 0;
  overflow-wrap: anywhere;
}
.dx-font-list small {
  font-size: 11px;
  color: var(--dx-muted);
}
.dx-font-list > button.is-active,
.dx-font-list > button:hover {
  background: color-mix(in srgb, var(--dx-text) 9%, transparent);
}
.dx-font-preview {
  font-size: 20px;
  line-height: 1.35;
  min-height: 28px;
  padding: 3px 0;
  overflow-wrap: anywhere;
}
.dx-font-status {
  padding: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.dx-font-status button {
  min-height: 32px;
  border: 1px solid var(--dx-border);
  border-radius: 6px;
  background: var(--dx-surface);
  padding: 3px 8px;
  color: var(--dx-text);
}
.dx-native-emoji-stamp {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-weight: 400;
  font-style: normal;
  font-variant-emoji: emoji;
  -webkit-user-select: none;
  user-select: none;
  pointer-events: none;
}
.dx-stamp-options button > span {
  font-size: 28px;
  line-height: 1;
  font-weight: 400;
  font-variant-emoji: emoji;
}

/* canvas/src/compact-controls-v1.css */
.dx-canvas-controls {
  display: contents;
}
.dx-compact-controls-toggle,
.dx-compact-controls-heading,
.dx-compact-workspace-close {
  display: none;
}
.dx-canvas-controls > .dx-canvas-zoom {
  left: calc(var(--canvas-nav-width) + 18px / var(--canvas-ui-scale));
}
.dx-canvas-controls[hidden] {
  display: none;
}
@media (max-width: 760px) {
  .dx-canvas-app,
  .dx-canvas-app.is-nav-expanded {
    --canvas-nav-width:0px;
    --compact-bottom:max(12px,env(safe-area-inset-bottom));
    --compact-input-height:52px;
    --compact-panel-bottom:calc(var(--compact-bottom) + var(--compact-input-height) + 12px);
  }
  .dx-canvas-surface,
  .dx-app-settings {
    left: 0;
    transition: none;
  }
  .dx-canvas-app .dx-prompt-dock {
    left: calc(72px / var(--canvas-ui-scale));
    right: calc(12px / var(--canvas-ui-scale));
    bottom: calc(var(--compact-bottom) / var(--canvas-ui-scale));
    width: auto;
    transform: none;
  }
  .dx-prompt-bar {
    min-height: calc(var(--compact-input-height) / var(--canvas-ui-scale));
    box-sizing: border-box;
    gap: 4px;
    padding: 4px;
  }
  .dx-prompt-circle {
    width: calc(38px / var(--canvas-ui-scale));
    height: calc(38px / var(--canvas-ui-scale));
  }
  .dx-prompt-bar > textarea {
    font-size: max(13px, calc(16px / var(--canvas-ui-scale)));
    line-height: 1.5;
  }
  .dx-prompt-bar .vq-options-toggle {
    width: 18px;
    padding: 0;
    flex: none;
  }
  .dx-canvas-app .dx-conversation {
    max-height: calc((100dvh - 220px) / var(--canvas-ui-scale));
    min-height: 80px;
    translate: none !important;
  }
  .dx-compact-controls-toggle {
    position: absolute;
    display: grid;
    place-items: center;
    z-index: 65;
    left: 12px;
    bottom: var(--compact-bottom);
    width: 52px;
    height: 52px;
    padding: 0;
    border: 1px solid var(--dx-border);
    border-radius: 50%;
    background: var(--dx-surface);
    color: var(--dx-text-soft);
  }
  .dx-compact-controls-toggle:hover {
    background: var(--dx-hover);
    color: var(--dx-text);
  }
  .dx-compact-controls-toggle[aria-expanded=true] {
    border-color: var(--canvas-highlight);
    color: var(--canvas-highlight);
  }
  .dx-canvas-controls {
    position: absolute;
    z-index: 64;
    display: flex;
    flex-direction: column;
    gap: 12px;
    left: 12px;
    bottom: var(--compact-panel-bottom);
    width: min(420px, calc(100% - 24px));
    max-height: calc(100dvh - var(--compact-panel-bottom) - 12px);
    overflow: auto;
    overscroll-behavior: contain;
    padding: 12px;
    border: 1px solid var(--dx-border);
    border-radius: 16px;
    background: var(--dx-surface);
    color: var(--dx-text);
    box-sizing: border-box;
  }
  .dx-canvas-controls[hidden] {
    display: none;
  }
  .dx-compact-controls-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    gap: 12px;
  }
  .dx-compact-controls-heading strong {
    font-weight: 500;
  }
  .dx-compact-controls-heading button {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 0;
    background: transparent;
    color: var(--dx-text-soft);
    border-radius: 50%;
  }
  .dx-canvas-controls .dx-tool-dock {
    position: static;
    transform: none;
    max-width: none;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .dx-canvas-controls .dx-tool-pillbar {
    order: -1;
    zoom: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    border: 0;
    border-radius: 0;
    padding: 0;
    max-width: none;
    overflow: visible;
    background: transparent;
  }
  .dx-canvas-controls .dx-tool-slot,
  .dx-canvas-controls .dx-tool-slot.starts-group {
    margin: 0;
    padding: 0;
    border: 0;
    display: block;
  }
  .dx-canvas-controls .dx-tool-pillbar button {
    width: 100%;
    height: 58px;
    border-radius: 8px;
    gap: 4px;
    flex-direction: column;
    font-size: 11px;
  }
  .dx-canvas-controls .dx-tool-pillbar button[aria-pressed=true],
  .dx-canvas-controls .dx-checkerboard-toggle[aria-pressed=true] {
    color: var(--canvas-highlight);
  }
  .dx-tool-label {
    display: block;
  }
  .dx-canvas-controls .dx-tool-options {
    position: static;
    zoom: 1;
    translate: none !important;
    transform: none;
    width: 100%;
    max-width: none;
    max-height: none;
    overflow: visible;
    padding: 0;
    border: 0;
    border-radius: 0;
    order: 2;
  }
  .dx-canvas-controls .dx-tool-options header {
    cursor: default;
  }
  .dx-canvas-controls > .dx-canvas-zoom {
    position: static;
    zoom: 1;
    justify-content: center;
    align-self: center;
    max-width: 100%;
    box-sizing: border-box;
    padding: 4px;
    gap: 2px;
  }
  .dx-canvas-controls .dx-canvas-zoom button {
    min-width: 44px;
    min-height: 44px;
  }
  .dx-canvas-controls .dx-navigation-rail {
    position: static;
    zoom: 1;
    display: flex;
    width: 100%;
    height: auto;
    border: 0;
    overflow: visible;
    background: transparent;
  }
  .dx-canvas-controls .dx-rail-brand,
  .dx-canvas-controls .dx-rail-expand,
  .dx-canvas-controls .dx-rail-app,
  .dx-canvas-controls .dx-theme-control {
    display: none;
  }
  .dx-canvas-controls .dx-navigation-rail nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0;
    gap: 4px;
    overflow: visible;
  }
  .dx-canvas-controls .dx-rail-action {
    min-height: 44px;
    font-size: 13px;
    gap: 9px;
  }
  .dx-canvas-controls .dx-rail-action > span,
  .dx-canvas-controls .dx-profile-trigger > span:last-child {
    display: block;
    visibility: visible;
    opacity: 1;
    transform: none;
  }
  .dx-canvas-controls .dx-rail-account {
    margin: 8px 0 0;
    padding: 8px 0 0;
    border-top: 1px solid var(--dx-border);
  }
  .dx-canvas-controls .dx-profile-trigger {
    min-height: 44px;
    font-size: 13px;
  }
  .dx-canvas-app > .dx-message {
    left: 12px;
    right: 12px;
    top: 12px;
    bottom: auto;
    transform: none;
    width: auto;
    max-width: none;
    max-height: 30vh;
    overflow: auto;
  }
  .dx-floating-host:not([hidden]) {
    position: absolute;
    inset: 12px 12px var(--compact-panel-bottom);
    z-index: 63;
    overflow: auto;
    background: var(--dx-surface);
    border: 1px solid var(--dx-border);
    border-radius: 16px;
  }
  .dx-compact-workspace-close {
    display: grid;
    place-items: center;
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 2;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: var(--dx-surface);
    color: var(--dx-text-soft);
  }
  .dx-floating-host .dx-workspace-sidebar {
    position: static;
    zoom: 1;
    width: 100% !important;
    max-width: none;
    height: 100% !important;
    max-height: none;
    min-height: 0;
    border: 0;
    resize: none;
    box-shadow: none;
  }
  .dx-floating-host .dx-sidebar-header {
    padding-right: 48px;
  }
  .dx-floating-host .dx-sidebar-header > button[aria-label="Collapse sidebar"] {
    display: none;
  }
  .dx-floating-host:has(.dx-workspace-detail-panel) .dx-workspace-sidebar {
    display: none;
  }
  .dx-floating-host .dx-workspace-detail-panel {
    position: static;
    zoom: 1;
    translate: none !important;
    transform: none;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    border: 0;
    overflow: auto;
  }
  .dx-floating-host .dx-sidebar-detail-header {
    padding-right: 44px;
  }
}
@media (min-width: 761px) {
  .dx-tool-label {
    display: none;
  }
}

/* canvas/src/workspace-checkerboard-v1.css */
:root {
  --canvas-checker-a:#fff;
  --canvas-checker-b:#e3e3e3;
  --canvas-checker-dot:rgba(110,125,145,.22);
}
:root.dark {
  --canvas-checker-a:#242424;
  --canvas-checker-b:#303030;
  --canvas-checker-dot:rgba(150,170,200,.16);
}
html[data-transparency-checkerboard=true] .dx-canvas-stage {
  background-color: var(--canvas-checker-a);
  background-image:
    radial-gradient(var(--canvas-checker-dot) 1px, transparent 1.4px),
    conic-gradient(
      var(--canvas-checker-b) 25%,
      var(--canvas-checker-a) 0 50%,
      var(--canvas-checker-b) 0 75%,
      var(--canvas-checker-a) 0);
  background-size: 40px 40px, 20px 20px;
}
html[data-transparency-checkerboard=true] .dx-canvas-empty {
  background: transparent;
}
html[data-transparency-checkerboard=true] .dx-node-label small {
  color: var(--dx-text-soft);
}
/*! Bundled license information:

@diffusion/portal-kit-ui/dist/styles.css:
  (*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com *)
*/
/*# sourceMappingURL=app.css.map */