import n from"style-inject";var o=".l3-style-counter {\n  display: inline-flex;\n  justify-content: center;\n  border-radius: 30px;\n  overflow: hidden;\n  transform-origin: center;\n}\n.l3-style-counter--with-animation {\n  animation: counter-pop-elastic var(--motion-expressive-short);\n}\n.l3-style-counter--size-small {\n  color: var(--color-content-primary);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-subtext);\n  min-width: 18px;\n  line-height: 18px;\n  padding: 0 4px;\n}\n.l3-style-counter--size-medium {\n  color: var(--color-content-primary);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-subtext);\n  min-width: 18px;\n  line-height: 18px;\n  padding: 0 4px;\n}\n.l3-style-counter--size-large {\n  color: var(--color-content-primary);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-general-label);\n  line-height: 22px;\n  line-height: 24px;\n  min-width: 24px;\n  padding: 0 8px;\n}\n.l3-style-counter--fade {\n  /* New number enters */\n  /* Old number exits */\n}\n.l3-style-counter--fade-enter {\n  opacity: 0;\n  transform: translateY(15px);\n}\n.l3-style-counter--fade-enter-active {\n  position: relative;\n  opacity: 1;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n  transform: translateY(0);\n}\n.l3-style-counter--fade-exit {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n.l3-style-counter--fade-exit-active {\n  position: relative;\n  opacity: 0;\n  transform: translateY(-15px);\n  transition: transform var(--motion-productive-long) var(--motion-timing-exit), opacity var(--motion-productive-short);\n}\n.l3-style-counter--kind-fill.l3-style-counter--color-primary {\n  color: var(--text-color-on-primary);\n  background-color: var(--primary-color);\n}\n.l3-style-counter--kind-fill.l3-style-counter--color-dark {\n  color: var(--text-color-on-inverted);\n  background-color: var(--inverted-color-background);\n}\n.l3-style-counter--kind-fill.l3-style-counter--color-negative {\n  color: var(--text-color-on-primary);\n  background-color: var(--negative-color);\n}\n.l3-style-counter--kind-fill.l3-style-counter--color-light {\n  color: var(--primary-text-color);\n  background-color: var(--primary-background-hover-color);\n}\n.l3-style-counter--kind-line {\n  box-shadow: 0 0 0 1px currentColor inset;\n}\n.l3-style-counter--kind-line.l3-style-counter--color-primary {\n  color: #000000;\n  color: #000000;\n}\n.l3-style-counter--kind-line.l3-style-counter--color-dark {\n  color: #898c99;\n  color: var(--inverted-color-background);\n}\n.l3-style-counter--kind-line.l3-style-counter--color-negative {\n  color: #e44258;\n  color: var(--negative-color);\n}\n.l3-style-counter--kind-line.l3-style-counter--color-light {\n  color: var(--primary-text-color);\n  box-shadow: 0 0 0 1px var(--primary-background-hover-color) inset !important;\n}\n@keyframes counter-pop-elastic {\n  0% {\n    transform: scale(1);\n  }\n  33% {\n    transform: scale(1.2);\n  }\n  66% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}";n(o,{insertAt:"top"});export{o as default};
