.progressBar:global(.carbon) {
  position: relative;
  height: 0.25rem;
  width: 100%;
  background-color: rgba(102, 102, 102, 0.5);
  background-image: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.03));
  border-radius: 0;
  transform: none;
}
.progressBar:global(.carbon).small {
  height: 0.125rem;
}
.progressBar:global(.carbon).vertical {
  height: 100%;
  width: 0.25rem;
  transform: none;
}
.progressBar:global(.carbon).vertical.small {
  width: 0.125rem;
}
.progressBar:global(.carbon).vertical .fill {
  background-image: linear-gradient(to top, transparent, rgba(255, 255, 255, 0.75));
}
.progressBar:global(.carbon) .fill {
  background-color: var(--agate-highlight-color, #6abe0b);
  background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.75));
  border-radius: 0;
}
.progressBar:global(.cobalt) {
  position: relative;
  height: 0.5rem;
  width: 100%;
  background-color: var(--agate-accent-color, #8c81ff);
  background-image: none;
  border-radius: 3.5rem;
  transform: none;
}
.progressBar:global(.cobalt).small {
  height: 0.25rem;
}
.progressBar:global(.cobalt).vertical {
  height: 100%;
  width: 0.5rem;
  transform: none;
}
.progressBar:global(.cobalt).vertical.small {
  width: 0.25rem;
}
.progressBar:global(.cobalt).vertical .fill {
  background-image: none;
}
.progressBar:global(.cobalt) .fill {
  background-color: var(--agate-highlight-color, #fff);
  background-image: none;
  border-radius: 3.5rem;
}
.progressBar:global(.cobalt):global(.night) {
  position: relative;
  height: 0.5rem;
  width: 100%;
  background-color: var(--agate-accent-color, #fc7982);
  background-image: none;
  border-radius: 3.5rem;
  transform: none;
}
.progressBar:global(.cobalt):global(.night).small {
  height: 0.25rem;
}
.progressBar:global(.cobalt):global(.night).vertical {
  height: 100%;
  width: 0.5rem;
  transform: none;
}
.progressBar:global(.cobalt):global(.night).vertical.small {
  width: 0.25rem;
}
.progressBar:global(.cobalt):global(.night).vertical .fill {
  background-image: none;
}
.progressBar:global(.cobalt):global(.night) .fill {
  background-color: var(--agate-highlight-color, #fff);
  background-image: none;
  border-radius: 3.5rem;
}
.progressBar:global(.copper) {
  position: relative;
  height: 0.5rem;
  width: 100%;
  background-color: var(--agate-accent-color, #a47d66);
  background-image: none;
  border-radius: 3.5rem;
  transform: none;
}
.progressBar:global(.copper).small {
  height: 0.25rem;
}
.progressBar:global(.copper).vertical {
  height: 100%;
  width: 0.5rem;
  transform: none;
}
.progressBar:global(.copper).vertical.small {
  width: 0.25rem;
}
.progressBar:global(.copper).vertical .fill {
  background-image: none;
}
.progressBar:global(.copper) .fill {
  background-color: var(--agate-highlight-color, #fff);
  background-image: none;
  border-radius: 3.5rem;
}
.progressBar:global(.copper):global(.night) {
  position: relative;
  height: 0.5rem;
  width: 100%;
  background-color: var(--agate-accent-color, #e0b094);
  background-image: none;
  border-radius: 3.5rem;
  transform: none;
}
.progressBar:global(.copper):global(.night).small {
  height: 0.25rem;
}
.progressBar:global(.copper):global(.night).vertical {
  height: 100%;
  width: 0.5rem;
  transform: none;
}
.progressBar:global(.copper):global(.night).vertical.small {
  width: 0.25rem;
}
.progressBar:global(.copper):global(.night).vertical .fill {
  background-image: none;
}
.progressBar:global(.copper):global(.night) .fill {
  background-color: var(--agate-highlight-color, #fff);
  background-image: none;
  border-radius: 3.5rem;
}
.progressBar:global(.electro) {
  position: relative;
  height: 1.75rem;
  width: 100%;
  background-color: var(--agate-accent-color, #0359f0);
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.4));
  border-radius: 0.75rem;
  transform: skewX(-20deg);
}
.progressBar:global(.electro).small {
  height: 0.875rem;
}
.progressBar:global(.electro).vertical {
  height: 100%;
  width: 1.75rem;
  transform: none;
}
.progressBar:global(.electro).vertical.small {
  width: 0.875rem;
}
.progressBar:global(.electro).vertical .fill {
  background-image: linear-gradient(to top left, transparent, rgba(255, 255, 255, 0.5));
}
.progressBar:global(.electro) .fill {
  background-color: var(--agate-accent-color, #0359f0);
  background-image: linear-gradient(to top left, transparent, rgba(255, 255, 255, 0.5));
  border-radius: 0.75rem;
}
.progressBar:global(.gallium) {
  position: relative;
  height: 0.25rem;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.1);
  background-image: inherit;
  border-radius: 0.125rem;
  transform: none;
}
.progressBar:global(.gallium).small {
  height: 0.125rem;
}
.progressBar:global(.gallium).vertical {
  height: 100%;
  width: 0.25rem;
  transform: none;
}
.progressBar:global(.gallium).vertical.small {
  width: 0.125rem;
}
.progressBar:global(.gallium).vertical .fill {
  background-image: linear-gradient(to top, transparent, rgba(255, 255, 255, 0.75));
}
.progressBar:global(.gallium) .fill {
  background-color: #000000;
  background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.75));
  border-radius: 0.125rem;
}
.progressBar:global(.gallium):global(.night) {
  position: relative;
  height: 0.25rem;
  width: 100%;
  background-color: #373737;
  background-image: inherit;
  border-radius: 0.125rem;
  transform: none;
}
.progressBar:global(.gallium):global(.night).small {
  height: 0.125rem;
}
.progressBar:global(.gallium):global(.night).vertical {
  height: 100%;
  width: 0.25rem;
  transform: none;
}
.progressBar:global(.gallium):global(.night).vertical.small {
  width: 0.125rem;
}
.progressBar:global(.gallium):global(.night).vertical .fill {
  background-image: linear-gradient(to top, transparent, rgba(255, 255, 255, 0.75));
}
.progressBar:global(.gallium):global(.night) .fill {
  background-color: #ffffff;
  background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.75));
  border-radius: 0.125rem;
}
.progressBar:global(.silicon) {
  position: relative;
  height: 0.25rem;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  background-image: inherit;
  border-radius: 0;
  transform: none;
}
.progressBar:global(.silicon).small {
  height: 0.125rem;
}
.progressBar:global(.silicon).vertical {
  height: 100%;
  width: 0.25rem;
  transform: none;
}
.progressBar:global(.silicon).vertical.small {
  width: 0.125rem;
}
.progressBar:global(.silicon).vertical .fill {
  background-image: linear-gradient(to top, transparent, rgba(255, 255, 255, 0.75));
}
.progressBar:global(.silicon) .fill {
  background-color: #000000;
  background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.75));
  border-radius: 0;
}
.progressBar:global(.silicon):global(.night) {
  position: relative;
  height: 0.25rem;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.5);
  background-image: inherit;
  border-radius: 0;
  transform: none;
}
.progressBar:global(.silicon):global(.night).small {
  height: 0.125rem;
}
.progressBar:global(.silicon):global(.night).vertical {
  height: 100%;
  width: 0.25rem;
  transform: none;
}
.progressBar:global(.silicon):global(.night).vertical.small {
  width: 0.125rem;
}
.progressBar:global(.silicon):global(.night).vertical .fill {
  background-image: linear-gradient(to top, transparent, rgba(255, 255, 255, 0.75));
}
.progressBar:global(.silicon):global(.night) .fill {
  background-color: #ffffff;
  background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.75));
  border-radius: 0;
}
.progressBar:global(.titanium) {
  position: relative;
  height: 0.5rem;
  width: 100%;
  background-color: var(--agate-accent-color, rgba(0, 0, 0, 0.1));
  background-image: none;
  border-radius: 3.5rem;
  transform: none;
}
.progressBar:global(.titanium).small {
  height: 0.25rem;
}
.progressBar:global(.titanium).vertical {
  height: 100%;
  width: 0.5rem;
  transform: none;
}
.progressBar:global(.titanium).vertical.small {
  width: 0.25rem;
}
.progressBar:global(.titanium).vertical .fill {
  background-image: none;
}
.progressBar:global(.titanium) .fill {
  background-color: var(--agate-highlight-color, #2a48ca);
  background-image: none;
  border-radius: 3.5rem;
}
