.Badge {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: var(--badge-size);
  font-size: var(--badge-text-size);
  font-weight: 600;
  line-height: var(--badge-size);
  white-space: nowrap;
  text-decoration: none;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

  .Badge_size_s {
      --badge-size: 20px;
      --badge-text-size: var(--size-text-2xs);
      padding: 0 var(--space-2xs);
    }

  .Badge_size_m {
      --badge-size: 24px;
      --badge-text-size: var(--size-text-xs);
      padding: 0 var(--space-xs);
    }

  .Badge_size_l {
      --badge-size: 32px;
      --badge-text-size: var(--size-text-s);
      padding: 0 var(--space-xs);
    }

  .Badge_form_default {
      border-radius: var(--control-radius);
    }

  .Badge_form_round {
      border-radius: 99em;
    }

  .Badge_form_round.Badge_size_s {
        padding: 0 var(--space-xs);
      }

  .Badge_form_round.Badge_size_m {
        padding: 0 var(--space-s);
      }

  .Badge_form_round.Badge_size_l {
        padding: 0 var(--space-m);
      }

  .Badge_status_success {
      --badge-bg-color: var(--color-bg-success);
      --badge-text-color: var(--color-typo-success);
      --badge-border-color: var(--color-bg-success);
    }

  .Badge_status_error {
      --badge-bg-color: var(--color-bg-alert);
      --badge-text-color: var(--color-typo-alert);
      --badge-border-color: var(--color-bg-alert);
    }

  .Badge_status_warning {
      --badge-bg-color: var(--color-bg-warning);
      --badge-text-color: var(--color-typo-warning);
      --badge-border-color: var(--color-bg-warning);
    }

  .Badge_status_normal {
      --badge-bg-color: var(--color-bg-normal);
      --badge-text-color: var(--color-typo-normal);
      --badge-border-color: var(--color-bg-normal);
    }

  .Badge_status_system {
      --badge-bg-color: var(--color-bg-system);
      --badge-border-color: var(--color-bg-system);
    }

  .Badge_view_filled {
      color: var(--color-typo-primary);
      background: var(--badge-bg-color);
    }

  .Badge_view_filled.Badge_status_system {
          color: var(--color-typo-secondary);
        }

  .Badge_view_stroked {
      color: var(--badge-text-color);
      -webkit-box-shadow: inset 0 0 0 1px var(--badge-border-color);
              box-shadow: inset 0 0 0 1px var(--badge-border-color);
    }

  .Badge_view_stroked.Badge_status_system {
          --badge-text-color: var(--color-typo-system);
        }

  .Badge_minified {
    --badge-text-size: 0;
    background: transparent;
    border-radius: 50%;
  }

  .Badge_minified.Badge_size_s {
      width: 16px;
      height: 16px;
      padding: 0;
      border: 3px solid transparent;
      -webkit-box-shadow: inset 0 0 0 10px var(--badge-bg-color);
              box-shadow: inset 0 0 0 10px var(--badge-bg-color);
    }

  .Badge_minified.Badge_size_m {
      width: 24px;
      height: 24px;
      padding: 0;
      border: 4px solid transparent;
      -webkit-box-shadow: inset 0 0 0 12px var(--badge-bg-color);
              box-shadow: inset 0 0 0 12px var(--badge-bg-color);
    }

  .Badge_minified.Badge_size_l {
      width: 32px;
      height: 32px;
      padding: 0;
      border: 5px solid transparent;
      -webkit-box-shadow: inset 0 0 0 14px var(--badge-bg-color);
              box-shadow: inset 0 0 0 14px var(--badge-bg-color);
    }

  .Badge-Icon {
    margin-right: var(--space-2xs);
    font-size: 0;
    line-height: 1em;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
