.item {
  display: flex;
  position: relative;
}
.item.hasLabel .itemContent.labelAfter .content,
.item.hasLabel .itemContent.labelBelow .content {
  order: 1;
}
.item.hasLabel .itemContent.labelAfter .label,
.item.hasLabel .itemContent.labelBelow .label {
  order: 2;
}
.item.hasLabel .itemContent.labelAbove .content,
.item.hasLabel .itemContent.labelBefore .content {
  order: 2;
}
.item.hasLabel .itemContent.labelAbove .label,
.item.hasLabel .itemContent.labelBefore .label {
  order: 1;
}
.item .slotAfter,
.item .slotBefore {
  display: flex;
  justify-content: center;
}
.item:global(.carbon) {
  font-size: 1.25rem;
  font-weight: normal;
  line-height: 2.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 2.25rem;
  border-style: solid;
  border-width: inherit;
  border-color: transparent;
  color: var(--agate-accent-color, #8fd43a);
  background-color: transparent;
}
.item:global(.carbon).hasLabel .itemContent {
  line-height: inherit;
  padding: 0.875rem 0;
}
.item:global(.carbon).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.carbon).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.carbon).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.carbon).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.carbon):not(.centered) .labelAfter .content,
.item:global(.carbon):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.carbon):not(.centered) .labelAfter .label,
.item:global(.carbon):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.carbon) .label {
  color: var(--agate-accent-color, #8fd43a);
  font-size: inherit;
  line-height: inherit;
}
.item:global(.carbon) .slotAfter {
  font-size: inherit;
}
.item:global(.carbon).selected {
  color: var(--agate-accent-color, #8fd43a);
}
.item:global(.carbon).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.carbon).inline .itemContent {
  max-width: 10rem;
}
.item:global(.carbon).inline .itemContent,
.item:global(.carbon).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.carbon).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.carbon).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.carbon).centered .itemContent {
  max-width: fit-content;
}
.item:global(.carbon).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.carbon).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.carbon).small {
  font-size: inherit;
  line-height: 2rem;
}
.item:global(.carbon).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.carbon).small .itemContent {
  line-height: inherit;
}
.item:global(.carbon).small .itemContent .label {
  font-size: inherit;
}
.item:global(.carbon):global(.spottable):focus {
  border-color: transparent;
  background-color: var(--agate-highlight-color, #6abe0b);
  color: black;
}
.item:global(.carbon):global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #8fd43a);
}
.item:global(.carbon).selected {
  background-color: transparent;
  border-color: transparent;
  color: black;
}
.item:global(.carbon).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.carbon).selected .itemContent .label {
  color: inherit;
}
.item:global(.carbon).selected:global(.spottable):focus {
  border-color: transparent;
  background-color: var(--agate-highlight-color, #6abe0b);
  color: black;
}
.item:global(.carbon).selected:global(.spottable):focus .itemContent .label {
  color: black;
}
.item:global(.cobalt) {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 2.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 2.25rem;
  border-style: solid;
  border-width: inherit;
  border-color: transparent;
  color: inherit;
  background-color: transparent;
}
.item:global(.cobalt).hasLabel .itemContent {
  line-height: inherit;
  padding: 0.875rem 0;
}
.item:global(.cobalt).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.cobalt).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.cobalt).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.cobalt).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.cobalt):not(.centered) .labelAfter .content,
.item:global(.cobalt):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.cobalt):not(.centered) .labelAfter .label,
.item:global(.cobalt):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.cobalt) .label {
  color: var(--agate-accent-color, #8c81ff);
  font-size: inherit;
  line-height: inherit;
}
.item:global(.cobalt) .slotAfter {
  font-size: inherit;
}
.item:global(.cobalt).selected {
  color: var(--agate-accent-color, #8c81ff);
}
.item:global(.cobalt).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.cobalt).inline .itemContent {
  max-width: 10rem;
}
.item:global(.cobalt).inline .itemContent,
.item:global(.cobalt).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.cobalt).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.cobalt).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.cobalt).centered .itemContent {
  max-width: fit-content;
}
.item:global(.cobalt).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.cobalt).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.cobalt).small {
  font-size: inherit;
  line-height: 2rem;
}
.item:global(.cobalt).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.cobalt).small .itemContent {
  line-height: inherit;
}
.item:global(.cobalt).small .itemContent .label {
  font-size: inherit;
}
.item:global(.cobalt):global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.5);
  color: var(--agate-accent-color, #8c81ff);
}
.item:global(.cobalt):global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #8c81ff);
}
.item:global(.cobalt).selected {
  background-color: transparent;
  border-color: transparent;
  color: var(--agate-accent-color, #8c81ff);
}
.item:global(.cobalt).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.cobalt).selected .itemContent .label {
  color: inherit;
}
.item:global(.cobalt).selected:global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.5);
  color: var(--agate-accent-color, #8c81ff);
}
.item:global(.cobalt).selected:global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #8c81ff);
}
.item:global(.cobalt):global(.night) {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 2.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 2.25rem;
  border-style: solid;
  border-width: inherit;
  border-color: transparent;
  color: var(--agate-accent-color, #fc7982);
  background-color: transparent;
}
.item:global(.cobalt):global(.night).hasLabel .itemContent {
  line-height: inherit;
  padding: 0.875rem 0;
}
.item:global(.cobalt):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.cobalt):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.cobalt):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.cobalt):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.cobalt):global(.night):not(.centered) .labelAfter .content,
.item:global(.cobalt):global(.night):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.cobalt):global(.night):not(.centered) .labelAfter .label,
.item:global(.cobalt):global(.night):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.cobalt):global(.night) .label {
  color: var(--agate-accent-color, #fc7982);
  font-size: inherit;
  line-height: inherit;
}
.item:global(.cobalt):global(.night) .slotAfter {
  font-size: inherit;
}
.item:global(.cobalt):global(.night).selected {
  color: var(--agate-accent-color, #fc7982);
}
.item:global(.cobalt):global(.night).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.cobalt):global(.night).inline .itemContent {
  max-width: 10rem;
}
.item:global(.cobalt):global(.night).inline .itemContent,
.item:global(.cobalt):global(.night).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.cobalt):global(.night).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.cobalt):global(.night).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.cobalt):global(.night).centered .itemContent {
  max-width: fit-content;
}
.item:global(.cobalt):global(.night).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.cobalt):global(.night).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.cobalt):global(.night).small {
  font-size: inherit;
  line-height: 2rem;
}
.item:global(.cobalt):global(.night).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.cobalt):global(.night).small .itemContent {
  line-height: inherit;
}
.item:global(.cobalt):global(.night).small .itemContent .label {
  font-size: inherit;
}
.item:global(.cobalt):global(.night):global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.1);
  color: var(--agate-accent-color, #fc7982);
}
.item:global(.cobalt):global(.night):global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #fc7982);
}
.item:global(.cobalt):global(.night).selected {
  background-color: transparent;
  border-color: transparent;
  color: var(--agate-accent-color, #fc7982);
}
.item:global(.cobalt):global(.night).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.cobalt):global(.night).selected .itemContent .label {
  color: inherit;
}
.item:global(.cobalt):global(.night).selected:global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.1);
  color: var(--agate-accent-color, #fc7982);
}
.item:global(.cobalt):global(.night).selected:global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #fc7982);
}
.item:global(.copper) {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 2.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 2.25rem;
  border-style: solid;
  border-width: inherit;
  border-color: transparent;
  color: inherit;
  background-color: transparent;
}
.item:global(.copper).hasLabel .itemContent {
  line-height: inherit;
  padding: 0.875rem 0;
}
.item:global(.copper).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.copper).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.copper).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.copper).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.copper):not(.centered) .labelAfter .content,
.item:global(.copper):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.copper):not(.centered) .labelAfter .label,
.item:global(.copper):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.copper) .label {
  color: var(--agate-accent-color, #a47d66);
  font-size: inherit;
  line-height: inherit;
}
.item:global(.copper) .slotAfter {
  font-size: inherit;
}
.item:global(.copper).selected {
  color: var(--agate-accent-color, #a47d66);
}
.item:global(.copper).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.copper).inline .itemContent {
  max-width: 10rem;
}
.item:global(.copper).inline .itemContent,
.item:global(.copper).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.copper).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.copper).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.copper).centered .itemContent {
  max-width: fit-content;
}
.item:global(.copper).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.copper).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.copper).small {
  font-size: inherit;
  line-height: 2rem;
}
.item:global(.copper).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.copper).small .itemContent {
  line-height: inherit;
}
.item:global(.copper).small .itemContent .label {
  font-size: inherit;
}
.item:global(.copper):global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.5);
  color: var(--agate-accent-color, #a47d66);
}
.item:global(.copper):global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #a47d66);
}
.item:global(.copper).selected {
  background-color: transparent;
  border-color: transparent;
  color: var(--agate-accent-color, #a47d66);
}
.item:global(.copper).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.copper).selected .itemContent .label {
  color: inherit;
}
.item:global(.copper).selected:global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.5);
  color: var(--agate-accent-color, #a47d66);
}
.item:global(.copper).selected:global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #a47d66);
}
.item:global(.copper):global(.night) {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 2.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 2.25rem;
  border-style: solid;
  border-width: inherit;
  border-color: transparent;
  color: var(--agate-accent-color, #e0b094);
  background-color: transparent;
}
.item:global(.copper):global(.night).hasLabel .itemContent {
  line-height: inherit;
  padding: 0.875rem 0;
}
.item:global(.copper):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.copper):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.copper):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.copper):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.copper):global(.night):not(.centered) .labelAfter .content,
.item:global(.copper):global(.night):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.copper):global(.night):not(.centered) .labelAfter .label,
.item:global(.copper):global(.night):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.copper):global(.night) .label {
  color: var(--agate-accent-color, #e0b094);
  font-size: inherit;
  line-height: inherit;
}
.item:global(.copper):global(.night) .slotAfter {
  font-size: inherit;
}
.item:global(.copper):global(.night).selected {
  color: var(--agate-accent-color, #e0b094);
}
.item:global(.copper):global(.night).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.copper):global(.night).inline .itemContent {
  max-width: 10rem;
}
.item:global(.copper):global(.night).inline .itemContent,
.item:global(.copper):global(.night).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.copper):global(.night).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.copper):global(.night).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.copper):global(.night).centered .itemContent {
  max-width: fit-content;
}
.item:global(.copper):global(.night).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.copper):global(.night).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.copper):global(.night).small {
  font-size: inherit;
  line-height: 2rem;
}
.item:global(.copper):global(.night).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.copper):global(.night).small .itemContent {
  line-height: inherit;
}
.item:global(.copper):global(.night).small .itemContent .label {
  font-size: inherit;
}
.item:global(.copper):global(.night):global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.1);
  color: var(--agate-accent-color, #e0b094);
}
.item:global(.copper):global(.night):global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #e0b094);
}
.item:global(.copper):global(.night).selected {
  background-color: transparent;
  border-color: transparent;
  color: var(--agate-accent-color, #e0b094);
}
.item:global(.copper):global(.night).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.copper):global(.night).selected .itemContent .label {
  color: inherit;
}
.item:global(.copper):global(.night).selected:global(.spottable):focus {
  border-color: transparent;
  background-color: hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0%), var(--agate-highlight-l, 0%), 0.1);
  color: var(--agate-accent-color, #e0b094);
}
.item:global(.copper):global(.night).selected:global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #e0b094);
}
.item:global(.electro) {
  font-size: 1.25rem;
  font-weight: normal;
  line-height: 2.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 2.25rem;
  border-style: solid;
  border-width: inherit;
  border-color: transparent;
  color: white;
  background-color: transparent;
}
.item:global(.electro).hasLabel .itemContent {
  line-height: inherit;
  padding: 0.875rem 0;
}
.item:global(.electro).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.electro).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.electro).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.electro).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.electro):not(.centered) .labelAfter .content,
.item:global(.electro):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.electro):not(.centered) .labelAfter .label,
.item:global(.electro):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.electro) .label {
  color: var(--agate-accent-color, #0359f0);
  font-size: inherit;
  line-height: inherit;
}
.item:global(.electro) .slotAfter {
  font-size: inherit;
}
.item:global(.electro).selected {
  color: var(--agate-accent-color, #0359f0);
}
.item:global(.electro).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.electro).inline .itemContent {
  max-width: 10rem;
}
.item:global(.electro).inline .itemContent,
.item:global(.electro).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.electro).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.electro).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.electro).centered .itemContent {
  max-width: fit-content;
}
.item:global(.electro).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.electro).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.electro).small {
  font-size: inherit;
  line-height: 2rem;
}
.item:global(.electro).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.electro).small .itemContent {
  line-height: inherit;
}
.item:global(.electro).small .itemContent .label {
  font-size: inherit;
}
.item:global(.electro):global(.spottable):focus {
  border-color: transparent;
  background-color: hsla( calc( var(--agate-accent-h, 218) - 27), calc( var(--agate-accent-s, 98%) - 1%), calc( var(--agate-accent-l, 48%) + 17%) , 0.7);
  color: white;
}
.item:global(.electro):global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, #0359f0);
}
.item:global(.electro).selected {
  background-color: transparent;
  border-color: transparent;
  color: white;
}
.item:global(.electro).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.electro).selected .itemContent .label {
  color: inherit;
}
.item:global(.electro).selected:global(.spottable):focus {
  border-color: transparent;
  background-color: hsla( calc( var(--agate-accent-h, 218) - 27), calc( var(--agate-accent-s, 98%) - 1%), calc( var(--agate-accent-l, 48%) + 17%) , 0.7);
  color: white;
}
.item:global(.electro).selected:global(.spottable):focus .itemContent .label {
  color: white;
}
.item:global(.gallium) {
  font-size: 1.66667rem;
  font-weight: 500;
  line-height: 3.75rem;
  padding-left: 1.33333rem;
  padding-right: 1.33333rem;
  line-height: 3.5rem;
  border-style: solid;
  border-width: 0.125rem;
  border-color: transparent;
  color: #000000;
  background-color: transparent;
}
.item:global(.gallium).hasLabel .itemContent {
  line-height: 1.75rem;
  padding: 0.875rem 0;
}
.item:global(.gallium).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.gallium).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.gallium).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.gallium).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.gallium):not(.centered) .labelAfter .content,
.item:global(.gallium):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.gallium):not(.centered) .labelAfter .label,
.item:global(.gallium):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.gallium) .label {
  color: #000000;
  font-size: 1.125rem;
  line-height: 1.375rem;
}
.item:global(.gallium) .slotAfter {
  font-size: inherit;
}
.item:global(.gallium).selected {
  color: #000000;
}
.item:global(.gallium).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.gallium).inline .itemContent {
  max-width: 10rem;
}
.item:global(.gallium).inline .itemContent,
.item:global(.gallium).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.gallium).inline.hasLabel .slotAfter {
  padding-left: 0.875rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.gallium).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: 0.875rem;
}
.item:global(.gallium).centered .itemContent {
  max-width: fit-content;
}
.item:global(.gallium).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.gallium).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.gallium).small {
  font-size: 1.66667rem;
  line-height: 2rem;
}
.item:global(.gallium).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.gallium).small .itemContent {
  line-height: 1.75rem;
}
.item:global(.gallium).small .itemContent .label {
  font-size: 1.125rem;
}
.item:global(.gallium):global(.spottable):focus {
  border-color: var(--agate-accent-color, #8b7efe);
  background-color: transparent;
  color: #000000;
}
.item:global(.gallium):global(.spottable):focus .itemContent .label {
  color: #000000;
}
.item:global(.gallium).selected {
  background-color: transparent;
  border-color: var(--agate-accent-color, #8b7efe);
  color: #000000;
}
.item:global(.gallium).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.gallium).selected .itemContent .label {
  color: inherit;
}
.item:global(.gallium).selected:global(.spottable):focus {
  border-color: var(--agate-accent-color, #8b7efe);
  background-color: transparent;
  color: #000000;
}
.item:global(.gallium).selected:global(.spottable):focus .itemContent .label {
  color: #000000;
}
.item:global(.gallium):global(.night) {
  font-size: 1.66667rem;
  font-weight: 500;
  line-height: 3.75rem;
  padding-left: 1.33333rem;
  padding-right: 1.33333rem;
  line-height: 3.5rem;
  border-style: solid;
  border-width: 0.125rem;
  border-color: transparent;
  color: #ffffff;
  background-color: transparent;
}
.item:global(.gallium):global(.night).hasLabel .itemContent {
  line-height: 1.75rem;
  padding: 0.875rem 0;
}
.item:global(.gallium):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.gallium):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.gallium):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.gallium):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.gallium):global(.night):not(.centered) .labelAfter .content,
.item:global(.gallium):global(.night):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.gallium):global(.night):not(.centered) .labelAfter .label,
.item:global(.gallium):global(.night):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.gallium):global(.night) .label {
  color: #ffffff;
  font-size: 1.125rem;
  line-height: 1.375rem;
}
.item:global(.gallium):global(.night) .slotAfter {
  font-size: inherit;
}
.item:global(.gallium):global(.night).selected {
  color: #ffffff;
}
.item:global(.gallium):global(.night).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.gallium):global(.night).inline .itemContent {
  max-width: 10rem;
}
.item:global(.gallium):global(.night).inline .itemContent,
.item:global(.gallium):global(.night).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.gallium):global(.night).inline.hasLabel .slotAfter {
  padding-left: 0.875rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.gallium):global(.night).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: 0.875rem;
}
.item:global(.gallium):global(.night).centered .itemContent {
  max-width: fit-content;
}
.item:global(.gallium):global(.night).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.gallium):global(.night).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.gallium):global(.night).small {
  font-size: 1.66667rem;
  line-height: 2rem;
}
.item:global(.gallium):global(.night).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.gallium):global(.night).small .itemContent {
  line-height: 1.75rem;
}
.item:global(.gallium):global(.night).small .itemContent .label {
  font-size: 1.125rem;
}
.item:global(.gallium):global(.night):global(.spottable):focus {
  border-color: var(--agate-accent-color, #8b7efe);
  background-color: transparent;
  color: #ffffff;
}
.item:global(.gallium):global(.night):global(.spottable):focus .itemContent .label {
  color: #ffffff;
}
.item:global(.gallium):global(.night).selected {
  background-color: transparent;
  border-color: var(--agate-accent-color, #8b7efe);
  color: #ffffff;
}
.item:global(.gallium):global(.night).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.gallium):global(.night).selected .itemContent .label {
  color: inherit;
}
.item:global(.gallium):global(.night).selected:global(.spottable):focus {
  border-color: var(--agate-accent-color, #8b7efe);
  background-color: transparent;
  color: #ffffff;
}
.item:global(.gallium):global(.night).selected:global(.spottable):focus .itemContent .label {
  color: #ffffff;
}
.item:global(.silicon) {
  font-size: 1.375rem;
  font-weight: normal;
  line-height: 4.25rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  line-height: 4rem;
  border-style: solid;
  border-width: 0 0 0.125rem 0;
  border-color: rgba(0, 0, 0, 0.4);
  color: #000000;
  background-color: transparent;
}
.item:global(.silicon).hasLabel .itemContent {
  line-height: 1.75rem;
  padding: 0.875rem 0;
}
.item:global(.silicon).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.silicon).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.silicon).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.silicon).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.silicon):not(.centered) .labelAfter .content,
.item:global(.silicon):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.silicon):not(.centered) .labelAfter .label,
.item:global(.silicon):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.silicon) .label {
  color: #999999;
  font-size: 1rem;
  line-height: 1.375rem;
}
.item:global(.silicon) .slotAfter {
  font-size: 1rem;
}
.item:global(.silicon).selected {
  color: #999999;
}
.item:global(.silicon).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.silicon).inline .itemContent {
  max-width: 10rem;
}
.item:global(.silicon).inline .itemContent,
.item:global(.silicon).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.silicon).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.silicon).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.silicon).centered .itemContent {
  max-width: fit-content;
}
.item:global(.silicon).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.silicon).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.silicon).small {
  font-size: 1.375rem;
  line-height: 2rem;
}
.item:global(.silicon).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.silicon).small .itemContent {
  line-height: 1.75rem;
}
.item:global(.silicon).small .itemContent .label {
  font-size: 1rem;
}
.item:global(.silicon):global(.spottable):focus {
  border-color: rgba(0, 0, 0, 0.4);
  background-color: rgba(0, 0, 0, 0.15);
  color: #000000;
}
.item:global(.silicon):global(.spottable):focus .itemContent .label {
  color: #999999;
}
.item:global(.silicon).selected {
  background-color: transparent;
  border-color: var(--agate-accent-color, #ff2d55);
  color: #000000;
}
.item:global(.silicon).selected::before {
  content: "";
  height: 0.375rem;
  width: 0.375rem;
  background-color: var(--agate-accent-color, #ff2d55);
  border-radius: 0.1875rem;
  align-self: center;
  margin-right: 0.875rem;
}
.item:global(.silicon).selected .itemContent .label {
  color: #000000;
}
.item:global(.silicon).selected:global(.spottable):focus {
  border-color: var(--agate-accent-color, #ff2d55);
  background-color: rgba(0, 0, 0, 0.15);
  color: #000000;
}
.item:global(.silicon).selected:global(.spottable):focus .itemContent .label {
  color: #000000;
}
.item:global(.silicon):global(.night) {
  font-size: 1.375rem;
  font-weight: normal;
  line-height: 4.25rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  line-height: 4rem;
  border-style: solid;
  border-width: 0 0 0.125rem 0;
  border-color: rgba(255, 255, 255, 0.4);
  color: #ffffff;
  background-color: transparent;
}
.item:global(.silicon):global(.night).hasLabel .itemContent {
  line-height: 1.75rem;
  padding: 0.875rem 0;
}
.item:global(.silicon):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.silicon):global(.night).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.silicon):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.silicon):global(.night).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.silicon):global(.night):not(.centered) .labelAfter .content,
.item:global(.silicon):global(.night):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.silicon):global(.night):not(.centered) .labelAfter .label,
.item:global(.silicon):global(.night):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.silicon):global(.night) .label {
  color: #999999;
  font-size: 1rem;
  line-height: 1.375rem;
}
.item:global(.silicon):global(.night) .slotAfter {
  font-size: 1rem;
}
.item:global(.silicon):global(.night).selected {
  color: #999999;
}
.item:global(.silicon):global(.night).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.silicon):global(.night).inline .itemContent {
  max-width: 10rem;
}
.item:global(.silicon):global(.night).inline .itemContent,
.item:global(.silicon):global(.night).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.silicon):global(.night).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.silicon):global(.night).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.silicon):global(.night).centered .itemContent {
  max-width: fit-content;
}
.item:global(.silicon):global(.night).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.silicon):global(.night).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.silicon):global(.night).small {
  font-size: 1.375rem;
  line-height: 2rem;
}
.item:global(.silicon):global(.night).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.silicon):global(.night).small .itemContent {
  line-height: 1.75rem;
}
.item:global(.silicon):global(.night).small .itemContent .label {
  font-size: 1rem;
}
.item:global(.silicon):global(.night):global(.spottable):focus {
  border-color: rgba(255, 255, 255, 0.4);
  background-color: rgba(255, 255, 255, 0.15);
  color: #ffffff;
}
.item:global(.silicon):global(.night):global(.spottable):focus .itemContent .label {
  color: #999999;
}
.item:global(.silicon):global(.night).selected {
  background-color: transparent;
  border-color: var(--agate-accent-color, #ff2d55);
  color: #ffffff;
}
.item:global(.silicon):global(.night).selected::before {
  content: "";
  height: 0.375rem;
  width: 0.375rem;
  background-color: var(--agate-accent-color, #ff2d55);
  border-radius: 0.1875rem;
  align-self: center;
  margin-right: 0.875rem;
}
.item:global(.silicon):global(.night).selected .itemContent .label {
  color: #ffffff;
}
.item:global(.silicon):global(.night).selected:global(.spottable):focus {
  border-color: var(--agate-accent-color, #ff2d55);
  background-color: rgba(255, 255, 255, 0.15);
  color: #ffffff;
}
.item:global(.silicon):global(.night).selected:global(.spottable):focus .itemContent .label {
  color: #ffffff;
}
.item:global(.titanium) {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 2.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  line-height: 2.25rem;
  border-style: solid;
  border-width: inherit;
  border-color: transparent;
  color: inherit;
  background-color: transparent;
}
.item:global(.titanium).hasLabel .itemContent {
  line-height: inherit;
  padding: 0.875rem 0;
}
.item:global(.titanium).hasLabel .itemContent.labelBefore .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
:global(.enact-locale-right-to-left) .item:global(.titanium).hasLabel .itemContent.labelBefore .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
.item:global(.titanium).hasLabel .itemContent.labelAfter .label {
  padding-left: 0.41667rem;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.titanium).hasLabel .itemContent.labelAfter .label {
  padding-left: 0;
  padding-right: 0.41667rem;
}
.item:global(.titanium):not(.centered) .labelAfter .content,
.item:global(.titanium):not(.centered) .labelBefore .content {
  box-sizing: border-box;
  min-width: 60%;
}
.item:global(.titanium):not(.centered) .labelAfter .label,
.item:global(.titanium):not(.centered) .labelBefore .label {
  box-sizing: border-box;
  max-width: 40%;
}
.item:global(.titanium) .label {
  color: var(--agate-accent-color, rgba(0, 0, 0, 0.1));
  font-size: inherit;
  line-height: inherit;
}
.item:global(.titanium) .slotAfter {
  font-size: inherit;
}
.item:global(.titanium).selected {
  color: var(--agate-accent-color, rgba(0, 0, 0, 0.1));
}
.item:global(.titanium).inline {
  display: inline-flex;
  max-width: 16.66667rem;
}
.item:global(.titanium).inline .itemContent {
  max-width: 10rem;
}
.item:global(.titanium).inline .itemContent,
.item:global(.titanium).inline .content {
  flex-shrink: 1;
  overflow: auto;
}
.item:global(.titanium).inline.hasLabel .slotAfter {
  padding-left: inherit;
  padding-right: 0;
}
:global(.enact-locale-right-to-left) .item:global(.titanium).inline.hasLabel .slotAfter {
  padding-left: 0;
  padding-right: inherit;
}
.item:global(.titanium).centered .itemContent {
  max-width: fit-content;
}
.item:global(.titanium).centered.inline {
  max-width: 16.66667rem;
}
.item:global(.titanium).large {
  /* Needed to prevent global class being added in the DOM */
}
.item:global(.titanium).small {
  font-size: inherit;
  line-height: 2rem;
}
.item:global(.titanium).small.hasLabel .itemContent {
  padding: 0.5rem 0;
}
.item:global(.titanium).small .itemContent {
  line-height: inherit;
}
.item:global(.titanium).small .itemContent .label {
  font-size: inherit;
}
.item:global(.titanium):global(.spottable):focus {
  border-color: transparent;
  background-color: var(--agate-highlight-color, #2a48ca);
  color: white;
}
.item:global(.titanium):global(.spottable):focus .itemContent .label {
  color: var(--agate-accent-color, rgba(0, 0, 0, 0.1));
}
.item:global(.titanium).selected {
  background-color: transparent;
  border-color: transparent;
  color: white;
}
.item:global(.titanium).selected::before {
  content: "";
  height: inherit;
  width: inherit;
  background-color: inherit;
  border-radius: inherit;
  align-self: inherit;
  margin-right: inherit;
}
.item:global(.titanium).selected .itemContent .label {
  color: inherit;
}
.item:global(.titanium).selected:global(.spottable):focus {
  border-color: transparent;
  background-color: var(--agate-highlight-color, #2a48ca);
  color: white;
}
.item:global(.titanium).selected:global(.spottable):focus .itemContent .label {
  color: white;
}
