@sanity/vision 6.20.0-next.58 → 6.20.0-next.63

package/lib/bundle.css

@@ -2,7 +2,7 @@
   --static-css-file-loaded-vision: true;
 }
 
-._1o4e43l3 {
+.okz3su3 {
   box-sizing: border-box;
   width: 100%;
   height: 100%;
@@ -11,39 +11,43 @@
   overflow: clip;
 }
 
-._1o4e43l3 .cm-theme {
+.okz3su3 .cm-theme {
   width: 100%;
 }
 
-._1o4e43l3 .cm-editor {
+.okz3su3 .cm-editor {
   height: 100%;
   font-size: 16px;
   line-height: 21px;
 }
 
-._1o4e43l3 .cm-line {
-  padding-left: var(--_1o4e43l0);
+.okz3su3 .cm-line {
+  padding-left: var(--okz3su0);
 }
 
-._1o4e43l3 .cm-content {
-  padding-top: var(--_1o4e43l2);
-  border-right-width: var(--_1o4e43l1) !important;
+.okz3su3 .cm-content {
+  padding-top: var(--okz3su2);
+  border-right-width: var(--okz3su1) !important;
 }
 
-.phmces0 .sidebarPanes .Pane {
+.okz3su4, .okz3su4 .cm-editor {
+  height: auto;
+}
+
+.ch9tvf0 .sidebarPanes .Pane {
   overflow: hidden auto;
 }
 
-.phmces1 {
+.ch9tvf1 {
   position: absolute;
   inset: 0;
 }
 
-.phmces2 {
+.ch9tvf2 {
   min-height: 0;
 }
 
-.phmces0 .Resizer {
+.ch9tvf0 .Resizer {
   background: var(--card-border-color);
   opacity: 1;
   z-index: 1;
@@ -52,11 +56,11 @@
   border: solid #0000;
 }
 
-.phmces0 .Resizer:hover {
+.ch9tvf0 .Resizer:hover {
   border-color: var(--card-shadow-ambient-color);
 }
 
-.phmces0 .Resizer.horizontal {
+.ch9tvf0 .Resizer.horizontal {
   cursor: row-resize;
   z-index: 4;
   border-width: 5px 0;
@@ -65,7 +69,7 @@
   margin: -5px 0;
 }
 
-.phmces0 .Resizer.vertical {
+.ch9tvf0 .Resizer.vertical {
   cursor: col-resize;
   z-index: 2;
   border-width: 0 5px;
@@ -73,15 +77,15 @@
   margin: 0 -5px;
 }
 
-.phmces0 .Resizer.disabled {
+.ch9tvf0 .Resizer.disabled {
   cursor: not-allowed;
 }
 
-.phmces0 .Resizer.disabled:hover {
+.ch9tvf0 .Resizer.disabled:hover {
   border-color: #0000;
 }
 
-.phmces3 {
+.ch9tvf3 {
   z-index: 6;
   border-bottom: 1px solid var(--card-border-color);
   flex-shrink: 0;
@@ -89,26 +93,26 @@
   overflow: visible;
 }
 
-.phmces3.phmces3 {
+.ch9tvf3.ch9tvf3 {
   background: var(--card-bg-color);
 }
 
-.phmces4 {
+.ch9tvf4 {
   flex: 1;
 }
 
-.phmces5 {
+.ch9tvf5 {
   z-index: 1;
   min-height: 0;
   position: relative;
 }
 
-.phmces6 {
+.ch9tvf6 {
   cursor: pointer;
   margin-right: auto;
 }
 
-.phmces7 {
+.ch9tvf7 {
   z-index: 10;
   margin: 0;
   padding: 0;
@@ -118,38 +122,38 @@
   right: 0;
 }
 
-.phmces7 .phmces4 {
+.ch9tvf7 .ch9tvf4 {
   -webkit-user-select: none;
   user-select: none;
 }
 
-.phmces8 {
+.ch9tvf8 {
   left: 33px;
 }
 
-.phmces9 {
+.ch9tvf9 {
   flex-direction: column;
   width: 100%;
   height: 100%;
   position: relative;
 }
 
-.phmcesa {
+.ch9tvfa {
   height: 100%;
 }
 
-.phmcesb {
+.ch9tvfb {
   position: relative;
 }
 
-.phmcesc {
+.ch9tvfc {
   width: 100%;
   max-width: 100%;
   height: 100%;
   position: absolute;
 }
 
-.phmcesd.phmcesd:after {
+.ch9tvfd.ch9tvfd:after {
   content: "";
   background-color: var(--card-bg-color);
   width: 100%;
@@ -159,113 +163,113 @@
   left: 0;
 }
 
-.phmcese {
+.ch9tvfe {
   z-index: 20;
   width: 100%;
   height: 100%;
   position: relative;
 }
 
-.phmcesf {
+.ch9tvff {
   border-top: 1px solid var(--card-border-color);
   flex-wrap: wrap;
 }
 
-.phmcesg {
+.ch9tvfg {
   position: relative;
 }
 
-.phmcesi {
+.ch9tvfi {
   height: 100%;
-  min-height: var(--phmcesh);
+  min-height: var(--ch9tvfh);
 }
 
-.phmcesj {
+.ch9tvfj {
   position: relative;
 }
 
-.phmcesl.phmcesl {
+.ch9tvfl.ch9tvfl {
   transform: initial;
 }
 
-.phmcesl.phmcesl:before, .phmcesl.phmcesl:after {
+.ch9tvfl.ch9tvfl:before, .ch9tvfl.ch9tvfl:after {
   content: none;
 }
 
-.phmcesl > span {
-  gap: var(--phmcesk);
+.ch9tvfl > span {
+  gap: var(--ch9tvfk);
   flex-wrap: wrap;
   align-items: center;
   display: flex !important;
 }
 
-.phmcesm {
+.ch9tvfm {
   border-top: 1px solid var(--card-border-color);
 }
 
-._116oler0 {
+._17ffm660 {
   background: var(--card-bg-color);
   z-index: 1;
   flex-shrink: 0;
 }
 
-._116oler1 {
+._17ffm661 {
   width: 100%;
   min-width: 0;
   min-height: 0;
 }
 
-._116oler2 {
+._17ffm662 {
   min-height: 0;
 }
 
-._1mjpm8q0 {
+.e85d3y0 {
   max-width: 240px;
 }
 
-._1mjpm8q1 {
+.e85d3y1 {
   cursor: pointer;
   margin-right: auto;
 }
 
-._1mjpm8q2 {
+.e85d3y2 {
   width: 4px;
   height: 4px;
   box-shadow: 0 0 0 1px var(--card-bg-color);
   border-radius: 3px;
 }
 
-.qq7z3z0.qq7z3z0 {
+._14yleie0._14yleie0 {
   color: var(--card-muted-fg-color);
 }
 
-.ujs8fmc .json-inspector, .ujs8fmc .json-inspector .json-inspector__selection {
-  font-family: var(--ujs8fm0);
-  font-size: var(--ujs8fm1);
-  line-height: var(--ujs8fm2);
+._1nwt464c .json-inspector, ._1nwt464c .json-inspector .json-inspector__selection {
+  font-family: var(--_1nwt4640);
+  font-size: var(--_1nwt4641);
+  line-height: var(--_1nwt4642);
   color: var(--card-code-fg-color);
 }
 
-.ujs8fmc .json-inspector .json-inspector__leaf {
-  padding-left: var(--ujs8fm5);
+._1nwt464c .json-inspector .json-inspector__leaf {
+  padding-left: var(--_1nwt4645);
 }
 
-.ujs8fmc .json-inspector .json-inspector__leaf.json-inspector__leaf_root {
-  padding-top: var(--ujs8fm3);
+._1nwt464c .json-inspector .json-inspector__leaf.json-inspector__leaf_root {
+  padding-top: var(--_1nwt4643);
   padding-left: 0;
 }
 
-.ujs8fmc .json-inspector > .json-inspector__leaf_root > .json-inspector__line > .json-inspector__key {
+._1nwt464c .json-inspector > .json-inspector__leaf_root > .json-inspector__line > .json-inspector__key {
   display: none;
 }
 
-.ujs8fmc .json-inspector .json-inspector__line {
+._1nwt464c .json-inspector .json-inspector__line {
   cursor: default;
   display: block;
   position: relative;
 }
 
-.ujs8fmc .json-inspector .json-inspector__line:after {
+._1nwt464c .json-inspector .json-inspector__line:after {
   content: "";
   z-index: -1;
   pointer-events: none;
@@ -273,78 +277,710 @@
   inset: 0 -50px 0 -200px;
 }
 
-.ujs8fmc .json-inspector .json-inspector__line:hover:after {
+._1nwt464c .json-inspector .json-inspector__line:hover:after {
   background: var(--card-code-bg-color);
 }
 
-.ujs8fmc .json-inspector .json-inspector__leaf_composite > .json-inspector__line {
+._1nwt464c .json-inspector .json-inspector__leaf_composite > .json-inspector__line {
   cursor: pointer;
 }
 
-.ujs8fmc .json-inspector .json-inspector__leaf_composite > .json-inspector__line:before {
+._1nwt464c .json-inspector .json-inspector__leaf_composite > .json-inspector__line:before {
   content: "▸ ";
-  margin-left: calc(0px - var(--ujs8fm5));
-  font-size: var(--ujs8fm1);
-  line-height: var(--ujs8fm2);
+  margin-left: calc(0px - var(--_1nwt4645));
+  font-size: var(--_1nwt4641);
+  line-height: var(--_1nwt4642);
 }
 
-.ujs8fmc .json-inspector .json-inspector__leaf_expanded.json-inspector__leaf_composite > .json-inspector__line:before {
+._1nwt464c .json-inspector .json-inspector__leaf_expanded.json-inspector__leaf_composite > .json-inspector__line:before {
   content: "▾ ";
-  font-size: var(--ujs8fm1);
-  line-height: var(--ujs8fm2);
+  font-size: var(--_1nwt4641);
+  line-height: var(--_1nwt4642);
 }
 
-.ujs8fmc .json-inspector .json-inspector__radio, .ujs8fmc .json-inspector .json-inspector__flatpath {
+._1nwt464c .json-inspector .json-inspector__radio, ._1nwt464c .json-inspector .json-inspector__flatpath {
   display: none;
 }
 
-.ujs8fmc .json-inspector .json-inspector__value {
-  margin-left: var(--ujs8fm6);
+._1nwt464c .json-inspector .json-inspector__value {
+  margin-left: var(--_1nwt4646);
+}
+
+._1nwt464e {
+  appearance: none;
+  color: var(--card-muted-fg-color);
+  cursor: pointer;
+  font-size: 1.2em;
+  line-height: var(--_1nwt4642);
+  opacity: 0;
+  background: none;
+  border: 0;
+  border-radius: 2px;
+  padding: 0;
+  display: inline-flex;
+  position: absolute;
+  top: 0;
+  right: 0;
+}
+
+._1nwt464e:hover {
+  color: var(--card-fg-color);
 }
 
-.ujs8fmc .json-inspector > .json-inspector__leaf_root > .json-inspector__line > .json-inspector__key + .json-inspector__value {
+._1nwt464e:focus-visible {
+  opacity: 1;
+  outline: 1px solid var(--card-focus-ring-color);
+}
+
+._1nwt464c .json-inspector .json-inspector__line:hover ._1nwt464e {
+  opacity: 1;
+}
+
+._1nwt464d .json-inspector .json-inspector__line {
+  padding-right: 1.5em;
+}
+
+._1nwt464c .json-inspector > .json-inspector__leaf_root > .json-inspector__line > .json-inspector__key + .json-inspector__value {
   margin: 0;
 }
 
-.ujs8fmc .json-inspector .json-inspector__key {
-  color: var(--ujs8fm7);
+._1nwt464c .json-inspector .json-inspector__key {
+  color: var(--_1nwt4647);
 }
 
-.ujs8fmc .json-inspector .json-inspector__value_helper, .ujs8fmc .json-inspector .json-inspector__value_null {
-  color: var(--ujs8fm8);
+._1nwt464c .json-inspector .json-inspector__value_helper, ._1nwt464c .json-inspector .json-inspector__value_null {
+  color: var(--_1nwt4648);
 }
 
-.ujs8fmc .json-inspector .json-inspector__not-found {
-  padding-top: var(--ujs8fm4);
+._1nwt464c .json-inspector .json-inspector__not-found {
+  padding-top: var(--_1nwt4644);
 }
 
-.ujs8fmc .json-inspector .json-inspector__value_string {
-  color: var(--ujs8fm9);
+._1nwt464c .json-inspector .json-inspector__value_string {
+  color: var(--_1nwt4649);
   word-break: break-word;
 }
 
-.ujs8fmc .json-inspector .json-inspector__value_boolean {
-  color: var(--ujs8fma);
+._1nwt464c .json-inspector .json-inspector__value_boolean {
+  color: var(--_1nwt464a);
 }
 
-.ujs8fmc .json-inspector .json-inspector__value_number {
-  color: var(--ujs8fmb);
+._1nwt464c .json-inspector .json-inspector__value_number {
+  color: var(--_1nwt464b);
 }
 
-.ujs8fmc .json-inspector .json-inspector__show-original {
+._1nwt464c .json-inspector .json-inspector__show-original {
   cursor: pointer;
   padding: 0 6px;
   display: inline-block;
 }
 
-.ujs8fmc .json-inspector .json-inspector__show-original:hover {
+._1nwt464c .json-inspector .json-inspector__show-original:hover {
   color: inherit;
 }
 
-.ujs8fmc .json-inspector .json-inspector__show-original:before {
+._1nwt464c .json-inspector .json-inspector__show-original:before {
   content: "↔";
 }
 
-.ujs8fmc .json-inspector .json-inspector__show-original:hover:after {
+._1nwt464c .json-inspector .json-inspector__show-original:hover:after {
   content: " expand";
 }
+
+._189f3iz0 {
+  position: relative;
+}
+
+._189f3iz1 {
+  width: 100%;
+  min-width: 0;
+  height: 100%;
+  min-height: 0;
+  display: flex;
+}
+
+._189f3iz2 {
+  flex-direction: row;
+}
+
+._189f3iz3 {
+  flex-direction: column;
+}
+
+._189f3iz4 {
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+  position: relative;
+}
+
+._189f3iz5 {
+  background: var(--card-border-color);
+  z-index: 11;
+  touch-action: none;
+  outline: none;
+  flex: 0 0 1px;
+  position: relative;
+}
+
+._189f3iz5:after {
+  content: "";
+  position: absolute;
+  inset: -5px;
+}
+
+._189f3iz5:hover:after, ._189f3iz5[data-dragging="true"]:after {
+  background: var(--card-shadow-ambient-color);
+}
+
+._189f3iz5:focus-visible:after {
+  background: var(--card-shadow-ambient-color);
+  outline: 2px solid var(--card-focus-ring-color);
+  outline-offset: -2px;
+}
+
+._189f3iz6 {
+  cursor: col-resize;
+}
+
+._189f3iz6:after {
+  top: 0;
+  bottom: 0;
+}
+
+._189f3iz7 {
+  cursor: row-resize;
+}
+
+._189f3iz7:after {
+  left: 0;
+  right: 0;
+}
+
+._189f3iz8 {
+  cursor: default;
+}
+
+._189f3iz8:hover:after {
+  background: none;
+}
+
+._189f3iz9 {
+  width: 100%;
+  min-width: 0;
+  height: 100%;
+  min-height: 0;
+  position: relative;
+}
+
+._189f3iza {
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+  position: relative;
+}
+
+._189f3izb {
+  z-index: 10;
+  pointer-events: none;
+  -webkit-user-select: none;
+  user-select: none;
+  position: absolute;
+  top: 1rem;
+  left: 33px;
+  right: 0;
+}
+
+._189f3izc {
+  left: 12px;
+}
+
+._189f3izd {
+  pointer-events: auto;
+  margin-top: -.5rem;
+  margin-right: 12px;
+}
+
+._189f3ize {
+  height: 100%;
+}
+
+._189f3izf {
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+}
+
+._189f3izg {
+  flex: 0 auto;
+  min-height: 0;
+  overflow: auto;
+}
+
+._189f3izh {
+  scrollbar-width: none;
+  min-width: 0;
+  overflow-x: auto;
+}
+
+._189f3izh [data-ui="TabList"] {
+  white-space: nowrap;
+}
+
+._189f3izi {
+  flex-direction: column;
+  flex: 1;
+  min-height: 120px;
+  display: flex;
+  position: relative;
+}
+
+._189f3izj {
+  border-top: 1px solid var(--card-border-color);
+  flex-direction: column;
+  flex: 0 auto;
+  min-height: 0;
+  display: flex;
+  position: relative;
+}
+
+._189f3izk {
+  max-height: 40%;
+}
+
+._189f3izl {
+  max-height: none;
+}
+
+._189f3izm {
+  max-height: 45%;
+}
+
+._189f3izn {
+  flex: auto;
+  min-height: 0;
+  position: relative;
+  overflow: auto;
+}
+
+._189f3izo {
+  cursor: row-resize;
+  z-index: 11;
+  touch-action: none;
+  height: 11px;
+  position: absolute;
+  top: -6px;
+  left: 0;
+  right: 0;
+}
+
+._189f3izo:hover, ._189f3izo[data-dragging="true"] {
+  background: var(--card-shadow-ambient-color);
+}
+
+._189f3izo:focus-visible {
+  background: var(--card-shadow-ambient-color);
+  outline: 2px solid var(--card-focus-ring-color);
+  outline-offset: -2px;
+}
+
+._189f3izp {
+  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+  gap: 12px;
+  display: grid;
+}
+
+._189f3izq._189f3izq {
+  display: none;
+}
+
+._189f3izr {
+  flex-direction: column;
+  height: 100%;
+  min-height: 0;
+  display: flex;
+  position: relative;
+}
+
+._189f3izs {
+  min-height: 0;
+  overflow: auto;
+}
+
+._189f3izt {
+  flex-shrink: 0;
+  transition: width .12s ease-out;
+}
+
+._189f3izu {
+  width: 49px;
+}
+
+._189f3izv {
+  width: 224px;
+}
+
+._189f3izw {
+  z-index: 21;
+  background: var(--card-bg-color);
+  box-shadow: 0 0 0 1px var(--card-border-color);
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+}
+
+._189f3izx {
+  position: relative;
+}
+
+._189f3izy {
+  pointer-events: none;
+  position: absolute;
+  top: -2px;
+  right: -2px;
+}
+
+._189f3izz {
+  top: 50%;
+  right: 8px;
+  transform: translateY(-50%);
+}
+
+._189f3iz10 {
+  flex-shrink: 0;
+  width: 49px;
+  position: relative;
+}
+
+._189f3iz11 {
+  background: var(--card-bg-color);
+  flex-shrink: 0;
+  width: 300px;
+  min-height: 0;
+}
+
+._189f3iz12 {
+  width: min(480px, 45vw);
+}
+
+._189f3iz13 {
+  z-index: 22;
+  width: auto;
+  position: absolute;
+  inset: 0;
+}
+
+._189f3iz14 {
+  scrollbar-width: thin;
+  background: var(--card-bg2-color);
+  box-shadow: inset 0 -1px 0 var(--card-border-color);
+  flex-shrink: 0;
+  overflow: auto hidden;
+}
+
+._189f3iz14 [data-ui="Button"]:not(:hover) {
+  background-color: #0000;
+}
+
+._189f3iz15 {
+  align-items: stretch;
+  gap: 2px;
+  display: flex;
+}
+
+._189f3iz16 {
+  flex-shrink: 0;
+  display: flex;
+  position: relative;
+}
+
+._189f3iz16[data-dragging="true"] {
+  z-index: 1;
+}
+
+._189f3iz17 {
+  border: 1px solid #0000;
+  border-bottom: none;
+  border-radius: 3px 3px 0 0;
+  flex-shrink: 0;
+  max-width: 240px;
+  margin-top: 4px;
+  transition: background-color .1s;
+  position: relative;
+}
+
+._189f3iz17:hover {
+  background: var(--card-muted-bg-color);
+}
+
+._189f3iz17[data-selected="true"] {
+  background: var(--card-bg-color);
+  border-color: var(--card-border-color);
+}
+
+._189f3iz16[data-dragging="true"] ._189f3iz17 {
+  box-shadow: 0 2px 6px var(--card-shadow-umbra-color);
+}
+
+._189f3iz18 {
+  flex-shrink: 1;
+  min-width: 0;
+  overflow: hidden;
+}
+
+._189f3iz19 {
+  opacity: 0;
+  flex-shrink: 0;
+  transition: opacity .1s;
+}
+
+._189f3iz17:hover ._189f3iz19, ._189f3iz17:focus-within ._189f3iz19, ._189f3iz17[data-selected="true"] ._189f3iz19 {
+  opacity: 1;
+}
+
+._189f3iz1a {
+  min-width: 120px;
+}
+
+._189f3iz1b {
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+  position: relative;
+  overflow: auto;
+}
+
+._189f3iz1c {
+  max-height: 50vh;
+  overflow: auto;
+}
+
+._189f3iz1d {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  min-width: 0;
+  max-width: 100%;
+  display: block;
+  overflow: hidden;
+}
+
+._189f3iz1d pre, ._189f3iz1d code {
+  white-space: inherit;
+  display: inline;
+}
+
+._189f3iz1d pre:before, ._189f3iz1d pre:after {
+  content: none;
+}
+
+._189f3iz1e {
+  text-align: left;
+  cursor: pointer;
+  width: 100%;
+  display: block;
+}
+
+._189f3iz1e:hover {
+  background: var(--card-muted-bg-color);
+}
+
+._189f3iz1f, ._189f3iz1g {
+  min-width: 0;
+}
+
+._189f3iz1g [data-ui="Box"], ._189f3iz1g [data-ui="Flex"] {
+  min-width: 0;
+  max-width: 100%;
+}
+
+._189f3iz1g > [data-ui="Box"] {
+  width: 100%;
+}
+
+._1pe9hmp7 {
+  cursor: grab;
+  touch-action: none;
+  -webkit-user-select: none;
+  user-select: none;
+  outline: none;
+  height: 100%;
+  position: relative;
+  overflow: hidden;
+}
+
+._1pe9hmp7[data-dragging="true"] {
+  cursor: grabbing;
+}
+
+._1pe9hmp7:focus-visible {
+  box-shadow: inset 0 0 0 2px var(--card-focus-ring-color);
+}
+
+._1pe9hmp8 {
+  transform-origin: 0 0;
+  position: absolute;
+  top: 0;
+  left: 0;
+}
+
+._1pe9hmp9 {
+  pointer-events: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  overflow: visible;
+}
+
+._1pe9hmp9 path {
+  fill: none;
+  stroke: var(--card-muted-fg-color);
+  stroke-opacity: .55;
+  stroke-width: 1.5px;
+}
+
+._1pe9hmpa {
+  box-sizing: border-box;
+  background: var(--card-bg-color);
+  border: 1px solid var(--card-border-color);
+  box-shadow: 0 1px 2px var(--card-shadow-umbra-color);
+  font-family: var(--_1pe9hmp0);
+  font-size: var(--_1pe9hmp1);
+  cursor: default;
+  border-radius: 6px;
+  position: absolute;
+  overflow: hidden;
+}
+
+._1pe9hmpb {
+  box-sizing: border-box;
+  border-bottom: 1px solid var(--card-border-color);
+  background: var(--card-muted-bg-color);
+  align-items: center;
+  gap: 2px;
+  height: 28px;
+  padding-left: 10px;
+  padding-right: 4px;
+  display: flex;
+}
+
+._1pe9hmpc {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+  color: var(--_1pe9hmp2);
+  flex: auto;
+  font-weight: 600;
+  overflow: hidden;
+}
+
+._1pe9hmpd {
+  color: var(--card-muted-fg-color);
+  margin-left: .5ch;
+  font-weight: 400;
+}
+
+._1pe9hmpe {
+  appearance: none;
+  color: var(--card-muted-fg-color);
+  cursor: pointer;
+  font: inherit;
+  background: none;
+  border: 0;
+  border-radius: 3px;
+  flex-shrink: 0;
+  align-items: center;
+  gap: 2px;
+  padding: 2px;
+  font-size: 1.15em;
+  line-height: 1;
+  display: inline-flex;
+}
+
+._1pe9hmpe:hover {
+  color: var(--card-fg-color);
+  background: var(--card-code-bg-color);
+}
+
+._1pe9hmpe:focus-visible {
+  outline: 1px solid var(--card-focus-ring-color);
+}
+
+._1pe9hmpf {
+  white-space: nowrap;
+  align-items: center;
+  height: 20px;
+  padding-left: 10px;
+  padding-right: 10px;
+  display: flex;
+  position: relative;
+  overflow: hidden;
+}
+
+._1pe9hmpg {
+  color: var(--_1pe9hmp2);
+  flex-shrink: 0;
+}
+
+._1pe9hmph {
+  text-overflow: ellipsis;
+  min-width: 0;
+  margin-left: 1ch;
+  overflow: hidden;
+}
+
+._1pe9hmph[data-type="string"] {
+  color: var(--_1pe9hmp3);
+}
+
+._1pe9hmph[data-type="number"] {
+  color: var(--_1pe9hmp4);
+}
+
+._1pe9hmph[data-type="boolean"] {
+  color: var(--_1pe9hmp5);
+}
+
+._1pe9hmph[data-type="null"] {
+  color: var(--_1pe9hmp6);
+}
+
+._1pe9hmph[data-type="child"], ._1pe9hmph[data-type="more"] {
+  color: var(--card-muted-fg-color);
+}
+
+._1pe9hmpi {
+  background: var(--card-muted-fg-color);
+  border-radius: 50%;
+  width: 6px;
+  height: 6px;
+  margin-top: -3px;
+  position: absolute;
+  top: 50%;
+  right: -3px;
+}
+
+._1pe9hmpj {
+  background: var(--card-bg-color);
+  box-shadow: 0 0 0 1px var(--card-border-color);
+  z-index: 1;
+  border-radius: 4px;
+  gap: 2px;
+  padding: 2px;
+  display: flex;
+  position: absolute;
+  bottom: 8px;
+  right: 8px;
+}
+
+._1pe9hmpk {
+  background: var(--card-bg-color);
+  max-width: calc(100% - 140px);
+  box-shadow: 0 0 0 1px var(--card-border-color);
+  z-index: 1;
+  border-radius: 4px;
+  padding: 4px 8px;
+  position: absolute;
+  bottom: 8px;
+  left: 8px;
+}