.host {
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: fit-content;
  block-size: fit-content;
}

.withPadding {
  inline-size: var(--vkui--size_field_height--regular);
  block-size: var(--vkui--size_field_height--regular);
  border-radius: 50%;
}

.host[disabled] {
  opacity: var(--vkui--opacity_disable);
}

/**
 * density="compact"
 */

.withPadding.densityCompact {
  inline-size: var(--vkui--size_field_height--compact);
  block-size: var(--vkui--size_field_height--compact);
}

@media (pointer: fine) and (min-width: 768px),(max-height: 414.9px) {
  .withPadding.densityNone {
    inline-size: var(--vkui--size_field_height--compact);
    block-size: var(--vkui--size_field_height--compact);
  }
}