.marks-toggle {
  &__items {
    display: flex;
    align-items: center;
    gap: 0 4px;
    user-select: none;
    word-break: break-word;
  }

  &__item {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    cursor: pointer;
    white-space: nowrap;
    position: relative;
  }

  &__mark {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    border-width: 1px;
    border-style: solid;

    &_y {
      background: #97cc64;
      border-color: #97cc64;
      color: #fff;
    }

    &_n {
    }
  }
}