.tabBar:global(.carbon) {
  margin: 0;
  background-color: transparent;
  background-image: linear-gradient(to bottom, transparent, rgba(51, 51, 51, 0.5));
}
.tabBar:global(.carbon) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.carbon) .tabGroup .tab {
  color: rgba(255, 255, 255, 0.75);
  border-left: 1px solid #333;
}
.tabBar:global(.carbon) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.carbon) .tabGroup .tab .labeledIcon {
  margin: 0;
  padding: 0.75rem 0;
}
.tabBar:global(.carbon) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.carbon) .tabGroup .tab:global(.spottable):focus {
  color: white;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.carbon) .tabGroup .tab:global(.spottable):focus::before {
  background-color: hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.2);
  background-image: linear-gradient(to bottom, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.1), var(--agate-accent-color, #8fd43a) 98%, var(--agate-accent-color, #8fd43a));
}
.tabBar:global(.carbon) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #6abe0b) 98%, var(--agate-accent-color, #8fd43a));
}
.tabBar:global(.carbon) .tabGroup .tab.selected .labeledIcon {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.carbon) .tabGroup .tab.selected:global(.spottable):focus {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.carbon) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #6abe0b) 98%, var(--agate-accent-color, #8fd43a));
}
.tabBar:global(.carbon).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.carbon).horizontal .tabGroup,
.tabBar:global(.carbon).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.carbon).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.carbon).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.carbon).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.carbon).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.cobalt) {
  margin: 0;
  background-color: rgba(0, 0, 0, 0.05);
  background-image: linear-gradient(to left, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.5) 0rem, transparent 0.08333rem);
}
.tabBar:global(.cobalt) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.cobalt) .tabGroup .tab {
  color: var(--agate-accent-color, #8c81ff);
  border-left: 1px solid transparent;
}
.tabBar:global(.cobalt) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.cobalt) .tabGroup .tab .labeledIcon {
  margin: 0.25rem 1.375rem;
  padding: 0.75rem 4rem 0.75rem 0.5rem;
}
.tabBar:global(.cobalt) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.cobalt) .tabGroup .tab:global(.spottable):focus {
  color: var(--agate-accent-color, #8c81ff);
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.cobalt) .tabGroup .tab:global(.spottable):focus::before {
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.cobalt) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.cobalt) .tabGroup .tab.selected .labeledIcon {
  color: var(--agate-accent-color, #8c81ff);
}
.tabBar:global(.cobalt) .tabGroup .tab.selected:global(.spottable):focus {
  color: var(--agate-accent-color, #8c81ff);
}
.tabBar:global(.cobalt) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.cobalt).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.cobalt).horizontal .tabGroup,
.tabBar:global(.cobalt).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.cobalt).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.cobalt).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.cobalt).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.cobalt).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.cobalt):global(.night) {
  margin: 0;
  background-color: rgba(255, 255, 255, 0.05);
  background-image: linear-gradient(to left, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0%), var(--agate-accent-l, 0%), 0.5) 0rem, transparent 0.08333rem);
}
.tabBar:global(.cobalt):global(.night) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab {
  color: #7482bf;
  border-left: 1px solid transparent;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab .labeledIcon {
  margin: 0.25rem 1.375rem;
  padding: 0.75rem 4rem 0.75rem 0.5rem;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab:global(.spottable):focus {
  color: var(--agate-accent-color, #fc7982);
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab:global(.spottable):focus::before {
  background-color: transparent;
  background-image: transparent;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: transparent;
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab.selected .labeledIcon {
  color: var(--agate-accent-color, #fc7982);
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab.selected:global(.spottable):focus {
  color: var(--agate-accent-color, #fc7982);
}
.tabBar:global(.cobalt):global(.night) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: transparent;
}
.tabBar:global(.cobalt):global(.night).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.cobalt):global(.night).horizontal .tabGroup,
.tabBar:global(.cobalt):global(.night).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.cobalt):global(.night).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.cobalt):global(.night).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.cobalt):global(.night).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.cobalt):global(.night).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.copper) {
  margin: 0;
  background-color: rgba(0, 0, 0, 0.05);
  background-image: linear-gradient(to left, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.5) 0rem, transparent 0.08333rem);
}
.tabBar:global(.copper) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.copper) .tabGroup .tab {
  color: var(--agate-accent-color, #a47d66);
  border-left: 1px solid transparent;
}
.tabBar:global(.copper) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.copper) .tabGroup .tab .labeledIcon {
  margin: 0.25rem 1.375rem;
  padding: 0.75rem 4rem 0.75rem 0.5rem;
}
.tabBar:global(.copper) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.copper) .tabGroup .tab:global(.spottable):focus {
  color: var(--agate-accent-color, #a47d66);
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.copper) .tabGroup .tab:global(.spottable):focus::before {
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.copper) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.copper) .tabGroup .tab.selected .labeledIcon {
  color: #373739;
}
.tabBar:global(.copper) .tabGroup .tab.selected:global(.spottable):focus {
  color: #373739;
}
.tabBar:global(.copper) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.copper).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.copper).horizontal .tabGroup,
.tabBar:global(.copper).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.copper).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.copper).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.copper).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.copper).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.copper):global(.night) {
  margin: 0;
  background-color: rgba(255, 255, 255, 0.05);
  background-image: linear-gradient(to left, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0%), var(--agate-accent-l, 0%), 0.5) 0rem, transparent 0.08333rem);
}
.tabBar:global(.copper):global(.night) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab {
  color: var(--agate-accent-color, #e0b094);
  border-left: 1px solid transparent;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab .labeledIcon {
  margin: 0.25rem 1.375rem;
  padding: 0.75rem 4rem 0.75rem 0.5rem;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab:global(.spottable):focus {
  color: var(--agate-accent-color, #e0b094);
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab:global(.spottable):focus::before {
  background-color: transparent;
  background-image: transparent;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: transparent;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab.selected .labeledIcon {
  color: white;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab.selected:global(.spottable):focus {
  color: white;
}
.tabBar:global(.copper):global(.night) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: transparent;
}
.tabBar:global(.copper):global(.night).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.copper):global(.night).horizontal .tabGroup,
.tabBar:global(.copper):global(.night).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.copper):global(.night).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.copper):global(.night).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.copper):global(.night).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.copper):global(.night).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.electro) {
  margin: 0;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.electro) .tabGroup {
  margin: 0;
  padding: 0 1.75rem;
  border-radius: 0.75rem;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.electro) .tabGroup .tab {
  color: white;
  border-left: 1px solid transparent;
}
.tabBar:global(.electro) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0.75rem;
  transform: skewX(-20deg);
}
.tabBar:global(.electro) .tabGroup .tab .labeledIcon {
  margin: 0;
  padding: 0.75rem;
}
.tabBar:global(.electro) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.electro) .tabGroup .tab:global(.spottable):focus {
  color: white;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.electro) .tabGroup .tab:global(.spottable):focus::before {
  background-color: hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.2);
  background-image: linear-gradient(to bottom right, hsl( calc( var(--agate-accent-h, 218) - 27), calc( var(--agate-accent-s, 98%) - 1%), calc( var(--agate-accent-l, 48%) + 17%) ), transparent);
}
.tabBar:global(.electro) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom right, hsl( calc( var(--agate-accent-h, 218) - 27), calc( var(--agate-accent-s, 98%) - 1%), calc( var(--agate-accent-l, 48%) + 17%) ), transparent);
}
.tabBar:global(.electro) .tabGroup .tab.selected .labeledIcon {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.electro) .tabGroup .tab.selected:global(.spottable):focus {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.electro) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom right, hsl( calc( var(--agate-accent-h, 218) - 27), calc( var(--agate-accent-s, 98%) - 1%), calc( var(--agate-accent-l, 48%) + 17%) ), transparent);
}
.tabBar:global(.electro).positionAfter .tabGroup {
  margin: 0 0 0 0.875rem;
}
.tabBar:global(.electro).horizontal .tabGroup,
.tabBar:global(.electro).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.electro).vertical .tabGroup {
  margin: 0;
  padding: 0 1.25rem 0 0;
  transform: none;
}
.tabBar:global(.electro).vertical .tabGroup .tab {
  margin: 0 1.25rem 0 0;
}
.tabBar:global(.electro).vertical .tabGroup .tab::before {
  top: 0;
  right: -10%;
  bottom: 0;
  left: -20%;
}
.tabBar:global(.electro).vertical.positionAfter .tab {
  right: 0;
  padding-right: 10%;
}
.tabBar:global(.gallium) {
  margin: 0;
  background-color: transparent;
  background-image: linear-gradient(to bottom, transparent, rgba(51, 51, 51, 0.5));
}
.tabBar:global(.gallium) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.gallium) .tabGroup .tab {
  color: #000000;
  border-left: 1px solid #333333;
}
.tabBar:global(.gallium) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.gallium) .tabGroup .tab .labeledIcon {
  margin: 0;
  padding: 0.75rem 0;
}
.tabBar:global(.gallium) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.gallium) .tabGroup .tab:global(.spottable):focus {
  color: white;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.gallium) .tabGroup .tab:global(.spottable):focus::before {
  background-color: hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.2);
  background-image: linear-gradient(to bottom, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.1), var(--agate-accent-color, #8b7efe) 98%, var(--agate-accent-color, #8b7efe));
}
.tabBar:global(.gallium) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #c6c0fe) 98%, var(--agate-accent-color, #8b7efe));
}
.tabBar:global(.gallium) .tabGroup .tab.selected .labeledIcon {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.gallium) .tabGroup .tab.selected:global(.spottable):focus {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.gallium) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #c6c0fe) 98%, var(--agate-accent-color, #8b7efe));
}
.tabBar:global(.gallium).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.gallium).horizontal .tabGroup,
.tabBar:global(.gallium).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.gallium).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.gallium).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.gallium).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.gallium).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.gallium):global(.night) {
  margin: 0;
  background-color: transparent;
  background-image: linear-gradient(to bottom, transparent, rgba(51, 51, 51, 0.5));
}
.tabBar:global(.gallium):global(.night) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab {
  color: #ffffff;
  border-left: 1px solid #333333;
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab .labeledIcon {
  margin: 0;
  padding: 0.75rem 0;
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab:global(.spottable):focus {
  color: white;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab:global(.spottable):focus::before {
  background-color: hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.2);
  background-image: linear-gradient(to bottom, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.1), var(--agate-accent-color, #8b7efe) 98%, var(--agate-accent-color, #8b7efe));
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #c6c0fe) 98%, var(--agate-accent-color, #8b7efe));
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab.selected .labeledIcon {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab.selected:global(.spottable):focus {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.gallium):global(.night) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #c6c0fe) 98%, var(--agate-accent-color, #8b7efe));
}
.tabBar:global(.gallium):global(.night).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.gallium):global(.night).horizontal .tabGroup,
.tabBar:global(.gallium):global(.night).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.gallium):global(.night).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.gallium):global(.night).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.gallium):global(.night).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.gallium):global(.night).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.silicon) {
  margin: 0;
  background-color: transparent;
  background-image: linear-gradient(to bottom, transparent, rgba(51, 51, 51, 0.5));
}
.tabBar:global(.silicon) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.silicon) .tabGroup .tab {
  color: #000000;
  border-left: 1px solid #333333;
}
.tabBar:global(.silicon) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.silicon) .tabGroup .tab .labeledIcon {
  margin: 0;
  padding: 0.75rem 0;
}
.tabBar:global(.silicon) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.silicon) .tabGroup .tab:global(.spottable):focus {
  color: white;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.silicon) .tabGroup .tab:global(.spottable):focus::before {
  background-color: hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.2);
  background-image: linear-gradient(to bottom, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.1), var(--agate-accent-color, #ff2d55) 98%, var(--agate-accent-color, #ff2d55));
}
.tabBar:global(.silicon) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #9e00d8) 98%, var(--agate-accent-color, #ff2d55));
}
.tabBar:global(.silicon) .tabGroup .tab.selected .labeledIcon {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.silicon) .tabGroup .tab.selected:global(.spottable):focus {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.silicon) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #9e00d8) 98%, var(--agate-accent-color, #ff2d55));
}
.tabBar:global(.silicon).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.silicon).horizontal .tabGroup,
.tabBar:global(.silicon).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.silicon).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.silicon).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.silicon).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.silicon).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.silicon):global(.night) {
  margin: 0;
  background-color: transparent;
  background-image: linear-gradient(to bottom, transparent, rgba(51, 51, 51, 0.5));
}
.tabBar:global(.silicon):global(.night) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab {
  color: #ffffff;
  border-left: 1px solid #333333;
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab .labeledIcon {
  margin: 0;
  padding: 0.75rem 0;
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab:global(.spottable):focus {
  color: white;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab:global(.spottable):focus::before {
  background-color: hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.2);
  background-image: linear-gradient(to bottom, hsla(var(--agate-accent-h, 0), var(--agate-accent-s, 0), var(--agate-accent-l, 0), 0.1), var(--agate-accent-color, #ff2d55) 98%, var(--agate-accent-color, #ff2d55));
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab.selected::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #9e00d8) 98%, var(--agate-accent-color, #ff2d55));
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab.selected .labeledIcon {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab.selected:global(.spottable):focus {
  color: rgba(255, 255, 255, 0.9);
}
.tabBar:global(.silicon):global(.night) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: transparent;
  background-image: linear-gradient(to bottom, hsla(var(--agate-highlight-h, 0), var(--agate-highlight-s, 0), var(--agate-highlight-l, 0), 0.1), var(--agate-highlight-color, #9e00d8) 98%, var(--agate-accent-color, #ff2d55));
}
.tabBar:global(.silicon):global(.night).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.silicon):global(.night).horizontal .tabGroup,
.tabBar:global(.silicon):global(.night).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.silicon):global(.night).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.silicon):global(.night).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.silicon):global(.night).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.silicon):global(.night).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
.tabBar:global(.titanium) {
  margin: 0;
  background-color: #eaeaea;
  background-image: none;
}
.tabBar:global(.titanium) .tabGroup {
  margin: 0;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
  transform: none;
}
.tabBar:global(.titanium) .tabGroup .tab {
  color: rgba(0, 0, 0, 0.5);
  border-left: 1px solid transparent;
}
.tabBar:global(.titanium) .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  content: "";
  display: block;
  border-radius: 0;
  transform: none;
}
.tabBar:global(.titanium) .tabGroup .tab .labeledIcon {
  margin: 0.25rem 0;
  padding: 0.75rem 4rem 0.75rem 0.5rem;
}
.tabBar:global(.titanium) .tabGroup .tab:first-child {
  border-left-width: 0;
}
.tabBar:global(.titanium) .tabGroup .tab:global(.spottable):focus {
  color: #4d4d4d;
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.titanium) .tabGroup .tab:global(.spottable):focus::before {
  background-color: transparent;
  background-image: none;
}
.tabBar:global(.titanium) .tabGroup .tab.selected::before {
  background-color: #ddd;
  background-image: none;
}
.tabBar:global(.titanium) .tabGroup .tab.selected .labeledIcon {
  color: #262626;
}
.tabBar:global(.titanium) .tabGroup .tab.selected:global(.spottable):focus {
  color: #262626;
}
.tabBar:global(.titanium) .tabGroup .tab.selected:global(.spottable):focus::before {
  background-color: #ddd;
  background-image: none;
}
.tabBar:global(.titanium).positionAfter .tabGroup {
  margin: 0;
}
.tabBar:global(.titanium).horizontal .tabGroup,
.tabBar:global(.titanium).horizontal .tabGroup .labeledIcon {
  height: 100%;
}
.tabBar:global(.titanium).vertical .tabGroup {
  margin: 0;
  padding: 0;
  transform: none;
}
.tabBar:global(.titanium).vertical .tabGroup .tab {
  margin: 0;
}
.tabBar:global(.titanium).vertical .tabGroup .tab::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.tabBar:global(.titanium).vertical.positionAfter .tab {
  right: 0;
  padding-right: 0;
}
